:root{font-family:Tahoma,Arial,sans-serif;color:#253258;background:#f8faff;font-synthesis:none;--header-height:72px}
*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:radial-gradient(circle at 88% 8%,#e8e5ff 0,transparent 28%),radial-gradient(circle at 6% 36%,#e3f9ff 0,transparent 24%),#f8faff}button,a{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #4469db;outline-offset:4px}
.site-header{position:fixed;z-index:10;inset:0 0 auto;background:#fafffff5;border-bottom:1px solid #dce5f5;backdrop-filter:blur(16px);padding-top:env(safe-area-inset-top)}
.header-inner{min-height:72px;max-width:1320px;margin:auto;padding:10px max(25px,env(safe-area-inset-right)) 10px max(25px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 16px}
.site-brand{display:inline-flex;align-items:center;min-height:44px;font-size:16px;font-weight:850;letter-spacing:-.035em;white-space:nowrap}.brand-spark{color:#755ad8;margin-right:5px}.site-header nav{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.nav-link{min-height:44px;padding:10px 15px;border:1px solid #d6dff0;border-radius:999px;background:#fff;color:#35436d;font-size:13px;font-weight:800;letter-spacing:.035em;display:inline-flex;align-items:center;justify-content:center}.nav-link:hover,.nav-link[aria-current=page]{border-color:#849ae3;background:#edf2ff}.support-trigger{color:#fff;background:#495bd3;border-color:#495bd3;box-shadow:0 4px 12px #4859cc33}.support-trigger:hover{background:#3648c4;color:#fff}
.site-main{max-width:1220px;min-height:calc(100dvh - 140px);margin:auto;padding:var(--header-height) max(25px,env(safe-area-inset-right)) 0 max(25px,env(safe-area-inset-left))}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-home .library{padding:28px 0 64px}.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.game-card{border:1px solid #dae2f2;border-radius:22px;background:#fff;min-width:0;overflow:hidden;box-shadow:0 14px 30px #475aa60d;display:flex;flex-direction:column}.game-card-live{cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s}.game-card-live:active{transform:scale(.98)}
.card-art{height:220px;display:grid;place-items:center;position:relative;overflow:hidden;background:linear-gradient(145deg,#e8f2ff,#f0edff)}.card-art img{position:absolute;inset:5% 8%;width:84%;height:90%;object-fit:contain;filter:drop-shadow(0 8px 9px #42586c30);transition:transform .2s ease}
.game-card[data-game=dino] .card-art{background:linear-gradient(145deg,#d8e8cf,#f1e4bd)}.game-card[data-game=alien] .card-art{background:linear-gradient(145deg,#eee0ff,#d8f3fa)}.game-card[data-game=gems] .card-art{background:linear-gradient(145deg,#e0eaff,#e8f6ff)}
.play-cue{position:absolute;right:12px;bottom:12px;display:grid;place-items:center;width:40px;height:40px;padding-left:3px;border-radius:50%;background:#495bd3;color:#fff;box-shadow:0 6px 14px #4051bf33;font-size:15px}
.card-content{padding:18px 20px 22px;display:flex;flex-direction:column;gap:9px}.card-label{font-size:12px;font-weight:800;letter-spacing:.075em;color:#5260a8}.card-content h2{font-size:clamp(18px,2vw,25px);letter-spacing:-.035em;line-height:1.25;margin:0;overflow-wrap:anywhere}.game-card-soon{background:#fcfdff;border-style:dashed;box-shadow:none}.game-card-soon .card-art{background:#f3f5fc}.placeholder-symbol{font-size:64px;color:#a5a6c8}
.site-footer{border-top:1px solid #dce5f1;background:#f2f6fd;padding-bottom:env(safe-area-inset-bottom)}.footer-inner{max-width:1270px;margin:auto;padding:24px max(25px,env(safe-area-inset-right)) 24px max(25px,env(safe-area-inset-left));display:flex;justify-content:space-between;align-items:center;gap:20px;color:#586785;font-size:12px}.footer-inner nav{display:flex;gap:4px 24px;flex-wrap:wrap;font-weight:750;letter-spacing:.025em}.footer-inner a{min-height:44px;display:inline-flex;align-items:center}.footer-inner a:hover{text-decoration:underline;color:#495bd3}
.support-dialog{width:min(460px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;border:1px solid #d7dff0;border-radius:25px;padding:40px 28px 28px;background:#fff;color:#27355c;text-align:center;box-shadow:0 28px 80px #1c2c6773}.support-dialog::backdrop{background:#1a265b78;backdrop-filter:blur(5px)}body:has(.support-dialog[open]){overflow:hidden}.eyebrow{font-size:12px;letter-spacing:.12em;font-weight:800;color:#586789;margin:12px 0}.support-dialog h2{font-size:28px;letter-spacing:-.045em;margin:8px 0}.support-dialog p:not(.eyebrow){color:#566584;line-height:1.55}.dialog-close{position:absolute;top:8px;right:10px;border:0;background:transparent;color:#566584;font-size:28px;min-width:44px;min-height:44px}.dialog-icon{width:54px;height:54px;margin:auto;border-radius:50%;display:grid;place-items:center;background:#e9e9ff;color:#6d63d7;font-size:25px}.support-options{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:24px 0}.support-options span{padding:13px 4px;background:#f4f6fc;border:1px solid #dfe4f1;border-radius:12px;color:#64718d;font-size:14px;font-weight:800}.support-dialog .coming-note{font-size:14px;margin-bottom:0}
.info-page{max-width:760px;margin:auto;padding:48px 0 72px;overflow-wrap:anywhere}.back-link{display:inline-flex;align-items:center;min-height:44px;color:#4e5ec0;font-size:14px;font-weight:800}.info-page h1{font-size:clamp(30px,5vw,48px);letter-spacing:-.045em;margin:24px 0 12px}.info-page .lede{font-size:17px;color:#596987;line-height:1.65;margin-bottom:36px}.info-page section{padding:22px 0;border-top:1px solid #dce3f1}.info-page h2{font-size:19px;margin:0 0 9px}.info-page p,.info-page li,.info-page dd{line-height:1.8;color:#566584;font-size:16px}.info-page ul{padding-left:22px}.info-page dl{display:grid;grid-template-columns:minmax(160px,1fr) 2fr;gap:0 18px}.info-page dt,.info-page dd{padding:13px 0;border-bottom:1px solid #e3e9f4;margin:0}.info-page dt{font-weight:800}.draft-note{color:#775538;background:#fff6e8;padding:12px 16px;border-radius:10px}
@media(hover:hover){.game-card-live:hover{transform:translateY(-4px);box-shadow:0 20px 32px #475aa620;border-color:#a6b6ed}.game-card-live:hover img{transform:scale(1.04)}}
@media(max-width:900px){.footer-inner{display:block}.footer-inner nav{margin-top:12px}}
@media(orientation:portrait) and (max-width:900px){.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.header-inner{padding:8px max(16px,env(safe-area-inset-right)) 8px max(16px,env(safe-area-inset-left));gap:0 8px}.site-header nav{gap:5px}.nav-link{padding:10px 11px;font-size:12px}.site-main{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}.site-home .library{padding-top:20px}.game-grid{gap:14px}.card-art{height:180px}.card-content{padding:15px}.card-content h2{font-size:19px}.info-page{padding:30px 0 60px}.info-page dl{grid-template-columns:1fr}.info-page dt{border-bottom:0;padding-bottom:0}.info-page dd{padding-top:0}}
@media(max-width:420px){.game-grid{grid-template-columns:1fr}.site-header nav{width:100%;justify-content:space-between}.nav-link{flex:1}.card-art{height:210px}.support-options{grid-template-columns:repeat(2,1fr)}}
/* Landscape uses four slots even before the fourth game is added. */
@media(orientation:landscape) and (min-width:480px){.game-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.5vw,18px)}.game-card{border-radius:16px}.card-art{height:clamp(110px,17vw,200px)}.card-content{padding:clamp(10px,1.4vw,18px);gap:8px}.card-content h2{font-size:clamp(15px,1.7vw,22px)}.play-cue{width:32px;height:32px;right:8px;bottom:8px;font-size:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}