:root{--ink: #1d1b26;--ink2: #2a2735;--ink3: #3a3648;--paper: #f6f2e4;--muted: #b9b3c9;--gold: #f2c23a;--gold-d: #a37a14;--green: #4fb35a;--green-d: #2d7036;--red: #d8433b;--red-d: #8f2620;--teal: #6fa29a;--teal-d: #3c5f59;--poo: #7b4a21;--poo-l: #a86d34;--blue: #4a7fd0;--px: 3px;--safe-b: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%}body{background:var(--ink);background-image:linear-gradient(45deg,#221f2d 25%,transparent 25%,transparent 75%,#221f2d 75%),linear-gradient(45deg,#221f2d 25%,transparent 25%,transparent 75%,#221f2d 75%);background-size:24px 24px;background-position:0 0,12px 12px;color:var(--paper);font:600 15px/1.4 Trebuchet MS,Segoe UI,system-ui,sans-serif;overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:manipulation}canvas{image-rendering:pixelated;image-rendering:crisp-edges;display:block}button{font:inherit;color:inherit}.hidden{display:none!important}.muted{color:var(--muted)}.btn{display:block;width:100%;min-height:46px;padding:10px 14px;margin:0;background:var(--ink3);color:var(--paper);border:0;cursor:pointer;text-align:center;box-shadow:inset 0 calc(var(--px) * -1) 0 #00000059,0 0 0 var(--px) var(--ink),0 var(--px) 0 var(--px) var(--ink);border-radius:2px;transition:transform .06s;position:relative}.btn:hover{filter:brightness(1.12)}.btn:active{transform:translateY(2px)}.btn:focus-visible,.icon-btn:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.btn[disabled]{opacity:.5;cursor:not-allowed;filter:grayscale(.5)}.btn.small{min-height:34px;padding:6px 10px;font-size:13px;width:auto;display:inline-block}.btn.danger{background:#4a2a30}.btn-play{background:var(--green);color:#10230f;font-size:20px;font-weight:800;letter-spacing:.5px;min-height:56px}.btn-play.pulse{animation:pulse 1.6s ease-in-out infinite}@keyframes pulse{50%{filter:brightness(1.18);transform:scale(1.02)}}.btn.gold{background:var(--gold);color:#3a2a05}.icon-btn{width:42px;height:42px;border:0;border-radius:2px;background:var(--ink3);cursor:pointer;font-size:16px;box-shadow:inset 0 -3px #00000059,0 0 0 3px var(--ink);display:grid;place-items:center}.mute-btn:before{content:"🔊"}.mute-btn.muted:before{content:"🔇"}.loading{position:fixed;inset:0;display:grid;place-items:center;z-index:50}.loading-box{text-align:center}.spinner{width:40px;height:40px;margin:0 auto 14px;background:var(--poo);box-shadow:0 0 0 4px var(--ink),0 0 0 7px var(--gold);animation:spin 1s steps(4) infinite}@keyframes spin{to{transform:rotate(360deg)}}.screen{position:fixed;inset:0}#menu{overflow-y:auto;-webkit-overflow-scrolling:touch}.menu-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px 0;max-width:520px;margin:0 auto}.account-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px;min-height:42px}.account-status .who{background:var(--ink2);padding:6px 10px;border-radius:2px;box-shadow:0 0 0 2px var(--ink3);max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-status .who b{color:var(--gold)}.provider-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;min-height:40px;border:0;cursor:pointer;background:var(--paper);color:var(--ink);font-weight:800;border-radius:2px;box-shadow:0 0 0 3px var(--ink),inset 0 -3px #0000002e}.provider-btn svg,.provider-btn img{width:18px;height:18px;display:block}.provider-btn .sep{opacity:.45;font-weight:600}.menu-col{max-width:440px;margin:0 auto;padding:4px 16px calc(24px + var(--safe-b));display:flex;flex-direction:column;gap:12px}.logo{width:100%;max-width:384px;height:auto;aspect-ratio:192 / 72;margin:0 auto}.tagline{text-align:center;margin:-6px 0 2px;color:var(--muted)}.card{background:var(--ink2);box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--ink3);padding:12px;border-radius:2px}.player-card{display:flex;gap:12px;align-items:center}.avatar{width:60px;height:72px;background:#2f3a52;box-shadow:0 0 0 3px var(--ink);flex:none}.pc-main{flex:1;min-width:0}.pc-row{display:flex;justify-content:space-between;align-items:center}.lvl{background:var(--gold);color:#3a2a05;padding:2px 8px;font-weight:800;border-radius:2px}.coins:before{content:"";display:inline-block;width:10px;height:12px;background:var(--gold);box-shadow:inset -2px 0 0 var(--gold-d);margin-right:6px;vertical-align:-1px}.coins{color:var(--gold);font-weight:800}.xpbar{height:10px;background:var(--ink);margin:8px 0 6px;box-shadow:0 0 0 2px var(--ink3)}.xpbar i{display:block;height:100%;background:linear-gradient(90deg,var(--green),#8fe39a);width:0;transition:width .4s}.pc-sub{font-size:13px;color:var(--muted)}.play-note{margin:-4px 0 0;text-align:center;font-size:13px;color:var(--muted);min-height:1em}.menu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.menu-grid .nav{min-height:66px;font-size:12.5px;padding:8px 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.menu-grid .ico{width:32px;height:32px}.menu-grid .lock{position:absolute;top:3px;right:4px;font-size:11px}.menu-grid .dot{position:absolute;top:5px;right:6px;width:10px;height:10px;background:var(--red);box-shadow:0 0 0 2px var(--ink);animation:blink 1s steps(2) infinite}@keyframes blink{50%{opacity:.3}}@media (max-width: 360px){.menu-grid{grid-template-columns:repeat(2,1fr)}}#play{display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.stage{position:relative;margin-top:8px}#game{box-shadow:0 0 0 4px var(--ink),0 0 0 8px var(--ink3);background:#000}.side-btns{position:absolute;top:0;left:calc(100% + 18px);display:flex;flex-direction:column;gap:12px}.tut-box{position:absolute;left:6px;right:6px;bottom:8px;background:#1d1b26f0;padding:10px 12px;box-shadow:0 0 0 3px var(--gold);display:flex;gap:10px;align-items:center}.tut-box p{margin:0;flex:1;font-size:14px}.controls{width:100%;max-width:520px;flex:1;display:none;align-items:center;justify-content:space-between;padding:8px 20px calc(10px + var(--safe-b));gap:12px}.pad{width:136px;height:136px;border-radius:50%;background:radial-gradient(circle,var(--ink3) 0 40%,var(--ink2) 41%);box-shadow:0 0 0 4px var(--ink),0 0 0 7px var(--ink3);position:relative;touch-action:none;flex:none}.knob{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:var(--paper);box-shadow:inset 0 -5px #c9c3b0,0 0 0 3px var(--ink);pointer-events:none}.action{width:112px;height:112px;border-radius:50%;border:0;background:var(--gold);color:#3a2a05;font-weight:900;font-size:15px;box-shadow:inset 0 -7px 0 var(--gold-d),0 0 0 4px var(--ink),0 0 0 7px var(--ink3);touch-action:none;flex:none;cursor:pointer}.action.down{transform:translateY(3px);box-shadow:inset 0 -3px 0 var(--gold-d),0 0 0 4px var(--ink),0 0 0 7px var(--ink3)}.action.idle{background:#c9c3b0;box-shadow:inset 0 -7px #8f8a74,0 0 0 4px var(--ink),0 0 0 7px var(--ink3);color:var(--ink3)}.hint{color:var(--muted);font-size:13px;text-align:center;flex:1}body.touch .controls{display:flex}body.touch .hint{display:none}body.touch .side-btns{left:50%;top:calc(100% + 18px);transform:translate(-50%);flex-direction:row;gap:14px;z-index:2}body:not(.touch) .controls{display:flex;justify-content:center;flex:none}body:not(.touch) .controls .pad,body:not(.touch) .controls .action{display:none}.overlay{position:fixed;inset:0;z-index:20;background:#0c0a12c7;display:grid;place-items:center;padding:16px}.sheet{width:100%;max-width:520px;max-height:calc(100dvh - 32px);display:flex;flex-direction:column;background:var(--ink2);box-shadow:0 0 0 4px var(--ink),0 0 0 8px var(--ink3);border-radius:2px}.sheet.small{max-width:380px;padding:18px;gap:12px;overflow-y:auto}.sheet.small h2{margin:0;text-align:center}.sheet header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:3px solid var(--ink)}.sheet header h2{margin:0;font-size:20px}.sheet-body{padding:14px;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:10px}.row{display:flex;align-items:center;gap:10px;background:var(--ink3);padding:10px;border-radius:2px}.row .grow{flex:1;min-width:0}.row .title{font-weight:800}.row .desc{font-size:13px;color:var(--muted)}.row.done{box-shadow:inset 4px 0 0 var(--green)}.row.locked{opacity:.55}.price{color:var(--gold);font-weight:800;white-space:nowrap}.price s{color:var(--muted);font-weight:600;margin-right:4px}.progress{height:8px;background:var(--ink);margin-top:6px}.progress i{display:block;height:100%;background:var(--green)}.gate{background:#3a2f1c;box-shadow:inset 4px 0 0 var(--gold);padding:12px;border-radius:2px}.badge{display:inline-block;font-size:11px;padding:1px 6px;border-radius:2px;background:var(--ink);color:var(--muted);margin-left:6px;vertical-align:1px}.tabs{display:flex;gap:8px}.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.cal .d{aspect-ratio:1 / 1.15;background:var(--ink3);border-radius:2px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:11px;text-align:center;padding:2px;position:relative;line-height:1.1}.cal .d b{font-size:10px;color:var(--muted);position:absolute;top:2px;left:4px}.cal .d .rw{font-size:16px}.cal .d .lbl{font-size:9.5px;color:var(--paper)}.cal .d.claimed{background:#24432a}.cal .d.claimed:after{content:"✓";position:absolute;right:3px;top:1px;color:var(--green);font-weight:900}.cal .d.today{box-shadow:0 0 0 3px var(--gold);animation:pulse 1.6s ease-in-out infinite}.cal .d.missed{opacity:.4}.cal .d.big{background:#3d3157}@media (prefers-reduced-motion: reduce){.cal .d.today,.btn-play.pulse,.menu-grid .dot{animation:none}}.swatches{display:flex;flex-wrap:wrap;gap:8px}.swatch{width:42px;height:42px;border:0;border-radius:2px;cursor:pointer;box-shadow:0 0 0 3px var(--ink);position:relative}.swatch.sel{box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--gold)}.swatch[disabled]{opacity:.35;cursor:not-allowed}.swatch .lv{position:absolute;bottom:-2px;right:0;font-size:10px;background:var(--ink);padding:0 3px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{padding:8px 12px;min-height:40px;background:var(--ink3);border:0;border-radius:2px;cursor:pointer;box-shadow:0 0 0 3px var(--ink)}.chip.sel{background:var(--gold);color:#3a2a05}.chip[disabled]{opacity:.4;cursor:not-allowed}label.slider{display:flex;align-items:center;gap:10px}label.slider input{flex:1;accent-color:var(--gold);height:28px}table.board{width:100%;border-collapse:collapse;font-size:14px}table.board td,table.board th{padding:6px 8px;text-align:left}table.board tr:nth-child(2n) td{background:var(--ink3)}table.board th{color:var(--muted);font-weight:600;font-size:12px}.report .stamp{text-align:center;font-size:34px;font-weight:900;letter-spacing:2px;transform:rotate(-6deg);padding:6px;margin:4px auto;border:4px solid;width:max-content}.report .stamp.pass{color:var(--green);border-color:var(--green)}.report .stamp.fail{color:var(--red);border-color:var(--red)}.report .stamp.fired{color:#ff8a65;border-color:#ff8a65}.report .line{display:flex;justify-content:space-between;padding:6px 10px;background:var(--ink3);margin:4px 0;border-radius:2px}.report .line.ok b{color:var(--green)}.report .line.bad b{color:var(--red)}.report .note{font-size:13px;color:var(--muted);text-align:center;margin:6px 0 0}#toasts{position:fixed;left:50%;top:14px;transform:translate(-50%);z-index:60;display:flex;flex-direction:column;gap:8px;pointer-events:none;width:min(92vw,380px)}.toast{background:var(--ink2);box-shadow:0 0 0 3px var(--gold);padding:10px 14px;animation:toast 3.2s forwards}@keyframes toast{0%{opacity:0;transform:translateY(-8px)}8%,85%{opacity:1;transform:none}to{opacity:0}}.rotate{display:none;position:fixed;inset:0;z-index:40;background:var(--ink);place-items:center;text-align:center;padding:24px}@media (orientation: landscape) and (max-height: 500px) and (pointer: coarse){body.playing .rotate{display:grid}}#cynnx-game-chip{display:none!important}
