@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600;700&display=swap');
:root{--gold:#e8c989;--muted:#8d9ab3;--panel:#151d30;--line:#ffffff13}*{box-sizing:border-box}body{margin:0;background:#0c1221;color:#e9edf5;font:14px/1.6 system-ui,sans-serif;background-image:radial-gradient(ellipse at 80% 15%,#25314c66,transparent 50%)}button,input,select{font:inherit}button,select{cursor:pointer}button{border:1px solid var(--line);border-radius:8px;background:#202a40;color:inherit;padding:10px 18px;transition:.2s}button:hover{border-color:var(--gold);transform:translateY(-1px)}button:disabled{opacity:.4;cursor:not-allowed}input,select{padding:9px;background:#0d1526;color:#e9edf5;border:1px solid #36415a;border-radius:7px}h1,h2,h3{font-family:'Noto Serif SC',serif;font-weight:600}h2{font-size:27px;margin:4px 0}h3{font-size:20px}small,.muted{color:var(--muted)}a{color:var(--gold)}aside{width:224px;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--line);padding:35px 22px;background:#0d1424}.brand{display:flex;gap:14px;align-items:center;color:var(--gold);font-size:30px}.brand span{font:600 21px 'Noto Serif SC',serif}.brand small{display:block;font:8px system-ui;letter-spacing:2px;margin-top:9px}.edition{font-size:11px;letter-spacing:3px;color:#8390a9;margin:48px 12px 20px}nav button{display:block;width:100%;text-align:left;background:none;border:0;margin:7px 0;padding:14px 16px;color:#9ba8be}nav button.active{color:var(--gold);background:#e8c98912;border-left:2px solid var(--gold)}.asidebottom{position:absolute;bottom:35px;line-height:2.5;color:var(--gold)}main{margin-left:224px;padding:30px 42px;max-width:1700px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}header small{letter-spacing:2px}.wallet{display:flex;gap:14px;align-items:center}.currency{border:1px solid var(--line);padding:9px 17px;border-radius:30px;color:#e0d6f7}.currency strong{color:white;margin-left:10px;font-size:18px}.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}.tabs button{background:transparent;color:#95a2b8}.tabs .active{background:#e8c989;color:#262538}.hero{position:relative;min-height:460px;border:1px solid #dbbc7f44;border-radius:17px;overflow:hidden;background:radial-gradient(ellipse at 74% 38%,#66755766,transparent 65%),linear-gradient(120deg,#26352d,#172639 70%)}.hero:after{content:'✧';position:absolute;font-size:400px;color:#e4c8770b;right:60px;top:-120px;pointer-events:none}.splash{position:absolute;height:115%;width:78%;object-fit:contain;right:-8%;top:-6%;filter:drop-shadow(0 15px 30px #0006)}.hero.weapon{background:radial-gradient(ellipse at 70% 40%,#564a6e,#182135 70%)}.herotext{position:relative;z-index:1;padding:42px;pointer-events:none;max-width:52%}.tag{display:inline-block;color:var(--gold);border:1px solid #d7ba7144;border-radius:5px;padding:4px 10px;font-size:11px;letter-spacing:2px}.hero h1{font-size:43px;line-height:1.4;margin:28px 0 10px}.hero .desc{color:#b6c4c4;max-width:260px}.stars{color:#e9c374;letter-spacing:4px}.featured{display:flex;gap:12px;margin-top:25px}.mini{position:relative;width:65px;text-align:center}.mini img{width:64px;background:linear-gradient(#594974,#9c80af);border-radius:8px}.mini span{font-size:11px;display:block}.hero label{pointer-events:auto}.hero select{max-width:230px}.sectiontitle{display:flex;justify-content:space-between;align-items:center;margin:25px 0 14px}.sectiontitle h3{margin:0}.statusgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:21px}.panel strong.big{font-size:29px;color:var(--gold);font-weight:500}.progress{background:#2c3549;height:4px;margin:13px 0;border-radius:6px}.progress i{display:block;height:100%;background:var(--gold);border-radius:6px}.actions{display:flex;align-items:center;justify-content:space-between;margin-top:24px;gap:15px}.gold{background:linear-gradient(120deg,#ead4a5,#d5b374);color:#282738;border-color:#e9cf9b;font-weight:600}.draw{padding:14px 35px;font-size:16px;border-radius:30px}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:15px}.card{padding:0;overflow:hidden;text-align:center;position:relative;background:#1b2436;border:1px solid var(--line);border-radius:10px}.card img{width:100%;aspect-ratio:1;object-fit:contain;background:linear-gradient(145deg,#695747,#b59263)}.card.r4 img{background:linear-gradient(145deg,#4e405f,#9275ac)}.card.r3 img{background:linear-gradient(145deg,#364963,#6584a0)}.card b{display:block;padding:9px 4px 0}.card small{display:block;padding:0 4px 9px}.badge{position:absolute;top:6px;right:6px;background:#0b1426d9;padding:2px 8px;border-radius:5px;color:var(--gold);font-size:11px}.notice{padding:12px 16px;border-left:2px solid var(--gold);background:#e8c98909;color:#c8bda6;margin:16px 0;font-size:13px}.toolbar{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.toolbar input{flex:1;min-width:160px}table{width:100%;border-collapse:collapse}td,th{text-align:left;padding:12px;border-bottom:1px solid var(--line)}th{font-size:12px;color:var(--muted);font-weight:400}.goldtext{color:var(--gold)}.purpletext{color:#c5a5e7}.empty{text-align:center;padding:65px;color:var(--muted)}footer{font-size:11px;color:#64708b;border-top:1px solid var(--line);margin-top:35px;padding-top:20px}dialog{background:#121b2e;color:#e9edf5;border:1px solid #bda66a66;border-radius:16px;width:min(960px,94vw);max-height:90vh;padding:35px}dialog::backdrop{background:#050a16d9;backdrop-filter:blur(10px)}.close{float:right;font-size:22px;padding:0 9px}.result{animation:reveal .65s ease both}.detailpic{width:180px;float:left;margin:0 25px 20px 0}.formrow{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:12px 0}.formrow input{width:110px}.rule{max-width:900px;line-height:1.95}.rule h3{color:var(--gold)}#toast{position:fixed;bottom:35px;left:50%;transform:translateX(-50%);background:#e7d3aa;color:#222a39;padding:10px 24px;border-radius:30px;z-index:9;display:none}.weaponsplash{position:absolute;right:10%;top:12%;width:38%;height:76%;object-fit:contain} @keyframes reveal{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1000px){aside{width:175px;padding:30px 14px}main{margin-left:175px;padding:25px}.herotext{padding:28px}.hero h1{font-size:33px}.wallet{gap:5px}.currency{padding:7px 10px}}@media(max-width:700px){aside{position:static;width:auto;padding:15px;border-right:0}.brand{font-size:22px}.brand small,.edition,.asidebottom{display:none}nav{display:flex;overflow:auto;margin-top:10px}nav button{white-space:nowrap;padding:8px 12px;margin:0}main{margin:0;padding:17px}header{align-items:start}.wallet{flex-wrap:wrap;justify-content:end;max-width:170px}.currency{font-size:11px}.currency strong{font-size:14px}.hero{min-height:450px}.herotext{max-width:100%;padding:25px}.hero h1{font-size:30px}.hero .desc{max-width:180px}.splash{right:-27%;width:110%;top:10%;height:90%;opacity:.7}.statusgrid{gap:8px}.panel{padding:13px}.statusgrid small{font-size:10px}.panel strong.big{font-size:22px}.actions{align-items:stretch;flex-direction:column}.draw{padding:12px 24px}.cards{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}td,th{padding:8px 4px;font-size:12px}.tabs button{padding:7px 10px}.weaponsplash{opacity:.6;right:0;width:50%}}

.economybar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}.economybar p{margin:5px 0}.economybar .toolbar{margin:0}@media(max-width:700px){.economybar{display:block}.economybar .toolbar{margin-top:12px}.economybar button{font-size:12px;padding:9px}}
.wish-result-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.wish-result-grid.single{grid-template-columns:minmax(0,180px);justify-content:center}.wish-result-grid .result{min-width:0}.wish-result-grid .card{width:100%;height:100%}
@media(max-width:700px),(max-height:500px){
 dialog.wish-results{width:calc(100vw - 16px);max-width:700px;max-height:calc(100dvh - 16px);padding:14px;border-radius:12px;overflow:auto}
 .wish-results .close{position:absolute;right:8px;top:8px;float:none;font-size:20px;padding:0 8px}
 .wish-results #modalbody>small{display:block;font-size:9px;line-height:1.3;padding-right:25px}
 .wish-results h2{font-size:20px;line-height:1.4;margin:6px 24px 8px 0}
 .wish-results .wish-result-grid{gap:6px;margin:10px 0!important;grid-template-columns:repeat(5,minmax(0,1fr))}
 .wish-results .wish-result-grid.single{grid-template-columns:minmax(0,110px)}
 .wish-results .card{border-radius:6px;min-width:0}
 .wish-results .card img{display:block;width:100%;height:clamp(30px,15dvh,95px);aspect-ratio:auto;object-fit:contain}
 .wish-results .card b{font-size:10px;line-height:1.3;padding:5px 2px 0;min-height:31px;overflow-wrap:anywhere}
 .wish-results .card small{font-size:9px;line-height:1.2;letter-spacing:0;padding:2px 0 5px}
 .wish-results .badge{top:3px;right:2px;max-width:calc(100% - 4px);padding:1px 3px;font-size:8px;line-height:1.25;overflow-wrap:anywhere}
 .wish-results #modalbody>.gold{display:block;width:100%;padding:10px 12px;font-size:13px;min-height:40px}
}
@media(max-width:700px),(max-height:500px){
 .wish-results .wish-result-grid{grid-template-columns:repeat(var(--wish-cols,2),minmax(0,1fr))}
 .wish-results .card img{height:var(--wish-image-height,60px)}
 .wish-results .wish-result-grid.single{grid-template-columns:minmax(0,110px)}
}
/* Clearer surfaces and a compact desktop wish stage. */
:root{--line:#a7b5d421}.panel{border-color:#9cacc52b;box-shadow:inset 0 1px 0 #ffffff04}.hero{border-color:#d8bd795c;box-shadow:0 10px 35px #0000001c,inset 0 0 0 1px #ffffff05}.tabs button{border-color:#a6b4cf29}.tabs button.active{border-color:#f4dc9e}.actions{border-top:1px solid #d8bd7933;padding-top:12px}.draw{border-color:#b8c5dc38}.draw.gold{box-shadow:0 3px 16px #e8c98912}.card{border-color:#b5c1d533}button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media(min-width:701px){
 main{padding:14px 30px}header{margin-bottom:10px}header h2{font-size:23px;margin:0}header small{font-size:10px}header .currency{padding:6px 14px}
 #app.wish-view{display:flex;flex-direction:column}
 .wish-view>.economybar{order:0;padding:10px 14px;margin-bottom:8px;gap:10px}
 .wish-view .economybar>div:first-child{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:center}
 .wish-view .economybar>div:first-child>small:first-child{display:none}
 .wish-view .economybar p{margin:0;font-size:12px}.wish-view .economybar>div:first-child>small:last-child{flex-basis:100%;font-size:11px}
 .wish-view .economybar .toolbar{gap:6px;flex-shrink:0}.wish-view .economybar button{font-size:12px;padding:8px 10px}
 .wish-view>.notice{order:1;margin:0 0 8px;padding:7px 12px;font-size:11px}
 .wish-view>.tabs{order:2;margin-bottom:10px;gap:8px}.wish-view>.tabs button{padding:7px 13px;font-size:12px}
 .wish-view>.hero{order:3;min-height:0;height:clamp(230px,calc(100dvh - 400px),440px);flex-shrink:0}
 .wish-view .herotext{height:100%;padding:12px 25px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px}
 .wish-view .hero .tag{font-size:10px;padding:2px 8px}.wish-view .hero h1{font-size:30px;line-height:1.3;margin:3px 0}.wish-view .hero h3{font-size:18px;line-height:1.4;margin:2px 0}.wish-view .hero .stars{line-height:1.3;font-size:12px}.wish-view .hero .desc{display:none}
 .wish-view .featured{margin-top:5px;gap:10px}.wish-view .mini{width:43px}.wish-view .mini img{width:42px;display:block}.wish-view .mini span{font-size:10px;line-height:1.5}
 .wish-view>.actions{order:4;margin-top:10px;padding-top:10px;gap:10px}.wish-view .actions>button{font-size:12px;padding:8px 12px}.wish-view .draw{padding:11px 27px;font-size:15px}
 .wish-view>.chronicled-path{order:5;margin-top:12px!important}.wish-view>.statusgrid{order:6;margin-top:12px;gap:12px}.wish-view>.statusgrid .panel{padding:12px 16px}.wish-view .statusgrid .progress{margin:7px 0}.wish-view .statusgrid strong.big{font-size:25px}
 .wish-view>.sectiontitle{order:7;margin:18px 0 10px}.wish-view>.recent-wishes{order:8}
}

