:root{color-scheme:light;--paper: #fbf7ef;--ink: #1e1b16;--soft: #46403a;--faint: #6e665a;--cerise: #e8306e;--cerise-ink: #a81152;--cerise-wash: #fbe5ec;--line: rgba(30, 27, 22, .35);--f-display: "Fredoka", system-ui, -apple-system, sans-serif;--f-body: "Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;--f-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-display);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}#app{min-height:100%;display:flex;justify-content:center}button{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--cerise);outline-offset:2px}.scr{width:100%;max-width:480px;min-height:100dvh;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top,0px) + 18px) 20px calc(env(safe-area-inset-bottom,0px) + 30px)}.center{align-items:center;justify-content:center;text-align:center;gap:12px}.top{gap:10px}.mascot{width:150px;height:150px}.mascot-sm{width:64px;height:64px;flex:none}.big{font-weight:700;font-size:34px;line-height:1.04;text-wrap:balance}.big.title{font-size:30px;margin-top:6px}.big.small{font-size:24px}.sub{font:400 16px/1.45 var(--f-body);color:var(--soft);max-width:32ch}.top .sub{max-width:none}.fine{font:400 13.5px/1.4 var(--f-body);color:var(--soft)}.hello{display:flex;align-items:center;gap:12px}.hello .big{font-size:28px;text-align:left}.teamline{font:600 18px/1.25 var(--f-display);margin-top:4px;overflow-wrap:anywhere}.teamline .no{font:700 14px var(--f-mono);color:var(--cerise-ink)}.field{width:100%;text-align:left}.field.stack{display:flex;flex-direction:column;gap:6px}.field.stack label:not(:first-child){margin-top:8px}.field label{display:block;font:700 11px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--soft);margin-bottom:6px}.inp{width:100%;height:58px;border:2.5px solid var(--ink);border-radius:18px;background:#fff;padding:0 16px;font:500 21px var(--f-display);color:var(--ink);appearance:none}.inp::placeholder{color:var(--faint);font-weight:400}.inp.code{text-align:center;letter-spacing:.02em}.inp.pin{font:700 26px var(--f-mono);letter-spacing:.4em;text-align:center}.inp-wrap{position:relative}.inp.named{padding-right:52px}.inp-wrap.bad .inp{border-color:var(--cerise-ink);background:#fff6f9}.clear{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;border:0;background:var(--ink);color:#fff;font:700 17px/30px var(--f-body);padding:0;cursor:pointer}.helper{display:flex;justify-content:space-between;gap:10px;margin:6px 0 12px;min-height:2.7em;font:600 13px/1.35 var(--f-body);color:var(--soft)}.helper .msg{white-space:pre-line}.helper .msg.err{color:var(--cerise-ink)}.helper .ct{font:600 12.5px var(--f-mono);white-space:nowrap;margin-left:auto}.helper .ct.max{color:var(--cerise-ink)}.btnrow{display:grid;grid-template-columns:auto 1fr;gap:8px}.go{height:54px;border:0;border-radius:18px;background:var(--ink);color:var(--paper);font:600 18px var(--f-display);cursor:pointer}.go.wide{width:100%}.go:disabled{opacity:.35;cursor:not-allowed}.ghost{height:54px;padding:0 16px;border-radius:18px;border:2px solid var(--line);background:#fff;font:600 16px var(--f-display);cursor:pointer}.linkish{align-self:flex-start;margin-top:18px;border:0;background:none;padding:6px 0;font:600 15px var(--f-body);color:var(--cerise-ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}.note{width:100%;background:#fff;border:2px solid rgba(30,27,22,.12);border-radius:16px;padding:12px 14px;text-align:left;font:400 14.5px/1.45 var(--f-body);margin-top:10px}.pinhead{font:700 11px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}.pinrow{display:flex;gap:8px;margin:8px 0 10px}.pinrow span{width:46px;height:56px;border-radius:14px;background:#fff;border:2.5px solid var(--ink);display:grid;place-items:center;font:700 28px var(--f-mono)}.wait{margin-top:26px;display:flex;flex-direction:column;gap:6px}.alert{display:flex;gap:10px;background:var(--cerise-wash);border:2px solid var(--cerise);border-radius:14px;padding:10px 12px;font:600 15px/1.35 var(--f-body)}.alert b{display:block;font:700 16px var(--f-display)}.banner{position:fixed;top:calc(env(safe-area-inset-top,0px) + 8px);left:50%;transform:translate(-50%);background:var(--ink);color:var(--paper);font:600 14px var(--f-body);padding:6px 14px;border-radius:100px;z-index:10}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
