body.ds-offline-page{--navy: #1e4152;--blue: #265166;--ink: #46697c;--line: #bacfda;--bg1: #f6fafd;--bg2: #dde9f0;--tint: #eaf2f7;--ok: #16a34a;--bad: #dc2626;--ease: cubic-bezier(.16, 1, .3, 1);min-height:100vh;margin:0;padding:20px;display:grid;place-items:center;background:radial-gradient(1200px 600px at 80% -10%,var(--bg2),transparent 60%),linear-gradient(180deg,var(--bg1),var(--bg2));color:var(--navy);font-family:Nunito,Nunito Sans,Segoe UI,system-ui,-apple-system,Roboto,Arial,sans-serif;font-size:16px;line-height:1.6}.ds-offline-overlay.ds-offline-page,body.ds-offline-page{--navy: #1e4152;--blue: #265166;--ink: #46697c;--line: #bacfda;--bg1: #f6fafd;--bg2: #dde9f0;--tint: #eaf2f7;--ok: #16a34a;--bad: #dc2626;--ease: cubic-bezier(.16, 1, .3, 1);color:var(--navy);font-family:Nunito,Nunito Sans,Segoe UI,system-ui,-apple-system,Roboto,Arial,sans-serif;font-size:16px;line-height:1.6}body.ds-offline-open{overflow:hidden}.ds-offline-overlay,.ds-offline-page *{box-sizing:border-box}.ds-offline-page .card{display:grid;width:100%;max-width:1100px;min-width:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:#26516633 0 24px 50px -18px,#2651660a 0 2px 8px}.ds-offline-page .game-col{display:flex;min-width:0;align-items:center;flex-direction:column;gap:14px;padding:28px;border-right:1px solid var(--line);background:linear-gradient(180deg,#f6fafd,#dde9f0)}.ds-offline-page .game-head{display:flex;width:100%;max-width:360px;align-items:center;justify-content:space-between;gap:10px}.ds-offline-page .game-head h2{font-size:1.1rem;font-weight:800;letter-spacing:-.01em}.ds-offline-page .icon-btn{padding:7px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--navy);font:inherit;font-size:.82rem;font-weight:700;cursor:pointer;transition:background .2s var(--ease),transform .2s var(--ease)}.ds-offline-page .icon-btn:hover{background:var(--tint)}.ds-offline-page .icon-btn:active{transform:scale(.96)}.ds-offline-page .stage{position:relative;width:100%;max-width:360px;aspect-ratio:2/3;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#7fb4cc;box-shadow:#26516659 0 20px 40px -14px;touch-action:none;user-select:none;-webkit-user-select:none}.ds-offline-page canvas{display:block;width:100%;height:100%;cursor:pointer}.ds-offline-page .overlay{position:absolute;inset:0;display:grid;place-items:center;padding:20px;pointer-events:none}.ds-offline-page .panel{min-width:200px;padding:20px 22px;border:1px solid var(--line);border-radius:18px;background:#ffffffeb;box-shadow:#2651664d 0 14px 30px -10px;text-align:center;backdrop-filter:blur(6px);animation:ds-offline-pop .28s ease;pointer-events:auto}.ds-offline-page .panel h3{margin-bottom:6px;font-size:1.2rem;font-weight:800}.ds-offline-page .panel p{margin-bottom:12px;color:var(--ink);font-size:.85rem}.ds-offline-page .stats{display:flex;justify-content:center;gap:10px;margin-bottom:14px}.ds-offline-page .stat{padding:8px 14px;border-radius:8px;background:var(--tint)}.ds-offline-page .stat b{display:block;font-size:1.4rem;font-weight:800}.ds-offline-page .stat span{color:var(--ink);font-size:.72rem}.ds-offline-page .hidden{display:none!important}.ds-offline-page .hint{max-width:360px;color:var(--ink);font-size:.8rem;text-align:center}.ds-offline-page .info-col{display:flex;min-width:0;justify-content:center;flex-direction:column;gap:20px;padding:56px 52px}.ds-offline-page .brand{color:var(--blue);font-size:.8rem;font-weight:800;letter-spacing:.14em}.ds-offline-page h1{font-size:clamp(2.1rem,4vw,3.25rem);font-weight:800;letter-spacing:-.03em;line-height:1.08}.ds-offline-page h1 em{background:linear-gradient(135deg,#547c90,#265166);background-clip:text;color:var(--blue);font-style:normal;-webkit-text-fill-color:transparent}.ds-offline-page .desc{max-width:44ch;color:var(--ink);font-size:1.0625rem;line-height:1.65}.ds-offline-page .status{display:inline-flex;align-self:flex-start;align-items:center;gap:10px;padding:9px 16px;border:1px solid #f6caca;border-radius:8px;background:#fff4f4;color:var(--bad);font-size:.9rem;font-weight:600;transition:opacity .3s}.ds-offline-page .status.on{border-color:#bfe8cc;background:#effaf3;color:var(--ok)}.ds-offline-page .dot{width:9px;height:9px;border-radius:50%;background:currentColor;animation:ds-offline-pulse 1.6s infinite}.ds-offline-page .status.on .dot{animation:none}.ds-offline-page .btns{display:flex;flex-wrap:wrap;gap:12px}.ds-offline-page .btn{padding:11px 24px;border:1px solid transparent;border-radius:8px;font:inherit;font-weight:700;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease)}.ds-offline-page .btn.primary{background:linear-gradient(135deg,#547c90,#265166);color:#fff;box-shadow:#26516633 0 8px 18px -6px}.ds-offline-page .btn:hover{transform:translateY(-2px) scale(1.015)}.ds-offline-page .btn.primary:hover{box-shadow:#26516647 0 13px 24px}.ds-offline-page .btn.ghost{border-color:var(--line);background:#fff;color:var(--navy)}.ds-offline-page .btn.ghost:hover{background:var(--tint)}.ds-offline-page .btn:active{transform:translateY(1px) scale(.985)}.ds-offline-page .btn[disabled]{opacity:.6;cursor:wait}.ds-offline-page .note{min-height:1.3em;color:var(--ink);font-size:.88rem}.ds-offline-page button:focus-visible{outline:2px solid #265166;outline-offset:3px;box-shadow:#26516614 0 6px 22px}.ds-offline-page .stage:focus-visible{outline:3px solid #547c90;outline-offset:3px}.ds-offline-overlay{position:fixed;z-index:999999;inset:0;display:grid;overflow:hidden;place-items:center;padding:20px;background:radial-gradient(1200px 600px at 80% -10%,var(--bg2),transparent 60%),linear-gradient(180deg,var(--bg1),var(--bg2))}.ds-offline-overlay[hidden]{display:none}.ds-offline-overlay .card{max-height:calc(100vh - 24px);overflow:auto}.ds-offline-page .game-and-info{display:contents}@keyframes ds-offline-pulse{50%{opacity:.35}}@keyframes ds-offline-pop{0%{opacity:0;transform:scale(.94)}}@media(max-width:860px){body.ds-offline-page{place-items:start center;padding:12px}.ds-offline-overlay{padding:12px}.ds-offline-page .card{grid-template-columns:1fr}.ds-offline-page .info-col{order:-1;gap:16px;padding:30px 24px}.ds-offline-page .game-col{border-top:1px solid var(--line);border-right:0;padding:22px 16px}}@media(prefers-reduced-motion:reduce){.ds-offline-overlay *,.ds-offline-page *{animation:none!important;transition:none!important}}