/* Muck GTO pages: the site's own header, font and colours (matches the lobby header). */
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/Inter-Variable-latin.woff2') format('woff2')}
:root{--gto-bg:#0e0e0e;--gto-panel:#16181b;--gto-line:#292929;--gto-text:#eceef1;--gto-muted:#8b9099;--gto-gold:#ffd34f;--gto-green:#7fe0a0}
html,body{background:var(--gto-bg)}
body,button,input,select{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.site-head{display:none!important}
.gto-head{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:26px;height:70px;padding:0 28px;background:var(--gto-bg);border-bottom:1px solid var(--gto-line)}
.gto-head .gto-logo img{display:block;width:150px;height:auto}
.gto-nav{display:flex;align-items:center;gap:4px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}
.gto-nav a{color:#c7cbd1;text-decoration:none;font-size:13px;font-weight:600;padding:8px 12px;border-radius:6px;white-space:nowrap}
.gto-nav a:hover{color:#fff;background:#ffffff0d}
.gto-nav a[aria-current=page]{color:#fff;background:#ffffff14}
.gto-nav .gto-brand{color:#fff;font-weight:800;letter-spacing:-.2px;padding-right:14px;margin-right:6px;border-right:1px solid var(--gto-line);border-radius:0}
.gto-nav .gto-brand span{color:#c9a7ff}
.gto-play{display:flex;align-items:center;gap:6px;height:36px;padding:0 16px;border-radius:7px;background:linear-gradient(#ffdf72,#ffcc3e);color:#0b1117;font-size:13px;font-weight:800;text-decoration:none;white-space:nowrap}
.gto-play:hover{filter:brightness(1.05)}
@media(max-width:760px){.gto-head{flex-wrap:wrap;gap:4px 12px;padding:10px 12px 6px;height:auto}.gto-head .gto-logo img{width:110px}.gto-nav{order:3;flex:1 0 100%;justify-content:space-between}.gto-nav a{font-size:12px;padding:6px 7px}.gto-nav .gto-brand{display:none}.gto-play{margin-left:auto;height:32px;padding:0 12px;font-size:12px}}

/* sign-in gate (includes/gto_access.php) */
.gto-gate{display:grid;place-items:center;min-height:calc(100vh - 70px);padding:24px 16px}
.gto-gate-box{max-width:520px;text-align:center;padding:40px 32px;border:1px solid var(--gto-line);border-radius:6px;background:var(--gto-panel);color:var(--gto-text)}
.gto-gate-eyebrow{color:var(--gto-gold);font-size:11px;font-weight:800;letter-spacing:.14em;margin:0 0 10px}
.gto-gate-box h1{font-size:28px;line-height:1.15;margin:0 0 12px;letter-spacing:-.5px}
.gto-gate-box p{color:#c4c9cf;font-size:15px;line-height:1.6;margin:0}.gto-gate-box a{color:#ffd34f}
.gto-gate-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:22px}
.gto-gate-btn{display:inline-flex;align-items:center;height:42px;padding:0 18px;border-radius:7px;font-size:14px;font-weight:800;text-decoration:none;color:#fff!important;background:#26292e;border:1px solid #3a3d42}
.gto-gate-btn.primary{background:linear-gradient(#ffdf72,#ffcc3e);color:#0b1117!important;border-color:#ffe184}
/* daily limit pop-up (gto-limits.js) */
.gto-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;background:#000b;backdrop-filter:blur(3px)}
.gto-modal-box{max-width:440px;width:100%;padding:28px 26px;border-radius:6px;background:var(--gto-panel,#16181b);border:1px solid var(--gto-line,#292929);color:var(--gto-text,#eceef1);text-align:center;box-shadow:0 20px 60px #000a}
.gto-modal-box h2{font-size:22px;margin:0 0 10px;letter-spacing:-.3px}
.gto-modal-box p{color:#c4c9cf;font-size:14px;line-height:1.6;margin:0}
.gto-modal-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:20px}
.gto-modal-x{display:block;margin-top:14px;text-align:center;font-size:14px;color:#c4c9cf;text-decoration:none}   /* or Sign in with X (gto-limits.js) */
.gto-modal-x b{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.gto-modal-x:hover b{color:var(--muck-gold)}
.gto-modal-x:focus-visible{outline:2px solid var(--muck-gold);outline-offset:2px;border-radius:2px}
.gto-modal-btn{display:inline-flex;align-items:center;height:40px;padding:0 16px;white-space:nowrap;border-radius:7px;font-size:14px;font-weight:800;text-decoration:none;color:#fff;background:#26292e;border:1px solid #3a3d42;cursor:pointer}
.gto-modal-btn.primary{background:linear-gradient(#ffdf72,#ffcc3e);color:#0b1117;border-color:#ffe184}

.gto-locked{max-width:560px;margin:30px auto;padding:22px;border:1px solid var(--gto-line,#292929);border-radius:10px;background:var(--gto-panel,#16181b);text-align:center}.gto-locked h3{margin:0 0 8px;font-size:17px}.gto-locked p{margin:0;color:#b6bcc4;font-size:14px}
/* Price tag (2026-10-02): Muck GTO is normally $9.99/month, free for now */
.gto-price{display:inline-flex;align-items:center;gap:8px;font-size:13px;line-height:1}
.gto-price s{color:var(--muck-text-3,#7d7d7d);text-decoration-thickness:1.5px}
.gto-price b{padding:5px 10px;border-radius:999px;background:var(--muck-gold-cta,linear-gradient(#ffdf72,#ffcc3e));color:var(--muck-gold-ink,#0b1117);font-size:12px;font-weight:800;letter-spacing:.02em}
.gto-gate-price{margin:0 0 14px!important}

/* One Muck GTO width (Shaun, 2026-10-02: "why is the header position diff ie not lined up w content and the
   buttons are diff style"): the header and every page share a 1600px container (the main site's width) with 26px sides, like the main
   site's header and content; nav and the Play button use the main site's header styles. */
@media(min-width:761px){
  .gto-head{padding-left:max(26px,calc((100% - 1600px)/2 + 26px));padding-right:max(26px,calc((100% - 1600px)/2 + 26px))}
  body>main{max-width:1600px!important;margin-left:auto!important;margin-right:auto!important;padding-left:26px!important;padding-right:26px!important;box-sizing:border-box}
  .method>*,.learn>.l-hero{max-width:900px}
}
.gto-nav a{padding:10px 13px;border:1px solid transparent;border-radius:8px;color:var(--muck-text-2)}
.gto-nav a:hover{color:var(--muck-text);background:var(--muck-surface-2)}
.gto-nav a[aria-current=page]{color:var(--muck-gold-muted);background:color-mix(in srgb,var(--muck-gold) 9%,var(--muck-bg));border-color:color-mix(in srgb,var(--muck-gold) 30%,var(--muck-bg))}
.gto-nav .gto-brand{color:var(--muck-text);border-radius:0;border-width:0 1px 0 0;border-right-color:var(--gto-line)}
.gto-nav .gto-brand[aria-current=page]{color:var(--muck-text);background:none;border-color:transparent var(--gto-line) transparent transparent}
.gto-play{height:40px;padding:0 16px;border:1px solid var(--muck-line-strong);border-radius:10px;background:var(--muck-surface-2);color:var(--muck-text)}
.gto-play:hover{filter:none;border-color:var(--muck-gold-muted);color:var(--muck-gold)}
@media(max-width:760px){.gto-nav a{padding:6px 7px;font-size:12px}.gto-play{height:34px;padding:0 12px}}

/* Moving between Muck GTO pages (Shaun, 2026-10-02: "it still like jerks as we jump between pages"): pages are
   prerendered on hover (speculation rules in each page) and cross-fade instead of blanking, with the header and
   the Study toolbar held in place. Browsers without view transitions just navigate as before. */
@view-transition{navigation:auto}
.gto-head{view-transition-name:gto-head}
.hu-toolbar{view-transition-name:gto-toolbar}
::view-transition-old(root),::view-transition-new(root){animation-duration:.14s}
/* Gold buttons keep their gold on hover (Shaun, 2026-10-02: "hover states for the yellow buttons that arent
   styled/ada friendly"). study-lab.css's catch-all "button:hover { background: #202f40 }" outranked them, turning
   gold into navy with dark text on top. Hover = the site's usual lift; keyboard focus gets a visible gold ring. */
:is(.learn .l-next,.t-go,.t-next,.gto-gate-btn.primary,.gto-modal-btn.primary,.nmax-solved-btn):hover:not(:disabled){background:var(--muck-gold-cta)!important;color:var(--muck-gold-ink)!important;border-color:transparent!important;filter:brightness(1.06);transform:translateY(-1px)}
:is(.learn .l-next,.t-go,.t-next,.gto-gate-btn.primary,.gto-modal-btn.primary,.nmax-solved-btn,.gto-play):focus-visible{outline:2px solid var(--muck-gold);outline-offset:3px}
:is(.learn .l-next,.t-go,.t-next,.gto-gate-btn.primary,.gto-modal-btn.primary,.nmax-solved-btn){transition:filter .15s,transform .15s}
/* The site header (lobby nav + account cluster) and the Muck GTO submenu live in assets/site-header.css. */