/* Adapted directly from result-light-v1. Shared combat styles remain untouched. */
#overlay .h5-result{position:relative;container-type:inline-size;width:min(900px,100%);overflow:hidden;background:#0d1c25;color:#f0dbad;border:1px solid #8a7147;border-radius:3px;box-shadow:0 15px 55px #0007,inset 0 0 0 4px #0a151d;font-family:Georgia,'Songti SC',serif}
#overlay .h5-result.portrait{width:min(390px,100%)}
#overlay .h5-result .result-hero{height:200px;position:relative;overflow:hidden;background:#14212e}
#overlay .h5-result .result-hero>img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 38%;display:block}
#overlay .h5-result .hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,transparent 5%,#07131b44 37%,#07131bc9 62%,#07131bdb),linear-gradient(0deg,#0d1c25,transparent 45%)}
#overlay .h5-result .outcome-copy{position:absolute;right:7%;top:28%;width:51%;text-align:center;text-shadow:0 2px 7px #0009}
#overlay .h5-result .chapter{font:10px/1.5 system-ui,sans-serif;letter-spacing:.2em;color:#d7c7a7}
#overlay .h5-result .outcome-copy h2{font-size:clamp(34px,5.4cqw,52px);letter-spacing:.12em;font-weight:500;line-height:1.2;margin:7px 0;color:#f1d99e}
#overlay .h5-result .outcome-copy p{font-size:13px;color:#b9bdaf;margin:8px 0 0}
#overlay .h5-result .run-summary{display:grid;grid-template-columns:repeat(3,1fr);margin:0 30px;padding:18px 0 19px;border-bottom:1px solid #645b44;text-align:center}
#overlay .h5-result .run-summary>div+div{border-left:1px solid #4a4a3e}
#overlay .h5-result .run-summary small{display:block;font:10px system-ui,sans-serif;letter-spacing:.12em;color:#a9b2ad;margin-bottom:5px}
#overlay .h5-result .run-summary b{font-size:27px;line-height:1.2;font-weight:500;font-variant-numeric:tabular-nums}
#overlay .h5-result .earned b{display:flex;align-items:center;justify-content:center;gap:7px;color:#e8c881}
#overlay .h5-result .earned svg{height:24px;width:24px}
#overlay .h5-result .unlocks{padding:22px 30px 0}
#overlay .h5-result .section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:17px}
#overlay .h5-result .section-head>div{display:flex;gap:10px;align-items:center}
#overlay .h5-result .diamond{font-size:24px;color:#ddbd7e}
#overlay .h5-result .section-head h3{margin:0;font-weight:500;font-size:20px;letter-spacing:.04em}
#overlay .h5-result .section-head>small{font:9px system-ui;letter-spacing:.12em;color:#9ca9a5}
#overlay .h5-result #unlock-count{font:11px system-ui;color:#c4ae7f;padding:2px 6px;border:1px solid #625a45;border-radius:2px}
#overlay .h5-result .unlock-list{min-height:154px;max-height:198px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#b2945c #101b23;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-content:start;outline-offset:5px}
#overlay .h5-result .unlock-card{min-width:0;display:flex;gap:12px;align-items:center;padding:14px 12px;background:linear-gradient(120deg,#243038aa,#101e27);border:1px solid #59604e;border-top-color:#a48a56;border-radius:2px;position:relative;min-height:110px}
#overlay .h5-result .unlock-card.trait{border-top-color:#919976;background:linear-gradient(120deg,#2b342baa,#101e27)}
#overlay .h5-result .unlock-icon{position:relative;width:52px;height:60px;flex:0 0 52px;background:#0d182080;border:1px solid #655c43;clip-path:polygon(12% 0,88% 0,100% 10%,100% 90%,88% 100%,12% 100%,0 90%,0 10%)}
#overlay .h5-result .unlock-icon svg{position:absolute;inset:10%;width:80%;height:80%;overflow:hidden}
#overlay .h5-result .unlock-info{min-width:0}
#overlay .h5-result .unlock-info>small{display:block;font:9px system-ui;letter-spacing:.07em;color:#b2a079;margin-bottom:5px}
#overlay .h5-result .trait .unlock-info>small{color:#adba91}
#overlay .h5-result .unlock-info h4{font-size:17px;line-height:1.25;margin:0 0 5px;font-weight:500;overflow-wrap:anywhere}
#overlay .h5-result .unlock-info p{font:11px/1.4 system-ui;color:#98a6a7;margin:0}
#overlay .h5-result .unlock-note{display:flex;align-items:center;justify-content:center;gap:7px;padding:17px 0 14px;color:#a8b497;font:11px system-ui}
#overlay .h5-result .unlock-note>span:first-child{font-size:14px;color:#b0c282}
#overlay .h5-result .result-actions{display:grid;grid-template-columns:1fr 1.3fr;gap:16px;margin:0 30px 25px;padding-top:14px;border-top:1px solid #4d4e40}
#overlay .h5-result .result-actions .brass-button{margin:0;height:53px;font-size:17px}
#overlay .h5-result .empty-unlocks{grid-column:1/-1;min-height:154px;display:flex;align-items:center;justify-content:center;gap:16px;text-align:left;color:#9daaa8}
#overlay .h5-result .empty-icon{font-size:32px;color:#8a805f}
#overlay .h5-result .empty-unlocks h4{font-size:18px;font-weight:400;margin:0 0 5px;color:#d0c6ab}
#overlay .h5-result .empty-unlocks p{font:12px/1.5 system-ui;margin:0;color:#8e9da0}
#overlay .h5-result.defeat .result-hero>img{filter:saturate(.4) brightness(.65)}
#overlay .h5-result.defeat .outcome-copy h2{color:#c8b9ad}
#overlay .h5-result.defeat .hero-shade{background:linear-gradient(90deg,transparent,#07131be0 80%),linear-gradient(0deg,#0d1c25,transparent 60%)}
#overlay .h5-result #toast{position:absolute;bottom:90px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#07141df0;border:1px solid #7c6a46;padding:9px 20px;font:12px system-ui;pointer-events:none;opacity:0;transition:opacity .15s}
#overlay .h5-result #toast.visible{opacity:1}
#overlay .h5-result.portrait .result-hero{height:178px}
#overlay .h5-result.portrait .result-hero>img{object-position:28% 40%}
#overlay .h5-result.portrait .hero-shade{background:linear-gradient(0deg,#0d1c25 0%,#0d1c2599 36%,transparent 100%)}
#overlay .h5-result.portrait .outcome-copy{top:auto;bottom:9px;left:5%;right:5%;width:auto}
#overlay .h5-result.portrait .chapter{font-size:8px;letter-spacing:.15em}
#overlay .h5-result.portrait .outcome-copy h2{font-size:30px;margin:3px 0 0;line-height:1.1}
#overlay .h5-result.portrait .outcome-copy p{font-size:11px;margin-top:5px}
#overlay .h5-result.portrait .run-summary{margin:0 18px;padding:17px 0}
#overlay .h5-result.portrait .run-summary b{font-size:23px}
#overlay .h5-result.portrait .run-summary small{font-size:8px;letter-spacing:.07em}
#overlay .h5-result.portrait .earned svg{height:20px;width:20px}
#overlay .h5-result.portrait .unlocks{padding:19px 18px 0}
#overlay .h5-result.portrait .section-head{gap:6px;flex-wrap:wrap;margin-bottom:13px}
#overlay .h5-result.portrait .section-head h3{font-size:18px}
#overlay .h5-result.portrait .section-head>div{gap:7px}
#overlay .h5-result.portrait .section-head>small{font-size:7px;letter-spacing:.05em}
#overlay .h5-result.portrait .unlock-list{grid-template-columns:1fr;min-height:240px;max-height:258px;gap:8px}
#overlay .h5-result.portrait .unlock-card{min-height:74px;padding:9px 12px;gap:13px}
#overlay .h5-result.portrait .unlock-icon{width:44px;height:48px;flex-basis:44px}
#overlay .h5-result.portrait .unlock-info{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:2px 8px;width:100%}
#overlay .h5-result.portrait .unlock-info>small{grid-column:2;grid-row:1;margin:0;font-size:8px;white-space:nowrap}
#overlay .h5-result.portrait .unlock-info h4{grid-column:1;grid-row:1;font-size:17px;margin:0}
#overlay .h5-result.portrait .unlock-info p{grid-column:1/-1;font-size:10px}
#overlay .h5-result.portrait .unlock-note{font-size:10px;padding:13px 0}
#overlay .h5-result.portrait .result-actions{margin:0 18px 19px;gap:10px;padding-top:14px}
#overlay .h5-result.portrait .result-actions .brass-button{height:46px;font-size:13px}
#overlay .h5-result.portrait .empty-unlocks{min-height:240px;gap:12px}
#overlay .h5-result.portrait .empty-unlocks h4{font-size:16px}
#overlay .h5-result.portrait .empty-unlocks p{font-size:10px}
#overlay .h5-result.portrait #toast{font-size:10px;bottom:80px;max-width:90%;white-space:normal;text-align:center}
@media(max-width:700px){#overlay .h5-result.landscape .unlock-list{grid-template-columns:1fr;max-height:230px;min-height:230px}
#overlay .h5-result.landscape .unlock-card{min-height:70px}
#overlay .h5-result.landscape .result-hero{height:165px}
#overlay .h5-result.landscape .outcome-copy h2{font-size:30px}
#overlay .h5-result.landscape .unlocks{padding-inline:18px}
#overlay .h5-result .section-head>small{font-size:7px}
#overlay .h5-result.landscape .section-head h3{font-size:16px}
#overlay .h5-result.landscape .run-summary{margin-inline:18px}
#overlay .h5-result.landscape .result-actions{margin-inline:18px}
#overlay .h5-result .result-actions .brass-button{font-size:13px}
}#overlay .h5-result * Nine-slice frames: corner scale follows button height,#overlay .h5-result never button width. */
.result-actions .brass-button{--button-height:53px;height:var(--button-height);background:none;padding:0;display:grid;place-items:center;line-height:1;border-style:solid;border-color:transparent}
#overlay .h5-result .result-actions .secondary{border-width:calc(var(--button-height)*26/84);border-image:url('/nightfall/assets/ui-brass/assets/slices__navigation-plate.webp') 13 fill / 1 / 0 stretch}
#overlay .h5-result .result-actions .primary{border-width:calc(var(--button-height)*16/65);border-image:url('/nightfall/assets/ui-brass/controls/cf5ad5c054d0ed24ed48.webp') 8 fill / 1 / 0 stretch}
#overlay .h5-result.portrait .result-actions .brass-button{--button-height:46px}


