/* Synapse minimal system — one strong gesture, quiet surfaces, precise rhythm. */
:root{
  --ink:#1b1d19;
  --paper:#f4f1e9;
  --paper-2:#e9e5da;
  --white:#fffdf8;
  --signal:#e44a2d;
  --signal-dark:#b93620;
  --signal-text:#a7331d;
  --spark:#d5ef63;
  --font-display:'Newsreader',Georgia,serif;
  --font-body:'IBM Plex Sans',sans-serif;
  --font-mono:'IBM Plex Mono',monospace;
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s6:48px;--s8:64px;
  --bg:var(--paper);--bg-2:var(--paper-2);--surface:var(--white);--surface-2:var(--paper);--surface-3:var(--paper-2);
  --text:var(--ink);--text-dim:#62645e;--text-faint:#898b84;
  --line:rgba(27,29,25,.22);--line-soft:rgba(27,29,25,.11);
  --accent:var(--signal);--accent-soft:var(--signal);--accent-dim:var(--signal-dark);
  --accent-2:var(--spark);--accent-2-dim:#b9d147;--danger:var(--signal);
  --radius-xl:32px;--radius-lg:24px;--radius-md:16px;--radius-sm:12px;--radius-pill:999px;
  --shadow-1:0 5px 18px rgba(27,29,25,.06);--shadow-2:0 14px 36px rgba(27,29,25,.08);--shadow-3:0 24px 64px rgba(27,29,25,.14);--shadow-glow:none;
}
html.theme-night{--paper:#141815;--paper-2:#20251f;--white:#1b201c;--ink:#faf7ee;--text-dim:#d0d2ca;--text-faint:#aeb3aa;--line:rgba(250,247,238,.32);--line-soft:rgba(250,247,238,.18);--signal:#f06445;--signal-dark:#ff7b60;--signal-text:#ff9a80;--spark:#dff46b}
*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--font-body);letter-spacing:-.01em}
h1,h2,h3,.brand-name,.topbar-title,.card-name,.promo-title{font-family:var(--font-display);font-weight:500;letter-spacing:-.045em}
button,input,textarea,select{font-family:var(--font-body)}
::selection{background:var(--spark);color:#1b1d19}
.promo-eyebrow,.profile-page-eyebrow,.profile-card-kicker,.account-eyebrow,.account-kicker,.preview-eyebrow,.studio-kicker{display:none!important}

/* 8 / 16 / 24 / 32 / 48 / 64 is the only spacing ramp used by page sections. */
.shell{grid-template-columns:216px minmax(0,1fr);gap:0;padding:0;min-height:100vh}
.sidebar{top:0;height:100vh;padding:var(--s4) var(--s3);border:0;border-right:1px solid var(--line);border-radius:0;background:var(--white);box-shadow:none}
.brand{padding:0 0 var(--s8);gap:var(--s2)}
.brand-mark svg{width:30px;height:30px}.brand-mark svg circle:first-child{stroke:var(--ink)}.brand-mark svg circle:not(:first-child){fill:var(--signal)}
.brand-name{font-size:1.55rem}.nav{gap:0;border-top:1px solid var(--line)}
.nav-item{gap:12px;padding:15px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;color:var(--text-dim);font-size:.9rem;font-weight:500;text-decoration:none;box-shadow:none;transition:color .15s ease,padding .15s ease}
.nav-item:hover{padding-left:var(--s1);background:transparent;color:var(--ink);transform:none}.nav-item.is-active{background:transparent;color:var(--ink);box-shadow:none}.nav-item.is-active::after{content:'●';margin-left:auto;color:var(--signal);font-size:.7rem}
.nav-item .nav-badge{margin-left:auto;padding:0;background:none;color:var(--signal);font:500 .58rem var(--font-mono);letter-spacing:.06em}
.sidebar-foot{padding:var(--s3) 0 0}.foot-note{font-size:.68rem;line-height:1.55}
.main{padding:var(--s4) clamp(24px,4vw,64px) var(--s8)}
.topbar{margin:0 0 var(--s6);padding:0 0 var(--s3);border-bottom:1px solid var(--line)}
.topbar-title{font-size:clamp(1.8rem,3vw,2.6rem)}.topbar-stats{gap:var(--s1)}
.language-control{height:42px;min-width:82px;padding:0 10px;display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:var(--radius-pill);background:var(--surface);color:var(--text);box-shadow:var(--shadow-1)}
.language-control:focus-within,.language-control:hover{border-color:var(--ink)}.language-control select{width:auto;min-width:42px;padding:0!important;border:0!important;border-radius:0!important;outline:0!important;background:transparent;color:var(--text);font:600 .7rem var(--font-mono);cursor:pointer}.language-control option{background:var(--surface);color:var(--text)}
.stat-pill,.theme-toggle,.profile-chip{min-height:38px;border:1px solid var(--line);border-radius:var(--radius-pill);background:transparent;box-shadow:none}.stat-pill:hover,.theme-toggle:hover,.profile-chip:hover{border-color:var(--ink);box-shadow:none;transform:none}
.profile-avatar{border-radius:50%;background:var(--signal);box-shadow:none}.score-summary-popover{border:1px solid var(--ink);border-radius:var(--radius-lg);box-shadow:var(--shadow-3)}

.promo-banner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s4);margin-bottom:var(--s6);padding:var(--s6);border:1px solid var(--ink);border-radius:var(--radius-xl);background:var(--ink);color:var(--paper);box-shadow:none;overflow:hidden}
.promo-banner::before,.promo-banner::after{display:none}.promo-text{max-width:680px}.promo-title{margin:0;color:var(--paper);font-size:clamp(2rem,4vw,3.8rem);line-height:.98}.promo-sub{max-width:620px;margin-top:var(--s2);color:rgba(244,241,233,.72);font-size:.9rem;line-height:1.55}
.promo-cta{gap:var(--s3)}.board-preview{width:112px;height:112px;padding:0;border-radius:50%;background:var(--spark);box-shadow:none}.btn{border-radius:var(--radius-pill);padding:11px 18px;font-weight:600;box-shadow:none;transition:background .15s ease,color .15s ease,border-color .15s ease}
.btn-primary{border:1px solid var(--signal);background:var(--signal);color:#1b1d19}.btn-primary:hover{border-color:var(--signal-dark);background:var(--signal-dark);color:#fff;box-shadow:none;transform:none}.btn-accent2{border:1px solid var(--spark);background:var(--spark);color:#1b1d19}.btn-accent2:hover{background:#e2f789;box-shadow:none;transform:none}.btn-ghost{border:1px solid var(--line);background:transparent}.btn-ghost:hover{border-color:var(--ink);transform:none}

.filter-row{gap:0;margin-bottom:var(--s4);border-bottom:1px solid var(--line)}.chip{padding:10px 13px;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:var(--text-dim);box-shadow:none}.chip:hover{border-color:var(--line);transform:none}.chip.is-active{border-color:var(--signal);background:transparent;color:var(--ink);box-shadow:none}
.game-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.game-card{border:0;border-radius:0;background:var(--white);box-shadow:none;overflow:hidden}.game-card:hover{border:0;box-shadow:none;transform:none}.game-card:hover .card-art{background:var(--spark)}
.game-card .card-art{height:144px!important;border:0;background:var(--paper)!important;transition:background .15s ease}.card-art::before,.card-art::after{display:none!important}.card-art .cover-svg{width:112px!important;height:112px!important;filter:none!important;transform:none!important}
.card-body{padding:var(--s3)}.card-cat{font:500 .62rem var(--font-mono);letter-spacing:.04em;color:var(--signal)}.card-name{font-size:1.35rem;font-weight:500}.card-skill,.card-best{font-size:.74rem}.card-best{margin-top:var(--s3);border-color:var(--line)}

.panel,.leaderboard-players-space,.leaderboard-side-card,.profile-radar-card,.profile-about-card,.profile-hero-card{border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--white);box-shadow:var(--shadow-1)}.panel{padding:var(--s6);max-width:1100px}.panel h2{font-size:2rem}.progress-grid{gap:var(--s2);background:transparent;border:0}.progress-item{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--paper);box-shadow:none}.history-row,.open-match-row,.gomoku-panel,.gomoku-board-wrap,.gomoku-chat-message,.profile-metric-card{border-radius:var(--radius-md);box-shadow:none}
.leaderboard-side-head span,.profile-card-head span:first-child{display:none}.select,input,textarea{border-radius:var(--radius-md)!important;box-shadow:none!important}.select:focus,input:focus,textarea:focus{outline:2px solid var(--spark)!important;outline-offset:2px}

