/* Aligned selection columns with translucent surfaces and a shared action baseline. */
body:has(.selection-scene){overflow:hidden}
#app .selection-scene{--selection-frame:url('../assets/ui/components/selection-frame.png');--selection-line:#c3b8d038;--selection-ink:#e5deeb;--selection-muted:#bfb3ca;height:100dvh;min-height:0;padding:0 clamp(18px,2.6vw,56px) 24px;display:flex;flex-direction:column;overflow:hidden;color:var(--selection-ink);background:linear-gradient(0deg,#090b1270,transparent 45%),linear-gradient(90deg,#090b12bc,#090b12b8 58%,#090b127d),url('../assets/battle/sanctuary-background.png') center/cover}
.selection-scene .front-header{height:clamp(60px,9dvh,90px);flex:none}
.selection-layout{width:100%;max-width:2200px;flex:1;min-height:0;display:grid;grid-template-columns:clamp(185px,16vw,280px) minmax(0,1.42fr) minmax(300px,1fr);gap:clamp(20px,2vw,40px);margin:24px auto 0}
.selection-layout>*{min-width:0;min-height:0;padding:0;align-self:stretch}
/* Shared border artwork remains available to the card detail room. */
.selection-frame{position:relative;isolation:isolate;background:linear-gradient(115deg,#0c1014d9,#17191dc4);border:0;box-shadow:none}
.selection-frame:before{content:'';position:absolute;inset:0;border:42px solid transparent;border-image:var(--selection-frame) 27% / 42px / 0 stretch;mix-blend-mode:screen;pointer-events:none;z-index:2;opacity:.85}
.selection-label{font-size:19px;font-weight:400;letter-spacing:3px;line-height:1.4;margin:0;height:56px;color:#eee5f4;flex:none}
.selection-label small{display:block;font-size:10px;color:#c0b3ca;letter-spacing:1px;margin-top:6px}
.selection-roster{display:flex;flex-direction:column;border-right:1px solid var(--selection-line);padding-right:20px;background:linear-gradient(90deg,#0b0d141f,transparent)}
.selection-heroes{display:flex;flex-direction:column;gap:12px}
#app .selection-scene .roster-card{position:relative;display:flex;align-items:center;width:100%;height:clamp(72px,10dvh,106px);min-height:0;padding:12px;gap:12px;margin:0;border:1px solid #c8b6d63d!important;border-image:none!important;background:#100f194d!important;box-shadow:none!important;clip-path:none;color:#e5dbea;text-align:left;font-size:16px}
#app .selection-scene .roster-card.selected{border-color:#d1b4e4b5!important;background:linear-gradient(110deg,#7864873d,#15101e4d)!important;box-shadow:inset 2px 0 #c5a8db,0 0 14px #c7a0e026!important}
#app .selection-scene .roster-card.locked{opacity:.48}
.selection-roster .roster-avatar{width:47px;height:62px;border:1px solid #c1b1ce59;flex:none}
.selection-roster .roster-card em{font-size:11px;color:#c3b6cc;margin-top:8px}
.selection-roster .roster-silhouette{width:42px;text-align:center;font-size:29px;flex:none}
.selection-roster .roster-note{padding:0;margin:14px 0 0;font-size:10px;color:#b8a9c3;line-height:1.7}
.selection-traits{margin-top:24px;padding-top:20px;border-top:1px solid var(--selection-line);font-size:12px}
.selection-traits>span{display:flex;align-items:center;justify-content:space-between;color:#d3c5dc}.selection-traits b{font:28px Georgia;color:#f0e2f6}
.selection-traits h3{font-size:15px;font-weight:400;letter-spacing:2px;margin:20px 0 8px}.selection-traits p{font-size:12px;line-height:1.9;color:#c1b4cc;margin:0}
.selection-roster-quote{margin:auto 0 0;padding-top:24px;color:#b7a7c5;font-size:12px;line-height:2;letter-spacing:1px}
.selection-deck{display:flex;flex-direction:column;gap:0}
.selection-builds{display:grid;grid-template-rows:repeat(2,minmax(0,1fr));gap:12px;flex:1.2;min-height:270px;max-height:none}
#app .selection-scene .selection-builds .discipline{position:relative;display:grid;grid-template-columns:29% minmax(0,1fr) 22px;gap:16px;align-items:center;width:100%;min-width:0;min-height:0!important;height:100%;padding:10px!important;margin:0;border:1px solid #c3b5d24d!important;border-image:none!important;background:linear-gradient(105deg,#16111f7d,#100e1857)!important;box-shadow:none!important;color:#c8bbd2;text-align:left;transition:border-color .16s,background .16s}
#app .selection-scene .selection-builds .discipline.selected{border-color:#d3b6e7c4!important;background:linear-gradient(100deg,#5a456359,#17112080)!important;box-shadow:inset 2px 0 #c8acdd,0 0 12px #d1a4f128!important;color:#f4e8fa}
#app .selection-scene .discipline:before,#app .selection-scene .journey-difficulty button:before{display:none}
.selection-build-art{width:100%;height:100%;min-height:0;object-fit:cover;object-position:center 25%;border:1px solid #bba4cc45}
.selection-build-copy{min-width:0;display:flex;flex-direction:column;gap:12px}
.selection-build-heading{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
#app .selection-scene .selection-build-heading>b{font-size:clamp(19px,1.5vw,27px);line-height:1.3;font-weight:400;letter-spacing:2px}
.selection-build-heading em{font-style:normal;font-size:9px;white-space:nowrap;color:#bca9cc;border:1px solid #b7a2c44d;padding:3px 7px;background:#18111d44;border-radius:3px}
.discipline.selected .selection-build-heading em{color:#f0dafa;background:#9273ac45;border-color:#d6b3eb70}
.selection-tags{display:flex;gap:5px;flex-wrap:wrap}.selection-tags>span{border:1px solid #c3afd538;border-radius:14px;background:#82708e20;padding:3px 7px;font-size:10px;white-space:nowrap;color:#cbbcd8}
.selection-build-description{font-size:11px;line-height:1.8;color:#bdaeC6}
.selection-build-counts{display:flex;flex-wrap:wrap;align-items:center;gap:5px 12px;font-size:10px;color:#c9bad3}.selection-build-counts b{font-weight:400;color:#eee4f4;margin-left:3px}.selection-build-counts>small{font-size:10px;margin-left:auto;color:#c7b0d6}
.selection-build-arrow{border:1px solid #c8b3db59;background:#9b85b31a;color:#d9c3ec;font:24px/32px Georgia;text-align:center}
.selection-overview{min-height:0;flex:1;display:flex;flex-direction:column;margin-top:18px;padding-top:16px;border-top:1px solid var(--selection-line);background:linear-gradient(180deg,#0b0d151a,transparent)}
.selection-overview>header{display:flex;align-items:center;gap:18px;margin-bottom:12px;flex:none}
.selection-overview header>div:first-child{flex:1;min-width:0}.selection-overview h3{font-size:15px;font-weight:400;letter-spacing:1px;margin:0 0 8px}.selection-overview header p{font-size:11px;color:#ccbcd9;margin:0}.selection-overview header p small{font-size:10px;color:#b6a6c2;margin-left:8px}
.selection-total{font-size:10px;color:#c7b4d5;text-align:center;white-space:nowrap}.selection-total b{font:26px Georgia;color:#ebddf4}.selection-total small{display:block;font-size:9px;margin-top:3px}
.selection-curve .mana-curve{height:55px;gap:6px}.selection-curve .mana-curve>div{gap:3px}.selection-curve .mana-curve b,.selection-curve .mana-curve small{color:#c5b1d7;font-size:9px}.selection-curve .mana-curve i{background:linear-gradient(#ddc5ec,#84649c);border-color:#dbc3ee;box-shadow:none}
.selection-featured{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;flex:1;min-height:85px;max-height:none}
#app .selection-scene .selection-card{position:relative;display:block;min-height:0;min-width:0;height:100%;padding:0;border:1px solid #c1b1cd57!important;border-image:none!important;background:#0a0c1459!important;box-shadow:none!important;overflow:hidden;color:#eee3f7;transition:filter .15s}
#app .selection-scene .selection-card:hover{filter:brightness(1.15)}.selection-card img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 28%}
.selection-card-cost{position:absolute;top:8px;left:8px;display:grid;place-items:center;width:25px;height:27px;border:1px solid #d3bddf;background:#18111edb;border-radius:50%;font:19px Georgia}
.selection-card-name{position:absolute;left:0;right:0;bottom:0;padding:24px 4px 10px;background:linear-gradient(transparent,#0a0b13eb 50%);font-size:13px;text-align:center;letter-spacing:1px}.selection-card-name small{display:block;font-size:10px;letter-spacing:0;color:#c8b7d6;margin-top:4px}
.selection-detail-action{height:82px;display:flex;align-items:end;justify-content:center;flex:none}
#app .selection-scene .selection-details{min-height:62px;width:min(85%,350px);margin:0;padding:14px 24px;font-size:17px;letter-spacing:2px}
.selection-character{display:flex;flex-direction:column;border-left:1px solid var(--selection-line);padding-left:24px;background:linear-gradient(90deg,#0c0c1410,transparent)}
.selection-portrait{position:relative;flex:1;min-height:100px;overflow:hidden;margin-top:0;mask-image:linear-gradient(#000 75%,transparent)}
.selection-portrait>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:74% center;mask-image:linear-gradient(90deg,transparent,#000 9%,#000 93%,transparent);filter:drop-shadow(0 5px 15px #0c081950)}
.selection-portrait>p{position:absolute;top:10%;left:3%;font-size:12px;line-height:1.9;letter-spacing:1px;color:#eddef5;text-shadow:0 2px 5px #08060f,0 0 15px #08060f;margin:0}
.selection-biography{position:relative;flex:none;padding:0 0 16px;background:linear-gradient(90deg,#0c0c1459,transparent)}
.selection-biography>span{font-size:11px;letter-spacing:3px;color:#c7b8d5}.selection-biography h2{font-size:clamp(30px,2.6vw,44px);font-weight:400;letter-spacing:6px;color:#f1e8f5;margin:8px 0 12px}.selection-biography p{font-size:12px;line-height:1.9;color:#c9bdd4;margin:0}
.selection-introduction{border-top:1px solid var(--selection-line);padding:16px 0;flex:none}.selection-introduction h3{font-size:15px;font-weight:400;letter-spacing:2px;margin:0 0 9px}.selection-introduction p{font-size:12px;line-height:1.8;color:#c6b7d2;margin:0}
.selection-launch{flex:none;padding:14px 0 0;border-top:1px solid var(--selection-line);background:linear-gradient(110deg,#100e192e,transparent)}
.selection-options{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;align-items:end}
.selection-options .selection-label{height:auto;font-size:11px;letter-spacing:1px;margin:0;line-height:1.5}
#app .selection-scene .journey-difficulty{display:flex;flex-direction:row;gap:6px;margin-top:7px}
#app .selection-scene .journey-difficulty button{flex:1;min-width:0;min-height:36px!important;padding:8px 18px 8px 8px!important;border:1px solid #b8a9c549!important;border-image:none!important;background:#211b2d52!important;box-shadow:none!important;text-align:left;color:#ccbcd8}
#app .selection-scene .journey-difficulty button.selected{border-color:#d9bce89e!important;background:#86729438!important;color:#f1e4fb}
#app .selection-scene .journey-difficulty button b{font-size:12px;font-weight:400}
.selection-seed{font-size:11px;color:#c4b3d0;line-height:1.5}
#app .selection-scene .selection-seed input{display:block;width:100%;max-width:100%;box-sizing:border-box;margin-top:7px;padding:8px!important;height:36px;background:#120e1c66!important;border:1px solid #b4a0c552!important;border-radius:0!important;color:#eee2f5;font:12px Georgia,'Microsoft YaHei',serif}
.selection-difficulty{grid-column:1/-1;font-size:10px;line-height:1.7;color:#c0b0cf;margin:0}
.selection-depart{height:82px;display:flex;flex-direction:column;justify-content:end;text-align:center}
.selection-depart p{font-size:10px;color:#bfaacc;margin:0 0 1px;line-height:1.6}
#app .selection-scene .selection-depart>.button{width:100%;min-height:62px;padding:14px 24px;font-size:21px;letter-spacing:4px}




@media(min-width:961px) and (max-height:820px){
 #app .selection-scene{padding-bottom:16px}.selection-scene .front-header{height:62px}.selection-layout{margin-top:16px;gap:22px}.selection-label{height:46px;font-size:17px}.selection-label small{font-size:9px;margin-top:3px}.selection-builds{min-height:232px;max-height:300px;gap:10px}.selection-build-copy{gap:8px}.selection-build-description{font-size:10px;line-height:1.6}.selection-tags>span{font-size:9px;padding:2px 6px}.selection-overview{margin-top:12px;padding-top:12px}.selection-overview h3{font-size:13px}.selection-overview>header{gap:10px;margin-bottom:8px}.selection-featured{min-height:74px}.selection-biography{padding-bottom:10px}.selection-biography h2{font-size:32px;margin:6px 0 8px}.selection-biography p{font-size:11px}.selection-introduction{padding:12px 0}.selection-introduction p{font-size:11px}.selection-launch{padding-top:12px}.selection-options{gap:8px 10px}.selection-detail-action,.selection-depart{height:72px}#app .selection-scene .selection-details,#app .selection-scene .selection-depart>.button{min-height:54px;font-size:18px}.selection-traits{margin-top:18px;padding-top:15px}.selection-traits h3{font-size:13px;margin:14px 0 7px}.selection-traits p{font-size:11px}.selection-roster-quote{font-size:11px;padding-top:16px}
}
@media(min-width:961px) and (max-width:1200px){
 .selection-layout{grid-template-columns:160px minmax(0,1fr) 285px;gap:18px}.selection-roster{padding-right:12px}.selection-character{padding-left:16px}#app .selection-scene .roster-card{padding:9px;gap:8px;font-size:13px}.selection-roster .roster-avatar{width:32px;height:45px}.selection-roster .roster-card em{font-size:9px}.selection-roster .roster-silhouette{width:28px}#app .selection-scene .selection-builds .discipline{grid-template-columns:25% minmax(0,1fr);gap:10px}.selection-build-arrow{display:none}.selection-build-heading em{font-size:8px;padding:2px 5px}.selection-build-heading{gap:4px}.selection-tags{gap:3px}.selection-tags>span{font-size:8px;padding:2px 4px}.selection-build-counts{font-size:9px;gap:4px 8px}.selection-build-counts>small{font-size:9px}.selection-overview header p small{display:none}.selection-curve .mana-curve{gap:3px}.selection-curve .mana-curve>div{width:12px}.selection-overview h3{font-size:12px}.selection-featured{gap:8px}.selection-card-name{font-size:11px}.selection-options{gap:8px}.selection-biography p{font-size:11px}
}
@media(min-width:961px) and (max-height:660px){
 .selection-layout{margin-top:12px}.selection-builds{min-height:220px;max-height:236px}.selection-build-description{display:none}.selection-overview{margin-top:10px;padding-top:8px}.selection-overview>header{margin-bottom:7px}.selection-overview h3{margin-bottom:4px}.selection-curve .mana-curve{height:43px}.selection-traits{margin-top:12px;padding-top:10px}.selection-traits h3{margin:10px 0 5px}.selection-roster-quote{display:none}.selection-introduction{display:none}.selection-biography h2{font-size:29px}.selection-biography{padding-bottom:10px}.selection-portrait{min-height:70px}.selection-card-name{font-size:11px;padding-bottom:7px}.selection-card-name small{font-size:9px}
}
@media(max-width:960px){
 #app .selection-scene{padding:0 18px 14px}.selection-scene .front-header{height:62px}.selection-layout{grid-template-columns:155px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:14px 18px;margin-top:16px}.selection-roster{grid-row:1/3;padding-right:14px}.selection-deck{grid-column:2;grid-row:1}.selection-character{grid-column:2;grid-row:2;padding:0;border-left:0;border-top:1px solid var(--selection-line)}.selection-portrait,.selection-biography,.selection-introduction{display:none}.selection-launch{border:0;padding-top:12px}.selection-options{grid-template-columns:1fr 1fr}.selection-depart{height:65px;flex-direction:row;align-items:center;gap:15px}.selection-depart p{flex:1;text-align:left;line-height:1.7}#app .selection-scene .selection-depart>.button{width:60%;min-height:54px;font-size:18px}.selection-label{font-size:17px;height:49px}.selection-builds{min-height:220px;max-height:320px}.selection-build-description{font-size:10px}.selection-build-copy{gap:8px}.selection-build-arrow{display:none}#app .selection-scene .selection-builds .discipline{grid-template-columns:26% minmax(0,1fr);gap:12px}.selection-overview{margin-top:12px;padding-top:10px}.selection-detail-action{height:56px}#app .selection-scene .selection-details{min-height:44px;font-size:15px}.selection-traits h3{font-size:13px}.selection-traits p{font-size:11px}.selection-roster .roster-avatar{width:30px;height:44px}.selection-roster .roster-silhouette{width:25px}#app .selection-scene .roster-card{padding:8px;gap:6px;font-size:12px}.selection-roster .roster-card em{font-size:9px}.selection-roster-quote{font-size:10px}
}
@media(max-width:600px){
 #app .selection-scene{padding:0 12px max(10px,env(safe-area-inset-bottom))}.selection-scene .front-header{height:52px;gap:7px}.selection-scene .front-header h1{font-size:17px;letter-spacing:2px}.selection-scene .front-ornament{font-size:23px}.selection-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:60px minmax(0,1fr) auto;gap:10px;margin-top:10px}.selection-roster{grid-column:1;grid-row:1;border:0;padding:0}.selection-roster>.selection-label,.selection-roster .roster-note,.selection-traits,.selection-roster-quote{display:none}.selection-heroes{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:6px;height:100%}#app .selection-scene .roster-card{grid-column:auto;grid-row:auto;height:100%;min-height:0;padding:6px;gap:6px;font-size:11px}.selection-roster .roster-avatar{width:26px;height:38px}.selection-roster .roster-card em{font-size:8px;margin-top:4px}.selection-roster .roster-silhouette{display:none}.selection-deck{grid-column:1;grid-row:2}.selection-deck>.selection-label{font-size:15px;height:34px;display:flex;align-items:center;justify-content:space-between;letter-spacing:1px}.selection-deck>.selection-label small{font-size:8px;letter-spacing:0;margin:0}.selection-builds{min-height:180px;max-height:228px;gap:8px;flex:1}#app .selection-scene .selection-builds .discipline{padding:7px!important;grid-template-columns:23% minmax(0,1fr);gap:10px}.selection-build-copy{gap:6px}.selection-build-heading{gap:7px}#app .selection-scene .selection-build-heading>b{font-size:18px;letter-spacing:1px}.selection-build-heading em{font-size:8px;padding:2px 6px}.selection-tags{gap:4px}.selection-tags>span{font-size:8px;padding:2px 5px}.selection-build-description{display:none}.selection-build-counts{font-size:9px;gap:3px 10px}.selection-build-counts>small{font-size:9px}.selection-overview{margin-top:10px;padding-top:8px;flex:.7}.selection-overview h3{font-size:12px;margin-bottom:4px}.selection-overview header p{font-size:9px}.selection-overview header p small{display:none}.selection-overview>header{gap:10px;margin-bottom:7px}.selection-total b{font-size:20px}.selection-total small{font-size:8px}.selection-curve .mana-curve{height:40px;gap:2px}.selection-curve .mana-curve>div{width:10px;gap:2px}.selection-curve .mana-curve i{width:8px}.selection-curve .mana-curve b,.selection-curve .mana-curve small{font-size:8px}.selection-featured{gap:8px;min-height:65px;max-height:none}.selection-card-cost{width:19px;height:21px;font-size:15px;left:5px;top:5px}.selection-card-name{font-size:10px;padding:16px 2px 6px;letter-spacing:0}.selection-card-name small{display:none}.selection-detail-action{height:45px}#app .selection-scene .selection-details{min-height:39px;font-size:13px;width:230px;padding:8px 18px}.selection-character{grid-column:1;grid-row:3}.selection-launch{padding-top:8px}.selection-options{gap:7px 12px}.selection-options .selection-label,.selection-seed{font-size:10px}#app .selection-scene .journey-difficulty{margin-top:4px}#app .selection-scene .selection-seed input{margin-top:4px;height:33px;font-size:11px}#app .selection-scene .journey-difficulty button{min-height:33px!important;padding-top:7px!important;padding-bottom:7px!important}.selection-difficulty{font-size:9px;line-height:1.55}.selection-depart{height:57px;gap:8px}.selection-depart p{font-size:9px}#app .selection-scene .selection-depart>.button{width:64%;min-height:48px;font-size:17px;padding:10px 18px}
}
@media(max-width:600px) and (max-height:740px){
 .selection-layout{grid-template-rows:48px minmax(0,1fr) auto;gap:7px;margin-top:6px}.selection-builds{min-height:148px;max-height:168px}.selection-build-heading em{display:none}.selection-tags{display:none}.selection-build-copy{gap:6px}.selection-overview{margin-top:6px;padding-top:5px}.selection-overview>header{margin-bottom:5px}.selection-curve{display:none}.selection-featured{min-height:46px}.selection-card-cost{width:16px;height:17px;font-size:13px}.selection-card-name{font-size:9px;padding-bottom:4px}.selection-detail-action{height:38px}#app .selection-scene .selection-details{min-height:34px;font-size:12px}.selection-launch{padding-top:6px}.selection-depart{height:50px}.selection-difficulty{font-size:8px}.selection-deck>.selection-label{height:29px}
}
@media(prefers-reduced-motion:reduce){#app .selection-scene .selection-card,#app .selection-scene .discipline{transition:none}}
@media(min-width:601px) and (max-height:599px){
 #app .selection-scene{padding-bottom:10px}.selection-scene .front-header{height:46px}.selection-layout{grid-template-columns:120px minmax(0,1fr) 240px;grid-template-rows:minmax(0,1fr);gap:14px;margin-top:10px}.selection-roster{grid-column:1;grid-row:1;padding-right:10px}.selection-roster .selection-label{font-size:14px;height:43px}.selection-traits,.selection-roster-quote{display:none}#app .selection-scene .roster-card{height:57px;padding:7px;gap:5px;font-size:10px}.selection-roster .roster-avatar{width:25px;height:35px}.selection-roster .roster-card em{font-size:8px}.selection-roster .roster-silhouette{width:20px;font-size:22px}.selection-heroes{gap:8px}.selection-roster .roster-note{font-size:8px}.selection-deck{grid-column:2;grid-row:1}.selection-deck>.selection-label{height:43px;font-size:16px}.selection-builds{min-height:0;max-height:none;flex:1;gap:8px}#app .selection-scene .selection-builds .discipline{grid-template-columns:24% minmax(0,1fr);padding:7px!important;gap:8px}.selection-build-heading em,.selection-build-description,.selection-build-arrow{display:none}#app .selection-scene .selection-build-heading>b{font-size:18px}.selection-build-copy{gap:7px}.selection-tags>span{font-size:8px;padding:2px 4px}.selection-build-counts{font-size:9px;gap:3px 8px}.selection-build-counts>small{font-size:9px}.selection-overview{display:none}.selection-detail-action{height:49px}#app .selection-scene .selection-details{min-height:43px;font-size:14px;width:90%}.selection-character{grid-column:3;grid-row:1;border:0;border-left:1px solid var(--selection-line);padding-left:14px;justify-content:end}.selection-portrait,.selection-introduction{display:none}.selection-biography{display:block;margin-bottom:auto;padding:8px 0}.selection-biography h2{font-size:28px;margin:5px 0}.selection-biography p{font-size:10px}.selection-launch{padding-top:8px}.selection-options{grid-template-columns:1fr;gap:7px}.selection-options .selection-label,.selection-seed{font-size:10px}.selection-difficulty{font-size:9px;line-height:1.6}.selection-depart{height:49px;display:block}.selection-depart p{display:none}#app .selection-scene .selection-depart>.button{width:100%;min-height:43px;font-size:17px;padding:8px 14px}
}
@media(min-width:961px) and (max-height:760px){.selection-build-description{display:none}}

/* Character selection uses independent columns instead of negative offsets. */
#app .front-character{display:grid;grid-template-columns:200px minmax(230px,1fr) minmax(330px,390px);grid-template-rows:93px 1fr auto;gap:28px;min-height:100dvh;padding-bottom:24px}

#app .front-character .front-header{grid-column:1/-1;grid-row:1}

#app .character-roster{grid-column:1;grid-row:2;position:relative;width:auto;margin:28px 0 0;display:flex;flex-direction:column;align-items:stretch;gap:13px}

#app .character-roster .roster-card{width:100%;height:90px;font-size:15px}

#app .character-hero{grid-column:2;grid-row:2;position:relative;inset:auto;align-self:stretch;width:145%;max-width:none;height:100%;min-height:620px;margin-left:-28%;object-fit:cover;object-position:64% top;z-index:-1;opacity:1;mask-image:linear-gradient(#000 75%,transparent)}

#app .character-details{grid-column:3;grid-row:2;position:relative;inset:auto;width:auto;margin:15px 0 20px;padding:15px 0 0;background:none;border:0;box-shadow:none}

#app .front-character .front-foot{grid-column:1/-1;grid-row:3;position:relative;inset:auto;margin:0}

#app .character-details h2{font-size:37px;margin-bottom:20px}
.character-facts{background:linear-gradient(90deg,transparent,#21172960);padding:13px 0}

@media(max-width:1200px){.mana-curve{height:50px}
#app .front-character{grid-template-columns:170px minmax(150px,1fr) 330px;gap:20px}
}

@media(max-width:960px){#app .front-character{grid-template-columns:170px minmax(0,1fr);grid-template-rows:80px 350px auto auto;gap:20px}
#app .front-character .front-header{height:80px}
#app .character-hero{min-height:0;width:110%;height:400px;margin-left:-10%;object-position:65% 10%}
#app .character-details{grid-row:3;grid-column:1/-1;margin:0 auto;width:100%;max-width:650px;padding:10px 0}
#app .front-character .front-foot{grid-row:4}
#app .character-details .discipline-options{flex-direction:row}
.character-quote{font-size:12px}
}

@media(max-width:600px){#app .front-character{padding:0 25px 25px;grid-template-columns:125px minmax(0,1fr);grid-template-rows:75px 280px auto auto;gap:16px}
#app .front-character .front-header{height:75px}
#app .character-roster{margin-top:12px;gap:10px}
#app .character-roster .roster-card{height:64px;font-size:11px;padding:8px;gap:7px}
#app .character-roster .roster-avatar{width:31px;height:42px}
#app .character-roster .roster-note{font-size:9px;width:100%}
#app .character-hero{height:320px;width:165%;margin-left:-45%;object-position:64% top}
#app .character-details{margin:0;padding:12px 0}
#app .character-details h2{font-size:30px}
#app .character-details .discipline-options{flex-direction:column}
#app .character-details .discipline-heading{gap:9px}
#app .character-details .discipline-heading small{font-size:8px}
#app .character-details .character-facts b{font-size:10px}
#app .front-character .front-foot{font-size:9px;letter-spacing:0}
}

@media(min-width:961px){#app .character-hero{height:min(780px,calc(100dvh - 160px));min-height:620px}
#app .character-details{margin-top:0;padding-top:10px}
.character-quote{margin-bottom:15px}
.character-bio{margin-bottom:15px}
.character-details .discipline-heading{margin:15px 0 6px}
.character-details .discipline-note{margin:10px 0;line-height:1.9}
.character-selected{margin:14px 0!important}
}

/* Full card detail room: viewport-sized panels and paged cards. */
body:has(.preparation-room){overflow:hidden}
#app .preparation-room{--selection-frame:url('../assets/ui/components/selection-frame.png');height:100dvh;min-height:0;padding:0 clamp(16px,2vw,40px) 22px;display:flex;flex-direction:column;overflow:hidden;color:#ded9e4;background:linear-gradient(90deg,#0c0d13d9,#0c0d13b8 62%,#0c0d134a),url('../assets/backgrounds/luneth-astral-sanctuary.png') center/cover}
.preparation-room .front-header{height:clamp(58px,8dvh,86px);min-height:0;flex:none}
.preparation-layout{width:100%;max-width:2100px;flex:1;min-height:0;margin:22px auto 0;display:grid;grid-template-columns:clamp(180px,17vw,270px) minmax(0,1fr) clamp(245px,23vw,370px);gap:clamp(16px,1.5vw,30px)}
.preparation-layout>*{min-width:0;min-height:0}
.preparation-room .selection-frame{background:linear-gradient(115deg,#0c1014dc,#17191dbd)}
.preparation-room .selection-frame:before{opacity:.65;border-image-width:30px}
.preset-sidebar{padding:24px 18px;display:flex;flex-direction:column;gap:16px}
#app .preparation-room .preview-identity{display:flex;align-items:center;gap:12px;padding:0;min-height:0;background:none;border:0;color:#ede7f1;text-align:left;font-size:18px;letter-spacing:2px}
.preview-identity .roster-avatar{width:42px;height:52px;flex:none}
.preview-identity small{display:block;color:#b5adbf;font-size:10px;letter-spacing:0;margin-top:7px}
.preset-sidebar h2,.preset-sidebar h3{font-size:14px;font-weight:400;letter-spacing:2px;margin:0}
.preset-list{display:flex;flex-direction:column;gap:12px}
#app .preparation-room .preset-build{position:relative;display:flex;align-items:center;gap:12px;width:100%;min-height:80px;padding:10px;border:1px solid #bcb0ca3d!important;border-image:none!important;background:#111117a8!important;box-shadow:none!important;color:#d4ccd9;text-align:left}
#app .preparation-room .preset-build.selected{border-color:#cbb3e3a1!important;background:linear-gradient(105deg,#54436265,#17151eaa)!important;box-shadow:inset 2px 0 #c4a6e0,0 0 12px #ab7bc11a!important}
.preset-build-art{width:47px;height:60px;object-fit:cover;flex:none;border:1px solid #aa99b849}
.preset-number{display:none}.preset-build b{font-size:14px;font-weight:400;letter-spacing:1px}.preset-build small{display:block;font-size:10px;margin-top:8px;color:#b8a9c3}

.preset-note{font-size:12px;line-height:2;color:#a9a0b4;margin:0;padding:8px 2px}
.preset-sidebar .journey-options{border-top:1px solid #b8adbf35;padding-top:18px;margin-top:auto}
.preset-sidebar .journey-options h3{margin-bottom:12px}
.preparation-room .journey-difficulty{display:flex;gap:5px}
#app .preparation-room .journey-difficulty button[data-selection-control]{width:50%;min-height:42px;padding:10px!important;font-size:11px}
.preparation-room .journey-difficulty button b{font-size:11px}
.preparation-room .difficulty-explanation{font-size:10px;line-height:1.8;color:#b2a8bc;margin:10px 0}
.preparation-room .journey-seed{display:block;font-size:11px;color:#bdb3c7}
.preparation-room .journey-seed input{display:block;width:100%;box-sizing:border-box;margin-top:7px;padding:9px!important;font-size:11px}
.preset-sidebar .journey-options>small{display:block;font-size:10px;color:#a99ab6;margin-top:12px}
#app .preset-sidebar>.text-button{font-size:11px;min-height:30px;padding:5px}
.preset-workspace{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;padding:24px 22px 18px}
.preset-heading{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:18px;padding-bottom:20px;border-bottom:1px solid #b2a8c13d}
.preset-heading h2{font-size:clamp(24px,2.1vw,38px);font-weight:400;letter-spacing:3px;line-height:1.25;margin:0 0 12px;color:#eee8f2}
.deck-index{font:1.1em Georgia;color:#d4b8e5;margin-right:15px}
.preset-heading p{font-size:12px;color:#bab0c6;line-height:1.8;margin:0}
.mana-curve{display:flex;gap:8px;align-items:end;height:64px;flex-shrink:0}.mana-curve>div{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;width:15px}.mana-curve b,.mana-curve small{font-weight:400;font-size:10px;color:#b69cc9}.mana-curve i{display:block;width:12px;background:linear-gradient(#cca6e5,#6b468c);border-top:1px solid #f2d9ff;box-shadow:0 0 8px #a576d322}
.preset-total{font:30px Georgia;color:#e2d0ed;text-align:center;white-space:nowrap}.preset-total small{display:block;font:10px/1.5 'Microsoft YaHei',sans-serif;margin-top:8px;color:#bcaec7}
.preset-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 0 12px}
.preset-filters{display:flex;gap:5px}
#app .preparation-room .preset-filters button[data-button-family]{min-height:33px;padding:7px 10px;font-size:11px;letter-spacing:0;border:1px solid #b8a6ca30!important;background:#12121c!important;box-shadow:none!important;filter:none;text-shadow:none}
#app .preparation-room .preset-filters button[aria-pressed=true]{background:linear-gradient(#544365,#292032)!important;border-color:#c9acdf91!important;color:#f5e9ff;box-shadow:inset 0 -2px #bca1d2!important}
.preset-toolbar>label{font-size:10px;white-space:nowrap;color:#bcb1c7}.preset-toolbar select{font:11px 'Microsoft YaHei',sans-serif;padding:7px!important;margin-left:5px;max-width:76px}
.preset-grid{min-height:0;display:grid;grid-template-columns:repeat(var(--deck-columns),minmax(0,1fr));grid-template-rows:repeat(var(--deck-rows),minmax(0,1fr));gap:18px 14px;padding:8px 5px 12px}
.preset-grid .starter-card-wrap{container-type:size;min-height:0;min-width:0;display:grid;place-items:center;padding:0}
#app .preparation-room .preset-card{position:relative;display:block;width:min(100%,calc(100cqh * .68));height:auto;max-height:100%;aspect-ratio:.68;min-height:0;padding:0;border:0!important;border-image:none!important;background:#111019!important;box-shadow:none!important;color:#eee3f1;isolation:isolate;transition:filter .15s;container-type:inline-size}
#app .preparation-room .preset-card:hover{filter:brightness(1.15)}
#app .preparation-room .preset-card.selected{filter:drop-shadow(0 0 5px #c39ae09c);outline:1px solid #d5b6ea;outline-offset:2px}
.preset-art{position:absolute;inset:3%;width:94%;height:94%;object-fit:cover;z-index:-1}
.preset-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;z-index:2}
.preset-name{position:absolute;left:7%;right:7%;bottom:8%;padding:13px 0 8px;background:linear-gradient(transparent,#100c18ed 28%);font-size:clamp(10px,8cqw,15px);line-height:1.4;text-align:center;text-shadow:0 1px 3px #000;z-index:3;white-space:nowrap}
.preset-cost{position:absolute;top:-1%;left:-2%;width:23%;aspect-ratio:1;display:grid;place-items:center;background:radial-gradient(ellipse at 35% 30%,#796091,#20182d 70%);border:1px solid #d6c2eb;border-radius:50%;font:clamp(17px,17cqw,27px) Georgia;z-index:4;box-shadow:0 0 0 2px #292332}
#app .preparation-room .preset-card .starter-count{position:absolute;inset:auto 1% 1% auto;min-width:25px;border:1px solid #b5a5c577;background:#1d1627;padding:3px 5px;font:11px/1 Georgia;z-index:5}
.preset-empty{grid-column:1/-1;grid-row:1/-1;display:grid;place-content:center;text-align:center;font-size:13px;color:#d4c8de;line-height:2}.preset-empty small{font-size:11px;color:#a99bb6}
.preset-pagination{display:flex;justify-content:space-between;align-items:center;min-height:36px;font-size:11px;color:#b4a7bf;border-top:1px solid #b7a9c12c}
.preset-pagination>div{display:flex;align-items:center;gap:5px}.preset-pagination output{min-width:45px;text-align:center}
#app .preparation-room .preset-pagination .mini-button{min-height:30px;padding:4px 12px}
#app .preparation-room .preset-list-link{min-height:28px;padding:4px 13px;font-size:10px;letter-spacing:0}
.preset-features{border-top:1px solid #b7a9c12c;margin-top:8px;padding-top:14px}
.preset-features h3{font-size:16px;letter-spacing:2px;font-weight:400;margin:0 0 14px}.preset-features h3 small{font-size:10px;letter-spacing:0;color:#a59aad;margin-left:12px}
.preset-features>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.preset-features article{display:flex;align-items:center;gap:10px;border-right:1px solid #b7a9c12c}.preset-features article:last-child{border:0}.preset-features i{font-size:27px;font-style:normal;color:#b5a0cc}.preset-features b{display:block;font-size:12px;font-weight:400;color:#dad0e4}.preset-features article small{display:block;font-size:10px;line-height:1.7;color:#aaa0b5;margin-top:6px}
.preset-inspector{display:flex;flex-direction:column;gap:16px}
.preset-hero-art{position:relative;flex:1;min-height:70px;overflow:hidden;mask-image:linear-gradient(#000 85%,transparent)}
.preset-hero-art>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%}
.preset-hero-art>div{position:absolute;bottom:16px;left:20px;text-shadow:0 2px 12px #000}
.preset-hero-art h2{font-size:30px;font-weight:400;letter-spacing:5px;margin:0 0 10px}.preset-hero-art span{font-size:11px;color:#d6c7df}
.preset-detail{position:relative;padding:24px 20px;display:grid;grid-template-columns:80px minmax(0,1fr);gap:14px 13px;align-items:start;flex:none}
.detail-label{grid-column:1/-1;font-size:10px;letter-spacing:3px;color:#b9a8ca}
.detail-heading{grid-column:1/-1;display:flex;align-items:center;gap:13px;min-width:0}
.detail-heading h2{font-size:19px;line-height:1.3;font-weight:400;margin:0 0 7px;letter-spacing:1px}.detail-heading p{font-size:10px;color:#c1afcc;margin:0;line-height:1.6}
.detail-cost{font:29px Georgia;color:#dfc8f0;text-align:center}.detail-cost small{display:block;font-size:9px;margin-top:3px}
.detail-art{display:block;width:80px;height:116px;object-fit:cover;border:1px solid #b1a0c069;grid-column:1;grid-row:3/5}
.detail-effect{font-size:13px;line-height:1.85;color:#e4dbe9;grid-column:2;margin:0;overflow-wrap:anywhere}
.detail-owned{grid-column:2;margin:0;font-size:10px;color:#b5a3c4}
#app .preset-detail>.button{grid-column:1/-1;width:100%;min-height:43px;font-size:11px;padding:10px 16px}
.detail-reminder{display:none}
.preparation-depart{flex:none;text-align:center;padding:0 8px}
.preparation-depart p{font-size:11px;color:#b9acc5;margin:0 0 5px}
#app .preparation-depart>.button{width:100%;min-height:61px;font-size:20px;letter-spacing:3px}
@media(max-width:1200px) and (min-width:701px){
 .preparation-layout{grid-template-columns:160px minmax(0,1fr) 230px;gap:14px;margin-top:15px}.preset-sidebar{padding:20px 12px;gap:12px}.preset-workspace{padding:20px 14px 14px}.preset-build-art{width:32px;height:47px}#app .preparation-room .preset-build{gap:7px;padding:8px}.preset-build b{font-size:12px}.preset-build small{font-size:9px}.preset-heading{grid-template-columns:minmax(0,1fr) auto;gap:10px}.preset-heading .mana-curve{display:none}.preset-heading h2{font-size:24px}.deck-index{margin-right:8px}.preset-heading p{font-size:11px}.preset-filters{gap:3px}#app .preparation-room .preset-filters button[data-button-family]{padding:7px;font-size:10px}.preset-toolbar>label{font-size:0}.preset-toolbar select{margin:0;width:56px}.preset-grid{gap:16px 10px}.preset-detail{padding:20px 14px;grid-template-columns:65px minmax(0,1fr);gap:12px 10px}.detail-art{width:65px;height:105px}.detail-effect{font-size:12px}.preset-features article{gap:5px}.preset-features i{font-size:20px}.preset-features article small{font-size:9px}.preset-features b{font-size:11px}
}
@media(min-width:701px) and (max-height:760px){
 #app .preparation-room{padding-bottom:14px}.preparation-layout{margin-top:14px}.preset-sidebar{padding-top:18px;gap:12px}.preview-identity .roster-avatar{width:33px;height:43px}.preset-note{font-size:11px;line-height:1.7;padding:0}.preset-sidebar .journey-options{padding-top:12px}.preset-sidebar .journey-options>small{display:none}#app .preparation-room .preset-build{min-height:68px}.preset-build-art{height:48px;width:36px}.preset-workspace{padding-top:18px;padding-bottom:12px}.preset-heading{padding-bottom:12px}.preset-heading h2{font-size:25px;margin-bottom:8px}.preset-heading p{font-size:11px}.preset-heading .mana-curve{gap:4px}.preset-toolbar{padding:10px 0}.preset-grid{gap:14px 10px}.preset-features{padding-top:10px;margin-top:3px}.preset-features h3{font-size:14px;margin-bottom:9px}.preset-features article small{margin-top:3px}.preset-inspector{gap:10px}.preset-detail{padding:18px 15px;gap:10px}.detail-art{height:95px}.detail-effect{font-size:12px}.preset-hero-art h2{font-size:24px}.preset-hero-art>div{bottom:10px}#app .preparation-depart>.button{min-height:54px;font-size:17px}
}
@media(max-width:960px) and (min-width:701px){
 .preparation-layout{grid-template-columns:145px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:12px}.preset-sidebar{grid-row:1/3}.preset-workspace{grid-column:2}.preset-inspector{grid-column:2;display:grid;grid-template-columns:minmax(0,1fr) 145px;gap:10px;align-items:center}.preset-hero-art{display:none}.preset-detail{grid-template-columns:55px minmax(0,1fr);gap:7px;padding:14px}.detail-label{display:none}.detail-heading{grid-column:2;grid-row:1}.detail-art{grid-column:1;grid-row:1/4;width:55px;height:80px}.detail-heading h2{font-size:15px;margin-bottom:4px}.detail-cost{font-size:20px}.detail-cost small{display:none}.detail-effect{font-size:11px;line-height:1.6}.detail-owned{display:none}#app .preset-detail>.button{grid-column:2;min-height:28px;padding:5px;font-size:10px}.preset-features{display:none}.preparation-depart p{font-size:10px}#app .preparation-depart>.button{font-size:15px;letter-spacing:1px;min-height:54px}
}
@media(max-width:700px){
 #app .preparation-room{padding:0 12px max(10px,env(safe-area-inset-bottom))}.preparation-room .front-header{height:54px}.preparation-room .front-header h1{font-size:19px}.preparation-layout{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:54px minmax(0,1fr) auto;gap:10px;margin-top:10px}.preset-sidebar{padding:0;background:none!important}.preset-sidebar:before,.preset-sidebar>.preview-identity,.preset-sidebar>h2,.preset-note,.preset-sidebar .journey-options,.preset-sidebar>.text-button{display:none!important}.preset-list{flex-direction:row;gap:8px;height:100%}#app .preparation-room .preset-build{width:50%;height:100%;min-height:0;padding:6px 10px;gap:8px}.preset-build-art{width:30px;height:39px}.preset-build b{font-size:12px}.preset-build small{font-size:9px;margin-top:4px}.preset-workspace{padding:14px 12px 8px;grid-template-rows:auto auto minmax(0,1fr) auto}.preset-heading{grid-template-columns:minmax(0,1fr) auto;gap:8px;padding-bottom:8px}.preset-heading h2{font-size:22px;margin:0}.deck-index{font-size:24px;margin-right:10px}.preset-heading p,.preset-heading .mana-curve{display:none}.preset-total{font-size:22px}.preset-total small{font-size:9px;margin-top:3px}.preset-toolbar{gap:8px;flex-wrap:wrap;padding:8px 0}.preset-filters{flex:1;justify-content:space-between;gap:3px}#app .preparation-room .preset-filters button[data-button-family]{min-height:28px;padding:5px 7px;font-size:10px}.preset-toolbar>label{font-size:0}.preset-toolbar select{margin:0;padding:5px!important;width:50px;font-size:10px}.preset-grid{gap:12px;padding:6px 5px 10px}.preset-pagination{font-size:10px;min-height:30px}.preset-pagination output{min-width:34px}#app .preparation-room .preset-pagination .mini-button{min-height:27px;padding:3px 10px}.preset-features,.preset-hero-art{display:none}.preset-inspector{gap:7px}.preset-detail{display:grid;grid-template-columns:64px minmax(0,1fr);padding:12px 14px;gap:6px 11px}.detail-label{display:none}.detail-heading{grid-column:2;grid-row:1;gap:8px}.detail-heading h2{font-size:16px;margin-bottom:4px}.detail-heading p{font-size:9px}.detail-cost{font-size:23px}.detail-cost small{display:none}.detail-art{width:64px;height:94px;grid-row:1/4;grid-column:1}.detail-effect{font-size:12px;line-height:1.6}.detail-owned{display:none}#app .preset-detail>.button{grid-column:2;min-height:30px;padding:5px 10px;font-size:10px}.preparation-depart{padding:0;display:flex;align-items:center;gap:10px}.preparation-depart p{font-size:10px;line-height:1.6;margin:0;flex:1}#app .preparation-depart>.button{width:62%;min-height:48px;font-size:17px;letter-spacing:2px}
}
@media(max-height:599px){
 .preset-note,.preset-features,.preset-hero-art,.preset-sidebar .difficulty-explanation{display:none}.preset-inspector{justify-content:flex-end}.preset-sidebar .journey-options{margin-top:0}.preset-detail{padding:12px;gap:8px}.preset-heading p{display:none}.preset-heading h2{margin:0}.preset-heading .mana-curve{height:42px}.preparation-layout{margin-top:8px}.preset-sidebar{gap:10px}.preset-sidebar .journey-options h3{margin-bottom:5px}.preset-sidebar .journey-options{padding-top:8px}.preset-sidebar .journey-seed input{padding:6px!important}.preset-workspace{padding-top:12px}.preset-toolbar{padding:8px 0}
}
@media(min-width:701px) and (max-height:680px){.preset-note{display:none}.preset-features article small{display:none}.preset-features h3{display:none}.preset-sidebar{gap:10px}.preset-sidebar .journey-options{margin-top:auto}.preset-sidebar .difficulty-explanation{font-size:9px;line-height:1.5}}
@media(min-width:701px) and (max-width:960px) and (max-height:599px){
 #app .preparation-room{padding-bottom:10px}.preparation-room .front-header{height:46px}.preparation-layout{grid-template-columns:minmax(0,1fr) 235px;grid-template-rows:44px minmax(0,1fr);gap:8px 12px}.preset-sidebar{grid-row:1;grid-column:1/-1;padding:0;background:none!important}.preset-sidebar:before,.preset-sidebar>.preview-identity,.preset-sidebar>h2,.preset-sidebar .journey-options,.preset-sidebar>.text-button{display:none!important}.preset-list{flex-direction:row;height:44px}#app .preparation-room .preset-build{width:180px;min-height:0;height:44px;padding:5px 9px}.preset-build-art{height:32px;width:26px}.preset-build small{margin-top:3px}.preset-workspace{grid-column:1;grid-row:2;padding:10px 12px 6px}.preset-heading{padding-bottom:5px}.preset-heading h2{font-size:21px}.preset-total{font-size:22px}.preset-total small{display:none}.preset-toolbar{padding:6px 0}.preset-grid{padding-bottom:6px}.preset-inspector{grid-column:2;grid-row:2;display:flex;gap:6px}.preset-detail{padding:10px;grid-template-columns:55px minmax(0,1fr)}.detail-art{width:55px;height:80px}.detail-heading{grid-column:2}.preparation-depart{display:flex;align-items:center;gap:5px;padding:0}.preparation-depart p{font-size:9px;flex:1}#app .preparation-depart>.button{min-height:46px;width:67%;font-size:15px}
}
@media(prefers-reduced-motion:reduce){#app .preparation-room .preset-card{transition:none}}
/* Shared page titles: silver lettering and the existing black-rose crest. */
.front-header .front-ornament{display:grid;place-items:center;width:48px;height:52px;flex:none;font-size:0;filter:drop-shadow(0 2px 6px #09070dcc)}
.front-header .front-ornament img{display:block;width:100%;height:100%;object-fit:contain;filter:saturate(.65) brightness(1.15)}
.front-header .front-title{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding-left:2px}
.front-header .front-title h1{display:block;margin:0;font-family:'STZhongsong','Noto Serif SC','Source Han Serif SC','SimSun',serif;font-size:clamp(24px,1.75vw,32px);font-weight:400;line-height:1.15;letter-spacing:.16em;color:#eee8ef;text-shadow:0 2px 8px #09080ec9;white-space:nowrap}
.front-header .front-title-caption{margin:0;padding-left:2px;font:9px/1.2 Georgia,'Times New Roman',serif;letter-spacing:.25em;text-transform:uppercase;color:#b9abbf;text-shadow:0 1px 5px #08060e}
.front-header:after{content:'';bottom:-1px;left:0;width:clamp(180px,25vw,390px);height:1px;background:linear-gradient(90deg,#e4d9e6aa,#b4a1c4a6,transparent);pointer-events:none}
@media(max-height:600px) and (min-width:601px){
 .front-header .front-ornament{width:38px;height:40px}
 .front-header .front-title{gap:3px}
 .front-header .front-title h1{font-size:22px}
 .front-header .front-title-caption{font-size:7px}
}
@media(max-width:600px){
 .front-header .front-ornament{width:32px;height:36px}
 .front-header .front-title{gap:4px;padding-left:0}
 .front-header .front-title h1{font-size:20px;letter-spacing:.1em}
 .front-header .front-title-caption{font-size:7px;letter-spacing:.19em;padding-left:1px}
}
/* Preparation hierarchy: compact hero, comparable builds, readable starting cards. */
#app .setup-refined{padding:0 clamp(20px,2.5vw,48px) 20px;background:linear-gradient(90deg,#080a12e0,#11101ac4 58%,#100e1770),url('../assets/battle/sanctuary-background.png') center/cover}
#app .setup-refined .front-header{height:76px;flex:none}
#app .setup-refined .selection-layout{display:grid;grid-template-columns:clamp(175px,14vw,230px) minmax(0,1fr) clamp(315px,25vw,440px);grid-template-rows:minmax(0,1fr);gap:26px;margin:20px auto 0;min-height:0}
#app .setup-refined .selection-roster{grid-column:1;grid-row:1;padding-right:20px;display:flex;overflow:auto}
#app .setup-refined .selection-label{height:auto;min-height:0;font-size:18px;letter-spacing:2px;margin:0 0 18px}
#app .setup-refined .selection-label small{font-size:11px;margin-top:8px;line-height:1.6;letter-spacing:.5px}
#app .setup-refined .roster-card{height:84px;font-size:17px;padding:10px;gap:10px}
#app .setup-refined .roster-avatar{width:39px;height:53px}
#app .setup-refined .roster-note{font-size:11px;margin:16px 0 24px;color:#b6a8c1}
#app .setup-refined .selection-traits{display:block;margin:0;padding-top:18px;font-size:13px}
#app .setup-refined .starting-health b{font-size:34px}
.setup-skill{display:flex;align-items:flex-start;gap:10px;margin-top:30px}.setup-skill>img,.setup-echo-icon{width:35px;height:38px;object-fit:contain;flex:none}.setup-echo-icon{font-size:36px;color:#c5a8df;text-align:center}
#app .setup-refined .setup-skill h3{font-size:17px;margin:0 0 12px;letter-spacing:1px}.setup-skill h3 small{display:block;font-size:10px;font-weight:400;color:#ac9cb9;margin-top:5px}
#app .setup-refined .setup-skill b{font:12px/1.7 'Microsoft YaHei',sans-serif;color:#e0cbed}
#app .setup-refined .setup-skill p,#app .setup-refined .setup-resource-note{font-size:12px;line-height:1.9;color:#bbafc5;margin:8px 0 0}
#app .setup-refined .setup-resource-note{margin-top:24px;padding-top:15px;border-top:1px solid #ac91bc30}
#app .setup-refined .selection-roster-quote{display:block;font-size:12px;padding-top:30px}
#app .setup-refined .selection-deck{grid-column:2;grid-row:1;display:flex;overflow:auto;padding:0 5px 0 0}
#app .setup-refined .selection-builds{display:grid;grid-template-rows:repeat(2,auto);flex:none;min-height:0;max-height:none;gap:12px}
#app .setup-refined .selection-builds .discipline{display:grid;grid-template-columns:65px minmax(0,1fr) 15px;gap:16px;min-height:133px!important;padding:17px!important;background:linear-gradient(100deg,#17121dcd,#16111b80)!important}
#app .setup-refined .selection-builds .discipline.selected{background:linear-gradient(100deg,#67507960,#21172cd1)!important;box-shadow:inset 3px 0 #d7b4ed,0 0 18px #a975d317!important}
.setup-build-sigil{width:65px;height:76px;display:grid;place-items:center;font:56px Georgia;color:#dfc6ef;background:radial-gradient(ellipse,#a279c131,transparent 65%);border-block:1px solid #b999cc45;transform:rotate(-5deg)}.setup-build-sigil.eclipse{color:#c1b8ea;transform:rotate(5deg)}
#app .setup-refined .selection-build-copy{gap:7px}
#app .setup-refined .selection-build-heading>b{font-size:24px;letter-spacing:2px}
#app .setup-refined .selection-build-heading em{font-size:10px}
.setup-build-pitch{font-weight:400;font-size:15px;letter-spacing:1px;color:#e1d2ec}
#app .setup-refined .selection-build-description{display:block;font-size:12px;line-height:1.65;color:#b8a9c4}
#app .setup-refined .selection-build-counts{font-size:10px;gap:5px 12px;color:#b2a3bf}
#app .setup-refined .selection-build-arrow{display:block;font-size:24px;background:none;border:0}
#app .setup-refined .selection-overview{display:flex;flex:1;min-height:min-content;margin-top:20px;padding-top:18px;gap:0}
#app .setup-refined .selection-overview>header{margin-bottom:14px;gap:12px;align-items:center;flex:none}
#app .setup-refined .selection-overview h3{font-size:17px;margin:0 0 8px;letter-spacing:1px}
#app .setup-refined .selection-overview header p{font-size:12px;line-height:1.7;margin:0;color:#bdaeC6}
#app .setup-refined .selection-total{margin-left:auto;white-space:nowrap;font-size:11px}.setup-refined .selection-total b{font-size:23px}.setup-refined .selection-total small{font-size:10px}
#app .setup-refined .selection-featured{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;flex:none;min-height:255px}
#app .setup-refined .selection-card{height:auto;min-height:255px;display:flex;flex-direction:column;position:relative;padding:0!important;overflow:hidden;min-width:0;background:linear-gradient(140deg,#282031,#100d17)!important;border:1px solid #b7a0c552;border-radius:3px;color:#e8dced;text-align:left;transform:none!important;box-shadow:0 8px 15px #05030940}
#app .setup-refined .selection-card:hover,#app .setup-refined .selection-card:focus-visible{border-color:#d7b2ec;box-shadow:0 0 16px #a275cb40}
.setup-card-role{font-size:11px;letter-spacing:1px;color:#d1b6e4;padding:10px 12px;background:#110d1880}
.setup-card-art{display:block;position:relative;height:clamp(75px,10vh,125px);flex:none;width:100%;overflow:hidden}
#app .setup-refined .selection-card img{position:static;display:block;width:100%;height:100%;object-fit:cover;object-position:center 35%;opacity:.88;mask-image:linear-gradient(#000 65%,#0009)}
#app .setup-refined .selection-card-cost{top:7px;left:9px;font-size:19px;width:27px;height:30px;background:#171025ed}
#app .setup-refined .selection-card-name{position:static;display:block;padding:12px 12px 7px;font-size:16px;background:none;text-align:left;letter-spacing:1px}
#app .setup-refined .selection-card-name small{font-size:10px;margin-top:5px;color:#b4a3c0}
.setup-card-effect{font:12px/1.8 'Microsoft YaHei',sans-serif;color:#e1d6e9;padding:0 12px 12px;display:block}
.setup-card-more{margin-top:auto;padding:7px 12px;font-size:10px;color:#bca4cc;border-top:1px solid #b39ac32c;text-align:right}
.setup-growth-note{font-size:11px;line-height:1.7;color:#b3a3bf;margin:12px 0 0}
#app .setup-refined .selection-detail-action{height:46px;flex:none;justify-content:flex-start;margin-top:8px}
#app .setup-refined .selection-details[data-button-family=plate]{--button-art:none!important;width:auto;min-height:36px;font-size:13px;padding:6px 0!important;background:none!important;filter:none!important;color:#bca8cc}
#app .setup-refined .selection-character{grid-column:3;grid-row:1;display:flex;justify-content:flex-start;overflow:auto;gap:0;border:0;padding:0 0 0 4px}
#app .setup-refined .selection-portrait{display:block;position:relative;height:clamp(140px,21vh,235px);flex:none;min-height:0;margin:0}
#app .setup-refined .selection-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 30%;mask-image:linear-gradient(#000 65%,transparent)}
#app .setup-refined .selection-portrait p{font-size:12px;line-height:1.8;top:14px;left:14px}
#app .setup-refined .selection-biography{display:block;margin:-12px 0 16px;position:relative;padding:0 16px}
#app .setup-refined .selection-biography h2{font-size:32px;margin:6px 0 0;letter-spacing:6px}.setup-refined .selection-biography>span{font-size:11px;color:#c1a8d3}
#app .setup-refined .selection-launch{padding:16px 18px 0;margin:0;display:flex;flex-direction:column;flex:1;background:linear-gradient(#16111be8,#14101adc 85%,transparent);border-top:1px solid #bca1ce45}
.setup-journey-description{font-size:12px;color:#bba9c8;line-height:1.7;margin-bottom:15px}
#app .setup-refined .selection-options{display:block;margin:0}.setup-refined .selection-options .selection-label{display:block;font-size:13px!important;letter-spacing:1px!important;margin:0 0 9px!important}
#app .setup-refined .journey-difficulty{display:flex;gap:8px}
#app .setup-refined .journey-difficulty button[data-selection-control]{width:50%;min-height:56px;padding:9px!important;font-size:15px;background:#17121e!important;border:1px solid #af92c34d!important;box-shadow:none!important;clip-path:none}
#app .setup-refined .journey-difficulty button.selected[data-selection-control]{background:linear-gradient(110deg,#54406288,#21172c)!important;border-color:#d3b0e9!important}
#app .setup-refined .journey-difficulty button small{display:block;font-size:10px;margin-top:4px;color:#b5a0c5}
#app .setup-refined .selection-difficulty{display:block;font-size:11px;line-height:1.8;margin:10px 0 15px;color:#c3b4cf}
#app .setup-refined .challenge-control{padding-top:12px;margin:0;border-top:1px solid #b89ccc30}
#app .setup-refined .challenge-control label{font-size:12px}.setup-refined .challenge-control label>span{font-size:10px}.setup-refined .challenge-control p,.setup-refined .challenge-control small{font-size:11px;line-height:1.7;margin:6px 0;color:#b5a5c3}
.setup-seed-options{margin-top:14px;border-top:1px solid #b698ca2e;padding-top:10px}.setup-seed-options summary{cursor:pointer;color:#c5b2d3;font-size:12px;padding:4px 0}.setup-seed-options summary>span{float:right;font-size:10px;color:#95809f}
#app .setup-refined .selection-seed{display:block;font-size:11px;margin-top:12px;line-height:1.8}#app .setup-refined .selection-seed input{display:block;width:100%;min-width:0;margin-top:7px;background:#18111f;padding:9px 12px;color:#e6d5f0;border:1px solid #b89ace70;box-sizing:border-box}
#app .setup-refined .selection-depart{display:flex;flex-direction:column;gap:5px;height:auto;margin-top:auto;padding-top:15px;flex:none}
#app .setup-refined .selection-depart p{display:block;font-size:11px;line-height:1.6;color:#e0c9f0;text-align:center;margin:0}
#app .setup-refined .selection-depart>.button{width:100%;min-height:60px;font-size:21px;margin:0}
@media(min-width:961px) and (max-height:780px){
 #app .setup-refined .front-header{height:62px}#app .setup-refined .selection-layout{margin-top:14px;gap:18px}#app .setup-refined .selection-builds .discipline{min-height:112px!important;padding:12px!important;gap:12px;grid-template-columns:45px minmax(0,1fr) 12px}.setup-build-sigil{width:45px;height:60px;font-size:44px}#app .setup-refined .selection-build-description{font-size:11px}#app .setup-refined .selection-build-heading>b{font-size:21px}#app .setup-refined .selection-overview{margin-top:14px;padding-top:12px;min-height:min-content}#app .setup-refined .selection-featured{min-height:235px}#app .setup-refined .selection-card{min-height:235px}.setup-card-role{padding:7px 10px}.setup-card-art{height:66px}#app .setup-refined .selection-portrait{height:135px}#app .setup-refined .selection-biography{margin-bottom:10px}#app .setup-refined .selection-launch{padding:12px 12px 0}.setup-journey-description{margin-bottom:10px}
}
@media(max-width:960px){
 body:has(.setup-refined){overflow:auto}#app .setup-refined{height:auto;min-height:100dvh;overflow:visible;padding:0 18px 24px}#app .setup-refined .selection-layout{display:flex;flex-direction:column;gap:24px;flex:none;margin-top:20px}#app .setup-refined .selection-roster{display:block;border:0;padding:0;overflow:visible}#app .setup-refined .selection-roster>.selection-label{display:none}#app .setup-refined .selection-heroes{max-width:260px}#app .setup-refined .roster-note{margin:8px 0}#app .setup-refined .selection-traits{display:flex;flex-wrap:wrap;gap:18px;padding-top:10px;align-items:flex-start}#app .setup-refined .starting-health{width:100%;justify-content:flex-start;gap:16px}.setup-skill{flex:1;min-width:220px;margin-top:0}#app .setup-refined .setup-resource-note,#app .setup-refined .selection-roster-quote{display:none}#app .setup-refined .selection-deck{overflow:visible;padding:0}#app .setup-refined .selection-overview{min-height:0}#app .setup-refined .selection-featured{min-height:285px;flex:none}#app .setup-refined .selection-card{min-height:285px}.setup-card-art{height:95px}#app .setup-refined .selection-character{padding:0;overflow:visible}#app .setup-refined .selection-portrait,#app .setup-refined .selection-biography{display:none}#app .setup-refined .selection-launch{padding:18px}#app .setup-refined .selection-depart{padding-top:20px}
}
@media(max-width:600px){
 #app .setup-refined .front-header{height:65px}#app .setup-refined .selection-label{font-size:17px}#app .setup-refined .selection-builds .discipline{grid-template-columns:35px minmax(0,1fr) 10px;gap:10px;padding:14px 10px!important;min-height:140px!important}.setup-build-sigil{width:35px;height:58px;font-size:40px}#app .setup-refined .selection-build-heading>b{font-size:21px}#app .setup-refined .selection-build-heading em{font-size:9px}.setup-build-pitch{font-size:13px}#app .setup-refined .selection-overview>header{align-items:flex-start}#app .setup-refined .selection-overview header p{font-size:11px}#app .setup-refined .selection-featured{grid-template-columns:1fr;gap:12px}#app .setup-refined .selection-card{min-height:175px;display:grid;grid-template-columns:95px minmax(0,1fr);grid-template-rows:30px auto 1fr 27px}.setup-card-role{grid-column:1/-1;padding:7px 12px}.setup-card-art{grid-column:1;grid-row:2/5;height:100%}#app .setup-refined .selection-card-name{grid-column:2;padding:10px 12px 7px}.setup-card-effect{grid-column:2;font-size:12px}.setup-card-more{grid-column:2;padding:5px 12px}#app .setup-refined .selection-total{font-size:10px}#app .setup-refined .selection-total b{font-size:20px}
}

/* Keep natural card text height and reserve a separate departure footer. */
#app .setup-refined .selection-builds .discipline{height:auto;min-height:116px!important;padding:8px 16px!important}
#app .setup-refined .selection-build-copy{gap:5px}
#app .setup-refined .selection-overview{flex:none;margin-top:14px;padding-top:12px}
#app .setup-refined .setup-card-art{height:70px}
#app .setup-refined .setup-card-role{padding:7px 12px}
#app .setup-refined .selection-detail-action{margin-top:10px;min-height:40px}
#app .setup-refined .selection-card{height:auto;overflow:visible}
#app .setup-refined .selection-card>*{flex-shrink:0}
#app .setup-refined .selection-card{border-radius:0}
#app .setup-refined .selection-character{overflow:hidden}
#app .setup-refined .selection-launch{min-height:0;overflow:hidden}
.setup-settings-scroll{min-height:0;overflow:auto;padding-right:3px;flex:1}
#app .setup-refined .selection-depart{padding:12px 0 0;background:linear-gradient(transparent,#13101ded 25%);margin-top:0}
@media(min-width:961px) and (max-height:780px){
 #app .setup-refined .selection-label{margin-bottom:12px;font-size:16px}
 #app .setup-refined .selection-label small{margin-top:4px}
 #app .setup-refined .selection-builds .discipline{min-height:90px!important;padding:8px 12px!important}
 #app .setup-refined .selection-build-description{display:none}
 #app .setup-refined .selection-build-heading>b{font-size:20px}
 #app .setup-refined .setup-build-pitch{font-size:13px}
 #app .setup-refined .selection-build-counts{font-size:10px}
 #app .setup-refined .selection-overview{margin-top:12px;padding-top:10px}
 #app .setup-refined .selection-overview>header{margin-bottom:10px}
 #app .setup-refined .selection-overview h3{font-size:15px;margin-bottom:5px}
 #app .setup-refined .selection-overview header p{font-size:11px}
 #app .setup-refined .selection-card-name{padding:8px 10px 6px;font-size:14px}
 #app .setup-refined .setup-card-effect{padding:0 10px 8px;font-size:11px;line-height:1.75}
 #app .setup-refined .setup-card-art{height:48px}
 #app .setup-refined .selection-featured,#app .setup-refined .selection-card{min-height:210px}
 #app .setup-refined .setup-growth-note{margin-top:8px;font-size:10px}
 #app .setup-refined .selection-detail-action{height:36px;min-height:36px;margin-top:5px}
 #app .setup-refined .selection-portrait{height:85px}
 #app .setup-refined .selection-biography{margin:-8px 0 8px;padding-bottom:0}
 #app .setup-refined .selection-biography h2{font-size:26px}
 #app .setup-refined .setup-skill{margin-top:20px;gap:6px}
 #app .setup-refined .setup-skill>img,#app .setup-refined .setup-echo-icon{width:26px}
 #app .setup-refined .setup-skill p{font-size:11px;line-height:1.8}
 #app .setup-refined .setup-resource-note{font-size:11px;margin-top:15px}
 #app .setup-refined .selection-roster-quote{display:none}
 #app .setup-refined .roster-note{margin-bottom:15px}
}
@media(max-width:960px){
 #app .setup-refined .selection-heroes{display:block;width:100%;max-width:none;height:auto}
 #app .setup-refined .roster-card{width:100%;height:76px;max-width:none;font-size:18px}
 #app .setup-refined .roster-card em{font-size:11px}
 #app .setup-refined .selection-traits{display:grid;grid-template-columns:1fr 1fr;gap:14px}
 #app .setup-refined .starting-health{grid-column:1/-1}
 #app .setup-refined .setup-skill{min-width:0;gap:7px}
 #app .setup-refined .setup-skill>img,#app .setup-refined .setup-echo-icon{width:25px}
 #app .setup-refined .setup-skill h3{font-size:15px;margin-bottom:7px}
 #app .setup-refined .setup-skill b,#app .setup-refined .setup-skill p{font-size:11px;line-height:1.8}
 #app .setup-refined .selection-character,#app .setup-refined .selection-launch,.setup-settings-scroll{overflow:visible}
 #app .setup-refined .selection-deck>.selection-label{display:block}
 #app .setup-refined .selection-deck>.selection-label small{margin-top:7px;font-size:10px}
 #app .setup-refined .selection-card-name small{display:block}
}

@media(max-width:600px){#app .setup-refined .setup-card-art{height:100%}}

@media(min-width:961px) and (max-height:780px){#app .setup-refined .selection-builds{gap:8px}#app .setup-refined .selection-overview>header{margin-bottom:6px}}

@media(min-width:701px) and (max-height:780px){.preset-sidebar .preset-note{display:none}.preset-sidebar .challenge-control{padding-top:8px;margin-top:8px}.preset-sidebar .challenge-control p,.preset-sidebar .challenge-control small{font-size:10px;line-height:1.5;margin:5px 0}}

@media(min-width:701px) and (max-height:680px){.preset-sidebar .difficulty-explanation,.preset-sidebar .challenge-control>small,.preset-sidebar .journey-options>small{display:none}.preset-sidebar .journey-options h3{margin-bottom:6px}.preset-sidebar .challenge-control{margin-top:6px;padding-top:6px}.preset-sidebar .challenge-control p{font-size:9px;line-height:1.4}}

@media(min-width:961px) and (max-height:780px){#app .setup-refined .selection-difficulty{margin:6px 0 10px}#app .setup-refined .challenge-control{padding-top:8px}.setup-refined .setup-seed-options{margin-top:8px;padding-top:6px}}