:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--codle-bg:linear-gradient(135deg,#e6f3ff 0%,#f5f3ff 52%,#fff1f2 100%);--codle-text:#2b3444;--codle-text-muted:#94a3b8;--codle-icon:#2b3444b3;--codle-card:#ffffffd1;--codle-card-border:#0f172a0f;--codle-card-shadow:0 26px 60px #0f172a1a;--codle-input:#ffffff8c;--codle-input-border:#0f172a0f;--tile-bg:#ffffffeb;--tile-border:#0f172a0d;--tile-shadow:0px 5px 3px 2px #0f172a14;--tile-muted-text:#94a3b8e6;--tile-green:#a7f3d0;--tile-yellow:#fef08a;--tile-gray:#ffffffc7;--key-bg:#818384;--key-border:#0f172a0f;--key-text:#2b3444;--key-shadow:0 10px 20px #0f172a1a;--accent:#34d399;--accent-text:#fbfbff;--accent-shadow:0 22px 40px #a78bfa59;--toast-bg:#0000;--toast-border:#0f172a14;--toast-text:#2b3444;--topbar-bg:#ffffffeb;--topbar-border:#0f172a14;--topbar-text:#1f2537;--topbar-icon-muted:#272e4261}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--codle-bg:radial-gradient(circle at 20% 10%,#1b2550 0%,#0b1020 70%);--canc-clear-bg:#ffffff12;--codle-text:#e8ecf7eb;--codle-text-muted:#e8ecf7eb;--codle-icon:#e8ecf7a6;--codle-card:#111728b8;--codle-card-border:#ffffff1a;--codle-card-shadow:0 34px 80px #0000008c;--codle-input:#ffffff12;--codle-input-border:#ffffff1a;--tile-bg:#ffffff12;--tile-border:#ffffff1a;--tile-shadow:3px 3px 0px 3px #0000008c;--tile-muted-text:#e8ecf7eb;--tile-green:#2e785ab8;--tile-yellow:#876e28c7;--tile-gray:#818384;--key-bg:#818384;--key-border:#ffffff1a;--key-text:#e8ecf7;--key-shadow:0 14px 26px #0009;--accent:#34d399;--accent-text:#fbfbff;--accent-shadow:0 26px 50px #9f8bff66;--toast-bg:#121212db;--toast-border:#ffffff1a;--toast-text:#e8ecf7;--topbar-bg:#080c18e6;--topbar-border:#ffffff14;--topbar-text:#f4f5fb;--topbar-icon-muted:#e8ecf766}.global-topbar{width:100%;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;justify-content:space-between;align-items:center;padding:clamp(12px,2.2vw,15px) clamp(22px,4.5vw,25px);display:flex;position:relative}.global-topbar__brand{color:var(--topbar-text);text-transform:uppercase;align-items:baseline;gap:.85rem;font-weight:500;display:inline-flex}.brand-title{letter-spacing:.55em;color:#10b981;font-size:clamp(.95rem,1.8vw,1.15rem)}.brand-subtitle{letter-spacing:.4em;color:var(--topbar-icon-muted);margin-top:2px;font-size:clamp(.72rem,1.4vw,.9rem)}.global-topbar__actions{align-items:center;gap:.85rem;display:flex}.global-topbar__icon{color:var(--topbar-text);background:0 0;border:none;justify-content:center;align-items:center;padding:6px;text-decoration:none;transition:opacity .12s;display:inline-flex}.global-topbar__icon svg{width:24px;height:24px}.global-topbar__icon:hover{opacity:.75}.global-topbar__icon:active{opacity:.55}.global-topbar__icon.is-disabled{opacity:.35;pointer-events:none}[data-theme=dark] .global-topbar__icon{color:var(--topbar-text)}.codle-screen{color:var(--codle-text);justify-content:center;padding:clamp(20px,4vw,8px) clamp(20px,4vw,8px) 0;display:flex}.codle-shell{flex-direction:column;justify-content:flex-start;align-items:center;gap:clamp(18px,4vw,40px);width:min(981px,100%);height:auto;display:flex}.codle-caption{text-align:center;letter-spacing:.35em;text-transform:uppercase;color:var(--codle-text-muted);font-size:.78rem}.game-shell{flex-direction:column;align-items:center;gap:clamp(18px,1vw,60px);width:min(520px,100%);margin:0 auto;display:flex;position:relative}.game-loader-layer{opacity:0;visibility:hidden;pointer-events:none;z-index:10;border-radius:28px;justify-content:center;align-items:center;transition:opacity .18s,visibility 0s linear .18s;display:flex;position:absolute;inset:0}.game-loader-layer.is-active{opacity:1;visibility:visible;pointer-events:all;transition:opacity .18s,visibility linear}.game-loader-spinner{border:3px solid #ffffff40;border-top-color:var(--accent);border-radius:999px;width:56px;height:56px;animation:.75s linear infinite codle-spin}@keyframes codle-spin{to{transform:rotate(360deg)}}.game-board .grid{gap:clamp(18px,3vw,35px) clamp(12px,2vw,15px)}.board-scroll-window{overscroll-behavior:contain;scrollbar-width:none;max-height:calc(4*clamp(45px,8.2vw,60px) + 8rem);margin:12px 0;overflow-y:auto}.flip-tile{perspective:900px;opacity:1;transition:opacity 80ms}.game-board-loading .flip-tile{opacity:0}.flip-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .42s;position:relative}.flip-inner.flip-reveal{transform:rotateX(180deg)}.flip-face{backface-visibility:hidden;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.flip-back{transform:rotateX(180deg)}.tile-front,.tile-back{background:var(--tile-bg);border:1px solid var(--tile-border);width:100%;height:100%;color:var(--codle-text);font-variant-numeric:tabular-nums;border-radius:22px;font-weight:600}.tile-back-gray{color:var(--tile-muted-text)}.tile-back-yellow{background:var(--tile-yellow);color:#2b3444d9}[data-theme=dark] .tile-back-yellow{color:#e8ecf7eb;background:#f59e0b;border:2px solid #fcd34d}.tile-back-green{background:var(--tile-green);color:#1f4634d9}[data-theme=dark] .tile-back-green{color:#e8ecf7eb;background:#10b981;border:2px solid #34d399}@media (max-width:480px){.flip-inner{width:87.5%;height:87.5%}.tile-front,.tile-back{border-radius:12px}.game-board .grid{gap:0}}.keypad-panel{width:min(560px,100%)}.keypad-stack{flex-direction:column;align-items:center;gap:12px;width:100%;max-width:560px;margin:0 auto;display:flex}.keypad-stack-wide{width:fit-content;max-width:100%}.keypad-stack-wide .glass-input{max-width:none}.glass-input{background:var(--codle-input);border:1px solid var(--codle-input-border);border-radius:22px;justify-content:center;align-items:center;gap:12px;width:100%;padding:14px;display:flex}.code-display{letter-spacing:.45em;color:var(--codle-text-muted);font-variant-numeric:tabular-nums}.control-key{background:var(--canc-clear-bg);border:1px solid var(--key-border);color:var(--key-text);border-radius:18px}.digit-key{background:var(--canc-clear-bg);border:1px solid var(--key-border);color:var(--key-text);-webkit-user-select:none;user-select:none;border-radius:18px;transition:transform .15s,box-shadow .16s,filter .16s}.digit-key:hover:enabled,.control-key:hover:enabled,.submit-chip:hover:enabled{filter:brightness(1.01);transform:translateY(-2px)}.digit-key:active:enabled,.control-key:active:enabled{transform:scale(.97);box-shadow:inset 0 2px 7px #0f172a1a}.digit-key:disabled,.control-key:disabled{opacity:.55;cursor:not-allowed}.digit-key-gray{opacity:.3;background:#94a3b859}.digit-key-yellow{color:#2b3444;background:#fef08ad9}.digit-key-green{color:#234034;background:#a7f3d0e6}[data-theme=dark] .digit-key-gray{color:#e8ecf7bf;background:#e8ecf71a}[data-theme=dark] .digit-key-yellow{color:#e8ecf7f2;background:#f59e0b}[data-theme=dark] .digit-key-green{color:#e8ecf7f2;background:#10b981}.submit-chip{color:var(--codle-text);border:1px solid var(--tile-border);background:var(--canc-clear-bg);border-radius:18px;transition:transform .15s,filter .16s}.submit-chip:hover:enabled{filter:brightness(1.02);border:1px solid var(--tile-border)}.submit-chip:active:enabled{border:1px solid var(--tile-border);transform:scale(.97)}.submit-chip:disabled{opacity:.3;box-shadow:none;border:1px solid var(--tile-border);cursor:not-allowed}.toast-layer{z-index:50;pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.status-toast{background:var(--toast-bg);border:1px solid var(--toast-border);color:var(--toast-text);border-radius:999px;padding:10px 16px;font-weight:600;box-shadow:0 18px 40px #00000026}@media (prefers-reduced-motion:reduce){.flip-inner,.digit-key,.control-key,.submit-chip{transition:none!important}}.codle-nav{justify-content:space-between;align-items:flex-start;padding-top:clamp(6px,1vw,10px);display:flex}.codle-logo{letter-spacing:.65em;color:var(--codle-text);font-size:clamp(1.1rem,2.2vw,1.45rem);font-weight:500}.codle-actions{gap:12px;display:flex}.codle-icon{width:44px;height:44px;color:var(--codle-icon);background:#ffffffa6;border:1px solid #0f172a0f;border-radius:999px;justify-content:center;align-items:center;transition:transform .14s,filter .16s,background .16s;display:inline-flex;box-shadow:0 16px 34px #0f172a1a,inset 0 1px #ffffffb3}.codle-icon svg{width:22px;height:22px}.codle-icon:hover{filter:brightness(1.02);transform:translateY(-1px)}.codle-icon:active{transform:scale(.96)}[data-theme=dark] .codle-icon{color:var(--codle-icon);background:#ffffff0f;border-color:#ffffff1a;box-shadow:0 18px 42px #0000008c}.codle-board-stage{justify-content:center;align-items:flex-start;display:flex}
