/* さとLabo shared styles (top / privacy / contact). Tokens match tensai/index.html. */
:root{
  --bg:#EEF0F3;--panel:#FFFFFF;--line:#D5DAE2;--fg:#1B2333;--muted:#5D6778;
  --zap:#2D58C8;--zap-soft:#E3EAFB;--quake:#8A5A2B;--quake-soft:#F3E9DD;
  --f-display:"Dela Gothic One","Noto Sans JP",system-ui,sans-serif;
  --f-body:"Noto Sans JP","Hiragino Sans","Yu Gothic UI",system-ui,sans-serif;
  --f-num:"JetBrains Mono",ui-monospace,Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#121722;--panel:#1A2130;--line:#2C3547;--fg:#E7EBF2;--muted:#9AA4B5;
  --zap:#8EAEFF;--zap-soft:#22304F;--quake:#E2AA74;--quake-soft:#3A2C1F;color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#121722;--panel:#1A2130;--line:#2C3547;--fg:#E7EBF2;--muted:#9AA4B5;
  --zap:#8EAEFF;--zap-soft:#22304F;--quake:#E2AA74;--quake-soft:#3A2C1F;color-scheme:dark}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:15px;line-height:1.7;margin:0;word-break:auto-phrase;line-break:strict}
img{max-width:100%}
a{color:var(--zap);text-underline-offset:3px}
.nw{white-space:nowrap}
.wrap{max-width:720px;margin:0 auto;padding-inline:16px;padding-block:20px 48px;display:grid;gap:22px}

.crumb{font-size:13px}
.crumb a{text-decoration:none;font-weight:700}

/* header band: 嵐の夜 + Electro Dragon (Supercell Fan Kit) */
header.band{position:relative;overflow:hidden;border-radius:16px;padding:20px 16px 18px;min-height:210px;
  background:radial-gradient(circle at 80% 40%,rgba(110,190,255,.55),rgba(110,190,255,0) 45%),linear-gradient(160deg,#081127 0%,#11275A 60%,#1C4BA0 100%)}
header.band > *:not(.dragon){position:relative}
header.band .dragon{position:absolute;right:-30px;top:8px;width:210px;max-width:none;height:auto;filter:drop-shadow(0 6px 14px rgba(0,0,0,.35));pointer-events:none}
header.band .eyebrow{font-size:12px;letter-spacing:.08em;color:#A9C4F5}
header.band h1{font-family:var(--f-display);font-weight:400;font-size:clamp(30px,8vw,44px);line-height:1.15;margin:4px 0 8px;color:#fff}
header.band h1 .site{display:block;font:700 16px var(--f-body);color:#8FE0FF;letter-spacing:.04em;margin-top:6px;text-shadow:0 0 10px rgba(120,210,255,.6)}
header.band .lead{max-width:58%;margin:0;font-size:13px;color:#D6E3FA}
@media (min-width:600px){header.band{padding:28px 28px;min-height:240px} header.band .dragon{width:280px;right:10px;top:0} header.band .lead{max-width:60%;font-size:14px}}
@media (max-width:380px){header.band .dragon{width:180px;right:-40px}}

h2{font-size:18px;margin:0 0 10px;text-wrap:balance}
section{display:grid;gap:10px}

.tool{display:grid;grid-template-columns:auto 1fr;gap:12px 14px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;text-decoration:none;color:var(--fg)}
.tool:hover{border-color:var(--zap)}
.tool .ic{display:flex;gap:4px}
.tool .ic img{width:40px;height:40px;border-radius:9px}
.tool b{font-size:17px;display:block}
.tool p{margin:2px 0 0;font-size:13px;color:var(--muted)}
.tool .go{grid-column:1/-1;font-size:13px;font-weight:700;color:var(--zap)}

.soon{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.soon li{display:flex;gap:10px;align-items:baseline;background:var(--panel);border:1px dashed var(--line);border-radius:10px;padding:10px 12px;font-size:14px}
.soon li span{margin-left:auto;font-size:11px;font-weight:700;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:1px 8px;white-space:nowrap}

.box{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.box p{margin:0}

.doc{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 18px 22px;max-width:100%}
.doc h1{font-size:24px;margin:0 0 6px}
.doc h2{font-size:16px;margin:22px 0 6px}
.doc p,.doc li{font-size:14px;max-width:65ch}
.doc p{margin:0 0 8px}
.doc ul{margin:0 0 8px;padding-left:1.2em}
.doc .date{font-size:12px;color:var(--muted)}

footer{font-size:12px;color:var(--muted);display:grid;gap:6px;border-top:1px solid var(--line);padding-top:14px}
footer .copy{font-weight:700;color:var(--fg)}
footer nav{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:13px}
.formbtn{display:inline-block;background:var(--zap);color:var(--panel);font-weight:700;text-decoration:none;border-radius:10px;padding:10px 18px;margin:6px 0}