.overlay{background:rgba(27,29,25,.72);backdrop-filter:none}.overlay-panel{border:1px solid var(--ink);border-radius:var(--radius-xl);background:var(--white);box-shadow:var(--shadow-3)}.overlay-head{padding:var(--s3);border-bottom:1px solid var(--line)}.overlay-head h2{font-size:1.7rem}.overlay-meta{margin-top:4px;color:var(--text-dim);font:500 .65rem var(--font-mono);letter-spacing:.04em}.icon-btn{border-radius:50%}.icon-btn:hover{transform:none;background:var(--spark);color:#1b1d19}.overlay-stage{padding:var(--s3)}
.instruction-page{max-width:720px;margin:auto;padding:var(--s4);display:grid;grid-template-columns:130px minmax(0,1fr);gap:var(--s4)}.instruction-art{grid-row:1/6}.instruction-art::after{display:none}.instruction-page h3{font-size:clamp(2.5rem,6vw,4rem);line-height:.9;margin:0 0 var(--s3);border:0}.instruction-page ol{list-style:decimal;padding-left:20px}.instruction-page li{display:list-item;padding:12px 0;border-bottom:1px solid var(--line);color:var(--text-dim)}.instruction-page li::before{display:none}.instruction-continue{margin-top:var(--s3)}
.studio{border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--white);box-shadow:var(--shadow-2)}.studio-hud>div{border-radius:var(--radius-pill)}.studio-feedback,.countdown{font-family:var(--font-mono)!important}.game-result::before{display:none}

