:root{--bg: #16130d;--bg2: #1d1810;--panel: #211b12;--panel2: #2a2317;--ink: #ece3cf;--ink-dim: #a99a7c;--line: #3a3122;--gold: #d8b15a;--gold-dim: #8a6f3a;--jade: #8fae86;--seal: #b5402f;--warn: #d98b4a;--bad: #c75a44;--good: #8fae86;--candle: #e8a85a}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:var(--ink);font-family:"Noto Serif TC","Source Han Serif TC",Songti TC,Songti SC,PingFang TC,serif;-webkit-font-smoothing:antialiased;background-color:var(--bg);background-image:radial-gradient(900px 460px at 50% -8%,#241d12,#14100b00 60%),radial-gradient(420px 320px at 12% 22%,#3c321e59,#0000 70%),radial-gradient(520px 360px at 88% 72%,#282e284d,#0000 70%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");background-attachment:fixed}.app{max-width:520px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;position:relative}.screen{flex:1;padding:16px 16px 90px;position:relative;z-index:1}h1,h2,h3{font-weight:600;letter-spacing:.08em}h2{font-size:20px}.muted{color:var(--ink-dim)}.center{text-align:center}.card{background:linear-gradient(180deg,#2a2317eb,#1d1810eb);border:1px solid var(--line);border-radius:4px;padding:16px;margin-bottom:14px;box-shadow:0 1px #ece3cf0a inset,0 8px 24px #00000059;position:relative}.row{display:flex;align-items:center;gap:10px}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--line);background:linear-gradient(180deg,#2a2317,#211b12);color:var(--ink);padding:11px 16px;border-radius:3px;font-size:15px;font-family:inherit;cursor:pointer;letter-spacing:.06em;transition:transform .06s ease,border-color .15s,color .15s;-webkit-user-select:none;user-select:none}.btn:hover{border-color:var(--gold-dim);color:var(--gold)}.btn:active{transform:translateY(1px)}.btn.primary{border-color:var(--gold-dim);color:var(--gold)}.btn.gold{background:linear-gradient(180deg,#6a4f24,#4a3a1a);border-color:var(--gold);color:#f3dca0}.btn.ghost{background:transparent}.btn.danger{color:var(--bad);border-color:#5a2f28}.btn:disabled,.btn[aria-disabled=true]{opacity:.38;cursor:not-allowed;filter:grayscale(.5)}.btn.sm{padding:7px 11px;font-size:13px}.btn.lg{padding:15px 22px;font-size:17px;width:100%}.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:3px 9px;border-radius:2px;border:1px solid var(--line);color:var(--ink-dim);letter-spacing:.08em}.badge.gold{color:var(--gold);border-color:var(--gold-dim)}.badge.good,.badge.jade{color:var(--jade);border-color:#4a5a44}.badge.warn{color:var(--warn);border-color:#6a4a2a}.badge.bad{color:var(--bad);border-color:#5a2f28}.badge.master{background:var(--seal);color:#f7e6d8;border-color:#d65a45;box-shadow:0 0 0 1px #b7402f66 inset;font-weight:600}.seal{display:inline-grid;place-items:center;width:38px;height:38px;background:var(--seal);color:#f7e6d8;border-radius:3px;font-size:15px;font-weight:600;box-shadow:0 0 0 2px #f7e6d82e inset;letter-spacing:0}.bar{height:8px;background:#0f0c08;border-radius:999px;overflow:hidden;border:1px solid var(--line)}.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--gold-dim),var(--gold));transition:width .3s}.nav{position:fixed;bottom:0;left:0;right:0;max-width:520px;margin:0 auto;display:flex;background:#16130df0;border-top:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:40}.nav a{flex:1;text-align:center;padding:11px 4px 14px;color:var(--ink-dim);text-decoration:none;font-size:11px;letter-spacing:.1em}.nav a .ic{display:block;font-size:19px;margin-bottom:2px;filter:grayscale(.3)}.nav a.on{color:var(--gold)}.nav a.on .ic{filter:none}.toast{position:fixed;bottom:82px;left:50%;transform:translate(-50%);background:#14110bf2;border:1px solid var(--gold-dim);color:var(--gold);padding:9px 16px;border-radius:3px;font-size:13px;z-index:50;max-width:90%;letter-spacing:.06em}.realmfx{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;align-items:center;justify-content:center;pointer-events:none;background:radial-gradient(circle at 50% 45%,#000 0%,transparent 62%)}.realmfx .ring{width:220px;height:220px;border-radius:50%;animation:ringpulse 2.4s ease-out forwards}.realmfx .txt{position:absolute;text-align:center;animation:fxtext 2.4s ease-out forwards}.realmfx .txt b{font-size:32px;color:var(--gold);text-shadow:0 0 24px var(--gold);letter-spacing:.2em}@keyframes ringpulse{0%{box-shadow:0 0 0 0 currentColor;opacity:.9}to{box-shadow:0 0 0 320px transparent;opacity:0}}@keyframes fxtext{0%{opacity:0;transform:translateY(10px) scale(.9)}25%{opacity:1;transform:none}80%{opacity:1}to{opacity:0}}.note{font-size:12px;color:var(--gold-dim);border:1px dashed var(--gold-dim);border-radius:3px;padding:8px 11px;margin-bottom:14px;letter-spacing:.04em;line-height:1.7}.stat{font-variant-numeric:tabular-nums}input.field,select.field{width:100%;background:#0f0c08;border:1px solid var(--line);color:var(--ink);padding:11px;border-radius:3px;font-size:15px;font-family:inherit}label.lbl{font-size:13px;color:var(--ink-dim);display:block;margin:10px 0 5px;letter-spacing:.06em}@keyframes rise{0%{transform:translateY(0) scale(.7);opacity:0}15%{opacity:.9}85%{opacity:.5}to{transform:translateY(-130px) scale(1.1);opacity:0}}@keyframes drift{0%{transform:translate(-6%);opacity:.35}50%{opacity:.6}to{transform:translate(6%);opacity:.35}}@keyframes moonbreath{0%,to{opacity:.8;filter:blur(1px)}50%{opacity:1;filter:blur(0)}}@keyframes candleflame{0%,to{transform:scaleY(1) translateY(0);opacity:.9}50%{transform:scaleY(1.25) translateY(-1px);opacity:1}}.ambience{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.mote{position:absolute;bottom:-6px;border-radius:50%;background:radial-gradient(circle,#f3e6c4 0%,rgba(216,177,90,.5) 40%,transparent 70%);animation:rise linear infinite}.mist{position:absolute;left:-10%;right:-10%;height:60%;background:radial-gradient(120% 60% at 50% 100%,rgba(150,170,210,.1),transparent 70%);animation:drift 9s ease-in-out infinite alternate}.realmfx .beam{position:absolute;width:3px;height:60vh;background:linear-gradient(180deg,transparent,var(--gold),transparent);filter:blur(2px);animation:beam 2.4s ease-out forwards}@keyframes beam{0%{opacity:0;transform:scaleY(.2)}30%{opacity:1;transform:scaleY(1)}to{opacity:0}}