:root{color-scheme:light;--bg:#f7f5f0;--ink:#293d36;--muted:#879089;--accent:#355d4e;--line:#e3e6dd;--warm:#da906b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}main{max-width:460px;padding:22px 24px max(22px,env(safe-area-inset-bottom));min-height:100dvh;margin:auto;display:flex;flex-direction:column}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}a{color:inherit;text-decoration:none}#brand{font-size:13px;font-weight:800;letter-spacing:1.6px;display:flex;align-items:center;gap:7px}.brandmark{color:var(--accent);font-size:24px}.edition,.ambient{display:none}.help{border:1px solid #dedfd5;background:#fff9;border-radius:50%;width:34px;height:34px;color:#6c7b6e}button,select{font:inherit;color:inherit;touch-action:manipulation}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid #a2b8a3;outline-offset:3px}h1{font-size:36px;line-height:1.1;letter-spacing:-1.3px;font-weight:750;margin:0 0 12px}#app{overflow-anchor:none}.intro{font-size:14px;line-height:1.65;color:#7d897f;margin:0 0 24px}.eyebrow{font-size:9px;font-weight:700;color:#8b9989;letter-spacing:1.8px}.welcome{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 25px}.welcome h1{font-size:39px;line-height:1.03;margin:12px 0 13px;font-weight:800}.welcome h1 em{font-style:normal;color:var(--warm)}.welcome p{font-size:12px;line-height:1.65;color:#819082;margin:0}.spy-mascot{position:relative;width:116px;flex-shrink:0;align-self:center;padding:9px 0 0}.spy-mascot:before{content:'';position:absolute;z-index:-1;width:126px;height:126px;border-radius:50%;background:#e9ede0;top:10px;left:-6px}.spy-mascot svg{display:block;width:116px;height:138px;transform:rotate(8deg)}.mascot-spark{position:absolute;color:#d99a6f;font-size:18px}.spark-one{left:-12px;top:11px}.spark-two{right:-2px;bottom:8px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:22px 0 11px}.section-heading .field-label{margin:0}.field-label{font-weight:700;font-size:13px}.section-heading small{font-size:9px;font-weight:600;color:#a4ada1;letter-spacing:1px}.games{display:grid;grid-template-columns:1fr 1fr;gap:10px}.game-option{position:relative;isolation:isolate;overflow:hidden;min-width:0;height:124px;text-align:left;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:14px 12px;border:1px solid transparent;border-radius:16px;background:#eee5db;box-shadow:0 2px 4px #3b4d3910}.game-option:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#fff9,transparent 75%)}.game-option strong{font-size:16px;line-height:20px;white-space:nowrap;font-weight:750;z-index:1}.game-subtitle{font-size:9px;line-height:16px;color:#7c8073;z-index:1}.game-art{position:absolute;right:5px;top:4px;width:91px;height:69px;object-fit:contain;z-index:-1;filter:drop-shadow(0 5px 5px #2b3c3120)}.game-dota{background:#e9d8d0}.game-dota .game-art{width:109px;right:-2px;top:0;height:74px;object-fit:cover;border-radius:0 0 0 32px;opacity:.9;mask-image:linear-gradient(110deg,transparent,#000 35%)}.game-csgo{background:#e6e5d5}.game-csgo .game-art{right:0;top:0;width:115px;height:78px;transform:rotate(-12deg)}.game-brawlstars{background:#eaddb4}.game-brawlstars .game-art{width:70px;height:70px;right:10px;top:4px;transform:rotate(8deg)}.game-clashroyale{background:#dbe6ec}.game-clashroyale .game-art{height:85px;right:7px;top:-7px;transform:rotate(9deg)}.game-option.active{border-color:#648471;box-shadow:0 0 0 2px #64847122,0 3px 7px #3b4d3910}.game-check{position:absolute;top:10px;left:10px;display:grid;place-items:center;background:var(--accent);color:#fff;font-size:10px;width:19px;height:19px;border-radius:50%;opacity:0}.game-option.active .game-check{opacity:1}.themes{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;height:65px}.themes.two{grid-template-columns:1fr 1fr}.themes.single{grid-template-columns:1fr}.theme{border:1px solid var(--line);border-radius:12px;background:#fffc;padding:10px 4px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;font-size:11px;font-weight:600;min-width:0}.theme small{font-size:10px;font-weight:400;color:#9aa293}.theme.active{background:#e6ece2;border-color:#a7b9a1;color:var(--accent)}.themes.single .theme{flex-direction:row;justify-content:space-between;padding:14px}.topic-hint{height:34px;font-size:10px;line-height:16px;color:#939c8e;margin:9px 0 0}.players{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#fffc;border:1px solid var(--line);border-radius:14px;padding:10px 12px}.players>span{font-size:11px;color:#879282}.counter{display:flex;gap:14px;align-items:center}.counter button{width:34px;height:34px;background:#edf0e6;border:0;border-radius:9px;font-size:22px}.counter strong{font-size:20px;min-width:25px;text-align:center}.hint,.note{font-size:10px;color:#929d8c;line-height:1.6}.hint{margin:8px 0 12px}.primary{width:100%;height:56px;padding:0 12px;display:flex;align-items:center;justify-content:center;gap:30px;border:0;border-radius:14px;background:var(--accent);color:#fff;font-weight:650;font-size:14px;margin:10px 0;box-shadow:0 4px 10px #355d4e19}.primary:hover{background:#294e3f}.primary:active{background:#244636}.primary span{font-size:22px;font-weight:400}.note{text-align:center;margin:8px 0 0}.start-dock{position:sticky;bottom:0;z-index:3;background:linear-gradient(0deg,var(--bg) 80%,#f7f5f000);padding:8px 0 10px;margin-top:2px}.secondary{width:100%;padding:16px;border:1px solid var(--line);background:#fff8;border-radius:12px;margin-top:8px;font-size:14px}.back{border:0;background:transparent;padding:0;color:var(--muted);font-size:12px;margin-bottom:24px;text-align:left}.overline{font-size:10px;color:#9aa28f;letter-spacing:1.2px;margin:0 0 12px;display:block}.secret{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px 16px;margin:20px 0;box-shadow:0 8px 22px #344b3910}.secret h2{font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.6px;margin:8px 0;overflow-wrap:anywhere;max-width:100%}.secret p{font-size:12px;line-height:20px;color:#909a89;margin:8px 0}.spy-icon{width:70px;height:70px;display:grid;place-items:center;background:#edf1e5;border-radius:22px;font-size:38px;color:var(--accent);margin-bottom:16px}.word-image{width:192px;height:128px;object-fit:contain;margin:0 0 12px;border-radius:9px;max-width:100%;flex-shrink:0}.ready-icon{font-size:28px;color:var(--accent);background:#e7ecdf;border-radius:50%;width:56px;height:56px;display:grid;place-items:center;margin-bottom:28px}.tip{font-size:13px;line-height:1.8;color:#7a8973;border-top:1px solid var(--line);padding:22px 0;margin-bottom:25px}footer{margin-top:auto;padding-top:25px;text-align:center;font-size:8px;letter-spacing:1px;color:#b1b8a7}dialog{max-width:410px;width:calc(100% - 32px);padding:28px;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:20px}dialog::backdrop{background:#253a3270;backdrop-filter:blur(3px)}dialog p,dialog li{font-size:14px;line-height:1.7;color:#7c8974}dialog ol{padding-left:20px}.close{float:right;background:none;border:0;font-size:25px}.secret.swipeable{touch-action:pan-x;user-select:none;-webkit-user-select:none}.secret.swipeable img{-webkit-user-drag:none}
#app[data-stage=deal] .back{height:24px;margin:0 0 18px}#app[data-stage=deal] .overline{line-height:14px;margin:0 0 10px}#app[data-stage=deal] h1{font-size:34px;line-height:42px;margin:0}#app[data-stage=deal] .intro{height:48px;margin:10px 0 0;line-height:22px;font-size:13px}#app[data-stage=deal] .secret{height:336px;min-height:336px;margin:16px 0}#app[data-stage=deal] .secret h2{font-size:22px;line-height:26px;margin:8px 0;max-height:78px}#app[data-stage=deal] .secret .overline{margin:0 0 4px}#app[data-stage=deal] #deal{height:56px;margin:0;line-height:20px;font-size:13px}
@media(max-width:360px){main{padding:18px 16px}header{margin-bottom:22px}.welcome h1{font-size:35px}.welcome p{font-size:11px}.spy-mascot,.spy-mascot svg{width:94px}.spy-mascot svg{height:118px}.spy-mascot:before{width:104px;height:104px}.game-option strong{font-size:15px}.game-option{height:117px}.game-subtitle{font-size:8px}.counter{gap:10px}}
@media(prefers-reduced-motion:no-preference){.game-option,.theme{transition:background-color .15s,border-color .15s,box-shadow .15s}}
.spy-mascot{isolation:isolate}
.start-dock{position:relative;bottom:auto}
.word-image.items{width:256px;height:176px;margin-bottom:8px}#app[data-stage=deal] .secret:has(.word-image.items){padding:12px 16px}#app[data-stage=deal] .secret:has(.word-image.items) h2,#app[data-stage=deal] .secret:has(.word-image.items) p{margin:4px 0}
.header-actions{display:flex;gap:9px;align-items:center}.theme-toggle{font-size:19px;line-height:1}.swipe-hint{height:56px;display:flex;align-items:center;justify-content:center;gap:13px;color:#708876;font-size:12px;line-height:18px;user-select:none}.swipe-hint small{display:block;font-size:10px;color:var(--muted)}.swipe-arrow{font-size:28px;line-height:32px}.secret.swipeable{transform:translateY(var(--swipe-y,0px));opacity:var(--swipe-opacity,1);transition:transform .18s ease,opacity .18s ease;cursor:grab;position:relative;z-index:1}.secret.swipeable:focus-visible{outline:2px solid #96ae94;outline-offset:4px}.secret.is-dragging{transition:none;cursor:grabbing}.secret.is-leaving{animation:cardSwipeOut .22s cubic-bezier(.4,0,.8,.3) forwards;pointer-events:none}@keyframes cardSwipeOut{from{transform:translateY(var(--swipe-y,0px));opacity:var(--swipe-opacity,1)}to{transform:translateY(-420px) rotate(-4deg);opacity:0}}@media(prefers-reduced-motion:no-preference){.swipe-arrow{animation:swipeNudge 1.8s ease-in-out infinite}@keyframes swipeNudge{0%,100%{transform:translateY(4px);opacity:.5}50%{transform:translateY(-4px);opacity:1}}}@media(prefers-reduced-motion:reduce){.secret.swipeable{transition:none}.secret.is-leaving{animation:none}}
:root[data-color-mode=dark]{color-scheme:dark;--bg:#18201e;--ink:#e8ece3;--muted:#98aa9a;--accent:#b0c9ac;--line:#39463d;--warm:#e8aa83}:root[data-color-mode=dark] .help{background:#25322b;color:#c3d0bf;border-color:#405044}:root[data-color-mode=dark] .welcome p,:root[data-color-mode=dark] .intro{color:#a4b3a2}:root[data-color-mode=dark] .eyebrow{color:#a9b69f}:root[data-color-mode=dark] .spy-mascot:before{background:#2b3a2f}:root[data-color-mode=dark] .section-heading small{color:#8c9d89}:root[data-color-mode=dark] .game-dota{background:#4b3935}:root[data-color-mode=dark] .game-csgo{background:#3c4030}:root[data-color-mode=dark] .game-brawlstars{background:#4c4229}:root[data-color-mode=dark] .game-clashroyale{background:#2b414b}:root[data-color-mode=dark] .game-option:before{background:linear-gradient(0deg,#202c27ed,transparent 90%)}:root[data-color-mode=dark] .game-subtitle{color:#b5c3b2}:root[data-color-mode=dark] .game-option.active{border-color:#a7c09f;box-shadow:0 0 0 2px #adc5a223}:root[data-color-mode=dark] .game-check{color:#17251a}:root[data-color-mode=dark] .theme,:root[data-color-mode=dark] .players,:root[data-color-mode=dark] .secret{background:#242f2a}:root[data-color-mode=dark] .theme.active{background:#354737;border-color:#819b77}:root[data-color-mode=dark] .theme small,:root[data-color-mode=dark] .players>span,:root[data-color-mode=dark] .hint,:root[data-color-mode=dark] .note,:root[data-color-mode=dark] .topic-hint,:root[data-color-mode=dark] .overline,:root[data-color-mode=dark] .secret p{color:#a5b59e}:root[data-color-mode=dark] .counter button,:root[data-color-mode=dark] .spy-icon,:root[data-color-mode=dark] .ready-icon{background:#334232}:root[data-color-mode=dark] .primary{color:#1c2b1e;background:#b0c9ac}:root[data-color-mode=dark] .primary:hover{background:#c3d9bd}:root[data-color-mode=dark] .primary:active{background:#a4bf9e}:root[data-color-mode=dark] .secondary{background:#242f2a}:root[data-color-mode=dark] .tip,:root[data-color-mode=dark] dialog p,:root[data-color-mode=dark] dialog li{color:#a6b79e}:root[data-color-mode=dark] footer{color:#81927c}:root[data-color-mode=dark] .start-dock{background:linear-gradient(0deg,var(--bg) 80%,#18201e00)}:root[data-color-mode=dark] .swipe-hint{color:#b0c6a9}:root[data-color-mode=dark] .secret{box-shadow:0 8px 24px #0002}

.round-actions{display:flex;flex-direction:column;justify-content:center;min-height:55dvh;gap:12px}.round-actions .primary,.round-actions .secondary{margin:0;height:56px}

.developer{display:block;margin-top:10px;font-size:10px;letter-spacing:.2px;text-transform:none}.developer strong{color:var(--ink);font-weight:650}.support-link{display:flex;align-items:center;gap:12px;padding:14px 16px;margin-top:18px;border:1px solid var(--line);border-radius:14px;background:#fff8;font-size:12px;line-height:18px}.support-link svg{color:var(--accent);flex-shrink:0}.support-link small{display:block;font-size:10px;color:var(--muted)}.support-external{margin-left:auto;color:var(--muted);font-size:18px}:root[data-color-mode=dark] .support-link{background:#242f2a}.support-link:hover{border-color:var(--accent)}

.players{justify-content:center}.players .counter{display:grid;grid-template-columns:44px 70px 44px;gap:20px;align-items:center;justify-items:center}.players .counter button{width:40px;height:40px}.players .counter strong{width:70px}.players-note{text-align:center}.welcome h1{margin:0}