/* First screen: one Synapse-specific daily circuit, not a generic password card. */
.site-gate{z-index:2000;display:block;padding:0;background:var(--paper);color:var(--ink);overflow:auto}
.gate-stage{width:100%;min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;padding:var(--s4) clamp(24px,5vw,72px);background:var(--paper)}
.gate-header,.gate-footer{display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
.gate-header{padding-bottom:var(--s3);border-bottom:1px solid var(--line)}.gate-wordmark{display:flex;align-items:center;gap:12px;color:var(--ink);font:500 1.45rem var(--font-display);text-decoration:none}.gate-wordmark img{width:30px;height:30px;display:block}.gate-wordmark span{width:30px;height:30px;display:grid;place-items:center;background:var(--ink);color:var(--paper);font:600 .9rem var(--font-body)}
.gate-links{display:flex;gap:var(--s3)}.gate-links a,.seo-footer a{color:var(--ink);font-size:.84rem;text-underline-offset:4px;text-decoration-thickness:1px}
.gate-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.9fr);gap:var(--s8);align-items:center;padding:var(--s8) 0}.gate-copy{max-width:690px}.gate-copy h1{max-width:650px;font:500 clamp(4rem,8vw,7.6rem)/.82 var(--font-display);letter-spacing:-.065em}.gate-copy>p{max-width:520px;margin-top:var(--s4);font-size:1.08rem;line-height:1.55;color:var(--text-dim)}
.gate-form{max-width:540px;margin-top:var(--s6)}.gate-form>label{display:block;margin-bottom:var(--s1);font:500 .7rem var(--font-mono)}.gate-form-row{display:grid;grid-template-columns:1fr auto;gap:var(--s1)}.gate-form-row input{min-width:0;padding:14px 18px;border:1px solid var(--ink);background:var(--white);font-size:1rem}.gate-form-row .btn{min-width:142px}.gate-error{min-height:22px;margin-top:var(--s1);color:var(--signal)}
.gate-circuit{width:min(44vw,560px);justify-self:center}
.static-circuit-preview{position:relative;aspect-ratio:1;isolation:isolate}
.static-circuit-lines{position:absolute;inset:0;width:100%;height:100%}.static-circuit-lines circle,.static-circuit-lines path{fill:none;stroke:var(--line);stroke-width:1.5;vector-effect:non-scaling-stroke}.static-circuit-lines circle{stroke-dasharray:3 7}
.static-circuit-core{position:absolute;left:50%;top:50%;z-index:2;width:31%;aspect-ratio:1;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;background:var(--signal);color:#1b1d19}.static-circuit-core .brain-mark{width:54%;height:auto}.static-circuit-core strong{font:500 clamp(1.5rem,3vw,2.7rem)/.9 var(--font-display)}.static-circuit-core span{margin-top:2px;font:600 clamp(.42rem,.8vw,.58rem)/1.2 var(--font-mono)}
.static-circuit-node{position:absolute;z-index:3;width:19%;transform:translate(-50%,-50%);color:var(--ink);text-align:center}.static-circuit-node>span{display:block;width:78%;aspect-ratio:1;margin:auto;border:1px solid var(--ink);border-radius:50%;background:var(--white);overflow:hidden}.static-circuit-node svg{display:block;width:100%;height:100%}.static-circuit-node small{display:block;margin-top:5px;font:500 clamp(.48rem,1vw,.66rem)/1.1 var(--font-body);white-space:nowrap}
.static-position-1{left:50%;top:13%}.static-position-2{left:76%;top:24%}.static-position-3{left:87%;top:50%}.static-position-4{left:76%;top:76%}.static-position-5{left:50%;top:87%}.static-position-6{left:24%;top:76%}.static-position-7{left:13%;top:50%}.static-position-8{left:24%;top:24%}
.gate-footer{padding-top:var(--s3);border-top:1px solid var(--line);font-size:.72rem;color:var(--text-dim)}

/* The account screen keeps the same idea with less visual noise. */
#account-overlay{background:var(--paper)!important;backdrop-filter:none!important;padding:clamp(16px,2.5vw,40px)!important;align-items:center!important;justify-content:center!important}
#account-overlay .account-login-shell{width:min(1480px,100%)!important;height:min(900px,calc(100vh - clamp(32px,5vw,80px)))!important;min-height:min(720px,calc(100vh - 32px))!important;grid-template-columns:minmax(440px,.9fr) minmax(520px,1.1fr)!important;border:1px solid var(--ink)!important;border-radius:var(--radius-xl)!important;background:var(--white)!important;box-shadow:var(--shadow-3)!important;overflow:hidden!important}
#account-overlay .account-login-side{min-width:0;padding:var(--s4) clamp(32px,5vw,80px)!important;background:var(--white)!important}
#account-overlay .account-brand-mark{border-radius:50%!important;background:transparent!important;box-shadow:none!important;overflow:hidden!important}#account-overlay .account-brand-mark img{display:block;width:100%;height:100%}#account-overlay .account-brand-name{font-family:var(--font-display)!important;font-weight:500!important}
#account-overlay .account-login-content{width:100%!important;max-width:620px!important;margin:auto!important;padding:var(--s3) 0!important}#account-overlay .account-hero-title{font:500 clamp(3.2rem,5.4vw,6rem)/.87 var(--font-display)!important;letter-spacing:-.06em!important}#account-overlay .account-hero-copy{max-width:520px!important}
#account-overlay .account-panel{max-width:500px!important;margin-top:var(--s6)!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}#account-overlay .account-panel h2{font:500 2rem var(--font-display)!important}
#account-overlay .account-input-wrap{border-radius:var(--radius-md)!important;background:var(--paper)!important;box-shadow:none!important}#account-overlay .account-primary-btn{border-radius:var(--radius-pill)!important;background:var(--signal)!important;color:#1b1d19!important;box-shadow:none!important}#account-overlay .account-text-btn{color:var(--signal-text)!important}
#account-overlay .account-feature-row{gap:var(--s1)!important;border-top:1px solid var(--line)!important;padding-top:var(--s2)!important}#account-overlay .account-feature-row>div{border:1px solid var(--line)!important;border-radius:var(--radius-pill)!important;background:var(--paper)!important;box-shadow:none!important}#account-overlay .account-feature-row>div:last-child{border-right:1px solid var(--line)!important}
#account-overlay .account-preview-side{position:relative!important;display:block!important;padding:var(--s4)!important;background:var(--spark)!important;overflow:hidden!important;border-radius:calc(var(--radius-xl) - 1px)!important}#account-overlay .account-preview-side::before,#account-overlay .account-preview-side::after{content:none!important}
#account-overlay .account-preview-window,#account-overlay .account-preview-glow{display:none!important}
#account-overlay .account-circuit-frame{position:relative;z-index:2;height:100%;display:grid;grid-template-rows:auto 1fr auto;align-items:center;color:#1b1d19}#account-overlay .account-circuit-frame>p{max-width:560px;font:500 clamp(2.4rem,4vw,4.5rem)/.9 var(--font-display);letter-spacing:-.055em}#account-overlay .account-circuit-frame>small{padding-top:var(--s2);border-top:1px solid rgba(27,29,25,.45);font:500 .65rem/1.5 var(--font-mono)}#account-overlay .account-circuit-preview{width:min(100%,620px);max-height:68vh;margin:auto;--ink:#1b1d19;--line:rgba(27,29,25,.3);--white:#fffdf8}

.seo-footer{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s8);padding:var(--s3) 0;border-top:1px solid var(--line)}

