/* Profession selection: one centered row of printed role cards. */
.identity-draft-lobby{display:flex;align-items:center;gap:16px;padding:20px 18px;margin:18px 0;background:#e9dec2;color:#302b25;border:1px solid #675c48;box-shadow:4px 4px 0 #172b2840}
.identity-deal-mark{display:grid;place-items:center;flex:none;width:48px;height:66px;background:#245b52;color:#eddfba;border:3px double #eddfba;font:900 36px/1 serif;transform:rotate(-7deg);box-shadow:4px 3px 0 #b84732}
.identity-draft-lobby h3{font-size:20px;margin:0 0 6px}.identity-draft-lobby p{font-size:13px;line-height:1.7;margin:0;color:#5b503d}
.draft-card-stage{width:min(1120px,calc(100vw - 32px));max-height:calc(100svh - 32px);padding:18px 20px;background:#eadbb9;border:2px solid #192e29;box-shadow:7px 7px 0 #b54632,0 0 0 100vmax #102420ed;isolation:isolate}
.draft-card-stage header{border-bottom:2px solid #273c34;padding:0 0 10px}.draft-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.draft-card-stage header h2{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:clamp(22px,3vw,32px);letter-spacing:-.04em;margin:8px 0 5px;text-shadow:2px 2px #bdac86}.draft-card-stage header p{font-size:12px;margin:0;line-height:1.5}.draft-card-stage .eyebrow{font-size:10px;letter-spacing:.1em;color:#526750}.draft-progress{font-size:11px;white-space:nowrap;color:#536148}.draft-progress b{color:#ad402e}.draft-identity{font-size:12px;letter-spacing:.02em;color:#f5e5bf;background:#254e43;border-radius:3px;padding:6px 9px;text-shadow:none;white-space:nowrap}.draft-identity[data-identity=boss]{background:#a43f2d}.role-draft-placeholder{display:grid;place-items:center;width:100%;height:100%;background:#1c3932;color:#a89570;font:900 36px/1 serif}
.draft-card-stage .role-draft-clock{padding:9px 0;gap:14px}.draft-card-stage .role-draft-clock .action-clock{max-width:320px}.draft-card-stage .role-draft-clock>small{max-width:none;font-size:11px;white-space:nowrap}
.draft-card-stage .draft-card-row{display:flex;flex:none;align-items:stretch;justify-content:center;gap:12px;min-height:0;max-height:none;overflow-x:auto;overflow-y:hidden;padding:8px 6px 14px;scroll-snap-type:x proximity;scroll-padding-inline:6px;overscroll-behavior-x:contain;touch-action:pan-x pinch-zoom;scrollbar-width:thin;scrollbar-color:#667f6b #cab993}
.draft-card-stage .draft-profession-card{position:relative;display:flex;flex-direction:column;align-items:stretch;flex:0 0 calc((100% - 48px)/5);min-width:0;min-height:0;max-width:204px;gap:0;padding:0;text-align:center;overflow:hidden;border:2px solid #273c34;border-left:2px solid #273c34;background:#f4e8cb;color:#273c34;box-shadow:4px 5px 0 #263a3350;scroll-snap-align:center;cursor:pointer;transform:translateY(0);transition:transform .16s ease,box-shadow .16s ease}
.draft-card-stage .draft-profession-card:hover{background:#fff1ce;transform:translateY(-3px)}.draft-card-stage .draft-profession-card:focus-visible{outline:3px solid #ad402e;outline-offset:3px}.draft-card-stage .draft-profession-card.is-selected{border-color:#a73a27;background:#fff0c7;box-shadow:4px 5px 0 #aa3e29;transform:translateY(-4px)}.draft-card-stage .draft-profession-card:disabled{opacity:.66;cursor:wait}.draft-card-number{position:absolute;z-index:1;left:8px;top:7px;font:800 10px/1.2 monospace;color:#2d5145;letter-spacing:.07em}.draft-card-stage .role-draft-portrait{display:block;flex:none;width:100%;height:clamp(125px,20vh,195px);margin:0;overflow:hidden;background:radial-gradient(ellipse at 50% 80%,#77957d55 0 35%,transparent 70%),repeating-linear-gradient(135deg,#2a57470b 0 1px,transparent 1px 6px);filter:none;border-bottom:2px solid #273c34}.draft-card-stage .role-draft-portrait img{height:100%;width:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(3px 4px 0 #1b352e40);transform:scale(1.04)}.draft-card-stage .role-draft-meta{flex:1;display:flex;align-items:center;gap:4px;padding:10px 5px 7px;min-width:0}.draft-card-stage .role-draft-meta b{font-size:clamp(17px,2.2vw,23px);font-weight:900;letter-spacing:-.03em;line-height:1.15;text-shadow:1px 2px #bbae8c}.draft-card-stage .role-draft-meta em{font-size:11px;font-weight:700;line-height:1.4;font-style:normal;color:#75613e}.draft-card-stage .role-draft-meta em>span{color:#af432e}.draft-skill-names{display:flex;flex-wrap:wrap;justify-content:center;gap:3px;margin-top:3px}.draft-card-stage .draft-skill-names small{font-size:10px;line-height:1.4;padding:2px 4px;color:#f2e4c1;background:#326554;border-radius:1px;white-space:normal}.draft-card-stage .draft-skill-names .draft-passive{background:#6a6d61}.draft-card-stage .draft-skill-names .draft-break{background:#a34230}.draft-card-stage .role-draft-check{display:block;flex:none;padding:6px;font-size:11px;background:#233e32;color:#eddfba}.draft-card-stage .is-selected .role-draft-check{background:#a73a27;color:#fff0cb}
.draft-selected-detail{flex:0 1 auto;min-height:42px;max-height:100px;overflow:auto;font-size:12px;line-height:1.5;padding:8px 2px;color:#375046}.draft-selected-detail>b{display:block;color:#2c3e30;font-size:13px}.draft-selected-detail>span{display:block}.draft-selected-detail details{margin-top:4px}.draft-selected-detail summary{cursor:pointer;color:#8e3d2e;min-height:24px}.draft-selected-detail p{margin:4px 0}.draft-confirm-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:9px;border-top:1px solid #b9a880;flex:none}.draft-confirm-row>span{font-size:11px;color:#715f43}.draft-confirm-row .draft-confirm{min-width:168px;min-height:48px;background:#ab3c28;border:1px solid #6c291d;color:#fff0cf;box-shadow:3px 3px 0 #6c291d;border-radius:2px;font-size:14px}.draft-confirm-row .draft-confirm:disabled{opacity:.5;box-shadow:none;cursor:default}.draft-card-stage .role-draft-wait{display:flex;flex-direction:column;align-items:center;gap:15px;padding:38px 20px}.draft-wait-stamp{display:grid;place-items:center;width:86px;height:86px;border:4px double #a7422f;border-radius:50%;color:#a7422f;font-size:22px;font-weight:900;transform:rotate(-10deg)}.draft-card-stage .role-draft-wait b{font-size:24px;color:#284c3c}.draft-card-stage .role-draft-wait>span:last-child{font-size:13px}
@media(max-width:600px) and (orientation:portrait){.draft-card-stage{width:calc(100vw - 20px);padding:14px 12px;max-height:calc(100svh - 30px)}.draft-card-stage header h2{font-size:24px;gap:8px;margin:9px 0 6px}.draft-identity{font-size:11px;padding:5px 7px}.draft-heading{gap:6px}.draft-card-stage .eyebrow{font-size:9px;letter-spacing:.025em}.draft-card-stage .draft-card-row{justify-content:flex-start;gap:10px;padding-inline:4px;scroll-padding-inline:4px}.draft-card-stage .draft-profession-card{flex-basis:min(56vw,210px);max-width:none;min-width:150px}.draft-card-stage .role-draft-portrait{height:clamp(140px,22svh,200px)}.draft-card-stage .role-draft-meta b{font-size:23px}.draft-card-stage .role-draft-clock{gap:8px}.draft-card-stage .role-draft-clock>small{font-size:10px}.draft-selected-detail{max-height:110px;min-height:48px}.draft-confirm-row{gap:8px}.draft-confirm-row .draft-confirm{min-width:160px}.draft-card-stage .role-draft-meta{min-height:84px}}
@media(orientation:landscape) and (max-height:520px){.draft-card-stage{max-height:calc(100svh - 14px);width:min(1000px,calc(100vw - 24px));padding:9px 14px}.draft-card-stage header{padding-bottom:5px}.draft-card-stage header h2{font-size:22px;margin:3px 0;gap:12px}.draft-card-stage header p{font-size:10px}.draft-card-stage .draft-heading{position:absolute;right:15px;top:12px}.draft-card-stage .draft-heading .eyebrow{display:none}.draft-card-stage .draft-progress{font-size:10px}.draft-identity{font-size:10px;padding:4px 6px}.draft-card-stage .role-draft-clock{padding:5px 0;gap:12px}.draft-card-stage .role-draft-clock>small{font-size:10px}.draft-card-stage .draft-card-row{gap:8px;padding:5px 4px 8px}.draft-card-stage .draft-profession-card{flex-basis:calc((100% - 32px)/5);max-width:175px}.draft-card-stage .role-draft-portrait{height:clamp(65px,22svh,100px)}.draft-card-stage .role-draft-meta{padding:5px 3px;gap:2px}.draft-card-stage .role-draft-meta b{font-size:17px}.draft-card-stage .role-draft-meta em{font-size:10px}.draft-card-stage .draft-skill-names{gap:2px;margin-top:0}.draft-card-stage .draft-skill-names small{font-size:9px;padding:1px 3px}.draft-card-stage .role-draft-check{padding:3px;font-size:10px}.draft-card-number{font-size:9px;top:5px;left:5px}.draft-selected-detail{font-size:10px;line-height:1.35;max-height:46px;min-height:26px;padding:4px 2px}.draft-selected-detail>b{display:inline;font-size:11px;margin-right:7px}.draft-selected-detail>span{display:inline}.draft-selected-detail details{display:inline-block;margin:0 0 0 8px}.draft-selected-detail summary{min-height:18px}.draft-confirm-row{padding-top:5px}.draft-confirm-row .draft-confirm{min-height:48px;font-size:12px;min-width:150px}.draft-confirm-row>span{font-size:10px}.draft-card-stage .role-draft-wait{padding:18px;gap:8px}.draft-wait-stamp{width:60px;height:60px;font-size:17px}}
@media(prefers-reduced-motion:reduce){.draft-card-stage .draft-profession-card{transition:none}}

.hp-pending{display:block;font-size:10px;line-height:1.5;color:#c8b88e;letter-spacing:.04em}
/* Short portrait phones keep confirmation inside the paper panel. */
@media(orientation:portrait) and (max-width:600px) and (max-height:640px){
 .draft-card-stage{padding:11px 10px;max-height:calc(100svh - 24px)}
 .draft-card-stage header{padding-bottom:6px}
 .draft-card-stage .draft-heading{position:static;height:12px;justify-content:flex-end}
 .draft-card-stage .draft-heading .eyebrow{display:none}
 .draft-card-stage .draft-progress{font-size:10px}
 .draft-card-stage header h2{display:block;font-size:20px;line-height:1.15;margin:3px 0 5px;padding-right:0}
 .draft-card-stage .draft-identity{display:table;font-size:10px;padding:4px 6px;margin-top:6px;line-height:1.2}
 .draft-card-stage header p{font-size:10px;line-height:1.4}
 .draft-card-stage .role-draft-clock{padding:6px 0;gap:6px}
 .draft-card-stage .role-draft-clock>small{font-size:9px}
 .draft-card-stage .draft-card-row{height:210px;padding:7px 4px 13px;flex:0 0 210px}
 .draft-card-stage .draft-profession-card{height:190px;min-height:0}
 .draft-card-stage .role-draft-portrait{height:89px;flex:none}
 .draft-card-stage .role-draft-meta{min-height:0;padding:5px 3px;gap:2px}
 .draft-card-stage .role-draft-meta b{font-size:20px;line-height:1.1}
 .draft-card-stage .role-draft-meta em{font-size:10px;line-height:1.2}
 .draft-card-stage .draft-skill-names{gap:2px;margin-top:2px}
 .draft-card-stage .draft-skill-names small{font-size:9px;line-height:1.2;padding:1px 3px}
 .draft-card-stage .role-draft-check{font-size:10px;padding:4px;line-height:1.2}
 .draft-card-stage .draft-selected-detail{flex:1 1 42px;min-height:0;max-height:60px;padding:5px 2px;font-size:10px;line-height:1.35;overflow:auto}
 .draft-card-stage .draft-selected-detail>b{font-size:11px}
 .draft-card-stage .draft-selected-detail details{margin-top:2px}
 .draft-card-stage .draft-selected-detail summary{min-height:18px}
 .draft-card-stage .draft-confirm-row{flex:0 0 auto;padding-top:7px;gap:5px}
 .draft-card-stage .draft-confirm-row>span{font-size:10px}
 .draft-card-stage .draft-confirm{min-height:48px;min-width:157px;font-size:13px}
}