#overlay:has(.h5-result){padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));align-items:center;overflow:hidden;touch-action:pan-y}
#overlay>.panel:has(.h5-result){padding:0;border:0;background:none;box-shadow:none;margin:0;width:min(900px,100%);max-height:100%;overflow:visible}
#overlay .h5-result{margin:auto;max-width:100%;height:min(680px,calc(100dvh - 20px));display:grid;grid-template-rows:minmax(110px,1fr) auto minmax(150px,1.35fr) auto;text-align:left}
#overlay .h5-result .result-hero{height:auto;min-height:0}
#overlay .h5-result .run-summary{margin:0 24px;padding:14px 0}
#overlay .h5-result .unlocks{display:flex;flex-direction:column;min-height:0;padding-top:16px}
#overlay .h5-result .unlock-list{flex:1;min-height:0;max-height:none;overscroll-behavior:contain}
#overlay .h5-result .empty-unlocks{min-height:90px;height:100%}
#overlay .h5-result .section-head{flex-shrink:0;margin-bottom:10px}
#overlay .h5-result .unlock-note{flex-shrink:0;padding:12px 0}
#overlay .h5-result .result-actions{margin-bottom:18px;padding-top:10px}
#overlay .h5-result .brass-button{width:100%;margin:0;min-height:44px;font:bold 17px Georgia,serif;color:#efdbac;cursor:pointer;box-shadow:none;border-radius:0}
#overlay .h5-result .brass-button:disabled{filter:grayscale(1);opacity:.45;cursor:default}
#overlay .h5-result .brass-button:focus-visible{outline:2px solid #ffe4a4;outline-offset:2px}
#overlay .h5-result .unlock-icon{display:grid;place-items:center}
#overlay .h5-result .unlock-count{font:11px system-ui;color:#c4ae7f;padding:2px 6px;border:1px solid #625a45;border-radius:2px}
#overlay .h5-result #retry-save{grid-column:1/-1}
#overlay .h5-result .outcome-copy p{line-height:1.4}
#overlay .h5-result .unlock-info p{line-height:1.4}
@media(orientation:portrait){
 #overlay .h5-result{width:min(430px,100%);grid-template-rows:minmax(100px,1fr) auto minmax(130px,1.55fr) auto}
 #overlay .h5-result .unlocks{padding-top:12px}
 #overlay .h5-result .unlock-card{min-height:74px}
 #overlay .h5-result .result-actions{margin-bottom:12px}
 #overlay .h5-result .result-actions .brass-button{font-size:13px}
}
@media(orientation:landscape) and (max-height:580px){
 #overlay .h5-result{width:100%;height:calc(100dvh - 20px);grid-template-columns:36% 64%;grid-template-rows:minmax(0,1fr) 72px auto}
 #overlay .h5-result .result-hero{grid-column:1;grid-row:1}
 #overlay .h5-result .hero-shade{background:linear-gradient(0deg,#0d1c25,transparent 90%)}
 #overlay .h5-result .outcome-copy{left:4%;right:4%;width:auto;top:auto;bottom:5px}
 #overlay .h5-result .outcome-copy h2{font-size:28px;margin:4px 0}
 #overlay .h5-result .outcome-copy p{font-size:11px;margin:4px 0}
 #overlay .h5-result .chapter{font-size:8px}
 #overlay .h5-result .run-summary{grid-column:1;grid-row:2;margin:0 8px;padding:9px 0}
 #overlay .h5-result .run-summary b{font-size:20px}
 #overlay .h5-result .run-summary small{font-size:7px;letter-spacing:.04em}
 #overlay .h5-result .earned svg{width:16px;height:16px}
 #overlay .h5-result .unlocks{grid-column:2;grid-row:1/3;padding:12px 16px 0;overflow:hidden}
 #overlay .h5-result .section-head h3{font-size:17px}
 #overlay .h5-result .section-head>small{display:none}
 #overlay .h5-result .unlock-list{grid-template-columns:1fr;gap:6px}
 #overlay .h5-result .unlock-card{min-height:70px;padding:8px;gap:9px}
 #overlay .h5-result .unlock-icon{width:44px;height:48px;flex-basis:44px}
 #overlay .h5-result .unlock-info h4{font-size:16px}
 #overlay .h5-result .unlock-note{font-size:9px;padding:7px 0}
 #overlay .h5-result .result-actions{grid-column:1/-1;grid-row:3;margin:5px 16px 10px;padding-top:7px;gap:10px}
 #overlay .h5-result .result-actions .brass-button{--button-height:44px;font-size:13px;height:44px}
}
body:has(.h5-result) #debug-toggle{top:4px;right:4px;bottom:auto;opacity:.45;font-size:9px;min-height:24px;padding:3px;z-index:12}