/* Keep the complete circuit and its project note inside one desktop viewport. */
@media(min-width:901px){
  .shell:has(#view-games:not(.is-hidden)){height:100vh;min-height:0;overflow:hidden}
  .shell:has(#view-games:not(.is-hidden)) .main{height:100vh;min-height:0;display:flex;flex-direction:column;padding-top:var(--s3);padding-bottom:var(--s2);overflow:hidden}
  .shell:has(#view-games:not(.is-hidden)) .topbar{flex:0 0 auto;margin-bottom:var(--s2);padding-bottom:var(--s2)}
  .shell:has(#view-games:not(.is-hidden)) #view-games{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
  .shell:has(#view-games:not(.is-hidden)) #filter-row{flex:0 0 auto;margin-bottom:var(--s1)}
  .shell:has(#view-games:not(.is-hidden)) #game-grid{flex:1 1 auto;min-height:0}
  .shell:has(#view-games:not(.is-hidden)) .cognitive-circuit-shell{height:100%;min-height:0;max-height:none}
  .shell:has(#view-games:not(.is-hidden)) .seo-footer{flex:0 0 auto;margin-top:var(--s1);padding:var(--s1) 0 0;gap:var(--s3)}
}

/* The signed-in Games view is the circuit itself. */
#view-games>.promo-banner{display:none!important}
#view-games .filter-row{margin-bottom:var(--s3)}
#view-games #game-grid{display:block!important;width:100%!important;max-width:none!important;margin:0!important;border:0!important;background:transparent!important}
.cognitive-circuit-shell{display:grid;grid-template-columns:minmax(320px,.72fr) minmax(520px,1.28fr);gap:var(--s4);height:clamp(530px,calc(100vh - 225px),680px);min-height:0;border:0;background:transparent;overflow:visible}
.circuit-guide{position:relative;display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:var(--s4);border:0;border-right:1px solid var(--line);background:transparent;overflow:hidden}
.circuit-guide::after{content:'';position:absolute;right:-1px;top:0;width:6px;height:32%;background:var(--signal)}
.circuit-guide-index{position:absolute;right:var(--s4);top:var(--s2);color:var(--line);font:500 clamp(3.5rem,6vw,5.5rem)/1 var(--font-display);letter-spacing:-.08em;pointer-events:none}
.circuit-guide-title{position:relative;z-index:1;max-width:100%;margin-top:var(--s6);font:500 clamp(2.6rem,4vw,4.25rem)/.88 var(--font-display);letter-spacing:-.055em;overflow-wrap:anywhere}
.circuit-guide-skill{margin-top:12px;padding-bottom:var(--s2);border-bottom:1px solid var(--line);color:var(--signal-text);font:500 .68rem var(--font-mono)}
.circuit-guide-rules{width:100%;margin:var(--s2) 0;padding:0;list-style:none;counter-reset:circuit-rules}.circuit-guide-rules li{counter-increment:circuit-rules;display:grid;grid-template-columns:25px 1fr;gap:9px;padding:8px 0;border-bottom:1px solid var(--line-soft);color:var(--text-dim);font-size:.76rem;line-height:1.38}.circuit-guide-rules li::before{content:counter(circuit-rules,decimal-leading-zero);color:var(--ink);font:500 .58rem var(--font-mono)}
.circuit-guide-score{display:flex;align-items:baseline;justify-content:space-between;width:100%;margin:auto 0 var(--s2);padding-top:var(--s2);font:500 .7rem var(--font-mono)}.circuit-guide-score strong{font:500 2.2rem var(--font-display)}
.circuit-play{width:100%;min-height:46px}.circuit-gomoku-link{width:100%;margin-top:var(--s2);padding:12px 0;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text-dim);font-size:.72rem;text-align:left;cursor:pointer}.circuit-gomoku-link strong{float:right;color:var(--ink);font-weight:600}.circuit-gomoku-link:hover strong{color:var(--signal-text)}
.circuit-stage{position:relative;align-self:center;justify-self:center;height:min(100%,680px);width:auto;max-width:100%;aspect-ratio:1;background:transparent;isolation:isolate}.circuit-stage::after{content:'Hover to preview · click to play';position:absolute;right:var(--s3);bottom:var(--s1);color:var(--text-faint);font:500 .58rem var(--font-mono)}
.circuit-connections,.circuit-node-layer{position:absolute;inset:0;width:100%;height:100%}.circuit-connections{overflow:visible}.circuit-connections circle,.circuit-connections line{fill:none;stroke:var(--line);stroke-width:1.2;vector-effect:non-scaling-stroke;transition:stroke .18s ease,stroke-width .18s ease}.circuit-connections circle{stroke-dasharray:3 6}.circuit-connections line.is-active{stroke:var(--signal);stroke-width:2.5}
.circuit-score-core{position:absolute;left:50%;top:50%;z-index:4;width:174px;height:174px;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;border:0;border-radius:50%;background:var(--signal);color:#1b1d19;cursor:pointer;transition:transform .18s ease,background .18s ease}.circuit-score-core .brain-mark{width:82px;height:50px}.circuit-score-core:hover,.circuit-score-core:focus-visible{transform:translate(-50%,-50%) scale(1.035);background:var(--signal-dark);color:#fff;outline:3px solid var(--spark);outline-offset:4px}.circuit-score-core small{font:600 .55rem var(--font-mono)}.circuit-score-core strong{margin:0;font:500 2.2rem/.92 var(--font-display)}
.cognitive-node{position:absolute;z-index:5;width:126px;min-height:126px;transform:translate(-50%,-50%);padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer;text-align:center}.cognitive-node-visual{display:block;width:102px;height:102px;margin:0 auto 7px;border:1px solid rgba(244,241,233,.55);border-radius:50%;background:#1b1d19;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}.cognitive-node-visual svg{display:block;width:100%;height:100%;border-radius:50%}.cognitive-node-name{display:block;font:600 .68rem var(--font-body);white-space:nowrap}.cognitive-node-best{display:none}.cognitive-node:hover .cognitive-node-visual,.cognitive-node:focus-visible .cognitive-node-visual,.cognitive-node.is-active .cognitive-node-visual{transform:scale(1.07);box-shadow:0 0 0 4px var(--paper),0 0 0 7px var(--signal)}.cognitive-node:focus-visible{outline:none}.cognitive-node.is-active .cognitive-node-name{color:var(--signal-text);font-weight:600}.cognitive-node.is-filtered-out{opacity:.22}.cognitive-node.is-filtered-out:hover,.cognitive-node.is-filtered-out:focus,.cognitive-node.is-filtered-out.is-active{opacity:1}
.circuit-position-1{left:50%;top:13%}.circuit-position-2{left:76%;top:24%}.circuit-position-3{left:87%;top:50%}.circuit-position-4{left:76%;top:76%}.circuit-position-5{left:50%;top:87%}.circuit-position-6{left:24%;top:76%}.circuit-position-7{left:13%;top:50%}.circuit-position-8{left:24%;top:24%}
.cognitive-playing .game-instructions,.cognitive-playing .sudoku-penalty-note,.cognitive-playing .heartline-prompt,.cognitive-playing .heartline-motion-guide,.cognitive-playing .tide-stem-hint{display:none!important}

/* Gomoku is one contained workspace: board + one quiet information rail. */
#view-gomoku .gomoku-shell-panel.panel{width:100%;max-width:none!important;padding:var(--s4);overflow:hidden}
#view-gomoku .gomoku-layout{grid-template-columns:minmax(420px,560px) minmax(0,1fr);gap:var(--s4);width:100%;max-width:1280px;margin:auto;align-items:start}
#view-gomoku .gomoku-board-wrap{width:100%;min-width:0;max-width:560px;padding:var(--s2)}
#view-gomoku .gomoku-side{width:100%;min-width:0;max-width:none;gap:0}
#view-gomoku .gomoku-side-top{display:grid;grid-template-columns:1fr;gap:0;min-width:0}
#view-gomoku .gomoku-side-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2);min-width:0;border-top:1px solid var(--line)}
#view-gomoku .gomoku-side .gomoku-panel{min-width:0;margin:0;padding:var(--s2) 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none;overflow:hidden}
#view-gomoku .gomoku-side-top>.gomoku-panel:first-child{border-top:0;padding-top:0}
#view-gomoku .gomoku-side-details>.gomoku-panel{border-top:0;padding:var(--s2) 0}
#view-gomoku .gomoku-chat-list{height:168px;min-height:168px;max-height:168px;padding-right:4px}
#view-gomoku .gomoku-open-list{max-height:132px}
#view-gomoku .gomoku-chat-form{grid-template-columns:minmax(0,1fr) auto}
#view-gomoku .gomoku-chat-form-note>span:first-child{max-width:34ch}
#view-gomoku .gomoku-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
#view-gomoku .gomoku-history-mini{max-height:90px;overflow:auto}
#view-gomoku .gomoku-side h3,#view-gomoku .gomoku-side p,#view-gomoku .open-match-row,#view-gomoku .gomoku-history-mini{overflow-wrap:anywhere}

/* Keep cognitive play inside the viewport; overflow is an emergency fallback, not the layout. */
#game-overlay{padding:12px}
#game-overlay>.overlay-panel{max-height:calc(100vh - 24px)}
#game-overlay .overlay-head{padding:var(--s2) var(--s3)}
#game-overlay .overlay-stage.cognitive-playing{padding:12px var(--s2) var(--s2)}
#game-overlay .overlay-stage.cognitive-playing .studio{min-height:0}
@media(max-height:850px) and (min-width:681px){#game-overlay .studio-hud{padding:8px 16px 6px}#game-overlay .studio-hud>div{padding:6px 12px}#game-overlay .studio-board{padding:9px 18px 4px}#game-overlay .studio-feedback{min-height:40px;padding:7px 18px}#game-overlay .studio-actions{padding:0 16px 10px}#game-overlay .tide-scene{height:min(240px,34vh)}#game-overlay .shape-figure{max-width:180px;padding:6px}#game-overlay .shape-choice{max-height:126px;padding:10px}#game-overlay .number-grid{max-width:min(330px,42vh)}}

/* Night mode must retain readable hierarchy, including older account components. */
html.theme-night #account-overlay .account-hero-title,html.theme-night #account-overlay .account-panel h2,html.theme-night #account-overlay .account-brand-name,html.theme-night #account-overlay .account-input-group>span,html.theme-night #account-overlay .account-input-wrap input,html.theme-night #account-overlay .account-feature-row b,html.theme-night #account-overlay .account-feature-row strong{color:var(--ink)!important}
html.theme-night #account-overlay .account-hero-copy,html.theme-night #account-overlay .account-mode-hint,html.theme-night #account-overlay .account-alt-row,html.theme-night #account-overlay .account-feature-row small{color:var(--text-dim)!important}
html.theme-night #account-overlay .account-input-wrap{border-color:var(--line)!important;background:var(--paper-2)!important}
html.theme-night #account-overlay .account-input-wrap svg{stroke:var(--text-dim)!important}
html.theme-night .muted,html.theme-night .small,html.theme-night .circuit-guide-rules li,html.theme-night .gomoku-chat-form-note{color:var(--text-dim)}
html.theme-night .cognitive-node-visual{border-color:rgba(250,247,238,.72)}
html.theme-night .btn-primary:hover,html.theme-night .circuit-score-core:hover,html.theme-night .circuit-score-core:focus-visible{color:#1b1d19}

/* Crawlable supporting pages. */
body.content-page{min-height:100vh;background:var(--paper)}.content-shell{max-width:1160px;margin:auto;padding:var(--s4) clamp(24px,5vw,72px) var(--s8)}.content-nav{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--s3);border-bottom:1px solid var(--line)}.content-nav .gate-links{align-items:center}.content-hero{padding:var(--s8) 0;display:grid;grid-template-columns:1.15fr .85fr;gap:var(--s8);align-items:end}.content-hero h1{font:500 clamp(4rem,8vw,7.2rem)/.84 var(--font-display);letter-spacing:-.065em}.content-hero p{font-size:1.15rem;line-height:1.55;color:var(--text-dim)}.content-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;border:1px solid var(--line);background:var(--line)}.content-card{padding:var(--s4);background:var(--white)}.content-card h2{font:500 2rem var(--font-display)}.content-card p{margin-top:var(--s2);color:var(--text-dim);line-height:1.6}.content-index{display:block;margin-bottom:var(--s4);color:var(--signal);font:500 .7rem var(--font-mono)}

html.theme-night .promo-banner{background:#090a08}.theme-night .gate-wordmark span,.theme-night .profile-avatar{color:#fff}.theme-night .circuit-node{background:var(--paper)}.theme-night .circuit-node:nth-of-type(even){background:var(--spark);color:#1b1d19}
@media(max-width:1100px){.cognitive-circuit-shell{grid-template-columns:minmax(280px,.72fr) minmax(470px,1.28fr)}.circuit-guide{padding:var(--s4)}.cognitive-node{width:105px}.cognitive-node-visual{width:82px;height:82px}.circuit-score-core{width:128px;height:128px}}
@media(max-width:1050px) and (min-width:901px){.cognitive-circuit-shell{grid-template-columns:1fr;height:auto}.circuit-guide{min-height:500px;border-right:0;border-bottom:1px solid var(--line)}.circuit-guide::after{right:auto;left:0;width:32%;height:6px}.circuit-stage{width:min(100%,620px);height:auto}}
@media(max-width:900px){.shell{grid-template-columns:1fr}.sidebar{position:static;height:auto;padding:var(--s2) var(--s3);border-right:0;border-bottom:1px solid var(--line)}.brand{padding:0}.nav{margin-left:auto;border:0;flex-direction:row}.nav-item{padding:10px;border:0}.nav-item:hover{padding-left:10px}.main{padding:var(--s3)}.gate-main{grid-template-columns:1fr;gap:var(--s4)}.gate-copy h1{font-size:clamp(4rem,13vw,6.4rem)}.gate-circuit{width:min(520px,80vw)}#account-overlay .account-login-shell{height:auto!important;grid-template-columns:1fr!important}#account-overlay .account-preview-side{display:none!important}.content-hero{grid-template-columns:1fr;gap:var(--s3)}.cognitive-circuit-shell{grid-template-columns:1fr;height:auto;min-height:0}.circuit-guide{min-height:520px;border-right:0;border-bottom:1px solid var(--ink)}.circuit-guide::after{right:auto;left:0;width:32%;height:6px}.circuit-stage{width:min(100%,650px);height:auto}}
@media(max-width:620px){.gate-stage{padding:var(--s3)}.gate-links{gap:var(--s2)}.gate-main{padding:var(--s6) 0}.gate-copy h1{font-size:3.75rem}.gate-form-row{grid-template-columns:1fr}.gate-circuit{width:92vw;max-width:420px}.gate-footer{align-items:flex-start;flex-direction:column;gap:var(--s1)}.promo-banner{grid-template-columns:1fr;padding:var(--s4)}.promo-cta{justify-content:space-between}.instruction-page{grid-template-columns:1fr;padding:var(--s2)}.instruction-art{grid-row:auto}.content-grid{grid-template-columns:1fr}.content-hero h1{font-size:3.9rem}.content-nav{align-items:flex-start;gap:var(--s2)}.content-nav .gate-links{flex-wrap:wrap;justify-content:flex-end}.nav-item svg{display:none}.circuit-guide{min-height:0;padding:var(--s3)}.circuit-guide-title{margin-top:var(--s8);font-size:3.2rem}.circuit-stage{width:calc(100vw - 48px);min-width:0}.cognitive-node{width:76px;min-height:104px}.cognitive-node-visual{width:62px;height:62px}.cognitive-node-name{font-size:.54rem}.cognitive-node-best{font-size:.48rem}.circuit-score-core{width:98px;height:98px}.circuit-score-core strong{font-size:2.2rem}.circuit-score-core span,.circuit-score-core small{font-size:.5rem}.circuit-position-1{top:15%}.circuit-position-3{left:88%}.circuit-position-5{top:85%}.circuit-position-7{left:12%}.circuit-stage::after{display:none}.filter-row{overflow-x:auto;flex-wrap:nowrap}.chip{white-space:nowrap}.language-control{min-width:46px;width:46px;padding:0 7px}.language-control svg{display:none}.language-control select{min-width:32px;font-size:.62rem}}
@media(max-width:900px){#account-overlay .account-preview-side{display:block!important;min-height:500px!important}#account-overlay .account-circuit-frame>p{font-size:3rem}#account-overlay .account-circuit-preview{width:min(100%,430px)}}
@media(max-width:620px){#account-overlay{padding:var(--s2)!important}#account-overlay .account-login-side{padding:var(--s3)!important}#account-overlay .account-preview-side{min-height:410px!important;padding:var(--s3)!important}#account-overlay .account-circuit-frame>p{font-size:2.35rem}#account-overlay .account-circuit-frame>small{font-size:.56rem}.static-circuit-node small{font-size:.48rem}.static-position-1{top:13%}.static-position-5{top:87%}}
@media(max-width:1180px) and (min-width:861px){#view-gomoku .gomoku-shell-panel.panel{padding:var(--s3)}#view-gomoku .gomoku-layout{grid-template-columns:minmax(350px,46%) minmax(0,1fr);gap:var(--s3)}#view-gomoku .gomoku-side-details{grid-template-columns:1fr}#view-gomoku .gomoku-chat-list{height:145px;min-height:145px;max-height:145px}}
@media(max-width:860px){#view-gomoku .gomoku-shell-panel.panel{padding:var(--s2);overflow:visible}#view-gomoku .gomoku-layout{display:flex;gap:var(--s3)}#view-gomoku .gomoku-board-wrap,#view-gomoku .gomoku-side{width:min(100%,560px)}#view-gomoku .gomoku-side-details{grid-template-columns:1fr}#view-gomoku .gomoku-chat-list{height:190px;min-height:190px;max-height:190px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}