:root{--bg: #F4F5F7;--card: #FFFFFF;--dark: #16263F;--prim: #F5811F;--acc: #FFE0C2;--muted: #6B7480;--ok: #3F7D5A;--border: 1px solid #E6E9ED;--shadow: 0 6px 18px rgba(22, 38, 63, .06);--shadow-lift: 0 10px 24px rgba(22, 38, 63, .1)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--dark);font-family:Inter Tight,Segoe UI,system-ui,-apple-system,Roboto,sans-serif;-webkit-font-smoothing:antialiased}#root{max-width:480px;margin:0 auto;min-height:100dvh}.app{padding:16px 16px 100px}.logo{font-family:Inter Tight,Segoe UI,sans-serif;font-weight:800;letter-spacing:-.5px;font-size:26px;color:var(--prim);text-align:center;margin:10px 0 2px}.tagline{text-align:center;color:var(--muted);font-size:13px;margin-bottom:16px}.card{background:var(--card);border:var(--border);border-radius:18px;padding:16px;margin-bottom:14px;box-shadow:var(--shadow)}.card.flat{box-shadow:none}.row{display:flex;gap:12px;align-items:center}.grow{flex:1;min-width:0}h1{font-size:22px;font-weight:800;letter-spacing:-.4px;margin:0 0 4px}h2{font-size:16px;font-weight:700;letter-spacing:-.2px;margin:20px 0 10px}h3{font-size:16px;font-weight:700;margin:0 0 2px}.muted{color:var(--muted);font-size:13px}.small{font-size:12px}.chip{display:inline-block;background:var(--acc);color:#7a3b08;border-radius:999px;padding:4px 12px;font-size:12.5px;font-weight:600;margin:2px 4px 2px 0}.chip.ok{background:#dcebfb;color:#0c447c}.chip.prim{background:var(--prim);color:#fff}.bar{border-radius:999px;height:16px;background:#eaedf1;display:flex;gap:3px;padding:3px;overflow:hidden}.bar span{width:12px;border-radius:999px;flex-shrink:0}.bar span.on{background:var(--prim)}.dots{display:flex;gap:7px;margin-top:8px}.dot{width:28px;height:28px;border:var(--border);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--muted);background:var(--card)}.dot.on{background:var(--prim);color:#fff;border-color:var(--prim)}.dot.future{opacity:.45}button,.btn{font-family:inherit;font-size:15px;font-weight:700;background:var(--prim);color:#fff;border:none;border-radius:999px;padding:14px 18px;cursor:pointer;box-shadow:0 6px 16px #f5811f4d;width:100%;transition:transform .08s ease,box-shadow .15s ease,background .15s ease}button:active{transform:scale(.97)}button.sec{background:var(--card);color:var(--dark);border:1px solid #DCE0E6;box-shadow:none}button.acc{background:var(--acc);color:#7a3b08;box-shadow:none}button.mini{width:auto;padding:9px 16px;font-size:13px;box-shadow:none}button:disabled{opacity:.45;cursor:default;box-shadow:none}input,select,textarea{font-family:inherit;font-size:15px;width:100%;border:1px solid #DCE0E6;border-radius:14px;padding:12px 14px;background:#fbfbfc;color:var(--dark);margin:4px 0 12px;transition:border-color .15s ease,box-shadow .15s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--prim);box-shadow:0 0 0 3px #f5811f26}label{font-size:13px;font-weight:700}.swatches{display:flex;gap:8px;margin:6px 0 14px;flex-wrap:wrap}.swatch{width:34px;height:34px;border-radius:10px;border:3px solid transparent;cursor:pointer}.swatch.sel{border-color:var(--dark);box-shadow:0 0 0 3px #16263f1f}.hair-opt{border:3px solid transparent;border-radius:12px;padding:2px 4px;background:#f1f3f5;cursor:pointer;line-height:0}.hair-opt.sel{border-color:var(--dark);background:#ffe3cc}.nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;background:var(--card);border-top:1px solid #E9ECF0;display:flex;z-index:10;border-radius:22px 22px 0 0;box-shadow:0 -4px 20px #16263f12;padding-bottom:env(safe-area-inset-bottom)}.nav button{flex:1;background:none;border:none;box-shadow:none;border-radius:0;color:var(--muted);font-size:11.5px;font-weight:700;padding:12px 0 14px;display:flex;flex-direction:column;align-items:center;gap:3px;transition:color .15s ease}.nav button.on{color:var(--prim)}.nav .ico{font-size:20px;line-height:1}.items{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.item{border:var(--border);border-radius:16px;background:var(--card);padding:12px 6px;text-align:center;cursor:pointer;box-shadow:0 3px 10px #16263f0d;transition:transform .1s ease}.item:active{transform:scale(.97)}.item.locked{opacity:.4;filter:grayscale(1);box-shadow:none}.item.equipped{background:#ffe3cc;border-color:var(--prim)}.item .nm{font-size:11.5px;font-weight:700;margin-top:4px}.center{text-align:center}.spacer{height:10px}.topbar{display:flex;align-items:center;gap:10px;margin-bottom:12px}.topbar button{width:auto}.banner{background:var(--prim);color:#fff;border:none;border-radius:18px;padding:16px;margin-bottom:14px;box-shadow:0 8px 20px #f5811f47}.banner .muted{color:#ffe1cc}.toast{position:fixed;top:14px;left:50%;transform:translate(-50%);background:#22314e;color:#fff;padding:11px 20px;border-radius:999px;font-weight:700;font-size:14px;z-index:50;max-width:90%;box-shadow:var(--shadow-lift);animation:pop .2s ease-out}@keyframes pop{0%{transform:translate(-50%) scale(.8);opacity:0}}.photo-thumb{width:44px;height:44px;object-fit:cover;border-radius:12px;border:1px solid #E6E9ED}.hist{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #EEF0F3}.code{font-family:Inter Tight,Courier New,monospace;font-size:30px;font-weight:800;letter-spacing:6px;color:var(--prim)}.cover{position:relative;border-radius:18px;overflow:hidden;height:150px;margin-bottom:0;box-shadow:var(--shadow)}.lift{margin-top:-30px;position:relative;z-index:1}.cover-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.cover-scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#0b142352,#0b142300 55%)}.cover-text{position:absolute;left:18px;top:16px;right:18px}.cover-hi{color:#fff;font-weight:800;font-size:21px;letter-spacing:-.3px;text-shadow:0 1px 6px rgba(0,0,0,.4)}.cover-sub{color:#fff;font-size:12.5px;opacity:.95;text-shadow:0 1px 5px rgba(0,0,0,.45)}.cover-opt{width:78px;text-align:center;cursor:pointer}.cover-thumb{width:78px;height:48px;border-radius:12px;overflow:hidden;border:3px solid transparent;box-shadow:0 3px 10px #16263f1f}.cover-thumb-svg{width:100%;height:100%;display:block}.cover-opt.sel .cover-thumb{border-color:var(--dark)}.cover-opt.locked{opacity:.5;cursor:default}.pet{display:inline-block}.pet-name{font-size:11px;font-weight:700;color:var(--muted);margin-top:2px}.pet.bob svg{animation:bob 1.6s ease-in-out infinite}.pet.droop svg{transform:translateY(2px);opacity:.85}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.shields{display:flex;gap:4px;align-items:center;margin-top:8px}.shield-ico{font-size:15px}.shield-ico.spent{opacity:.28;filter:grayscale(1)}.bgs{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 4px}.bg-opt{width:52px;text-align:center;cursor:pointer}.bg-swatch{width:52px;height:40px;border-radius:12px;border:3px solid transparent;box-shadow:0 3px 10px #16263f1a}.bg-opt.sel .bg-swatch{border-color:var(--dark)}.bg-opt.locked{opacity:.5;cursor:default}.bg-opt .bg-nm{font-size:10.5px;font-weight:700;margin-top:3px;color:var(--muted)}.pwd{position:relative}.pwd input{padding-right:46px}.pwd-eye{position:absolute;right:6px;top:5px;width:auto;padding:7px;background:none;border:none;box-shadow:none;color:var(--muted);line-height:0}.pwd-eye:active{transform:none}.link-btn{width:100%;background:none;border:none;box-shadow:none;color:var(--muted);font-size:13px;font-weight:600;padding:12px 0 2px;text-decoration:underline}.link-btn:active{transform:none}.modal-bg{position:fixed;top:0;right:0;bottom:0;left:0;background:#0b142380;z-index:100;display:flex;align-items:center;justify-content:center;padding:20px;animation:fadein .18s ease-out}.modal-card{background:var(--card);border-radius:20px;padding:26px 22px;text-align:center;max-width:340px;width:100%;box-shadow:var(--shadow-lift);animation:pop .22s ease-out}.modal-card h1{margin:8px 0 10px}@keyframes fadein{0%{opacity:0}}.coinbar{display:flex;align-items:center;gap:10px;margin-bottom:14px}.coinbar .mini{width:auto}.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:6px}.kpi{background:var(--card);border:var(--border);border-radius:14px;padding:12px 10px;text-align:center}.kpi-val{font-size:22px;font-weight:800;color:var(--prim)}.kpi-lbl{font-size:11.5px;font-weight:700;color:var(--muted);margin-top:2px}.toggle{width:52px;height:30px;border-radius:999px;padding:0;flex:none;background:#d7dbe1;border:none;box-shadow:none;position:relative;cursor:pointer}.toggle.on{background:var(--prim)}.toggle .knob{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:left .15s ease}.toggle.on .knob{left:25px}.tier-legend{border-top:1px solid #EEF0F3;margin-top:10px;padding-top:10px}.tier-row{display:flex;align-items:center;gap:10px;margin-bottom:5px}.how{text-align:left;margin:8px 0}.how-row{display:flex;gap:12px;align-items:center;padding:7px 0}.how-ico{font-size:22px;width:26px;text-align:center}.interests{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}.interest{width:auto;background:var(--card);color:var(--dark);border:1px solid #DCE0E6;box-shadow:none;padding:9px 14px;font-size:14px;border-radius:999px}.interest.on{background:var(--prim);color:#fff;border-color:var(--prim)}.suggest{display:flex;align-items:center;gap:10px;border:1px solid #E6E9ED;border-radius:14px;padding:12px 14px;margin-bottom:8px;cursor:pointer}.suggest.on{border-color:var(--prim);background:#fff3e9}.suggest-check{width:30px;height:30px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;background:var(--prim)}[data-theme=dark]{--bg: #0E1726;--card: #172440;--dark: #E8EDF5;--muted: #94A2B8;--border: 1px solid #2A3A57}[data-theme=dark] body{background-image:radial-gradient(#1B2942 1.5px,transparent 1.5px)}[data-theme=dark] .bar{background:#223052}[data-theme=dark] input,[data-theme=dark] select,[data-theme=dark] textarea{background:#101c30;border-color:#2a3a57;color:var(--dark)}[data-theme=dark] button.sec,[data-theme=dark] .interest{border-color:#2a3a57}[data-theme=dark] .nav{border-top-color:#24334f}[data-theme=dark] .hist{border-bottom-color:#24334f}[data-theme=dark] .photo-thumb{border-color:#2a3a57}[data-theme=dark] .hair-opt{background:#223052}[data-theme=dark] .tier-legend{border-top-color:#24334f}[data-theme=dark] .suggest{border-color:#2a3a57}[data-theme=dark] .suggest.on{background:#2a2013}[data-theme=dark] .toggle{background:#33425e}