/* Shared density and hierarchy: one surface title, concise choices, optional detail. */
:root{--hud-height:58px;--rail-left:172px;--rail-right:244px;--ui-gap:8px;--ui-radius:12px;--ui-line:#3d658660;--ui-muted:#a2bdd5;--ui-surface:#102840;--ui-warn:#ffc875}
.eyebrow,.modal-header .eyebrow,.coach-tip{display:none!important}
#modal{width:min(900px,calc(100vw - 40px));max-height:min(820px,calc(100dvh - 40px));border-radius:18px}
#modal .modal-header{min-height:58px;padding:10px 16px;gap:10px}
#modal .modal-header h1{font-size:22px;line-height:1.15;margin:0}
#modal .modal-emblem{width:30px;height:30px;font-size:26px}
#modal-subtitle{display:none}
#modal .close-button{width:36px;height:36px;font-size:27px;flex-shrink:0}
#modal .modal-body{padding:16px;min-height:0}
.ui-costs{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ui-cost{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:62px;min-height:30px;padding:4px 7px 6px;border:1px solid var(--ui-line);border-radius:7px;color:#ddecf8;background:#0b2036;overflow:hidden;font:600 12px inherit;white-space:nowrap}
.ui-cost:after{content:'';position:absolute;bottom:0;left:0;width:var(--funded);height:2px;background:#43e6bb}
.ui-cost.missing:after{background:var(--ui-warn)}
.ui-cost.missing{color:#ffdda5}
.ui-cost .hud-icon,.ui-cost svg,.ui-cost img{width:22px;height:22px;flex:none;object-fit:contain}
.ui-fallback-icon{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:#28506a;color:#c9f4ff;font-size:11px}
.ui-benefit{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:12px;line-height:1.6}
.ui-benefit>span{color:var(--ui-muted)}
.ui-benefit strong{color:#9df5dc;text-align:right}.ui-arrow{color:#7697b6;padding:0 3px}
.ui-item-heading{display:flex;align-items:center;gap:10px;min-height:56px}
.ui-item-heading .sprite{width:64px!important;height:64px!important;position:static!important;float:none!important;flex:none;object-fit:contain}
.ui-item-heading h3{font-size:16px!important;line-height:1.15;margin:0!important}.ui-item-heading small{font-size:11px;color:var(--ui-muted)}
.ui-details{font-size:12px;color:var(--ui-muted);margin:6px 0}
.ui-details summary{cursor:pointer;font-size:11px;width:fit-content;padding:4px 0}
.ui-details>div{padding:6px 0;line-height:1.5}.ui-details p{margin:4px 0}
#modal .action-button{min-height:34px;padding:7px 12px;font-size:13px;border-radius:9px}
#modal .section-title{font-size:14px;margin:16px 0 8px}
#modal .reason:empty{display:none}#modal .reason{font-size:11px;margin:4px 0;color:#e9c287}
#modal .progress{height:4px}
#modal .item-card{border-radius:12px}
button:focus-visible,summary:focus-visible{outline:2px solid #74e6ff;outline-offset:3px}
@media(max-width:800px),(pointer:coarse) and (max-height:500px){
 #modal{width:100vw;max-width:none;height:100dvh;max-height:100dvh;border-radius:0;margin:0}
 #modal .modal-header{min-height:58px;padding:6px 12px;padding-top:calc(6px + env(safe-area-inset-top));flex-shrink:0}
 #modal .modal-body{padding:12px;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
 #modal .close-button{width:44px;height:44px}
 #modal .action-button,.ui-cost{min-height:40px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}}
/* Completed work collapses into one reusable, inspectable history strip. */
.completed-history{margin:0 0 16px;min-width:0}
.completed-history-heading{display:flex;align-items:center;gap:6px;margin:0 0 7px}
.completed-history-heading h2{font-size:12px!important;line-height:1.2;margin:0!important;font-weight:750;color:#abd3d7}
.completed-history-heading>span{font-size:11px;color:#7eacbe;cursor:help}
.completed-history-row{display:flex;align-items:flex-start;gap:7px;overflow-x:auto;overscroll-behavior-x:contain;padding:2px 2px 8px;scrollbar-width:thin;scrollbar-color:#427482 transparent}
.completed-history-item{position:relative;flex:0 0 158px;min-width:0;border:1px solid #488d7b77;border-radius:10px;background:linear-gradient(125deg,#1c484c99,#183449);color:#d8f2ee}
.completed-history-item>summary{display:flex;align-items:center;gap:7px;min-height:54px;padding:7px 18px 7px 7px;list-style:none;cursor:pointer;font-size:11px;line-height:1.25;font-weight:650}
.completed-history-item>summary::-webkit-details-marker{display:none}
.completed-history-item>summary>span:nth-child(2){min-width:0}
.completed-history-icon{width:29px;height:32px;flex:0 0 29px;display:grid;place-items:center;color:#78e4bf}
.completed-history-icon .sprite,.completed-history-icon .hud-icon{width:29px!important;height:32px!important;position:static!important;object-fit:contain}
.completed-history-icon .region-orb{width:25px;height:25px}
.completed-history-check{position:absolute;right:5px;top:6px;font-size:10px;color:#6febbf}
.completed-history-item[open]{flex-basis:240px;border-color:#6ccdb4}
.completed-history-detail{padding:0 10px 10px;font-size:11px;line-height:1.5;color:#bdd9df}
.completed-history-detail p{margin:0 0 7px}.completed-history-detail button{font-size:11px}
.completed-history-row:focus-visible{outline:1px solid #81e5de;outline-offset:3px;border-radius:8px}
@media(max-width:800px){.completed-history-item{flex-basis:148px}.completed-history-item>summary{min-height:58px}.completed-history-item[open]{flex-basis:min(240px,75vw)}}
