:root{--bg: #0c1020;--panel: #161c30;--panel-border: #2a3350;--ink: #e8ecf6;--muted: #9aa6c4;--gold: #e0a23a;--gold-strong: #f4c662;--danger-bg: #2a1620;--danger-border: #5a2c3a;--danger-ink: #f3b9c4;--font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--font);overflow:hidden}#game-root{position:fixed;top:0;right:0;bottom:0;left:0}#game-root canvas{display:block}#ui-root{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(1200px 600px at 50% -10%,#141a30 0%,var(--bg) 70%)}#ui-root:empty{display:none}.panel{width:min(440px,92vw);background:var(--panel);border:1px solid var(--panel-border);border-radius:16px;padding:28px;box-shadow:0 20px 60px #00000080}.eyebrow{text-align:center;letter-spacing:.18em;text-transform:uppercase;font-size:12px;color:var(--muted);margin:0 0 6px}.title{text-align:center;margin:0 0 4px;font-size:30px;font-weight:700;color:var(--gold-strong)}.subtitle{text-align:center;color:var(--muted);margin:0 0 22px;font-size:14px}.wallet-btn{display:block;width:100%;margin:10px 0;padding:14px 16px;font-size:16px;font-weight:600;color:#2a1c06;background:var(--gold);border:none;border-radius:12px;cursor:pointer;transition:transform .06s ease,background .15s ease}.wallet-btn:hover{background:var(--gold-strong)}.wallet-btn:active{transform:translateY(1px)}.wallet-btn:disabled{opacity:.5;cursor:default}.hint{text-align:center;color:var(--muted);font-size:13px;margin:16px 0 0}.error-box{background:var(--danger-bg);border:1px solid var(--danger-border);color:var(--danger-ink);border-radius:12px;padding:16px 18px;font-size:15px;line-height:1.5;text-align:center;margin:8px 0 22px}.retry-btn{display:block;margin:0 auto;padding:12px 30px;font-size:15px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#2a1c06;background:var(--gold);border:none;border-radius:10px;cursor:pointer}.retry-btn:hover{background:var(--gold-strong)}.char-preview{display:flex;justify-content:center;margin:0 0 18px}.char-preview img{width:160px;height:160px;image-rendering:pixelated;background:radial-gradient(circle at 50% 60%,#1e2740 0%,var(--panel) 70%);border:1px solid var(--panel-border);border-radius:14px}.seg{display:flex;gap:8px;margin:0 0 14px}.seg-btn{flex:1;padding:10px 0;font-size:14px;font-weight:600;color:var(--muted);background:#0e1426;border:1px solid var(--panel-border);border-radius:10px;cursor:pointer;transition:all .12s ease}.seg-btn:hover{color:var(--ink)}.seg-btn.is-on{color:#2a1c06;background:var(--gold);border-color:var(--gold)}.cc-looks{display:grid;grid-template-columns:repeat(auto-fit,minmax(74px,1fr));gap:8px;margin:0 0 14px}.cc-look{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px 6px;background:#0e1426;border:1px solid var(--panel-border);border-radius:10px;cursor:pointer;color:var(--muted);font-size:12px;font-weight:600;transition:all .12s ease}.cc-look img{width:56px;height:56px;image-rendering:pixelated;object-fit:contain}.cc-look:hover{color:var(--ink);border-color:#3a466e}.cc-look.is-on{color:var(--gold-strong);border-color:var(--gold);background:#15192c}.text-input{display:block;width:100%;padding:13px 15px;font-size:16px;font-family:var(--font);color:var(--ink);background:#0e1426;border:1px solid var(--panel-border);border-radius:12px;outline:none;transition:border-color .15s ease}.text-input:focus{border-color:var(--gold)}.text-input::placeholder{color:var(--muted)}.field-error{min-height:18px;margin:8px 2px 12px;font-size:13px;color:var(--danger-ink);text-align:center}.spinner{width:34px;height:34px;margin:6px auto 16px;border:3px solid var(--panel-border);border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{text-align:center;color:var(--muted)}