/* ceremony.css — Swords & Sandals overhaul layer (see load order in index.html). */
/* Character creator + change look chair, result/verdict panel, LEVEL UP! modal, small battle-tool touches. */

/* ---------- creator + change look: shared shell ---------- */
#dialog#dialog:has(.creator){padding:0;text-align:left;overflow-x:hidden}
#dialog:has(.creator)::before{z-index:6}
#dialog:has(.creator) .dialog-close{z-index:6}
.creator{position:relative}
.creator-stage{position:sticky;top:0;z-index:4;display:grid;grid-template-columns:clamp(112px,35vw,158px) minmax(0,1fr);align-items:center;gap:4px 12px;padding:20px 14px 10px;background:var(--ss-grain),radial-gradient(ellipse 70% 90% at 18% 100%,#c98b3c40,#c98b3c00 70%),linear-gradient(180deg,#56361c,#3f2715);border-bottom:3px solid var(--ss-ink);box-shadow:0 2px 0 var(--ss-bronze),0 10px 16px -6px #000a}
.creator-doll{width:100%;aspect-ratio:1;border-radius:50% 50% 16px 16px;background:radial-gradient(ellipse 42% 9% at 50% 91%,#2b170999,#2b170900 72%),radial-gradient(circle at 50% 58%,#f6dca4 0,#e2b772 42%,#c98b3c55 62%,#c98b3c00 72%)}
.creator-doll .paper-doll{width:100%;height:100%;transform:scale(1.16) translateY(2%)}
.creator-id{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
.creator-id .eyebrow{display:none;font-size:10.5px;letter-spacing:.14em;color:var(--ss-bronze-hi)}
#dialog .creator-id h2{margin:0 0 2px;padding:0;font-size:21px;line-height:1.1;text-align:left}
.creator-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 21px/1.15 var(--ss-font-display);color:var(--ss-gold);text-shadow:var(--ss-outline-sm);letter-spacing:.02em}
.creator-class{font:600 12px/1.25 var(--font,'DM Sans');color:#f2dfbd}
.creator-stats{display:flex;flex-wrap:wrap;gap:4px;margin:3px 0 2px}
.creator-stats>span{display:inline-flex;align-items:center;gap:3px;padding:2px 7px 2px 4px;border:1.5px solid var(--ss-ink);border-radius:10px;background:#2b1709b3;font:400 13px/1.2 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.creator-stats .icon{width:13px;height:13px;color:var(--ss-bronze-hi)}
.creator-stats b{font-weight:400}
.creator-stats small{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;font:600 10.5px var(--font,'DM Sans');color:#e3cba5;text-shadow:none}
#dialog .creator-random{min-height:40px;margin:3px 0 0;padding:0 14px;display:inline-flex;align-items:center;gap:7px;font-size:15px;border-radius:12px}
#dialog .creator-random .icon{width:19px;height:19px;color:var(--ss-gold)}
.creator-controls{padding:14px 14px calc(14px + env(safe-area-inset-bottom,0px))}
.creator-controls>.notice{margin-top:0}
.creator-controls>.secondary.full{margin-top:12px}
.creator-controls>.text-button{display:block;margin:10px auto 0;min-height:40px}
#dialog .creator form>label.input-label{margin-bottom:6px}
#dialog .creator fieldset{margin:16px 0 0;padding:0;border:0;min-width:0}
#dialog .creator legend{display:block;width:100%;margin:0 0 8px;padding:0;font:400 17px/1.2 var(--ss-font-display);color:#ffe0a0;text-shadow:var(--ss-outline-sm);letter-spacing:.02em}
/* compact class cards: icon + name + perk in a row, 2 × 2 */
#dialog .creator .class-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#dialog .creator .class-option-content{display:grid;grid-template-columns:28px minmax(0,1fr);grid-template-rows:auto auto;column-gap:8px;row-gap:1px;align-items:center;justify-items:start;min-height:58px;padding:7px 10px;text-align:left;border-radius:13px}
#dialog .creator .class-option-content>.icon{grid-row:1/3;width:26px;height:26px;margin:0}
#dialog .creator .class-option-content>b{font-size:16px;line-height:1.1}
#dialog .creator .class-option-content>small{font-size:11.5px;line-height:1.2}
#dialog .creator .creation-note{margin:16px 0 10px;text-align:center}
#dialog .creator form>.primary{width:100%;min-height:52px;font-size:19px}

/* ---------- look pickers ---------- */
.look-pickers{display:grid;gap:12px}
.look-row{display:grid;gap:6px;min-width:0}
.look-label{font:600 13px/1.2 var(--font,'DM Sans');color:#ffe0a0}
.look-label b{margin-left:3px;font:400 15px/1 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm);letter-spacing:.02em}
.look-swatches{display:grid;grid-template-columns:repeat(var(--n,7),minmax(0,1fr));gap:5px}
.swatches-skin{--n:7}.swatches-hairColor{--n:8}.swatches-color{--n:4}
#dialog .look-swatch{position:relative;height:40px;min-width:0;padding:0;border:2px solid var(--ss-ink);border-radius:12px;background:radial-gradient(ellipse 60% 40% at 35% 28%,#ffffff55,#fff0 70%),linear-gradient(180deg,var(--sw) 50%,var(--sw2));box-shadow:inset 0 -3px 0 #0003,0 2px 0 var(--ss-ink);cursor:pointer;transition:transform .12s}
#dialog .look-swatch.selected{box-shadow:0 0 0 3px var(--ss-gold),0 2px 0 3px var(--ss-ink);transform:translateY(-1px)}
#dialog .look-swatch.selected::after{content:'';position:absolute;right:-6px;top:-7px;width:16px;height:16px;border:2px solid var(--ss-ink);border-radius:50%;background:var(--ss-gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='%232b1709' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat}
#dialog .look-swatch:focus-visible{outline:3px solid #fff3dc;outline-offset:2px}
#dialog .swatches-color .look-swatch{height:44px}
#dialog .swatches-color .look-swatch>span{font:400 14px/1 var(--ss-font-display);color:#fff;text-shadow:var(--ss-outline-sm);letter-spacing:.02em}
.look-steppers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.look-stepper{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:stretch;height:44px;border:2px solid var(--ss-ink);border-radius:12px;background:var(--ss-parch-bg);box-shadow:inset 0 0 0 1px #fff6,0 2px 0 var(--ss-ink);overflow:hidden}
.look-stepper output{display:flex;align-items:center;justify-content:center;min-width:0;padding:0 2px;overflow:hidden;text-align:center;font:400 clamp(12px,3.4vw,14px)/1.05 var(--ss-font-display);color:var(--ss-parch-ink);letter-spacing:0}
#dialog .step-button{display:grid;place-items:center;height:100%;min-height:0;padding:0;border:0;border-radius:0;background:linear-gradient(180deg,#93613a,var(--ss-leather) 55%,#56341b);color:#fff1d6;box-shadow:inset 0 1px 0 #ffd79a55}
#dialog .step-button .icon{width:20px;height:20px;stroke-width:2.6;filter:drop-shadow(0 1px 0 var(--ss-ink))}
html:not([data-motion=off]) #dialog .step-button:active{filter:brightness(1.15)}

/* ---------- starting points ---------- */
.creator-points{padding:10px;border:2px solid var(--ss-ink);border-radius:14px;background:#2b170980;box-shadow:inset 0 1px 0 #ffd79a26}
.points-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.points-head>span{display:grid;gap:1px;min-width:0}
.points-head>span>b{font:400 16px/1.1 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.points-head>span>small{font:600 11.5px/1.3 var(--font,'DM Sans');color:#e3cba5}
.points-left{flex:none;display:inline-flex;align-items:baseline;gap:4px;padding:3px 11px;border:2px solid var(--ss-ink);border-radius:20px;background:linear-gradient(#ffe08f,#f0b955 48%,#d18f3a);box-shadow:inset 0 1px 0 #fff8,0 2px 0 var(--ss-ink);font:400 13px/1.2 var(--ss-font-display);color:var(--ss-parch-ink)}
.points-left>b{font-size:20px;font-weight:400}
.points-left.spent{background:linear-gradient(#8fd46a,#4d8a34);color:#fff;text-shadow:var(--ss-outline-sm)}
.pt-list{display:grid;gap:5px}
.pt-row{display:grid;grid-template-columns:26px minmax(0,1fr) 40px 38px 40px;align-items:center;gap:5px;padding:3px 4px 3px 7px;border:1.5px solid var(--ss-ink);border-radius:11px;background:linear-gradient(#4d301a,#3b2414)}
.pt-row.boosted{background:linear-gradient(#6b4424,#4d301a);box-shadow:inset 0 0 0 1.5px var(--ss-gold)}
.pt-icon .icon{display:block;width:20px;height:20px;color:var(--ss-bronze-hi)}
.pt-name{min-width:0}
.pt-name b{display:block;font:400 15px/1.15 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.pt-name small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 11px/1.25 var(--font,'DM Sans');color:#e3cba5}
.pt-value{display:grid;justify-items:center;font:400 20px/1 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.pt-value small{font-size:11px;color:var(--ss-gold)}
#dialog .pt-button{width:40px;height:40px;min-height:0;padding:0 0 2px;display:grid;place-items:center;border:2px solid var(--ss-ink);border-radius:11px;font:400 24px/1 var(--ss-font-display);box-shadow:inset 0 2px 0 #fff5,inset 0 -3px 0 #0004,0 2px 0 var(--ss-ink);cursor:pointer}
#dialog .pt-button.plus{background:linear-gradient(#ffe08f,#f0b955 48%,#d18f3a);color:var(--ss-parch-ink)}
#dialog .pt-button.minus{background:linear-gradient(#93613a,var(--ss-leather) 55%,#56341b);color:#fff1d6;text-shadow:var(--ss-outline-sm)}
#dialog .pt-button:disabled{background:#4a382a;color:#bfa987;box-shadow:inset 0 2px 0 #ffffff12;opacity:.55;cursor:default;text-shadow:none}
html:not([data-motion=off]) #dialog :is(.pt-button,.look-swatch):active:not(:disabled){transform:translateY(2px)}

/* change look chair */
.look-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
#dialog .look-actions>button{width:100%;margin:0;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.look-editor .creator-controls{padding-bottom:6px}

/* short phones: smaller stage */
@media (max-width:600px) and (max-height:700px){
 .creator-stage{grid-template-columns:clamp(100px,31vw,124px) minmax(0,1fr);padding-top:16px;gap:2px 10px}
 #dialog .creator-id h2{font-size:19px}
 .creator-name{font-size:19px}
 #dialog .creator-random{min-height:40px}
}
@media (max-width:360px){.creator-stats>span:nth-child(3){display:none}}
@media (max-width:380px){.swatches-hairColor{--n:4}}
/* wide (landscape phones, tablets, desktop): preview beside the controls */
@media (min-width:601px){
 #dialog:has(.creator){width:min(900px,calc(100% - 24px));max-width:none}
 .creator{--stage-w:max(220px,36%);display:grid;grid-template-columns:var(--stage-w) minmax(0,1fr);align-items:start}
 .creator::before{content:'';position:absolute;inset:0 auto 0 0;width:var(--stage-w);background:var(--ss-grain),radial-gradient(ellipse 90% 40% at 50% 30%,#c98b3c40,#c98b3c00 70%),linear-gradient(180deg,#56361c,#3f2715);border-right:3px solid var(--ss-ink);box-shadow:2px 0 0 var(--ss-bronze),10px 0 16px -8px #0009;box-sizing:border-box;pointer-events:none}
 .creator-stage{grid-template-columns:1fr;justify-items:center;align-content:start;gap:4px;padding:22px 16px 18px;text-align:center;border-bottom:0;background:none;box-shadow:none}
 .creator-doll{width:min(100%,250px);margin-bottom:14px}
 .creator-doll .paper-doll{transform:scale(1.1)}
 .creator-id{align-items:center;text-align:center;width:100%}
 .creator-id .eyebrow{display:block}
 #dialog .creator-id h2{text-align:center;font-size:25px}
 .creator-stats{justify-content:center}
 .creator-stats small{position:static;width:auto;height:auto;overflow:visible;clip:auto}
 .creator-controls{padding:18px 18px 12px}
 #dialog:has(.creator) .dialog-close{left:12px;right:auto;top:12px}
 .creator-stats{gap:3px}
}
@media (min-width:1000px){
 .pt-list{grid-template-columns:repeat(2,minmax(0,1fr))}
 .pt-row{grid-template-columns:24px minmax(0,1fr) 38px 30px 38px;gap:4px}
 .pt-name small{white-space:normal}
 #dialog .pt-button{width:38px;height:38px}
}
@media (min-width:601px) and (max-height:520px){
 .creator-stage{padding:14px 12px 10px;position:sticky}
 .creator-doll{width:min(100%,46dvh);margin-bottom:8px}
 .creator-id .eyebrow,.creator-stats{display:none}
 #dialog .creator-id h2{font-size:20px}
 .creator-name{font-size:18px}
 #dialog .creator-random{min-height:40px}
}

/* ---------- result + verdict panel ---------- */
.venue-content .battle-stage>.arena-controls.ss-result{padding:10px max(12px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));text-align:center}
.ss-result .result-inner{max-width:600px;margin:0 auto}
.ss-result .result-banner{margin:0 0 4px}
.ss-result .result-banner .eyebrow{display:block;font-size:11px;letter-spacing:.16em;color:var(--ss-bronze-hi)}
.ss-result .result-title{margin:2px 0 0!important;font:400 clamp(34px,10vw,48px)/1 var(--ss-font-display)!important;letter-spacing:.03em;color:#ffe066!important;text-shadow:var(--ss-outline),0 0 22px #ffcf3a66!important}
.ss-result.defeat .result-title{color:#ff9a7e!important;text-shadow:var(--ss-outline)!important}
.ss-result .result-sub{margin:4px 0 0!important;font:600 12.5px/1.3 var(--font,'DM Sans')!important;color:#efd9b3!important}
.reward-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:8px 0}
.reward-chip{display:inline-flex;align-items:center;gap:4px;min-height:32px;padding:2px 11px 2px 6px;border:2px solid var(--ss-ink);border-radius:18px;background:linear-gradient(#5e3d20,#3b2414);box-shadow:inset 0 1px 0 #ffd79a44,0 2px 0 var(--ss-ink)}
.reward-chip .icon{width:19px;height:19px;color:var(--ss-gold);filter:drop-shadow(0 1px 0 var(--ss-ink))}
.reward-chip.xp .icon{color:#8cc4ff}
.reward-chip b{font:400 17px/1 var(--ss-font-display);color:#fff;text-shadow:var(--ss-outline-sm)}
.reward-chip small{font:400 12.5px/1 var(--ss-font-display);color:var(--ss-bronze-hi);text-shadow:var(--ss-outline-sm)}
.reward-chip.level-chip{position:relative;background:linear-gradient(#ffe98f,#f0b955 48%,#d18f3a);box-shadow:inset 0 2px 0 #fff8,0 2px 0 var(--ss-ink),0 0 14px #ffd24a88}
.reward-chip.level-chip::after{content:'';position:absolute;inset:-2px;border-radius:inherit;box-shadow:0 0 22px #ffd24acc;opacity:0;pointer-events:none}
.reward-chip.level-chip .icon{color:var(--ss-red-dk);filter:none}
.reward-chip.level-chip b{color:var(--ss-parch-ink);text-shadow:none}
.reward-chip.level-chip small{color:#6e3a12;text-shadow:none}
/* A few pulses, then the static glow: transform + opacity only (compositor), so an idle result screen does no main-thread work. */
html:not([data-motion=off]) .reward-chip.level-chip::after{animation:cer-glow 1.6s ease-in-out 4}
@keyframes cer-glow{50%{opacity:1;transform:scale(1.05)}}
/* rival speech card */
.rival-says{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:12px;margin:8px 0;text-align:left}
.rival-face{width:54px;height:54px;border:2px solid var(--ss-ink);border-radius:50%;overflow:hidden;background:radial-gradient(circle at 50% 40%,#f6dca4,#d9a860 70%);box-shadow:0 2px 0 var(--ss-ink),inset 0 0 0 2px #fff5}
.rival-face svg{display:block;width:100%;height:100%;transform:scaleX(-1)}
.rival-says blockquote{position:relative;margin:0;padding:7px 12px 7px;border:2px solid var(--ss-ink);border-radius:14px;background:var(--ss-parch-bg);color:var(--ss-parch-ink);box-shadow:inset 0 0 0 1px #fff7,0 3px 0 var(--ss-ink)}
.rival-says blockquote::before{content:'';position:absolute;left:-11px;top:50%;width:14px;height:14px;margin-top:-7px;background:#f3e2bc;border-left:2px solid var(--ss-ink);border-bottom:2px solid var(--ss-ink);transform:rotate(45deg);border-radius:0 0 0 3px}
.rival-says p{margin:0!important;font:400 15px/1.2 var(--ss-font-display)!important;color:var(--ss-parch-ink)!important;letter-spacing:.01em}
.rival-says cite{display:block;margin-top:2px;font:600 11px/1.2 var(--font,'DM Sans');font-style:normal;color:#7a4a24}
.crowd-call{display:flex;align-items:center;justify-content:center;gap:6px;width:max-content;max-width:100%;margin:4px auto 10px!important;padding:5px 13px 5px 9px;border:2px solid var(--ss-ink);border-radius:20px;background:#2b1709cc;box-shadow:inset 0 0 0 1px #c98b3c80;font:400 14.5px/1.2 var(--ss-font-display)!important;color:#fff3dc!important;text-shadow:var(--ss-outline-sm)}
.crowd-call .icon{flex:none;width:19px;height:19px;color:var(--ss-gold)}
.crowd-call.wish-mercy{box-shadow:inset 0 0 0 1.5px #8fd46a}
.crowd-call.wish-blood{box-shadow:inset 0 0 0 1.5px #ff7a62}
.verdict-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.venue-content .battle-stage .arena-controls .verdict-button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:64px;padding:6px 8px;border:2px solid var(--ss-ink);border-radius:15px;color:#fff;text-align:left;box-shadow:inset 0 2px 0 #fff6,inset 0 -4px 0 #0004,0 3px 0 var(--ss-ink);cursor:pointer}
.venue-content .battle-stage .arena-controls .verdict-button.spare{background:linear-gradient(180deg,#7cc454,#347423 50%,#28601a)}
.venue-content .battle-stage .arena-controls .verdict-button.execute{background:linear-gradient(180deg,#ec6a58,var(--ss-red) 50%,#8f2317)}
.verdict-thumb{flex:none;display:grid;place-items:center;width:42px;height:42px;border:2px solid var(--ss-ink);border-radius:50%;background:radial-gradient(circle at 40% 30%,#fff9,#fff0 60%),#fff3dc;box-shadow:0 2px 0 #2b1709aa}
.verdict-thumb .icon{width:26px;height:26px;stroke-width:2.2;color:var(--ss-ink)}
.verdict-button>span:last-child{min-width:0}
.verdict-button b{display:block;font:400 22px/1 var(--ss-font-display);color:#fff;text-shadow:var(--ss-outline-sm);letter-spacing:.02em}
.verdict-button small{display:block;margin-top:3px;font:600 11.5px/1.2 var(--font,'DM Sans');color:#fff;text-shadow:0 1px 0 #000a}
.venue-content .battle-stage .arena-controls .verdict-button:hover:not(:disabled){filter:brightness(1.08)}
.venue-content .battle-stage .arena-controls.ss-result .verdict-button.chosen:disabled{opacity:1!important;filter:none!important;box-shadow:0 0 0 3px var(--ss-gold),0 3px 0 var(--ss-ink)!important;color:#fff!important;cursor:default}
.venue-content .battle-stage .arena-controls.ss-result .verdict-button.chosen:disabled :is(b,small){color:#fff!important}
.venue-content .battle-stage .arena-controls.ss-result .verdict-button.chosen:disabled .icon{opacity:1}
.venue-content .battle-stage .arena-controls.ss-result .verdict-button.spare.chosen:disabled{background:linear-gradient(180deg,#7cc454,#347423 50%,#28601a)!important}
.venue-content .battle-stage .arena-controls.ss-result .verdict-button.execute.chosen:disabled{background:linear-gradient(180deg,#ec6a58,var(--ss-red) 50%,#8f2317)!important}
.ss-result .result-note{margin:6px 0 4px!important;font:600 12.5px/1.45 var(--font,'DM Sans')!important;color:#efd9b3!important}
.ss-result .result-extras{display:grid;gap:6px;margin-top:10px;text-align:left}
.ss-result .result-extras>*{margin:0!important}
.ss-result .result-extras .reward-note{display:flex;align-items:center;gap:7px;padding:6px 10px;border:1.5px solid #2b1709;border-radius:11px;background:#2b170980;font:600 12.5px/1.3 var(--font,'DM Sans');color:#fff0d2}
.ss-result .result-extras .reward-note .icon{flex:none;width:17px;height:17px;color:var(--ss-gold)}
.ss-result .result-extras :is(.cup-victory,.trial-victory){display:grid;grid-template-columns:34px 1fr;align-items:center;column-gap:10px;padding:8px 12px;border:2px solid var(--ss-ink);border-radius:13px;background:var(--ss-parch-bg);color:var(--ss-parch-ink);box-shadow:0 2px 0 var(--ss-ink)}
.ss-result .result-extras :is(.cup-victory,.trial-victory)>.icon{grid-row:1/3;width:32px;height:32px;color:#9a4f10}
.ss-result .result-extras :is(.cup-victory,.trial-victory) h3{margin:0;font:400 17px/1.15 var(--ss-font-display);color:var(--ss-parch-ink)}
.ss-result .result-extras :is(.cup-victory,.trial-victory) p{margin:0;font:600 12px/1.3 var(--font,'DM Sans');color:#5e3f22}
.ss-result .result-extras .mastery-rewards{display:flex;flex-wrap:wrap;gap:6px}
.ss-result .result-extras .mastery-rewards>span{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px;padding:4px 9px;border:1.5px solid #2b1709;border-radius:10px;background:#2b170980;font:600 12px/1.3 var(--font,'DM Sans');color:#fff0d2}
.ss-result .result-extras .mastery-rewards .icon{width:15px;height:15px;color:var(--ss-bronze-hi)}
.ss-result .result-extras .mastery-rewards strong{color:var(--ss-gold);font-weight:700}
.ss-result .result-extras .achievement-rewards{display:flex;flex-wrap:wrap;gap:6px}
.ss-result .result-extras .achievement-rewards>span{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border:2px solid var(--ss-ink);border-radius:12px;background:linear-gradient(#5e3d20,#3b2414);font:400 13.5px/1.2 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.ss-result .result-extras .achievement-rewards .icon{width:16px;height:16px;color:var(--ss-gold)}
.ss-result .result-extras .achievement-rewards b{font-weight:400;color:var(--ss-gold)}
.ss-result .result-continue{width:100%;margin-top:12px!important;min-height:50px;font-size:18px}
@media (max-height:700px){
 .ss-result .result-title{font-size:clamp(30px,9vw,40px)!important}
 .ss-result .result-sub{display:none}
 .reward-chips{margin:6px 0}
 .rival-says{grid-template-columns:44px minmax(0,1fr);gap:10px;margin:6px 0}
 .rival-face{width:44px;height:44px}
 .rival-says p{font-size:14px!important}
 .crowd-call{margin-bottom:8px!important;padding-top:3px;padding-bottom:3px}
 .venue-content .battle-stage .arena-controls .verdict-button{min-height:58px}
}

/* short landscape phones: the verdict buttons come first, the plea card follows */
@media (max-height:450px){
 .venue-content .battle-stage>.arena-controls.ss-result.verdict-open{padding-top:8px}
 .ss-result.verdict-open .result-inner{display:flex;flex-direction:column;gap:6px}
 .ss-result.verdict-open .result-inner>*{flex:none}
 .ss-result .result-banner .eyebrow,.ss-result .result-sub{display:none}
 .ss-result .result-title{font-size:30px!important}
 .ss-result.verdict-open .reward-chips{margin:0}
 .reward-chip{min-height:26px;padding:1px 9px 1px 5px}
 .reward-chip b{font-size:15px}.reward-chip .icon{width:16px;height:16px}
 .ss-result.verdict-open .crowd-call{order:1;margin:0 auto!important}
 .ss-result.verdict-open .verdict-buttons{order:2;gap:6px}
 .ss-result.verdict-open .rival-says{order:3;margin:2px 0}
 .ss-result.verdict-open .result-extras{order:4;margin-top:2px}
 .venue-content .battle-stage .arena-controls .verdict-button{min-height:54px;gap:6px;padding:4px 6px}
 .verdict-thumb{width:34px;height:34px}.verdict-thumb .icon{width:21px;height:21px}
 .verdict-button b{font-size:19px}.verdict-button small{font-size:10.5px}
}
/* ---------- LEVEL UP! ---------- */
#dialog:has(.levelup){padding-top:18px}
.levelup{text-align:center}
.levelup-crest{--doll:clamp(88px,27vw,124px);position:relative;isolation:isolate;display:grid;grid-template-columns:var(--doll) minmax(0,1fr);align-items:center;gap:0 6px;padding:6px 0 4px;margin:0 -8px}
.levelup-doll{aspect-ratio:1;border-radius:50% 50% 16px 16px;background:radial-gradient(ellipse 42% 9% at 50% 91%,#2b170999,#2b170900 72%),radial-gradient(circle at 50% 58%,#f6dca4 0,#e2b772 42%,#c98b3c55 62%,#c98b3c00 72%)}
.levelup-doll .paper-doll{width:100%;height:100%;transform:scale(1.16) translateY(2%)}
html:not([data-motion=off]) .levelup-doll.flex .paper-doll{animation:cer-flex .45s cubic-bezier(.2,1.6,.4,1)}
@keyframes cer-flex{40%{transform:scale(1.28,1.22) translateY(-1%)}}
.levelup-head{display:grid;justify-items:center;min-width:0}
.levelup-note{display:flex;align-items:center;gap:8px;margin:0 36px 8px 0;padding:6px 11px;border:2px solid var(--ss-ink);border-radius:13px;background:var(--ss-parch-bg);box-shadow:0 2px 0 var(--ss-ink);text-align:left;font:400 15px/1.2 var(--ss-font-display);color:var(--ss-parch-ink)}
.levelup-note .icon{flex:none;width:20px;height:20px;color:#9a4f10}
.levelup-rays{position:absolute;left:calc(var(--doll)/2);top:48%;z-index:-1;width:360px;height:360px;margin:-180px 0 0 -180px;border-radius:50%;background:repeating-conic-gradient(#ffd24a38 0 9deg,#ffd24a00 9deg 20deg);-webkit-mask-image:radial-gradient(circle,#000 18%,#0000 66%);mask-image:radial-gradient(circle,#000 18%,#0000 66%);pointer-events:none}
/* The sheet stays open while points are spent: the rays settle, the doll only flexes per point and the screen behind holds still (SVG rig loops relayout every frame). */
html:not([data-motion=off]) .levelup-rays{animation:cer-spin 7s cubic-bezier(.2,.6,.35,1) both}
@keyframes cer-spin{from{transform:rotate(-120deg)}}
.levelup-doll .combat-rig :is(.rig-body,.rig-head){animation:none}
/* app.js sets #app.under-sheet while the LEVEL UP! or death sheet is open (a class, not :root:has(), so repaints stay cheap). */
#app.under-sheet *,#app.under-sheet *::after{animation-play-state:paused}
.levelup-crest .eyebrow{display:block;font-size:10.5px;letter-spacing:.16em;color:var(--ss-bronze-hi)}
#dialog h2.levelup-title{margin:2px 0 6px;padding:0;font:400 clamp(42px,12vw,58px)/1 var(--ss-font-display);letter-spacing:.03em;color:var(--ss-gold);text-shadow:var(--ss-outline),0 0 26px #ffcf3a88}
html:not([data-motion=off]) .levelup:not(.calm,:has(.pop)) .levelup-title{animation:cer-bounce .6s cubic-bezier(.2,1.6,.4,1) both}
@keyframes cer-bounce{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.levelup-level{display:inline-flex;align-items:center;gap:5px;padding:4px 16px 4px 11px;border:2px solid var(--ss-ink);border-radius:20px;background:linear-gradient(180deg,#e0584a,var(--ss-red) 55%,#8f2317);box-shadow:inset 0 2px 0 #fff5,0 2px 0 var(--ss-ink);font:400 18px/1.1 var(--ss-font-display);color:#fff;text-shadow:var(--ss-outline-sm)}
.levelup-level .icon{width:17px;height:17px;stroke-width:2.6}
/* Calm sheet (points left over, no level gained): smaller title, leather badge, no rays or bounce. */
#dialog .calm h2.levelup-title{font-size:clamp(28px,8.5vw,36px);text-shadow:var(--ss-outline)}
.calm .levelup-level{padding:4px 14px;background:linear-gradient(180deg,#8a5a32,var(--ss-leather) 55%,var(--ss-wood-2))}
#dialog .levelup-points{display:flex;align-items:center;justify-content:center;gap:8px;margin:12px 0 10px;font:400 17px/1.2 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.levelup-points>b{display:inline-grid;place-items:center;min-width:34px;height:34px;padding:0 6px;border:2px solid var(--ss-ink);border-radius:17px;background:linear-gradient(#ffe08f,#f0b955 48%,#d18f3a);box-shadow:inset 0 2px 0 #fff8,0 2px 0 var(--ss-ink);font:400 21px/1 var(--ss-font-display);color:var(--ss-parch-ink);text-shadow:none}
.levelup-points.done .icon{width:20px;height:20px;color:#8fd46a}
.levelup-stats{display:grid;gap:5px;text-align:left}
.lv-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto 44px;align-items:center;gap:8px;padding:3px 3px 3px 7px;border:2px solid var(--ss-ink);border-radius:13px;background:linear-gradient(#56361c,#3f2715);box-shadow:inset 0 1px 0 #ffd79a33,0 2px 0 #1a0b03a6}
.lv-icon{display:grid;place-items:center;width:32px;height:32px;border:1.5px solid var(--ss-bronze);border-radius:50%;background:#2b1709}
.lv-icon .icon{width:18px;height:18px;color:var(--ss-gold)}
.lv-name{min-width:0}
.lv-name b{display:block;font:400 16px/1.15 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.lv-name small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 11.5px/1.25 var(--font,'DM Sans');color:#e3cba5}
.lv-value{min-width:30px;text-align:right;font:400 22px/1 var(--ss-font-display);color:var(--ss-gold);text-shadow:var(--ss-outline-sm)}
#dialog .lv-plus{display:grid;place-items:center;width:44px;height:44px;min-height:0;padding:0;border:2px solid var(--ss-ink);border-radius:12px;background:linear-gradient(#ffe08f,#f0b955 48%,#d18f3a);color:var(--ss-parch-ink);box-shadow:inset 0 2px 0 #fff6,inset 0 -3px 0 #0004,0 2px 0 var(--ss-ink);cursor:pointer}
#dialog .lv-plus .icon{width:24px;height:24px;stroke-width:3}
#dialog .lv-plus:disabled{background:#4a382a;color:#bfa987;box-shadow:inset 0 2px 0 #ffffff12;opacity:.5;cursor:default}
html:not([data-motion=off]) #dialog .lv-plus:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 2px 0 #fff4,0 0 0 var(--ss-ink)}
.lv-row.pop{animation:cer-row .55s ease-out}
.lv-row.pop .lv-value{animation:cer-num .55s cubic-bezier(.2,1.8,.4,1)}
@keyframes cer-row{0%{box-shadow:inset 0 0 0 2px var(--ss-gold),0 0 18px #ffd24acc}100%{box-shadow:inset 0 1px 0 #ffd79a33,0 2px 0 #1a0b03a6}}
@keyframes cer-num{0%{transform:scale(1.7);color:#fff}100%{transform:none}}
.levelup-derived{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin:10px 0}
.levelup-derived>span{display:grid;justify-items:center;gap:1px;padding:5px 2px 4px;border:1.5px solid var(--ss-ink);border-radius:10px;background:#2b170999}
.levelup-derived .icon{width:15px;height:15px;color:var(--ss-bronze-hi)}
.levelup-derived b{font:400 16px/1 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.levelup-derived small{font:600 10px/1.1 var(--font,'DM Sans');color:#e3cba5}
.levelup-derived>span.up{background:#3f6a2ecc;box-shadow:inset 0 0 0 1.5px #8fd46a}
.levelup-derived>span.up b{color:#d9ffc4}
.levelup-derived>span.pop b{animation:cer-num .55s cubic-bezier(.2,1.8,.4,1)}
/* the climb's news: a new title under the level pill, and the legend talents whose tier opened */
.levelup-newtitle{display:inline-flex;align-items:center;gap:5px;max-width:100%;margin-top:7px;padding:2px 10px 3px 7px;border:2px solid var(--ss-ink);border-radius:9px;background:linear-gradient(#fff3c4,#f0c46a 60%,#d9a441);box-shadow:inset 0 1px 0 #fff9,0 2px 0 var(--ss-ink);color:var(--ss-parch-ink)}
.levelup-newtitle .icon{flex:none;width:17px;height:17px;color:#8a3d12}
.levelup-newtitle small{font:700 9.5px/1 var(--font,'DM Sans');letter-spacing:.1em;text-transform:uppercase;color:#7a3a10}
.levelup-newtitle b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 16px/1.1 var(--ss-font-display);letter-spacing:.02em;color:var(--ss-parch-ink)}
.levelup-talents{margin:0 0 10px;padding:7px 9px 8px;text-align:left;border:2px solid var(--ss-ink);border-radius:13px;background:var(--ss-parch-bg);box-shadow:0 2px 0 var(--ss-ink)}
.levelup-news-h{display:flex;align-items:center;gap:6px;font:400 15px/1.2 var(--ss-font-display);letter-spacing:.02em;color:#7a3a10}
.levelup-news-h .icon{width:17px;height:17px;color:#b8860b}
.levelup-talents ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:5px;margin:6px 0 0;padding:0;list-style:none}
.levelup-talents li{display:flex;align-items:center;gap:7px;min-width:0;padding:4px 7px;border:1.5px solid #8a5d3366;border-radius:9px;background:#fff7}
.levelup-talents li>.icon{flex:none;width:19px;height:19px;color:#8a3d12}
.levelup-talents li>span{min-width:0}
.levelup-talents li b{display:block;font:400 14px/1.15 var(--ss-font-display);color:var(--ss-parch-ink)}
.levelup-talents li small{display:block;font:600 10.5px/1.25 var(--font,'DM Sans');color:#8a3d12}
.levelup-talents li.move{border-color:#b03022;background:#fff1e6}
.levelup-skills{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:8px;margin:0 0 10px;padding:7px 8px 7px 10px;border:2px solid var(--ss-ink);border-radius:13px;background:var(--ss-parch-bg);box-shadow:0 2px 0 var(--ss-ink);text-align:left}
.levelup-skills>.icon{width:21px;height:21px;color:#9a4f10}
.levelup-skills>span{font:600 12.5px/1.3 var(--font,'DM Sans');color:var(--ss-parch-ink)}
.levelup-skills>span b{font:400 15px var(--ss-font-display);color:var(--ss-parch-ink)}
#dialog .levelup-skills .secondary{min-height:42px;margin:0;padding:0 12px;white-space:nowrap;font-size:15px}
.levelup-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:8px}
#dialog .levelup-actions>button{width:100%;min-height:50px;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:6px}
#dialog .levelup-done{font-size:19px}
#dialog .levelup-reset{font-size:16px}
#dialog .levelup-reset:disabled{opacity:.5}
@media (max-width:420px){.levelup-derived{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* no verdict note on top: keep the title clear of the close button */
@media (max-width:600px){.levelup>.levelup-crest:first-child{padding-top:40px}}
@media (min-width:601px){#dialog:has(.levelup){width:min(660px,calc(100% - 24px));max-width:none}.levelup-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-height:520px){.levelup-crest{--doll:84px}.levelup-crest .eyebrow{display:none}#dialog h2.levelup-title{font-size:38px}#dialog .levelup-points{margin:8px 0}}

/* ---------- training yard + battle tools ---------- */
.fighter-showcase .showcase-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 14px;margin-top:12px}
.venue-content .fighter-showcase .showcase-actions{justify-content:space-between;margin-top:0;width:100%}
.fighter-showcase .change-look{min-height:44px;padding:0 18px;display:inline-flex;align-items:center;gap:7px}
.stage-live .stage-tools{gap:4px}
.stage-live .tool-button.sound-toggle[aria-pressed=false]{background:linear-gradient(180deg,#6f6257,#4d4239 55%,#3a312a)}
@media (max-width:400px){.stage-live .stance-chip>summary{padding:0 8px 0 7px}}
@media (max-width:380px){.stage-live .stance-chip>summary>span{display:none}.stage-live .stance-chip>summary{padding:0;width:40px}}

/* ---------- entry prompt: play first, the optional account second ---------- */
#dialog .entry-options{gap:8px;margin-top:20px}
#dialog .entry-options>.entry-play{min-height:58px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:22px}
#dialog .entry-play .icon{width:22px;height:22px}
#dialog .entry-or{display:block;margin:12px 0 0;font-size:10.5px;letter-spacing:.14em;color:var(--ss-bronze-hi)}
#dialog .entry-options>.entry-benefits{margin:0 0 2px}
.entry-account{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#dialog .entry-account>.secondary{width:100%;min-height:46px;margin:0;font-size:15px}
@media (max-height:700px){.entry-title .welcome-crest{margin:4px auto 10px}#dialog .entry-options{margin-top:14px}}
@media (max-height:450px){.entry-title .welcome-crest{display:none}.entry-title{padding-top:0}#dialog .entry-options{margin-top:10px}#dialog .entry-options>.entry-play{min-height:52px}#dialog .entry-or{margin-top:6px}}

/* ---------- more Swords & Sandals: body stepper, music toggle ---------- */
.look-build .look-stepper{max-width:360px}
.stage-live .menu-item.music-toggle::after{content:'Music on'}
.stage-live .menu-item.music-toggle[aria-pressed=false]::after{content:'Music off'}
.stage-live .menu-pop>.menu-item.retreat{grid-column:1/-1}

/* ---------- jokes: item flavour, keeper banter, rival bios ---------- */
.item-card>p.item-flavour,.venue-content .item-card>p.item-flavour{margin-top:-3px;font-style:italic;color:#f0c98a}
#dialog .item-flavour{margin:-4px 0 10px;font:italic 500 13px/1.4 var(--font,'DM Sans');color:#f0c98a}
.keeper-says{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;gap:2px 8px;margin:0 0 12px;padding:7px 12px 8px;border:2px solid var(--ss-ink);border-radius:13px;background:var(--ss-parch-bg);color:var(--ss-parch-ink);box-shadow:inset 0 0 0 1px #fff7,0 3px 0 var(--ss-ink);text-align:left}
.keeper-says>b{font:400 13px/1.2 var(--ss-font-display);letter-spacing:.03em;color:#8a3d12;white-space:nowrap}
.keeper-says>span{font:italic 600 13px/1.35 var(--font,'DM Sans');color:var(--ss-parch-ink)}
.trial-intro .keeper-says{margin:10px 0 0}
.venue-greeting.keeper-said{animation:cer-say .38s cubic-bezier(.2,1.5,.4,1)}
@keyframes cer-say{from{transform:scale(.9);opacity:.35}}
.match-details p.rival-bio{margin-top:5px;font-style:italic;color:#f0c98a}
#toast.keeper-toast{display:grid;gap:2px;text-align:left;width:min(420px,calc(100% - 28px));max-width:none}
#toast.keeper-toast .toast-keeper{font:400 12.5px/1.15 var(--ss-font-display);letter-spacing:.04em;color:#8a3d12}
#toast.keeper-toast q{font:italic 600 13.5px/1.35 var(--font,'DM Sans');quotes:'“' '”'}
#toast.keeper-toast small{font:600 11.5px/1.3 var(--font,'DM Sans');color:#6e4a26}

/* ---------- hardcore: badges, the fate button, the oath, the fallen ---------- */
.hc-skull{display:inline-grid;place-items:center;width:18px;height:18px;margin:0 3px 0 auto;border-radius:50%;background:#1d0f06;box-shadow:0 0 0 1.5px #e8d9bd;color:#f3e6cf;flex:none}
.hc-skull .icon{width:13px;height:13px;stroke-width:2}
.plate-name>.hc-skull+span{margin-left:0}
.hc-badge{position:absolute;left:-5px;top:-5px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#1d0f06;box-shadow:0 0 0 1.5px #e8d9bd;color:#f3e6cf;pointer-events:none}
.hc-badge .icon{width:12px;height:12px;stroke-width:2.1}
.app-avatar{position:relative}
.hc-lobby,.fate-odds,.xp-ahead{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:7px 11px;border:2px solid var(--ss-ink);border-radius:13px;background:linear-gradient(#3a2618,#24160c);box-shadow:inset 0 0 0 1px #e8d9bd33,0 2px 0 var(--ss-ink);font:600 12.5px/1.35 var(--font,'DM Sans');color:#f3e6cf;text-align:left}
.hc-lobby>.icon,.fate-odds>.icon,.xp-ahead>.icon{flex:none;width:22px;height:22px;color:#f3e6cf}
.hc-lobby b,.fate-odds b,.xp-ahead b{color:#fff;font-weight:800}
/* 10.8: ahead of the campaign, side fights teach less */
.xp-ahead>.icon{color:var(--ss-gold,#f0c040)}
.vp-pit .xp-ahead,.vp-pit-hint+.xp-ahead{margin:0 0 12px}
.hc-perk{margin-left:6px;background:#24160c!important;color:#f3e6cf!important}
.fate-box{margin-top:10px}
@media (max-height:700px){.ss-result:has(.fate-box) .result-note{display:none}.fate-box{margin-top:6px}}
.fate-box .fate-odds{margin:0}
.venue-content .battle-stage .arena-controls .fate-button{margin-top:8px!important;background:linear-gradient(180deg,#5a3d8c,#3b2566 55%,#2a1a4a);color:#fff;text-shadow:var(--ss-outline-sm);border-color:var(--ss-ink)}
.venue-content .battle-stage .arena-controls .fate-button .icon{color:var(--ss-gold)}
#dialog .settings-list>button.hardcore-toggle.on{box-shadow:inset 0 0 0 2px #e8d9bd99,0 2px 0 var(--ss-ink)}
#dialog .settings-list>button:disabled{opacity:.62}
#dialog .settings-list>.hardcore-note{margin:-3px 2px 2px;font-size:12px;line-height:1.4}
.oath .dialog-intro b{color:#fff3dc}
.oath-list{display:grid;gap:7px;margin:4px 0 16px;padding:0;list-style:none}
.oath-list li{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:start;gap:8px;font:600 13px/1.4 var(--font,'DM Sans');color:#f2dfbd}
.oath-list .icon{width:22px;height:22px;color:var(--ss-gold)}
.oath-list b{color:#fff3dc}
#dialog .oath-accept{width:100%;min-height:50px;margin:0 0 8px;background:linear-gradient(180deg,#5a3d8c,#3b2566 55%,#2a1a4a);color:#fff;text-shadow:var(--ss-outline-sm);display:inline-flex;align-items:center;justify-content:center;gap:8px}
#dialog .oath-accept .icon{color:var(--ss-gold)}
/* death sheet: the gladiator kneels (the verdict pose from animation.css), epitaph, record, the only way on */
#dialog:has(.fallen-sheet){padding-top:22px}
.fallen-sheet{text-align:center}
.fallen-crest{display:grid;grid-template-columns:clamp(104px,32vw,150px) minmax(0,1fr);align-items:center;gap:0 10px}
.fallen-doll{aspect-ratio:1;border-radius:50% 50% 16px 16px;overflow:hidden;background:radial-gradient(ellipse 42% 9% at 50% 91%,#0009,#0000 72%),radial-gradient(circle at 50% 60%,#8a7f9e 0,#4b4360 46%,#2a2338 70%)}
.fallen-sheet .fighter-sprite.fallen-figure{position:relative;left:auto;bottom:auto;width:100%;height:100%;max-width:none;max-height:none;transform:none;aspect-ratio:1;filter:saturate(.55) brightness(.92)}
.fallen-figure .paper-doll{width:100%;height:100%;transform:scale(1.22) translate(4%,-6%)}
.fallen-figure .combat-rig .rig-body{animation-iteration-count:2}
.fallen-head{display:grid;justify-items:center;min-width:0}
.fallen-head .eyebrow{font-size:10.5px;letter-spacing:.14em;color:#d9c8ef}
#dialog h2.fallen-title{margin:2px 0 4px;padding:0;font:400 clamp(38px,11vw,52px)/1 var(--ss-font-display);letter-spacing:.04em;color:#e8dcf7;text-shadow:var(--ss-outline)}
.fallen-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 21px/1.15 var(--ss-font-display);color:var(--ss-gold);text-shadow:var(--ss-outline-sm)}
.fallen-epitaph{display:flex;align-items:center;gap:10px;margin:14px 0 10px;padding:9px 13px;border:2px solid var(--ss-ink);border-radius:14px;background:linear-gradient(#d9d2c4,#b9b0a0);color:#2f2a24;box-shadow:inset 0 0 0 1px #fff8,0 3px 0 var(--ss-ink);text-align:left}
.fallen-epitaph .icon{flex:none;width:28px;height:28px;color:#4a4238}
.fallen-epitaph span{font:400 15.5px/1.3 var(--ss-font-display);letter-spacing:.01em}
.fallen-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:0 0 10px}
.fallen-facts>span{display:grid;justify-items:center;gap:1px;padding:6px 4px;border:1.5px solid var(--ss-ink);border-radius:11px;background:#2b170999}
.fallen-facts .icon{width:16px;height:16px;color:var(--ss-bronze-hi)}
.fallen-facts b{font:400 16px/1.1 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.fallen-facts small{font:600 10.5px/1.2 var(--font,'DM Sans');color:#e3cba5}
#dialog .fallen-note{margin:0 0 12px;font:600 12.5px/1.45 var(--font,'DM Sans');color:#e3cba5}
#dialog .fallen-continue{width:100%;min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:19px}
@media (max-height:520px){.fallen-crest{grid-template-columns:96px minmax(0,1fr)}#dialog h2.fallen-title{font-size:34px}.fallen-epitaph{margin:8px 0}}
/* chronicle: the Hall of the Fallen */
.fallen-list{display:grid;gap:8px}
.fallen-row{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;padding:8px 10px;border:1.5px solid var(--ss-ink);border-radius:12px;background:#2b170980}
.fallen-row>.icon{width:26px;height:26px;color:#cfc6b6}
.fallen-row b{display:block;font:400 16px/1.2 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.fallen-row small{display:block;font:600 11.5px/1.35 var(--font,'DM Sans');color:#e3cba5}
.fallen-row p{margin:3px 0 0;font:italic 600 12.5px/1.4 var(--font,'DM Sans');color:#f0c98a}
/* ---------- 10.0 legendary loot: the LEGENDARY LOOT! sheet (ceremony.js legendaryRevealHTML) and the vault close-up ---------- */
/* Art: fx's legendaryIcon SVG, or .lg-art (the gilded base item) until it ships. One-shot pop + rays; nothing loops while the sheet is open. */
.lg-art{display:grid;place-items:center;width:var(--lg,96px);height:var(--lg,96px);max-width:100%;max-height:100%;border-radius:50%;background:radial-gradient(circle at 50% 45%,#fff6cf 0,#ffd24a88 45%,#ffd24a00 70%)}
.lg-art.is-silhouette{background:radial-gradient(circle,#5a4028,#3b241400 72%)}
.lg-art.is-silhouette>*{filter:brightness(0) opacity(.6)}
.legendary-icon{display:block;overflow:visible}
.lg-art>.item-model{width:88%;height:88%;max-width:none;filter:drop-shadow(0 0 5px #ffd24acc) drop-shadow(0 3px 3px #0006)}
#dialog:has(.loot-sheet){padding-top:18px}
.loot-sheet{text-align:center}
.loot-crest{--art:clamp(100px,30vw,132px);position:relative;isolation:isolate;display:grid;grid-template-columns:var(--art) minmax(0,1fr);align-items:center;gap:0 8px;padding:6px 0 4px;margin:0 -8px}
.loot-art{display:grid;place-items:center;aspect-ratio:1;border-radius:50%}
.loot-art>*{width:100%;height:100%}
.loot-art svg{display:block;width:100%;height:100%;overflow:visible}
html:not([data-motion=off]) .loot-sheet:not(.vault) .loot-art{animation:cer-loot .75s cubic-bezier(.2,1.6,.4,1) both}
@keyframes cer-loot{0%{transform:scale(.2) rotate(-25deg);opacity:0}60%{opacity:1}100%{transform:none}}
.loot-rays{position:absolute;left:calc(var(--art)/2 + 8px);top:50%;z-index:-1;width:380px;height:380px;margin:-190px 0 0 -190px;border-radius:50%;background:repeating-conic-gradient(#ffd24a42 0 8deg,#ffd24a00 8deg 18deg);-webkit-mask-image:radial-gradient(circle,#000 16%,#0000 66%);mask-image:radial-gradient(circle,#000 16%,#0000 66%);pointer-events:none}
html:not([data-motion=off]) .loot-rays{animation:cer-spin 7s cubic-bezier(.2,.6,.35,1) both}
.loot-head{display:grid;justify-items:center;min-width:0}
.loot-head .eyebrow{display:block;max-width:100%;font-size:10.5px;letter-spacing:.14em;color:var(--ss-bronze-hi);overflow-wrap:anywhere}
#dialog h2.loot-title{margin:2px 0 4px;padding:0;font:400 clamp(30px,9.4vw,46px)/.98 var(--ss-font-display);letter-spacing:.03em;color:var(--ss-gold);text-shadow:var(--ss-outline),0 0 26px #ffcf3a99}
#dialog h2.loot-title.named{font-size:clamp(24px,7vw,32px);line-height:1.05;color:#fff3dc}
html:not([data-motion=off]) .loot-sheet:not(.vault) .loot-title{animation:cer-bounce .6s .15s cubic-bezier(.2,1.6,.4,1) both}
.loot-name{max-width:100%;font:400 21px/1.15 var(--ss-font-display);letter-spacing:.01em;color:#fff3dc;text-shadow:var(--ss-outline-sm);overflow-wrap:anywhere}
.loot-kind{display:inline-flex;align-items:center;gap:4px;margin-top:5px;padding:2px 10px 3px 7px;border:2px solid var(--ss-ink);border-radius:9px;background:linear-gradient(#fff3c4,#f0c46a 60%,#d9a441);box-shadow:inset 0 1px 0 #fff9,0 2px 0 var(--ss-ink);font:400 13px/1.15 var(--ss-font-display);letter-spacing:.03em;color:var(--ss-parch-ink)}
.loot-kind .icon{flex:none;width:15px;height:15px;color:#8a3d12}
#dialog .loot-desc{margin:10px 0 8px;font:italic 600 13.5px/1.45 var(--font,'DM Sans');color:#f3dcb4}
.loot-perks{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:5px;margin:0 0 10px;padding:0;list-style:none;text-align:left}
.loot-perks li{display:flex;align-items:center;gap:7px;min-width:0;padding:6px 9px;border:2px solid var(--ss-ink);border-radius:11px;background:var(--ss-parch-bg);box-shadow:0 2px 0 var(--ss-ink);font:600 12.5px/1.3 var(--font,'DM Sans');color:var(--ss-parch-ink)}
.loot-perks li>.icon{flex:none;width:16px;height:16px;color:#b8860b}
.loot-compare{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 10px;padding:8px 10px;border:2px solid var(--ss-ink);border-radius:13px;background:#2b1709a6;box-shadow:inset 0 1px 0 #ffd79a26}
.loot-power{display:grid;justify-items:center;min-width:0;flex:1 1 0}
.loot-power small{font:700 9.5px/1.2 var(--font,'DM Sans');letter-spacing:.1em;text-transform:uppercase;color:#e3cba5}
.loot-power b{font:400 26px/1.05 var(--ss-font-display);color:#fff3dc;text-shadow:var(--ss-outline-sm)}
.loot-power.lg b{color:var(--ss-gold);font-size:30px}
.loot-power em{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 11px/1.2 var(--font,'DM Sans');font-style:normal;color:#e3cba5}
.loot-compare>i{flex:none;font:400 16px/1 var(--ss-font-display);font-style:normal;color:var(--ss-bronze-hi)}
.loot-delta{flex:none;min-width:48px;padding:4px 8px;border:2px solid var(--ss-ink);border-radius:12px;background:#5a4a3a;font:400 19px/1 var(--ss-font-display);color:#fff;box-shadow:0 2px 0 var(--ss-ink)}
.loot-delta.up{background:linear-gradient(#7fc85a,#3f8a2a);color:#f4ffe8}
.loot-delta.down{background:linear-gradient(#e0584a,#8f2317)}
.loot-compare.worn{justify-content:space-around}
.loot-worn{display:inline-flex;align-items:center;gap:5px;font:400 17px/1.1 var(--ss-font-display);color:#9fe07a;text-shadow:var(--ss-outline-sm)}
.loot-worn .icon{width:18px;height:18px}
.loot-herald,.loot-source,.loot-wait{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:6px 11px;border:2px solid var(--ss-ink);border-radius:13px;background:var(--ss-parch-bg);box-shadow:0 2px 0 var(--ss-ink);text-align:left;font:400 14.5px/1.25 var(--ss-font-display);color:var(--ss-parch-ink)}
.loot-herald .icon,.loot-source .icon,.loot-wait .icon{flex:none;width:19px;height:19px;color:#9a4f10}
.loot-wait{font:600 12.5px/1.35 var(--font,'DM Sans')}
.loot-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:8px}
.loot-actions.one{grid-template-columns:minmax(0,1fr)}
#dialog .loot-actions>button{width:100%;min-height:50px;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:17px}
#dialog .loot-actions .loot-equip{font-size:19px}
#dialog .loot-actions .loot-equip:disabled{opacity:.55}
@media (max-width:600px){.loot-sheet>.loot-crest:first-child{padding-top:30px}}
@media (min-width:601px){#dialog:has(.loot-sheet){width:min(560px,calc(100% - 24px));max-width:none}}
@media (max-height:520px){.loot-crest{--art:92px}.loot-head .eyebrow{display:none}#dialog h2.loot-title{font-size:30px}#dialog .loot-desc{margin:6px 0}.loot-perks{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 10.0 result chips: the Emperor's gold (coin rain / decree); many chips pack tighter so the verdict buttons stay on screen */
.reward-chip.emperor-gold .icon{color:#e8c3ff}
.reward-chips.packed{gap:4px}
.reward-chips.packed .reward-chip{min-height:28px;padding:1px 8px 1px 5px;gap:3px}
.reward-chips.packed .reward-chip b{font-size:15.5px}
.reward-chips.packed .reward-chip small{font-size:11.5px}
.reward-chips.packed .reward-chip .icon{width:16px;height:16px}
@media (max-width:420px){.reward-chips.packed .reward-chip.level-chip small{display:none}}
/* the inspect dialog on a base item worn as a legendary */
#dialog .lg-note{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:6px 10px;border:2px solid var(--ss-ink);border-radius:12px;background:linear-gradient(100deg,#fff3c4,#f0c46a);box-shadow:0 2px 0 var(--ss-ink);font:600 12.5px/1.35 var(--font,'DM Sans');color:var(--ss-parch-ink)}
#dialog .lg-note>.icon{flex:none;width:18px;height:18px;color:#8a3d12}
#dialog .lg-note b{font-weight:800}
/* the campaign dialog: each champion's legendary under its status (a tick once won) */
.full-campaign small:has(.campaign-loot){display:grid;justify-items:end;gap:1px}
.full-campaign .campaign-loot{display:inline-flex;align-items:center;gap:3px;font:400 11.5px/1.2 var(--ss-font-display);letter-spacing:.02em;color:var(--ss-bronze-hi)}
.full-campaign .campaign-loot .icon{width:12px!important;height:12px!important}
.full-campaign .campaign-loot.won{color:#9fe07a}
/* ---------- 10.1: the finisher picker (in the verdict row), beast results, the coronation ---------- */
/* Finish → pick a finisher: chunky red cards, the last pick ringed in gold; the rival's plea steps aside meanwhile. */
.ss-result:has(.finisher-pick) .rival-says{display:none}
.finisher-pick{display:grid;gap:7px;margin:2px 0 0}
.ss-result .finisher-h{display:grid;justify-items:center;gap:2px;margin:0!important}
.finisher-h b{display:inline-flex;align-items:center;gap:6px;font:400 22px/1 var(--ss-font-display);letter-spacing:.02em;color:#ffb09e;text-shadow:var(--ss-outline-sm)}
.finisher-h b .icon{width:22px;height:22px;color:#ffb09e}
.finisher-h small{font:600 11.5px/1.25 var(--font,'DM Sans');color:#efd9b3}
.finisher-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.venue-content .battle-stage .arena-controls .finisher-button{position:relative;display:flex;align-items:center;gap:8px;min-width:0;min-height:58px;margin:0;padding:6px 8px 6px 6px;border:2px solid var(--ss-ink);border-radius:13px;background:linear-gradient(180deg,#ec6a58,var(--ss-red) 50%,#8f2317);color:#fff;text-align:left;box-shadow:inset 0 2px 0 #fff6,inset 0 -4px 0 #0004,0 3px 0 var(--ss-ink);cursor:pointer}
.venue-content .battle-stage .arena-controls .finisher-button:hover:not(:disabled){filter:brightness(1.08)}
.venue-content .battle-stage .arena-controls .finisher-button.last{box-shadow:0 0 0 3px var(--ss-gold),inset 0 2px 0 #fff6,inset 0 -4px 0 #0004,0 3px 0 var(--ss-ink)}
.finisher-art{flex:none;display:grid;place-items:center;width:38px;height:38px;border:2px solid var(--ss-ink);border-radius:50%;background:radial-gradient(circle at 40% 30%,#fff9,#fff0 60%),#fff3dc;box-shadow:0 2px 0 #2b1709aa}
.finisher-art .icon{width:24px;height:24px;stroke-width:2;color:var(--ss-ink)}
.finisher-copy{min-width:0}
.finisher-copy b{display:block;font:400 15px/1.05 var(--ss-font-display);letter-spacing:.01em;color:#fff;text-shadow:var(--ss-outline-sm)}
.finisher-copy small{display:block;margin-top:2px;text-wrap:pretty;font:600 10.5px/1.2 var(--font,'DM Sans');color:#ffe6da;text-shadow:0 1px 0 #000a}
.finisher-button>em{position:absolute;top:-9px;right:8px;padding:0 6px;border:1.5px solid var(--ss-ink);border-radius:6px;background:var(--ss-gold);font:400 10.5px/1.45 var(--ss-font-display);font-style:normal;letter-spacing:.04em;color:var(--ss-ink)}
.ss-result .finisher-next{display:flex;align-items:center;justify-content:center;gap:5px;margin:0!important;font:600 11.5px/1.3 var(--font,'DM Sans');color:#d9c19a}
.finisher-next .icon{flex:none;width:14px;height:14px;color:var(--ss-bronze-hi)}
.finisher-next b{color:#fff0d2}
.ss-result .finisher-back{justify-self:center;display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:0 12px;color:var(--ss-bronze-hi)}
.finisher-back .icon{width:15px;height:15px}
html:not([data-motion=off]) .finisher-button{animation:cer-bounce .35s cubic-bezier(.2,1.6,.4,1) both}
html:not([data-motion=off]) .finisher-button:nth-child(2){animation-delay:.04s}
html:not([data-motion=off]) .finisher-button:nth-child(3){animation-delay:.08s}
html:not([data-motion=off]) .finisher-button:nth-child(4){animation-delay:.12s}
html:not([data-motion=off]) .finisher-button:nth-child(5){animation-delay:.16s}
html:not([data-motion=off]) .finisher-button:nth-child(6){animation-delay:.2s}
@media (max-width:359px){.finisher-copy small{display:none}}
@media (max-height:450px){.finisher-pick{gap:5px}.finisher-h small{display:none}.venue-content .battle-stage .arena-controls .finisher-button{min-height:50px;padding:4px 6px 4px 5px}.finisher-art{width:32px;height:32px}.finisher-art .icon{width:20px;height:20px}.ss-result.verdict-open .finisher-pick{order:2}}
/* Beast results: the trophy chip, the first-win bonus, the beast's face in the speech row. */
.reward-chip.trophy-chip .icon{color:#ffd24a}
.reward-chip.beast-gold .icon{color:#ffd24a}
.rival-says.beast-says .rival-face{background:radial-gradient(ellipse 90% 60% at 50% 100%,#f0d49a,#c99a58 70%,#8a6a3a)}
.rival-says.beast-says .rival-face{display:grid;place-items:end center}
.rival-says.beast-says .rival-face svg{width:auto;height:72%;max-width:88%;margin-bottom:12%;transform:none}
.ss-result .beast-note{display:flex;align-items:center;justify-content:center;gap:6px}
.ss-result .beast-note .icon{flex:none;width:18px;height:18px;color:var(--ss-gold)}
.ss-result .beast-note b{color:var(--ss-gold)}
/* HAIL, IMPERATOR! — the coronation sheet: your gladiator in a gold laurel ring, rays, confetti, the chant, the gifts, the sulk. */
#dialog:has(.crown-sheet){padding-top:18px}
@media (min-width:601px){#dialog:has(.crown-sheet){width:min(560px,calc(100% - 24px));max-width:none}}
.crown-sheet{text-align:center}
.crown-crest{--doll:clamp(120px,36vw,156px);position:relative;isolation:isolate;display:grid;justify-items:center;gap:6px;padding:10px 0 4px;margin:0 -8px;overflow:hidden;border-radius:14px}
.crown-rays{position:absolute;left:50%;top:calc(10px + var(--doll)/2);z-index:-1;width:400px;height:400px;margin:-200px 0 0 -200px;border-radius:50%;background:repeating-conic-gradient(#b46ad83d 0 8deg,#ffd24a3d 8deg 16deg,#ffd24a00 16deg 24deg);-webkit-mask-image:radial-gradient(circle,#000 16%,#0000 66%);mask-image:radial-gradient(circle,#000 16%,#0000 66%);pointer-events:none}
html:not([data-motion=off]) .crown-rays{animation:cer-spin 7s cubic-bezier(.2,.6,.35,1) both}
.crown-ring{position:relative;width:var(--doll);aspect-ratio:1;margin:0 0 8px;padding:6px;border-radius:50%;background:radial-gradient(circle at 50% 38%,#fff6dc,#f0c46a 55%,#b8860b 72%);box-shadow:0 0 0 3px var(--ss-ink),0 0 0 7px #ffd24a,0 0 0 9px var(--ss-ink),0 0 26px #ffd24acc}
.crown-doll{width:100%;height:100%;overflow:hidden;border-radius:50%}
.crown-doll .paper-doll,.crown-doll svg{display:block;width:100%;height:100%}
html:not([data-motion=off]) .crown-ring{animation:cer-loot .8s cubic-bezier(.2,1.6,.4,1) both}
.crown-head{display:grid;justify-items:center;min-width:0}
.crown-head .eyebrow{display:block;max-width:100%;font-size:10.5px;letter-spacing:.14em;color:#e8c3ff;overflow-wrap:anywhere}
#dialog h2.crown-title{margin:2px 0 4px;padding:0;font:400 clamp(26px,8vw,40px)/.98 var(--ss-font-display);letter-spacing:.03em;color:var(--ss-gold);text-shadow:var(--ss-outline),0 0 26px #ffcf3a99;overflow-wrap:anywhere}
.crown-name{display:block;color:#fff3dc}
html:not([data-motion=off]) #dialog .crown-title{animation:cer-bounce .6s .15s cubic-bezier(.2,1.6,.4,1) both}
.crown-chant{display:inline-flex;align-items:center;gap:6px;max-width:100%;margin:2px 0 0!important;padding:4px 12px 4px 8px;border:2px solid var(--ss-ink);border-radius:18px;background:linear-gradient(#8a3fb0,#5a1f7a);box-shadow:0 2px 0 var(--ss-ink);font:400 14px/1.2 var(--ss-font-display)!important;color:#ffe08f!important;text-shadow:var(--ss-outline-sm)}
.crown-chant .icon{flex:none;width:17px;height:17px;color:#ffe08f}
.crown-gifts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:5px;margin:10px 0;padding:0;list-style:none;text-align:left}
.crown-gifts li{display:flex;align-items:center;gap:8px;min-width:0;padding:6px 9px;border:2px solid var(--ss-ink);border-radius:11px;background:var(--ss-parch-bg);box-shadow:0 2px 0 var(--ss-ink);font:600 12px/1.3 var(--font,'DM Sans');color:#4b3622}
.crown-gifts li>.icon{flex:none;width:20px;height:20px;color:#7a2fa0}
.crown-gifts b{font:400 14.5px/1.15 var(--ss-font-display);color:var(--ss-parch-ink)}
.crown-sulk{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:6px 11px;border:2px dashed #9a6a33;border-radius:13px;background:#2b170980;text-align:left;font:italic 600 12.5px/1.35 var(--font,'DM Sans');color:#efd9b3}
.crown-sulk .icon{flex:none;width:18px;height:18px;color:#ff9a7e}
.crown-sulk b{font-style:normal;color:#fff0d2}
#dialog .crown-actions>button{width:100%;min-height:52px;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:19px}
.crown-confetti{position:absolute;inset:0;z-index:2;pointer-events:none}
.crown-confetti>i{position:absolute;top:-14px;left:var(--x);width:7px;height:12px;border-radius:2px;background:var(--c);box-shadow:0 0 0 1px #2b170966;transform:rotate(var(--r));opacity:0}
html:not([data-motion=off]) .crown-confetti>i{animation:crown-fall 2.8s var(--d) cubic-bezier(.3,.1,.6,1) 2 both}
@keyframes crown-fall{0%{opacity:1;transform:translateY(0) rotate(var(--r))}85%{opacity:1}100%{opacity:0;transform:translateY(240px) rotate(calc(var(--r) + 600deg))}}
html[data-motion=off] .crown-confetti>i{opacity:.85;top:var(--y)}
@media (max-width:600px){.crown-sheet>.crown-crest:first-child{padding-top:34px}.crown-sheet .crown-rays{top:calc(34px + var(--doll)/2)}}
@media (max-height:520px){.crown-crest{--doll:96px;grid-template-columns:var(--doll) minmax(0,1fr);align-items:center;justify-items:stretch;gap:0 12px;padding:6px 0 4px 14px}.crown-ring{margin:0}.crown-rays{left:calc(var(--doll)/2 + 8px);top:50%}.crown-head .eyebrow{display:none}#dialog h2.crown-title{font-size:28px}.crown-gifts{grid-template-columns:repeat(2,minmax(0,1fr));margin:6px 0}.crown-gifts li{padding:4px 7px}}
.boon-lobby{background:linear-gradient(#2c4f80,#1c3458)}.boon-lobby>.icon{color:#ffe08f}.boon-lobby b{color:#ffe08f}