:root{--fb-bg:#f4f5f8;--fb-surface:#fff;--fb-text:#15171a;--fb-hint:#8a8f98;--fb-link:#2f7bf6;--fb-btn:#3b82f6;--fb-btn-text:#fff;--fb-danger:#e5484d;--bg:var(--tg-theme-secondary-bg-color,var(--fb-bg));--surface:var(--tg-theme-section-bg-color,var(--tg-theme-bg-color,var(--fb-surface)));--text:var(--tg-theme-text-color,var(--fb-text));--hint:var(--tg-theme-hint-color,var(--fb-hint));--link:var(--tg-theme-link-color,var(--fb-link));--accent:var(--tg-theme-button-color,var(--fb-btn));--accent-text:var(--tg-theme-button-text-color,var(--fb-btn-text));--danger:var(--tg-theme-destructive-text-color,var(--fb-danger));--ok:#2fa66a;--warn:#e8a317;--accent-soft:color-mix(in srgb, var(--accent) 13%, transparent);--accent-2:color-mix(in srgb, var(--accent) 70%, #8b5cf6);--line:color-mix(in srgb, var(--hint) 22%, transparent);--fill:color-mix(in srgb, var(--hint) 12%, transparent);--shadow-sm:0 1px 2px #1018280f, 0 1px 3px #1018280f;--shadow:0 2px 6px #1018280d, 0 8px 24px #10182812;--shadow-lg:0 12px 40px #1018282e;--r-sm:10px;--r:16px;--r-lg:22px;--ease:cubic-bezier(.2, .8, .2, 1);--spring:cubic-bezier(.34, 1.56, .64, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}[data-scheme=dark]{--shadow-sm:0 1px 2px #0000004d;--shadow:0 4px 18px #0000004d;--shadow-lg:0 14px 44px #00000080}@media (prefers-color-scheme:dark){:root:not([data-scheme]){--fb-bg:#0f1216;--fb-surface:#1a1f26;--fb-text:#eef1f5;--fb-hint:#7d8794;--fb-link:#6aa8ff;--fb-btn:#4f8cff;--shadow-sm:0 1px 2px #0000004d;--shadow:0 4px 18px #0000004d;--shadow-lg:0 14px 44px #00000080}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{overscroll-behavior:none;background:var(--bg);height:100%;color:var(--text);-webkit-font-smoothing:antialiased;letter-spacing:-.01em;margin:0;font:15px/1.4 -apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;overflow:hidden}#root{height:var(--tg-viewport-height,100dvh);max-width:640px;margin:0 auto}button,input{font:inherit;color:inherit}button{-webkit-user-select:none;user-select:none}.icon{flex:none;display:block}.muted{color:var(--hint)}.small{font-size:12px}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}}@keyframes pop{0%{opacity:0;transform:scale(.88)translateY(8px)}}@keyframes slideUp{0%{opacity:0;transform:translateY(14px)}}@keyframes sheetUp{0%{transform:translateY(100%)}}@keyframes backdropIn{0%{opacity:0}}@keyframes msgIn{0%{opacity:0;transform:translateY(6px)scale(.98)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{transform:scale(1.07)}}@keyframes blink{0%,80%,to{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-4px)}}.fade-in{animation:fadeIn .4s var(--ease) both}.pop{animation:pop .38s var(--spring) both}.slide-up{animation:slideUp .32s var(--ease) both}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.screen{height:100%;padding:8px 10px calc(8px + env(safe-area-inset-bottom));flex-direction:column;gap:8px;min-height:0;display:flex}.screen.center{text-align:center;justify-content:center;align-items:center;gap:12px;padding:24px}.big-emoji{animation:pop .5s var(--spring) both;font-size:52px;line-height:1}.error-text{max-width:320px;color:var(--hint);margin:0}.spinner{border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;width:34px;height:34px;animation:.75s linear infinite spin}.btn{cursor:pointer;transition:transform .15s var(--ease), opacity .2s, box-shadow .2s, filter .2s;border:0;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:11px 16px;font-weight:650;display:inline-flex}.btn:active:not(:disabled){transform:scale(.96)}.btn:disabled{cursor:default}.btn.primary{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:var(--accent-text);box-shadow:0 6px 18px color-mix(in srgb, var(--accent) 35%, transparent)}.btn.primary:disabled{background:var(--fill);color:var(--hint);box-shadow:none}.btn.big{flex:1;min-height:50px;font-size:16px}.btn.secondary{background:var(--fill);color:var(--text)}.link-btn{color:var(--danger);cursor:pointer;background:0 0;border:0;flex:none;align-self:center;padding:4px 8px;font-size:13px;font-weight:600}.round-actions{flex-direction:column;gap:6px;width:100%;margin-top:4px;display:flex}.round-actions .btn{width:100%;min-height:44px}.timer.done{background:var(--fill);color:var(--ok);border-radius:50%}.card-hint{color:var(--hint);margin-left:auto;font-size:12px;font-weight:500}.drawer-slot{transition:background .3s var(--ease), border-color .3s;animation:fadeIn .3s var(--ease) both;border-radius:14px;align-items:center;gap:10px;padding:10px;display:flex}.drawer-slot.empty{border:1.5px dashed var(--line)}.drawer-slot.taken{border:1.5px solid color-mix(in srgb, var(--accent) 45%, transparent);background:var(--accent-soft)}.slot-pen{background:var(--accent);width:18px;height:18px;color:var(--accent-text);box-shadow:0 0 0 2px var(--surface);border-radius:50%;place-items:center;display:grid;position:absolute;bottom:-3px;right:-4px}.slot-empty-ico{background:var(--fill);width:40px;height:40px;color:var(--hint);border-radius:50%;flex:none;place-items:center;display:grid}.slot-text{flex-direction:column;flex:1;min-width:0;display:flex}.slot-text b{text-overflow:ellipsis;white-space:nowrap;font-size:14.5px;overflow:hidden}.slot-text small{color:var(--hint);font-size:12px}.slot-btn{border-radius:12px;flex:none;padding:8px 14px;font-size:14px}.reroll{width:100%;min-height:40px;font-size:14px}.reroll:disabled{opacity:.45}.round-card{gap:10px;max-width:340px}.round-top{text-align:left;align-items:center;gap:12px;width:100%;display:flex}.round-info{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.round-info .reveal{overflow-wrap:anywhere;font-size:20px}.snap{width:104px;height:104px;box-shadow:var(--shadow), 0 0 0 1px var(--line);cursor:zoom-in;animation:pop .45s var(--spring) both;background:#fff;border:0;border-radius:14px;flex:none;padding:0;overflow:hidden}.snap img{object-fit:cover;width:100%;height:100%;animation:.3s both backdropIn;display:block}.snap-loading{background:linear-gradient(100deg,#f1f2f5 30%,#fafbfc 50%,#f1f2f5 70%) 0 0/200% 100%;width:100%;height:100%;animation:1.2s linear infinite shimmer;display:block}@keyframes shimmer{to{background-position:-200% 0}}.result-line{font-size:13.5px}.result-line.win b{color:var(--ok)}.result-line.lose{font-weight:600}.snap-actions{grid-template-columns:1fr 1fr;gap:6px;width:100%;display:grid}.snap-actions .btn{min-height:40px;padding:8px 10px;font-size:14px}.snap-actions .btn:disabled{opacity:.6}.like-btn{color:#e5484d;background:#e5484d1f}.like-btn b{font-variant-numeric:tabular-nums}.like-btn.liked{color:#fff;background:#e5484d;opacity:1!important}.like-btn.liked .heart{animation:pop .45s var(--spring) both}.round-actions{flex-direction:row!important}.round-actions .btn.primary{flex:1.4}.round-actions .btn.secondary{flex:1}.lightbox{z-index:20;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);cursor:zoom-out;background:#080a0ed1;place-items:center;padding:16px;animation:.2s both backdropIn;display:grid;position:fixed;top:0;bottom:0;left:0;right:0}.lightbox img{max-width:100%;max-height:100%;box-shadow:var(--shadow-lg);animation:pop .35s var(--spring) both;background:#fff;border-radius:16px}.icon-btn{background:var(--surface);width:50px;min-height:50px;color:var(--accent);box-shadow:var(--shadow-sm);padding:0}.danger-btn{background:color-mix(in srgb, var(--danger) 12%, transparent);width:100%;color:var(--danger);margin-top:12px}.avatar{color:#fff;object-fit:cover;-webkit-user-select:none;user-select:none;box-shadow:0 0 0 2px var(--surface);border-radius:50%;flex:none;justify-content:center;align-items:center;font-weight:700;display:inline-flex}.card{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow-sm);padding:12px}.card-head{color:var(--text);align-items:center;gap:8px;margin-bottom:10px;font-size:14px;font-weight:650;display:flex}.card-head .icon{color:var(--accent)}.counter{background:var(--accent-soft);min-width:24px;height:22px;color:var(--accent);border-radius:999px;justify-content:center;align-items:center;margin-left:auto;padding:0 7px;font-size:12px;font-weight:700;display:inline-flex}.lobby-main{scrollbar-width:none;flex-direction:column;flex:1;gap:10px;min-height:0;margin:-4px -10px 0;padding:4px 10px 2px;display:flex;overflow-y:auto}.lobby-main::-webkit-scrollbar{display:none}.hero{border-radius:var(--r-lg);color:#fff;background:radial-gradient(120% 140% at 100% 0,#ffffff38,#0000 55%),linear-gradient(135deg,#22c55e 0%,#10b981 40%,#0ea5e9 100%);flex:none;align-items:center;gap:12px;padding:14px;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 30px #10b98147}.hero:after{content:"";background:#ffffff1f;border-radius:50%;width:140px;height:140px;position:absolute;bottom:-50px;right:-30px}.hero-logo{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffff38;border-radius:16px;flex:none;place-items:center;width:52px;height:52px;font-size:32px;display:grid}.hero-text h1{letter-spacing:-.02em;margin:0;font-size:22px;font-weight:800}.hero-text p{opacity:.9;margin:1px 0 0;font-size:13px}.conn{z-index:1;background:#0000002e;border-radius:999px;align-self:flex-start;align-items:center;gap:6px;margin-left:auto;padding:4px 9px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;font-weight:600;display:inline-flex;position:relative}.conn i{background:#a7f3d0;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 3px #a7f3d04d}.conn.off i{background:#fca5a5;animation:1s infinite pulse;box-shadow:0 0 0 3px #fca5a54d}.players-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px;max-height:168px;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.player-chip{background:var(--fill);min-width:0;animation:pop .35s var(--spring) both;border-radius:12px;align-items:center;gap:8px;padding:6px 10px 6px 6px;transition:opacity .3s;display:flex}.player-chip.is-me{background:var(--accent-soft)}.player-chip.offline{opacity:.4}.chip-ava{position:relative}.crown{color:#5c3d00;width:17px;height:17px;box-shadow:0 0 0 2px var(--surface);background:#ffc53d;border-radius:50%;place-items:center;display:grid;position:absolute;top:-5px;right:-5px}.chip-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:13.5px;font-weight:550;overflow:hidden}.chip-place{color:var(--hint);margin-right:4px}.chip-score{font-variant-numeric:tabular-nums;color:var(--accent);font-size:13px;font-weight:750}.settings{flex-direction:column;display:flex}.segmented{background:var(--fill);border-radius:13px;grid-template-columns:repeat(5,1fr);gap:3px;padding:4px;display:grid;position:relative}.segmented button{color:var(--hint);cursor:pointer;transition:background .25s var(--ease), color .25s, box-shadow .25s, transform .15s;background:0 0;border:0;border-radius:10px;padding:8px 0;font-size:14px;font-weight:650}.segmented button:active:not(:disabled){transform:scale(.95)}.segmented button.active{background:var(--surface);color:var(--text);box-shadow:var(--shadow-sm), 0 0 0 1.5px color-mix(in srgb, var(--accent) 55%, transparent)}.segmented.readonly button{cursor:default}.segmented.readonly button:not(.active){opacity:.6}.switch-row{border-top:1px solid var(--line);cursor:pointer;align-items:center;gap:10px;margin-top:12px;padding-top:12px;display:flex}.switch-row.readonly{cursor:default}.switch-icon{color:#c98a00;background:#ffc53d38;border-radius:10px;flex:none;place-items:center;width:34px;height:34px;display:grid}.switch-text{flex-direction:column;flex:1;min-width:0;display:flex}.switch-text b{font-size:14px;font-weight:650}.switch-text small{color:var(--hint);font-size:12px}.switch-row input{opacity:0;pointer-events:none;position:absolute}.switch{background:var(--line);width:46px;height:28px;transition:background .25s var(--ease);border-radius:999px;flex:none;position:relative}.switch:after{content:"";width:22px;height:22px;transition:transform .3s var(--spring);background:#fff;border-radius:50%;position:absolute;top:3px;left:3px;box-shadow:0 2px 5px #00000038}.switch-row input:checked+.switch{background:var(--ok)}.switch-row input:checked+.switch:after{transform:translate(18px)}.switch-row input:focus-visible+.switch{outline:2px solid var(--accent);outline-offset:2px}.switch-row.readonly .switch{opacity:.6}.settings-note{color:var(--hint);text-align:center;margin-top:10px;font-size:12px}.lobby-actions{flex:none;gap:8px;display:flex}.lobby-chat{flex:0 0 clamp(130px,26%,210px)}.chat{background:var(--surface);border-radius:var(--r);min-height:0;box-shadow:var(--shadow-sm);flex-direction:column;display:flex;overflow:hidden}.game-chat{flex:0 0 clamp(112px,23%,200px)}.chat-list{overscroll-behavior:contain;scrollbar-width:thin;flex-direction:column;flex:1;gap:3px;padding:8px 10px 4px;font-size:13.5px;display:flex;overflow-y:auto;-webkit-mask-image:linear-gradient(#0000 0,#000 10px);mask-image:linear-gradient(#0000 0,#000 10px)}.chat-empty{color:var(--hint);margin:auto;font-size:12px}.msg{animation:msgIn .25s var(--ease) both;word-break:break-word;max-width:100%}.msg-guess{background:var(--fill);border-radius:4px 14px 14px;align-self:flex-start;padding:4px 10px;line-height:1.3}.msg-guess.mine{background:var(--accent-soft);border-radius:14px 4px 14px 14px;align-self:flex-end}.msg-name{margin-right:6px;font-size:12px;font-weight:700}.msg-guess.mine .msg-name{color:var(--accent)}.msg-system,.msg-private,.msg-correct{text-align:center;border-radius:999px;align-self:center;padding:2px 10px;font-size:11.5px}.msg-system{color:var(--hint)}.msg-private{color:var(--warn);background:color-mix(in srgb, var(--warn) 13%, transparent);font-weight:600}.msg-correct{color:var(--ok);background:color-mix(in srgb, var(--ok) 13%, transparent);padding:4px 12px;font-size:12.5px;font-weight:700}.chat-input{align-items:center;gap:6px;padding:6px;display:flex}.chat-input input{background:var(--fill);border:1.5px solid #0000;border-radius:999px;outline:none;flex:1;min-width:0;height:40px;padding:0 14px;font-size:16px;transition:border-color .2s,background .2s}.chat-input input:focus{border-color:color-mix(in srgb, var(--accent) 60%, transparent);background:var(--surface)}.chat-input input::placeholder{color:var(--hint)}.chat-input input:disabled{opacity:.6}.send-btn{background:linear-gradient(135deg, var(--accent), var(--accent-2));width:40px;height:40px;color:var(--accent-text);cursor:pointer;transition:transform .2s var(--spring), opacity .2s;border:0;border-radius:50%;flex:none;place-items:center;display:grid}.send-btn .icon{transform:translate(-1px)}.send-btn:active:not(:disabled){transform:scale(.88)}.send-btn:disabled{opacity:.35;transform:scale(.92)}.statusbar{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow-sm);flex:none;align-items:center;gap:8px;padding:6px;display:flex}.timer{width:44px;height:44px;color:var(--text);flex:none;place-items:center;display:grid;position:relative}.timer svg{position:absolute;top:0;bottom:0;left:0;right:0;transform:rotate(-90deg)}.timer circle{fill:none;stroke-width:4px}.ring-bg{stroke:var(--fill)}.ring-fg{stroke:var(--accent);stroke-linecap:round;transition:stroke-dashoffset .25s linear,stroke .3s}.timer span{font-variant-numeric:tabular-nums;font-size:15px;font-weight:800;position:relative}.timer.urgent{color:var(--danger);animation:1s infinite pulse}.timer.urgent .ring-fg{stroke:var(--danger)}.status-center{text-align:center;min-width:0;animation:fadeIn .3s var(--ease) both;flex:1;justify-content:center;display:flex}.status-text{flex-direction:column;min-width:0;line-height:1.2;display:flex}.status-text small{text-transform:uppercase;letter-spacing:.06em;color:var(--hint);font-size:10.5px;font-weight:600}.status-text span,.status-text .word{text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:650;overflow:hidden}.status-text .word{letter-spacing:.04em;text-transform:uppercase;background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:17px;font-weight:800}.hint{flex-direction:column;align-items:center;min-width:0;max-width:100%;display:flex}.hint-letters{flex-wrap:wrap;justify-content:center;gap:2px 10px;display:flex}.hint-word{gap:3px;display:inline-flex}.hint-word span{text-align:center;text-transform:uppercase;width:13px;height:21px;font-size:16px;font-weight:800;line-height:20px}.hint-word span.blank{border-bottom:2.5px solid color-mix(in srgb, var(--text) 75%, transparent);border-radius:1px}.hint-word span.open{color:var(--accent);border-bottom:2.5px solid var(--accent);animation:pop .4s var(--spring) both}.hint-word span.sym{width:7px;color:var(--hint)}.hint-count{color:var(--hint);margin-top:1px;font-size:10.5px}.score-pill{color:#b57900;cursor:pointer;height:36px;transition:transform .15s var(--ease);background:#ffc53d33;border:0;border-radius:999px;flex:none;align-items:center;gap:5px;padding:0 12px;display:inline-flex}[data-scheme=dark] .score-pill{color:#ffc53d}.score-pill b{font-variant-numeric:tabular-nums;font-size:15px}.score-pill:active{transform:scale(.94)}.strip{scrollbar-width:none;flex:none;gap:6px;margin:0 -10px;padding:1px 10px;display:flex;overflow-x:auto}.strip::-webkit-scrollbar{display:none}.strip-item{background:var(--surface);box-shadow:var(--shadow-sm);border-radius:999px;flex:none;align-items:center;gap:6px;padding:3px 10px 3px 3px;transition:box-shadow .3s,opacity .3s;display:flex}.strip-item.drawer{box-shadow:0 0 0 2px var(--accent), var(--shadow-sm)}.strip-item.offline{opacity:.4}.strip-ava{position:relative}.pen{background:var(--accent);width:14px;height:14px;color:var(--accent-text);box-shadow:0 0 0 1.5px var(--surface);border-radius:50%;place-items:center;display:grid;position:absolute;bottom:-3px;right:-4px}.strip-name{text-overflow:ellipsis;white-space:nowrap;max-width:80px;font-size:12px;font-weight:550;overflow:hidden}.strip-item.me .strip-name{color:var(--accent)}.strip-score{font-variant-numeric:tabular-nums;background:var(--fill);border-radius:999px;padding:1px 6px;font-size:11px;font-weight:750}.offline-bar{text-align:center;color:var(--danger);font-size:12px;font-weight:600;animation:.3s both fadeIn}.board-wrap{flex:1 1 0;justify-content:center;align-items:center;min-height:120px;display:flex;overflow:hidden}.board{box-shadow:var(--shadow), 0 0 0 1px var(--line);background:#fff;border-radius:18px;position:relative;overflow:hidden}.layer{touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block;position:absolute;top:0;bottom:0;left:0;right:0}.layer.drawable{cursor:crosshair}.overlay{z-index:2;justify-content:center;align-items:center;padding:14px;animation:.25s both backdropIn;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.overlay.dim{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0f12166b}.overlay.frost{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff80}.overlay-card{background:var(--surface);color:var(--text);border-radius:var(--r-lg);text-align:center;width:100%;max-width:300px;box-shadow:var(--shadow-lg);flex-direction:column;align-items:center;gap:8px;max-height:100%;padding:18px 16px;display:flex;overflow-y:auto}.overlay-title{letter-spacing:-.02em;font-size:18px;font-weight:800}.overlay-sub{color:var(--hint);font-size:12px}.choices{flex-direction:column;gap:8px;width:100%;display:flex}.choice{cursor:pointer;background:var(--fill);color:var(--text);animation:pop .4s var(--spring) both;transition:transform .15s var(--ease), background .2s, color .2s;border:0;border-radius:14px;padding:13px 12px;font-size:16px;font-weight:700}.choice:first-letter{text-transform:uppercase}.choice:hover{background:var(--accent-soft)}.choice:active{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:var(--accent-text);transform:scale(.96)}.thinking{gap:6px;padding:6px 0 2px;display:flex}.thinking i{background:var(--accent);border-radius:50%;width:9px;height:9px;animation:1.2s infinite blink}.thinking i:nth-child(2){animation-delay:.15s}.thinking i:nth-child(3){animation-delay:.3s}.reveal{letter-spacing:.03em;text-transform:uppercase;background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#0000;animation:pop .5s var(--spring) 50ms both;-webkit-background-clip:text;background-clip:text;font-size:24px;font-weight:850;line-height:1.15}.result{text-align:left;border-radius:14px;align-items:center;gap:10px;width:100%;padding:10px 12px;display:flex}.result.win{background:color-mix(in srgb, var(--ok) 12%, transparent)}.result.win b{color:var(--ok)}.result.lose{background:var(--fill);justify-content:center}.result-emoji{font-size:26px;line-height:1}.pts{color:var(--hint);margin-top:2px;font-size:12px}.pts-chip{color:var(--ok);font-weight:800;display:inline-block}.toolbar{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);flex-direction:column;flex:none;gap:8px;padding:8px;display:flex}.palette{justify-content:space-between;gap:3px;display:flex}.swatch{aspect-ratio:1;cursor:pointer;background:var(--c);min-width:0;max-width:28px;transition:transform .25s var(--spring), box-shadow .2s;border:0;border-radius:50%;flex:1 1 0;padding:0;position:relative;box-shadow:inset 0 0 0 1px #0000001a}.swatch.active{box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--accent);z-index:1;transform:scale(1.12)}.swatch:active{transform:scale(.9)}.swatch.custom{background:conic-gradient(from 90deg,#ff4d4d,#ffd93d,#4dff88,#4dd2ff,#6b5bff,#ff4dd8,#ff4d4d);overflow:hidden}.swatch.custom.active{background:radial-gradient(circle, var(--c) 0 45%, transparent 47%), conic-gradient(from 90deg, #ff4d4d, #ffd93d, #4dff88, #4dd2ff, #6b5bff, #ff4dd8, #ff4d4d);overflow:visible}.swatch.custom input{opacity:0;cursor:pointer;border:0;width:100%;height:100%;padding:0;position:absolute;top:0;bottom:0;left:0;right:0}.tools-row{grid-template-columns:auto 1fr 1fr auto auto;grid-template-areas:"seg size alpha undo clear";align-items:center;gap:6px;display:grid}.tools-row .tool-seg{grid-area:seg}.tools-row .slider.size{grid-area:size}.tools-row .slider.alpha{grid-area:alpha}.tools-row .tool-btn.undo{grid-area:undo}.tools-row .tool-btn.danger{grid-area:clear}@media (max-width:400px){.tools-row{grid-template-columns:auto 1fr auto auto;grid-template-areas:"seg.undo clear""size size alpha alpha";row-gap:4px}}.layer.fill-mode{cursor:cell}.tool-seg{background:var(--fill);border-radius:12px;flex:none;gap:2px;padding:3px;display:flex}.tool-seg button{width:34px;height:30px;color:var(--hint);cursor:pointer;transition:background .2s var(--ease), color .2s, box-shadow .2s;background:0 0;border:0;border-radius:9px;place-items:center;display:grid}.tool-seg button.active{background:var(--surface);color:var(--accent);box-shadow:var(--shadow-sm)}.tool-btn{background:var(--fill);width:36px;height:36px;color:var(--text);cursor:pointer;transition:transform .15s var(--ease), background .2s;border:0;border-radius:12px;flex:none;place-items:center;padding:0;display:grid}.tool-btn:active{transform:scale(.88)}.tool-btn.danger{color:var(--danger);background:color-mix(in srgb, var(--danger) 11%, transparent)}.slider{flex:1 1 0;align-items:center;gap:5px;min-width:0;transition:opacity .2s;display:flex}.slider.off{opacity:.4}.dot-preview{background:repeating-conic-gradient(#e7e9ee 0 25%, #f7f8fa 0 50%) 0 0 / 8px 8px;border-radius:8px;flex:none;place-items:center;width:26px;height:26px;display:grid}.dot-preview i{border-radius:50%;transition:width .15s,height .15s;display:block;box-shadow:0 0 0 1px #0000001f}.slider-label{text-align:right;min-width:30px;color:var(--hint);font-variant-numeric:tabular-nums;font-size:11px;font-weight:650}input[type=range]{-webkit-appearance:none;appearance:none;cursor:pointer;--p:50%;background:0 0;flex:1;width:100%;min-width:0;height:22px;margin:0}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--accent) var(--p), var(--fill) var(--p));border-radius:999px;height:6px}input[type=range]::-moz-range-track{background:var(--fill);border-radius:999px;height:6px}input[type=range]::-moz-range-progress{background:var(--accent);border-radius:999px;height:6px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;transition:transform .15s var(--spring);background:#fff;border:0;border-radius:50%;margin-top:-7px;box-shadow:0 1px 4px #0000004d,0 0 0 1px #0000000d}input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}input[type=range]::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:20px;height:20px;box-shadow:0 1px 4px #0000004d}input[type=range]:disabled{cursor:default}.sheet-backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:10;background:#0a0c1073;justify-content:center;align-items:flex-end;animation:.25s both backdropIn;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.sheet{background:var(--surface);width:100%;max-width:640px;max-height:78%;padding:8px 14px calc(16px + env(safe-area-inset-bottom));box-shadow:var(--shadow-lg);animation:sheetUp .38s var(--ease) both;border-radius:24px 24px 0 0;overflow-y:auto}.sheet-grip{background:var(--line);border-radius:999px;width:38px;height:5px;margin:0 auto 10px}.sheet-head{flex-wrap:wrap;align-items:center;column-gap:8px;margin-bottom:12px;display:flex}.sheet-head .icon{color:#e0a100}.sheet-head b{font-size:18px;font-weight:800}.sheet-sub{color:var(--hint);flex-basis:100%;order:3;margin-top:2px;font-size:12px}.close{background:var(--fill);cursor:pointer;width:32px;height:32px;color:var(--hint);border:0;border-radius:50%;place-items:center;margin-left:auto;display:grid}.rank-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.rank-list li{background:var(--fill);animation:fadeIn .35s var(--ease) both;border-radius:14px;align-items:center;gap:10px;padding:8px 12px 8px 8px;display:flex}.rank-list li.is-me{background:var(--accent-soft)}.rank-list li.offline{opacity:.45}.rank-place{text-align:center;width:26px;color:var(--hint);font-size:16px;font-weight:800}.rank-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:600;overflow:hidden}.rank-name small{color:var(--hint);font-weight:500}.rank-score{font-variant-numeric:tabular-nums;font-size:17px;font-weight:800}@media (max-height:640px){.screen{gap:6px;padding-top:6px}.game-chat{flex-basis:98px}.statusbar{padding:4px}.toolbar{gap:6px;padding:6px}.hero{padding:10px 12px}.hero-logo{width:42px;height:42px;font-size:26px}}