.profile-setup{width:min(1000px,96vw)}.setup-columns{display:grid;grid-template-columns:1.25fr 1fr;gap:25px}.profile-roster{max-height:420px;overflow:auto;margin-top:12px}.profile-character{display:flex;align-items:center;gap:10px;padding:5px;border-bottom:1px solid var(--line)}.profile-character img{width:40px;height:40px;object-fit:contain}.profile-character span{flex:1}.profile-character select{padding:5px;font-size:12px}.upload-label{display:block;padding:12px;border:1px dashed #e8c98966;border-radius:8px}.upload-label input{display:block;width:100%;margin-top:7px}.ocr-review{max-height:160px;overflow:auto;font-size:12px}.setup-columns>section{min-width:0}#profile-search{width:100%}@media(max-width:700px){.setup-columns{grid-template-columns:1fr}.profile-roster{max-height:250px}.profile-setup{padding:20px}}@media(min-width:701px){.wish-view .economybar .toolbar{flex-wrap:wrap;max-width:480px}.wish-view>.hero{height:clamp(210px,calc(100dvh - 430px),410px)}}
.storage-management{margin:18px 0}.storage-management .sectiontitle{margin:0 0 12px;flex-wrap:wrap;gap:10px}.storage-policy{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.storage-policy .formrow{gap:14px;margin:0}.storage-policy input[type=number]{width:88px}.storage-alert[hidden]{display:none}.storage-alert .toolbar{margin:10px 0 0}button.danger{color:#f6aaa5;border-color:#c65a554d}button.danger:hover{background:#c65a5522}.saving #app,.saving dialog{pointer-events:none;opacity:.75}.saving{cursor:progress}#toast{max-width:calc(100vw - 32px);white-space:normal}td input[type=checkbox],th input[type=checkbox]{min-width:18px;min-height:18px}
@media(max-width:700px){.storage-policy{align-items:stretch;flex-direction:column}.storage-policy .formrow{justify-content:space-between}.storage-management{padding:16px}.storage-management .tag{font-size:10px}}
