@import url('legal-base.css');
:root{--bg:#0b1c28;--panel:#132d3b;--line:#c7b38736;--gold:#e7c785;--muted:#a8b8be;--ink:#f5eddd;--teal:#75c9c1;color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,"PingFang TC","Noto Sans TC",sans-serif;color:var(--ink);background:var(--bg)}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,a{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button,input{font:inherit}button,a,input{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold)}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}a{color:var(--gold);text-underline-offset:4px}button{color:inherit}button svg{width:22px;height:22px;flex-shrink:0}.sky{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 27% 25%,#42665b66,transparent 55%),radial-gradient(ellipse at 85% 92%,#193e5366,transparent 65%),linear-gradient(170deg,#102934,#091623);z-index:-2}.sky:after{content:"";position:absolute;inset:0;opacity:.28;background-image:radial-gradient(#edd19a 1px,transparent 1px),radial-gradient(#abc9d0 1px,transparent 1px);background-size:129px 157px,197px 263px;background-position:0 0,63px 30px}#app{min-height:100dvh}.loading{display:grid;place-content:center;justify-items:center;height:100dvh;color:var(--muted);font-size:13px;gap:20px}.eyebrow{color:var(--gold);font-size:10px;letter-spacing:.28em;font-weight:600}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}.brand img{width:30px;height:40px}.brand b{display:block;font-family:"Songti TC","Noto Serif TC",serif;font-size:18px;letter-spacing:.16em}.brand small{display:block;font-size:8px;letter-spacing:.3em;color:var(--gold);margin-top:3px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:15px;max-width:1200px;margin:auto;padding:calc(20px + env(safe-area-inset-top)) 36px 20px}.version{font-size:10px;letter-spacing:.1em;color:var(--muted);border:1px solid var(--line);padding:6px 10px;border-radius:20px}.text-btn{border:0;background:none;color:var(--muted);min-height:44px;padding:8px 0;display:inline-flex;align-items:center;gap:6px;font-size:13px;text-decoration:none}.text-btn:hover{color:var(--gold)}h1,h2,p{margin-top:0}h1,h2{font-family:"Songti TC","Noto Serif TC",serif;font-weight:600;letter-spacing:.07em}.auth-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,1fr);gap:60px;max-width:1140px;margin:12px auto 0;padding:0 36px;align-items:center;min-height:calc(100dvh - 168px)}.hero{text-align:center;position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center;min-height:580px}.hero h1{font-size:64px;margin:10px 0 3px;letter-spacing:.1em;text-shadow:0 3px 30px #0005}.hero .english{font-family:Georgia,serif;font-size:17px;letter-spacing:.55em;color:var(--gold);margin:0 0 14px}.hero p{font-size:14px;letter-spacing:.23em;color:#c3d0cb}.hero-art{position:relative;height:355px;width:100%;margin-top:5px}.hero-art:before{content:"";position:absolute;left:10%;right:10%;bottom:30px;height:90%;border:1px solid #d7bd772c;border-radius:50% 50% 10% 10%;background:radial-gradient(ellipse at bottom,#cbb57720,transparent 65%);box-shadow:0 0 0 12px #d7bd7707,0 0 0 13px #d7bd7715}.hero-art img{position:absolute;width:76%;height:110%;object-fit:contain;bottom:0;filter:drop-shadow(0 12px 15px #0006)}.hero-art .one{left:-14%;transform:scale(.78);bottom:5px}.hero-art .two{right:-12%;transform:scale(.77);bottom:9px}.hero-art .main{left:10%;width:83%;z-index:2}.hero-note{font-size:11px;letter-spacing:.25em;color:#b1c0bc;margin-top:10px}.auth-panel{position:relative;border:1px solid var(--line);background:linear-gradient(145deg,#1a3441df,#102330f5);padding:32px;border-radius:18px;box-shadow:0 24px 70px #0003}.auth-panel:before{content:"";width:50px;height:2px;background:var(--gold);position:absolute;top:-1px;left:32px}.auth-panel h2{font-size:28px;margin:10px 0}.intro{font-size:13px;line-height:1.8;color:var(--muted);margin-bottom:23px}.primary,.secondary{width:100%;min-height:50px;border-radius:9px;font-size:14px;font-weight:650;letter-spacing:.06em;display:flex;align-items:center;justify-content:center;gap:10px}.primary{border:1px solid #efd299;background:linear-gradient(135deg,#edcf92,#c99b54);color:#2b281d;box-shadow:0 6px 24px #d7ac4214}.primary:hover{filter:brightness(1.06)}.secondary{border:1px solid #a6bec147;background:#203b4770;color:#e7eded}.secondary:hover{background:#294654}.button-stack{display:grid;gap:10px}.divider{display:flex;gap:12px;align-items:center;font-size:10px;color:#84999f;letter-spacing:.1em;margin:21px 0 16px}.divider:before,.divider:after{content:"";height:1px;flex:1;background:#94a6a62b}.socials{display:grid;grid-template-columns:1fr 1fr;gap:10px}.socials button{border:1px solid #879c9e30;background:#0c202c7a;border-radius:8px;min-height:48px;font-size:12px;display:flex;align-items:center;justify-content:center;gap:8px;color:#8ea1a6;cursor:default}.socials small{display:block;font-size:9px;margin-top:2px}.social-icon{font-size:18px;color:#c0cbca;font-family:Arial,sans-serif}.policy-check{display:flex;align-items:flex-start;gap:10px;text-align:left;margin:19px 0;color:var(--muted);font-size:11px;line-height:1.8}.policy-check input{accent-color:var(--gold);width:19px;height:19px;flex:none;margin:1px 0 0}.policy-check a{color:#ced9d6}.auth-foot{text-align:center;color:var(--muted);font-size:12px;margin:20px 0 0}.auth-foot button{border:0;background:none;color:var(--gold);padding:8px;font-size:12px}.field{display:block;font-size:12px;margin-bottom:16px;color:#d9e2dd}.field input{display:block;width:100%;margin-top:8px;min-height:49px;border:1px solid #8aa0a340;border-radius:8px;background:#0b202c;color:var(--ink);padding:12px 14px;font-size:16px;line-height:1.4}.field input::placeholder{color:#738c93}.field small{display:block;font-size:11px;color:var(--muted);line-height:1.65;margin:7px 0 0}.password-wrap{position:relative}.password-wrap input{padding-right:59px}.password-wrap button{position:absolute;right:4px;top:4px;bottom:4px;width:48px;border:0;background:transparent;color:#afc0c3;font-size:11px}.form-error{background:#b5453826;color:#ffc6b2;border:1px solid #de705344;padding:10px 12px;font-size:12px;line-height:1.6;border-radius:7px;margin:0 0 15px;white-space:pre-line}.form-error:empty{display:none}.fine-print{font-size:11px;color:var(--muted);line-height:1.8;margin:12px 0 0}.footer{max-width:1100px;margin:25px auto 0;padding:0 20px calc(22px + env(safe-area-inset-bottom));color:#82989f;display:flex;justify-content:space-between;gap:12px;font-size:10px;line-height:1.6}.footer a{color:#9eafb3;text-decoration:none}.footer nav{display:flex;gap:17px}.notice{position:fixed;z-index:20;bottom:calc(25px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:#e9d7af;color:#263b3e;border:1px solid #ffedc6;border-radius:10px;padding:14px 20px;box-shadow:0 10px 30px #0005;font-size:13px;line-height:1.6;width:max-content;max-width:90vw}.notice[hidden]{display:none}.content{max-width:1100px;margin:12px auto;padding:0 36px}.page-title{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}.page-title h1{font-size:30px;margin:8px 0}.page-title p{font-size:12px;color:var(--muted);margin:0;line-height:1.8}.pill{font-size:10px;padding:6px 9px;color:var(--teal);background:#62bfb11a;border:1px solid #62bfb144;border-radius:20px;white-space:nowrap}.creator{display:grid;grid-template-columns:1.1fr 1fr;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#122b368c;min-height:540px}.character-stage{position:relative;display:grid;place-items:center;overflow:hidden;min-height:430px;background:radial-gradient(ellipse at 50% 75%,#a9c78d2e,transparent 68%)}.character-stage:before{content:"";position:absolute;width:260px;height:260px;border:1px solid #d8bd7f35;border-radius:50%;box-shadow:0 0 0 20px #d8bd7f05,0 0 0 21px #d8bd7f15;transform:translateY(38px) rotateX(63deg)}.character-stage:after{content:"";position:absolute;top:9%;height:70%;width:58%;border:1px solid #d8bd7f15;border-radius:50% 50% 0 0;z-index:-1}.character-stage img{position:relative;object-fit:contain;width:100%;height:100%;max-height:530px;filter:drop-shadow(0 16px 20px #0005)}.character-stage .stamp{position:absolute;top:26px;left:26px;font:11px Georgia,serif;color:#9bacaa;letter-spacing:.22em}.character-stage .stage-note{position:absolute;bottom:19px;font-size:10px;color:#a8b8b3;letter-spacing:.1em}.create-controls{padding:30px;display:flex;flex-direction:column;justify-content:center;border-left:1px solid var(--line)}.class-options{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:24px}.class-option{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-height:76px;padding:8px 3px;background:#0e2430;border:1px solid #91a5a430;color:#9fb2b6;border-radius:9px;font-size:11px}.class-option svg{width:26px;height:26px}.class-option[aria-pressed=true]{color:var(--gold);border-color:#d6b575;background:#d2b77714;box-shadow:inset 0 0 18px #d2b77709}.class-name{display:flex;align-items:baseline;gap:14px}.class-name h2{font-size:30px;margin-bottom:12px}.class-name small{font:10px Georgia,serif;letter-spacing:.16em;color:var(--gold)}.description{font-size:12px;color:#b5c7c7;line-height:1.9;min-height:47px;margin-bottom:15px}.tags{display:flex;gap:6px;margin:0 0 20px}.tags span{font-size:10px;color:#c0cdbc;border:1px solid #9caf9430;padding:4px 9px;border-radius:4px}.gender-row{display:flex;gap:8px;margin-bottom:20px;align-items:center}.gender-row span{font-size:12px;color:var(--muted);margin-right:auto}.gender-row button{min-height:42px;min-width:70px;border:1px solid #8ba39d40;color:var(--muted);background:#0d2430;border-radius:7px;font-size:12px}.gender-row button[aria-pressed=true]{border-color:var(--gold);color:var(--gold)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:15px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:20px}.stats span{font-size:10px;color:var(--muted);display:block}.stats b{font:20px Georgia,serif;display:block;margin-top:5px}.character-list{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.character-card{border:1px solid var(--line);background:#17313bd4;border-radius:12px;overflow:hidden;position:relative}.character-card.selected{border-color:#e0be76;box-shadow:0 0 35px #dcb9760c}.character-card button{width:100%;border:0;background:none;padding:0;text-align:left}.character-card img{width:100%;aspect-ratio:1;object-fit:contain;background:radial-gradient(#a8b6832a,transparent 70%)}.character-card .card-label{padding:15px 17px;display:block;border-top:1px solid var(--line)}.character-card b{font-size:15px;display:block;margin:0 0 7px}.character-card small{font-size:11px;color:var(--muted)}.empty-slot{display:flex;min-height:260px;align-items:center;justify-content:center;flex-direction:column;border:1px dashed #a8b9b144;background:#112b3660;border-radius:12px;color:#a7b8b7;gap:14px;font-size:13px}.empty-slot span{font-size:28px;font-weight:200;color:var(--gold)}.action-bar{margin:24px 0;display:flex;gap:15px;align-items:center}.action-bar .primary{max-width:300px;margin-left:auto}.info-banner{background:#d4b37b0d;border:1px solid #d4b37b2b;border-radius:8px;color:#c1c9b7;padding:12px 15px;font-size:12px;line-height:1.8;margin-bottom:22px}.info-banner a,.info-banner button{color:var(--gold);background:none;border:0;font-size:12px;text-decoration:underline}.camp{display:grid;grid-template-columns:1.1fr 1fr;gap:35px;align-items:center}.camp-stage{position:relative;min-height:465px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:radial-gradient(ellipse at bottom,#94b8a030,transparent 70%)}.camp-stage canvas{display:block;width:100%;height:430px}.camp-stage .caption{position:absolute;bottom:20px;text-align:center;width:100%;color:#b4c3bd;font-size:11px;letter-spacing:.1em}.camp h1{font-size:36px;margin:12px 0}.camp .welcome{font-size:12px;line-height:1.8;color:var(--muted)}.camp-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}.destination{padding:18px;border:1px solid var(--line);background:#17313cc9;border-radius:9px;min-height:95px}.destination strong{display:block;font:17px "Songti TC",serif;letter-spacing:.08em;margin-bottom:10px}.destination span{font-size:10px;color:var(--muted)}.settings{max-width:560px;margin:10px auto 35px;padding:0 22px}.settings h1{font-size:29px;margin:10px 0 25px}.settings-card{border:1px solid var(--line);padding:22px;border-radius:12px;background:#18323e99;margin-bottom:15px}.settings-card h2{font-size:18px;margin-bottom:15px}.settings-card p{font-size:12px;line-height:1.8;color:var(--muted);overflow-wrap:anywhere}.settings-card .secondary{margin-top:15px;font-size:12px}.danger{border-color:#cb897c60;color:#e9a998}.account-row{display:flex;justify-content:space-between;gap:12px;margin:12px 0;font-size:12px}.account-row span{color:var(--muted)}.account-row b{font-weight:400;overflow-wrap:anywhere}.skills{font-size:12px;color:#c9d4c7;line-height:2}.skills b{color:var(--gold);font-weight:400}.busy-overlay{pointer-events:none}#back{margin-bottom:15px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(max-width:800px){.topbar{padding:calc(14px + env(safe-area-inset-top)) 21px 12px}.auth-layout{grid-template-columns:1fr;gap:0;padding:0 22px;max-width:460px;margin-top:0;min-height:0}.hero{min-height:0}.hero h1{font-size:39px;margin:3px 0}.hero .english{font-size:11px;letter-spacing:.48em;margin:5px 0 8px}.hero>.eyebrow{display:none}.hero p{font-size:11px;margin:0}.hero-art{height:196px;max-width:320px;margin:0 auto -13px}.hero-art img{height:112%}.hero-note{display:none}.auth-panel{padding:25px 23px;border-radius:15px}.auth-panel h2{font-size:24px;margin:5px 0 8px}.auth-panel .intro{margin-bottom:16px;font-size:12px}.auth-layout.form-mode .hero{display:none}.auth-layout.form-mode{margin-top:18px}.footer{display:block;text-align:center;font-size:9px;padding-bottom:calc(22px + env(safe-area-inset-bottom));margin-top:24px}.footer nav{justify-content:center;margin-bottom:9px}.content{padding:0 20px;margin-top:8px}.page-title{margin-bottom:15px;gap:8px}.page-title h1{font-size:25px}.page-title p{font-size:11px}.creator{grid-template-columns:1fr;min-height:0;border:0;overflow:visible;background:none}.character-stage{min-height:0;height:290px;max-height:35dvh;margin:-10px -20px 0}.character-stage img{max-height:100%;width:100%}.character-stage .stamp{left:26px;top:25px;font-size:9px}.character-stage .stage-note{bottom:10px;font-size:9px}.character-stage:before{height:210px;width:210px}.create-controls{border:1px solid var(--line);border-radius:13px;padding:18px;background:#142e3aed}.class-options{margin-bottom:16px;gap:7px}.class-option{min-height:62px;font-size:10px;gap:5px}.class-option svg{height:23px;width:23px}.class-name h2{font-size:24px;margin-bottom:8px}.description{font-size:11px;min-height:0;margin-bottom:10px}.tags{margin-bottom:14px}.gender-row{margin-bottom:12px}.gender-row button{min-height:42px}.stats{margin-bottom:16px;padding:12px 0}.create-controls .stats{display:none}.create-controls .field{margin-bottom:12px}.create-controls .field input{margin-top:6px}.character-list{grid-template-columns:1fr 1fr;gap:11px}.empty-slot{min-height:230px}.character-card .card-label{padding:13px}.action-bar{flex-direction:column;margin-top:20px}.action-bar .primary{max-width:none}.action-bar .text-btn{order:2}.camp{grid-template-columns:1fr;gap:20px}.camp-stage{min-height:0;height:330px}.camp-stage canvas{height:320px}.camp-stage .caption{bottom:12px;font-size:10px}.camp h1{font-size:30px}.camp-grid{margin:18px 0}.camp .stats{margin-bottom:12px}.settings{padding:0 20px}.version{font-size:9px}.info-banner{font-size:11px;padding:11px 13px}.account-row{font-size:11px}.policy-check{margin:16px 0}.divider{margin:17px 0 14px}.auth-foot{margin-top:13px}.page-title .pill{font-size:9px}.auth-panel .eyebrow{font-size:9px}}
.account-data{white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px;line-height:1.8;color:#c3d0cd}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
