/* 60sBTC guide pages. Layout: a sticky top bar (logo, guide links, Play button), one readable column, related-guide cards, footer. Dark-only to match the game. */
:root{
  --bg:#06080b; --panel:#0b0f15; --panel2:#10161e; --rule:#1d2633; --text:#d6dce5; --dim:#7a8597; --faint:#4a5566;
  --amber:#ffae1a; --cyan:#58c4f0; --up:#27d17f; --down:#ff5257; --up-bg:#0d2a1c; --down-bg:#2f1214;
  --mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);background:var(--bg)}
body{background:var(--bg);color:var(--text);font:13px/1.45 var(--mono);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
.up{color:var(--up)} .down{color:var(--down)} .dim{color:var(--dim)}
a:focus-visible,button:focus-visible{outline:1px solid var(--amber);outline-offset:2px}
.gtop{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:rgba(11,15,21,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--rule)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--panel)}
.gtop .in{max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:16px;padding-block:10px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.gtop .logo{font-weight:700;letter-spacing:.06em;color:var(--amber);text-decoration:none;white-space:nowrap}
.gtop nav{display:flex;gap:14px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.gtop nav::-webkit-scrollbar{display:none}
.gtop nav a{color:var(--dim);text-decoration:none;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;padding:4px 0;border-bottom:1px solid transparent}
.gtop nav a:hover{color:var(--text)}
.gtop nav a[aria-current="page"]{color:var(--amber);border-bottom-color:var(--amber)}
.cta{display:inline-flex;align-items:center;gap:6px;background:var(--amber);color:#111;font-weight:700;font-size:12px;letter-spacing:.06em;text-decoration:none;padding:8px 12px;white-space:nowrap}
.cta:hover{filter:brightness(1.08)}
.playbox{margin:30px 0 10px;border:1px solid rgba(255,174,26,.45);background:rgba(255,174,26,.05);padding:16px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.playbox p{margin:0;font-size:13.5px;line-height:1.6}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:8px;margin:10px 0 0}
.cards a{display:block;border:1px solid var(--rule);background:var(--panel);padding:12px 14px;text-decoration:none;color:var(--text)}
.cards a:hover{border-color:var(--amber)}
.cards b{display:block;color:var(--amber);font-size:13px;margin-bottom:4px}
.cards span{font-size:12px;line-height:1.55;color:var(--dim)}
footer{max-width:1100px;margin:30px auto 0;border-top:1px solid var(--rule);padding-block:16px 26px;font-size:11.5px;color:var(--dim);line-height:1.7;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
footer a{color:var(--amber)}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
footer{margin-top:8px;font-size:11px;color:var(--dim);line-height:1.6}
footer .credit{margin:8px 0 0;color:var(--text)}
footer .credit a{color:var(--amber)}
footer kbd{font:inherit;color:var(--text);border:1px solid var(--rule);padding:0 4px}
.about .callout{border:1px solid rgba(255,174,26,.45);background:rgba(255,174,26,.05);padding:14px 16px;margin-top:16px}
.about .callout h2{margin-top:0}
.about .legal{border-top:1px solid var(--rule);padding-top:18px;margin-top:30px}
.about .legal p{font-size:12.5px;line-height:1.7;color:var(--dim)}
.about .legal b{color:var(--text)}
.about .ahead{margin-bottom:10px}
.about .byline{margin:4px 0 0;font-size:11.5px;color:var(--dim)}
.about .facts{display:grid;grid-template-columns:minmax(150px,auto) 1fr;border:1px solid var(--rule);margin:14px 0 6px;font-size:12.5px}
.about .facts > div{display:contents}
.about .facts span{padding:7px 10px;border-bottom:1px solid var(--rule)}
.about .facts > div:last-child span{border-bottom:0}
.about .facts span:first-child{color:var(--dim);background:var(--panel2);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
@media (max-width:560px){.about .facts{grid-template-columns:1fr}.about .facts span:first-child{border-bottom:0;padding-bottom:0}}
.about .shot{margin:14px 0}
.about .shot img{display:block;width:100%;height:auto;border:1px solid var(--rule)}
.about .shot figcaption{font-size:11.5px;color:var(--dim);margin-top:6px}
.about summary h3{display:inline;margin:0;font-size:13.5px;font-weight:600;color:inherit}
.about a{color:var(--amber);text-underline-offset:3px}
.about .toc a{color:var(--text)}
.about .wrap{max-width:84ch;margin:0 auto}
.about section{margin-top:22px;scroll-margin-top:12px}
.about h2{margin:0 0 8px;font-size:13px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--amber);text-wrap:balance}
.about h3{margin:14px 0 6px;font-size:13px;font-weight:600;color:var(--text)}
.about .formula{font-weight:600;color:var(--amber);background:var(--panel2);border:1px solid var(--rule);padding:8px 12px;display:inline-block}
.about h2.lead{font-size:17px;letter-spacing:.04em;margin-bottom:10px}
.about p,.about li,.about dd{font-size:13.5px;line-height:1.75;color:var(--text)}
.about p{margin:0 0 10px}
.about ul,.about ol{margin:0 0 10px;padding-left:20px}
.about li{margin-bottom:4px}
.about b{color:var(--amber);font-weight:600}
.about .note{color:var(--dim);font-size:12.5px}
.toc{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;padding:10px 12px;border:1px solid var(--rule);background:var(--panel2);margin:14px 0 4px;font-size:12px}
.toc b{color:var(--dim)!important;font-weight:500;font-size:10.5px;letter-spacing:.1em}
.toc a{color:var(--text);text-underline-offset:3px}
.toc a:hover{color:var(--amber)}
.tbl{overflow-x:auto;margin:6px 0 12px}
.about table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:460px}
.about caption{text-align:left;color:var(--dim);font-size:11.5px;padding-bottom:6px}
.about th,.about td{border:1px solid var(--rule);padding:7px 9px;text-align:left;vertical-align:top}
.about thead th{background:var(--panel2);color:var(--dim);font-weight:500;font-size:11px;letter-spacing:.06em}
.about tbody th{color:var(--dim);font-weight:500}
.about dl{margin:0;display:grid;grid-template-columns:minmax(120px,auto) 1fr;gap:6px 16px}
.about dt{color:var(--amber);font-size:13px;font-weight:600;padding-top:2px}
.about dd{margin:0}
@media (max-width:560px){.about dl{grid-template-columns:1fr}.about dd{margin-bottom:8px}}
.about details{border-top:1px solid var(--rule);padding:9px 0}
.about details:last-child{border-bottom:1px solid var(--rule)}
.about summary{cursor:pointer;font-weight:600;font-size:13.5px}
.about summary:hover{color:var(--amber)}
.about details p{margin:8px 0 2px;color:var(--dim)}
.about details[open] p{animation:fadeIn .3s ease}
.about summary{transition:color .15s}
/* guide-page overrides (after the shared article rules) */
.about{margin:0;border:0;background:var(--bg);padding-block:22px 10px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.crumbs{font-size:11.5px;color:var(--dim);margin-bottom:12px}
.crumbs a{color:var(--dim);text-underline-offset:3px}
.about h1{margin:0;font-size:24px;line-height:1.25;letter-spacing:.01em;color:var(--text);text-wrap:balance}
.about .lede{font-size:14.5px;line-height:1.75;color:var(--text);margin:12px 0 4px}
.about .cta{color:#111;text-decoration:none}
.about .playbox p{margin:0}
.about .cards a{color:var(--text)}
.about nav[aria-label="More guides"]{display:block;margin-top:24px}