body#realm-ui #workspace .recruitment-screen{margin:14px 0;color:#ffedc5;font-size:14px}
body#realm-ui #workspace .recruitment-status{display:flex;align-items:center;gap:12px;min-height:66px;padding:8px 14px;background:#102c39;border:1px solid #a9854a;margin-bottom:12px}
body#realm-ui #workspace .recruitment-status>img{width:60px;height:46px;object-fit:contain}
body#realm-ui #workspace .recruitment-status>div{display:grid;gap:3px;flex:1;min-width:0}
body#realm-ui #workspace .recruitment-status strong{font-size:16px;line-height:1.2}
body#realm-ui #workspace .recruitment-status span,body#realm-ui #workspace .recruitment-status>small{font-size:12px;color:#e7d4ae;line-height:1.4}
body#realm-ui #workspace .recruitment-status progress{height:8px;max-width:380px;width:100%;accent-color:#4eb4d0}
body#realm-ui #workspace .recruitment-status button{font-size:13px;min-height:38px;padding:5px 10px}
body#realm-ui #workspace .recruitment-workbench{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);border:2px solid #a9854a;background:#102c39;box-shadow:0 3px 14px #0007}
body#realm-ui #workspace .recruitment-portrait{position:relative;min-width:0;min-height:280px;background:linear-gradient(#08232a00,#08232a44),url('/art/battle/sea.webp') center/cover;display:grid;place-items:center;overflow:hidden;border-right:2px solid #a9854a}
body#realm-ui #workspace .recruitment-portrait.soldier{background:linear-gradient(#32200b22,#32200b22),url('/art/realm/construction-cove.webp') center/cover}
body#realm-ui #workspace .recruitment-portrait>img{width:85%;height:260px;object-fit:contain;filter:drop-shadow(0 7px 5px #09202470)}
body#realm-ui #workspace .recruitment-portrait.soldier>img{height:240px}
body#realm-ui #workspace .recruitment-portrait>span{position:absolute;bottom:12px;left:12px;background:#092330eF;border:1px solid #b99150;color:#ffebc5;padding:4px 10px;font-size:13px}
body#realm-ui #workspace .recruitment-order{margin:0;min-width:0;padding:0;background:none;border:0}
body#realm-ui #workspace .recruitment-order>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #b99150;background:#102c39}
body#realm-ui #workspace .recruitment-order h2{font-size:26px;line-height:1.15;color:#ffe7af;margin:2px 0 0}
body#realm-ui #workspace .recruitment-order header small{font-size:12px;color:#e8d5ad}
body#realm-ui #workspace .recruitment-paper{padding:12px 16px;background:linear-gradient(#f4e5c8df,#f1dfbded),url('/art/interface/ledger-paper.webp') center/500px;color:#322315;min-height:210px}
body#realm-ui #workspace .recruitment-stats{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
body#realm-ui #workspace .recruitment-stats>span{display:grid;grid-template-columns:20px auto;gap:0 5px;align-items:center;line-height:1.3}
body#realm-ui #workspace .recruitment-stats svg{width:18px;height:18px}
body#realm-ui #workspace .recruitment-stats .period-symbol{width:20px;height:20px}
body#realm-ui #workspace .recruitment-stats small{font-size:11px;color:#654522;grid-column:1/-1}
body#realm-ui #workspace .recruitment-description{font-size:13px;line-height:1.5;margin:12px 0 8px;color:#47321b}
body#realm-ui #workspace .recruitment-gates{display:flex;flex-wrap:wrap;gap:6px 14px;margin:4px 0 8px}
body#realm-ui #workspace .recruitment-gates button{color:#663e13;font-size:13px;padding:0;min-height:30px;text-decoration:underline}
body#realm-ui #workspace .recruitment-cost .costs{display:flex;flex-wrap:wrap;gap:14px;font-size:16px;margin:8px 0}
body#realm-ui #workspace .recruitment-cost .costs img{width:27px;height:27px}
body#realm-ui #workspace .recruitment-order form{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:12px;margin:8px 0 6px}
body#realm-ui #workspace .recruitment-quantity{display:grid;grid-template-columns:68px auto;gap:4px}
body#realm-ui #workspace .recruitment-quantity label{grid-column:1/-1;margin:0;font-size:12px;color:#4a321b}
body#realm-ui #workspace .recruitment-quantity input{width:68px;min-height:42px;padding:5px 8px;margin:0;font-size:16px}
body#realm-ui #workspace .recruitment-order form button{font-size:14px;min-height:42px;padding:5px 12px;white-space:nowrap}
body#realm-ui #workspace .recruitment-order .duration{font-size:13px;color:#54391e;text-align:center;align-self:center;margin-top:16px}
body#realm-ui #workspace .recruitment-payment{display:block;font-size:11px;color:#60421f}
body#realm-ui #workspace .recruitment-catalog-heading{display:flex;align-items:center;gap:12px;padding:12px 14px 10px;margin-top:12px;background:#241b14 url('/art/interface/cabin-timber.webp') center/cover;border:1px solid #9f7d43;border-bottom:0}
body#realm-ui #workspace .recruitment-catalog-heading h3{font-size:17px;color:#ffe6b3;margin:0}
body#realm-ui #workspace .recruitment-choice-label{display:none}
body#realm-ui #workspace .recruitment-capacity{margin-left:auto;position:relative;font-size:12px;line-height:1.4}
body#realm-ui #workspace .recruitment-capacity summary{cursor:pointer;min-height:32px;display:flex;align-items:center;color:#ffe6b3}
body#realm-ui #workspace .recruitment-capacity p{position:absolute;right:0;top:35px;z-index:3;width:290px;max-width:85vw;background:#092330;border:1px solid #b99150;padding:12px;color:#fff0d0;font-size:13px;margin:0;box-shadow:0 4px 12px #0008}
body#realm-ui #workspace .recruitment-catalog{display:flex;overflow-x:auto;gap:8px;padding:12px;background:#092330;border:1px solid #9f7d43;scroll-snap-type:x proximity;scrollbar-color:#bb9658 #092330}
body#realm-ui #workspace .recruitment-catalog button{flex:0 0 134px;min-width:0;border:1px solid #816d49;border-image:none;background:linear-gradient(#173e50,#071e2a);border-radius:2px;color:#fff0cf;box-shadow:inset 0 0 5px #0009;display:grid;place-items:center;gap:4px;padding:6px;scroll-snap-align:start;position:relative}
body#realm-ui #workspace .recruitment-catalog button[aria-pressed=true]{border-color:#ffd488;outline:2px solid #dbb366;outline-offset:-3px;background:linear-gradient(#235a70,#123243)}
body#realm-ui #workspace .recruitment-catalog img{width:112px;height:76px;object-fit:contain}
body#realm-ui #workspace .recruitment-catalog strong{font-size:14px;line-height:1.2;color:#fff0cf}
body#realm-ui #workspace .recruitment-catalog span{font-size:10px;line-height:1.4;color:#dfd0ae}
@media(max-width:1100px){body#realm-ui #workspace .recruitment-stats{gap:12px}body#realm-ui #workspace .recruitment-order form{grid-template-columns:auto 1fr}body#realm-ui #workspace .recruitment-order form>button{grid-column:1/-1}}
@media(max-width:600px){
body#realm-ui #workspace .recruitment-screen{margin:10px 0}
body#realm-ui #workspace .recruitment-status{padding:8px;gap:8px;min-height:60px;margin-bottom:10px}
body#realm-ui #workspace .recruitment-status>img{width:44px;height:40px}
body#realm-ui #workspace .recruitment-status strong{font-size:14px}
body#realm-ui #workspace .recruitment-status span{font-size:11px}
body#realm-ui #workspace .recruitment-status>small{display:none}
body#realm-ui #workspace .recruitment-status button{min-height:44px;font-size:12px;padding:4px 6px}
body#realm-ui #workspace .recruitment-workbench{grid-template-columns:110px minmax(0,1fr);position:relative}
body#realm-ui #workspace .recruitment-portrait{min-height:105px;height:105px;grid-column:1;grid-row:1;z-index:1;align-self:start;border:0;background:none!important}
body#realm-ui #workspace .recruitment-portrait>img,body#realm-ui #workspace .recruitment-portrait.soldier>img{width:100px;height:85px;margin-bottom:16px}
body#realm-ui #workspace .recruitment-portrait>span{bottom:0;left:3px;right:3px;text-align:center;padding:2px;font-size:10px}
body#realm-ui #workspace .recruitment-order{grid-column:1/-1;grid-row:1}
body#realm-ui #workspace .recruitment-order>header{min-height:112px;padding:10px 8px 10px 120px;gap:5px}
body#realm-ui #workspace .recruitment-order h2{font-size:21px;overflow-wrap:anywhere}
body#realm-ui #workspace .recruitment-order .info-button{flex-shrink:0;width:32px;min-width:32px;height:40px}
body#realm-ui #workspace .recruitment-paper{padding:10px 12px;min-height:0}
body#realm-ui #workspace .recruitment-stats{gap:12px;justify-content:space-between}
body#realm-ui #workspace .recruitment-stats>small{display:none}
body#realm-ui #workspace .recruitment-description{font-size:13px;margin:9px 0}
body#realm-ui #workspace .recruitment-order form{grid-template-columns:auto 1fr;gap:8px}
body#realm-ui #workspace .recruitment-order form button{min-height:44px;font-size:15px}
body#realm-ui #workspace .recruitment-order .duration{font-size:14px}
body#realm-ui #workspace .recruitment-order form>button{grid-column:1/-1}
body#realm-ui #workspace .recruitment-cost .costs{font-size:16px;margin:9px 0;gap:10px}
body#realm-ui #workspace .recruitment-catalog-heading{flex-wrap:wrap;padding:8px;gap:8px}
body#realm-ui #workspace .recruitment-catalog-heading h3{display:none}
body#realm-ui #workspace .recruitment-choice-label{display:flex;align-items:center;gap:8px;width:100%;color:#ffebc0;font-size:14px;margin:0}
body#realm-ui #workspace #recruitment-choice{flex:1;min-width:0;max-width:100%;min-height:44px;font-size:16px}
body#realm-ui #workspace .recruitment-capacity{margin-left:0;font-size:12px}
body#realm-ui #workspace .recruitment-capacity p{left:0;right:auto}
body#realm-ui #workspace .recruitment-catalog{padding:8px;gap:6px}
body#realm-ui #workspace .recruitment-catalog button{flex-basis:108px}
body#realm-ui #workspace .recruitment-catalog img{width:90px;height:62px}
body#realm-ui #workspace .recruitment-catalog strong{font-size:12px}
}
@media(max-width:600px){
body#realm-ui #workspace .recruitment-screen>.recruitment-choice-label{padding:8px;border:1px solid #a9854a;background:#291f16 url('/art/interface/cabin-timber.webp') center/cover;margin-bottom:8px}
body#realm-ui #workspace .recruitment-status:has([data-prerequisite-building]){display:none}
body#realm-ui #workspace .recruitment-order>header{min-height:94px}
body#realm-ui #workspace .recruitment-portrait{min-height:90px;height:90px}
body#realm-ui #workspace .recruitment-portrait>img,body#realm-ui #workspace .recruitment-portrait.soldier>img{height:72px;width:96px}
}