/* Keep the existing debug panel above the outside-game iframe. */
body.brass-outside #app:has(#debug-panel:not([hidden])){z-index:50;background:transparent}
body.brass-outside #app:has(#debug-panel:not([hidden]))>#game,body.brass-outside #app:has(#debug-panel:not([hidden]))>.vignette{visibility:hidden}
body.brass-outside .screen-layer{z-index:90}

#overlay .h5-result .result-actions .secondary{border-width:calc(var(--button-height)*26/84)!important;border-color:transparent!important}
#overlay .h5-result .result-actions .primary{border-width:calc(var(--button-height)*16/65)!important;border-color:transparent!important}
#overlay .h5-result .unlock-icon .equipment-art{width:44px;height:44px;display:block;margin:0}
#overlay .h5-result .result-actions #again,#overlay .h5-result .result-actions #camp,#overlay .h5-result .result-actions #retry-save{padding:0!important;display:grid!important;place-items:center;line-height:1.1;white-space:nowrap;min-width:0;min-height:44px;margin:0}
/* The preview's fixed minimum list height yields to the actual phone height. */
#overlay .h5-result.portrait .unlock-list,#overlay .h5-result.landscape .unlock-list{min-height:0!important;max-height:none!important;overflow-y:auto}
#overlay .h5-result .unlocks{overflow:hidden}
#overlay .h5-result .unlock-icon .h5-unlock-art{display:block;width:100%;height:100%;overflow:hidden;image-rendering:pixelated}
#overlay .h5-result .unlock-icon .h5-category-icon{font:34px/1 Georgia,serif;color:#dfc48c}

/* Alpha-tight icon artwork is centered once; no inherited absolute inset. */
#overlay .h5-result .unlock-icon{display:grid;place-items:center;overflow:hidden}
#overlay .h5-result .unlock-icon>svg,#overlay .h5-result .unlock-icon .h5-unlock-art{position:static!important;inset:auto!important;display:block!important;width:76%!important;height:76%!important;margin:0!important;transform:none!important;align-self:center;justify-self:center}
#overlay .h5-result .unlock-icon .h5-category-icon{display:grid;place-items:center;width:100%;height:100%;margin:0;line-height:1}

.h5-result .result-actions>button:only-child{grid-column:1/-1}