:root{--ink: #1b1327;--paper: #fff7e9;--cream: #ffe6bd;--coral: #ff4f36;--sun: #ffc93c;--berry: #e0397a;--mint: #35c06b;--sky: #38b6ff;--grape: #7b5cff;--shadow: 5px 5px 0 var(--ink);--shadow-s: 3px 3px 0 var(--ink);color-scheme:light}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;background:#2a1b3d;color:var(--ink);font:500 16px/1.35 Rubik Variable,Rubik,system-ui,sans-serif;-webkit-font-smoothing:antialiased;touch-action:manipulation;overscroll-behavior:none;-webkit-user-select:none;user-select:none}#app{min-height:100dvh;display:flex;flex-direction:column;padding:max(14px,env(safe-area-inset-top)) 14px max(16px,env(safe-area-inset-bottom));gap:14px}.bar{display:flex;align-items:center;gap:8px;background:var(--paper);border:3px solid var(--ink);border-radius:12px;box-shadow:var(--shadow-s);padding:8px 12px;transform:rotate(-.8deg);font-size:14px;font-weight:800}.dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--ink);flex:none}.bar .right{margin-left:auto;letter-spacing:.14em;background:var(--cream);border:2px solid var(--ink);border-radius:8px;padding:1px 8px}h1{font-size:22px;margin:0;font-weight:800}h1.prompt{font-size:23px;line-height:1.2}h1.logo{font-family:Pacifico,Rubik Variable,cursive;font-weight:400;font-size:34px;text-align:center;line-height:1.1;color:var(--sun);text-shadow:4px 4px 0 var(--ink);transform:rotate(-2deg);margin-bottom:4px}.sub{font-size:15px;font-weight:600;opacity:.65;margin:0}.step{align-self:flex-start;background:var(--coral);color:var(--paper);border:2px solid var(--ink);border-radius:8px;padding:2px 10px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;transform:rotate(-1.5deg)}.card{background:var(--paper);border:3px solid var(--ink);border-radius:18px;box-shadow:var(--shadow);padding:18px;display:flex;flex-direction:column;gap:14px}.join-card{margin:auto 0;transform:rotate(-1deg)}input,textarea{width:100%;padding:14px;font:inherit;font-size:17px;font-weight:600;background:#fffdf7;color:var(--ink);border:3px solid var(--ink);border-radius:12px;resize:none;-webkit-user-select:text;user-select:text}input:focus,textarea:focus{outline:none;background:var(--cream)}.code-input{font-size:32px;text-align:center;letter-spacing:.3em;text-transform:uppercase;font-weight:800;padding-left:.3em}button{font:inherit;font-weight:800;color:var(--ink);background:var(--paper);border:3px solid var(--ink);border-radius:14px;box-shadow:var(--shadow);padding:16px 14px;min-height:60px;cursor:pointer;transition:transform .06s,box-shadow .06s}button:active:not(:disabled){transform:translate(5px,5px);box-shadow:none}button:disabled{opacity:.4;box-shadow:var(--shadow-s)}button.primary{background:var(--sun);font-size:19px}button.big{min-height:78px;font-size:22px}.foot{display:flex;align-items:center;gap:12px}.counter{font-size:13px;font-weight:800;opacity:.55;font-variant-numeric:tabular-nums}.foot .primary{margin-left:auto;min-width:150px}.votes{display:flex;flex-direction:column;gap:14px}button.vote{--tint: var(--sky);position:relative;min-height:96px;text-align:left;padding-left:26px;background:var(--tint)}button.vote:before{content:"";position:absolute;left:0;top:0;bottom:0;width:14px;background:var(--ink);border-radius:10px 0 0 10px}button.vote .label{font-size:20px;font-weight:800;line-height:1.2;display:block}.big-status{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:24px 12px}.big-status .icon{font-size:40px;background:var(--paper);border:3px solid var(--ink);border-radius:20px;box-shadow:var(--shadow);padding:10px 18px;transform:rotate(-3deg)}.big-status h2{margin:0;font-size:30px;font-weight:800;color:var(--sun);text-shadow:3px 3px 0 var(--ink);transform:rotate(-1.2deg)}.big-status p{margin:0;background:var(--paper);border:3px solid var(--ink);border-radius:12px;box-shadow:var(--shadow-s);padding:8px 16px;font-weight:700;transform:rotate(.8deg)}.tone-good h2{color:var(--mint)}.tone-bad h2{color:var(--coral)}.timerbar{height:16px;background:#fffdf7;border:3px solid var(--ink);border-radius:999px;overflow:hidden}.timerbar i{display:block;height:100%;background:var(--sun)}.err{background:var(--coral);color:var(--paper);border:3px solid var(--ink);border-radius:12px;box-shadow:var(--shadow-s);padding:8px 14px;font-size:15px;font-weight:800;text-align:center;transform:rotate(-1deg)}