/* Additional approved v0.21 UI. Never changes member colors or game data. */
:root{--bg:#F5F8FD;--paper:#FFFFFF;--subtle:#EAF2FF;--line:#D8E4F2;--text:#223149;--muted:#53657F;--primary:#1D56B3;--blue:#1D56B3;--deep:#183E7D;--light:#EAF2FF;--red:#D92D20;--green:#167347;--warn:#9A570C;--radius:12px;--form-line:#8095B0;color-scheme:light}
body{font-size:16px;background:var(--bg);color:var(--text)}
h3,.btn,.btn.compact,.tabs button,.segmented button,.notice,.pagehead p,.chat-contact{font-size:16px}
small,.sub,.subtle,.muted,.footnote,.tag,.field small,.notice small,.pagehead small,.chat-message>small,.channel small,.v021-paper-review p,.v021-paper-social{font-size:14px}
input,select,textarea{font-size:16px;border-color:var(--form-line);color:var(--text);min-height:44px;max-width:100%}
.panel,.stat,.hero{border-radius:12px}dialog{border-radius:16px;background:var(--paper);color:var(--text)}
.notice.neutral,.concept-summary,.v021-paper-review,.w1-member-condition,.cash-confirm{background:var(--bg);border-color:var(--line);color:var(--text)}
.btn.secondary,.btn.ghost{color:var(--deep)}.btn.secondary{border-color:var(--form-line)}
.btn,.btn.compact,button,summary{min-height:44px}.btn{overflow-wrap:anywhere}
.btn:not(.secondary):not(.ghost):not(.danger):not(:disabled):hover{background:var(--deep)}
.nav-badge,.chat-count,.contact-badge,.v021-desk-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 5px;border-radius:999px;background:#D92D20!important;color:#fff!important;font-size:14px!important;font-weight:700;line-height:1;flex-shrink:0}
.tabs button{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:normal}.tabs .nav-badge{position:static}
.positive{color:var(--green)}.negative,.btn.danger{color:var(--red)}
.v021-calendar-day.is-today{background:var(--light);border-color:var(--primary)}.v021-calendar-day.is-selected{outline-color:var(--primary)}
.v021-calendar .purple{color:#183E7D}.v021-calendar .teal{color:#186773}.v021-calendar .orange{color:#9A570C}
.v021-calendar-toolbar{flex-wrap:wrap}.v021-calendar-toolbar h2{flex:1;text-align:center}
.v021-cal-dots{display:flex;gap:3px;min-height:5px}.v021-cal-dot{width:5px;height:5px;border-radius:50%;background:currentColor}
@media(max-width:767px){.main{padding-left:16px;padding-right:16px}.panel{padding:16px}.content{min-width:0}.topbar{flex-wrap:wrap}.statusline{flex-wrap:wrap}.pagehead,.split{flex-wrap:wrap}.pagehead .actions{width:100%}.tabs{flex-wrap:wrap}.tabs button{flex:1 1 auto}.recruit-stage-counts{grid-template-columns:repeat(3,minmax(0,1fr))}.channelgrid{grid-template-columns:1fr 1fr}.global-daybar .btn{font-size:14px}.chat-layout{min-width:0}.v021-calendar.panel{padding:4px}.v021-calendar-day{min-height:60px}.v021-calendar-toolbar .btn{font-size:14px;min-width:44px}.v021-calendar-toolbar{gap:4px}.v021-calendar-toolbar h2{font-size:16px}.v021-calendar-weekday{font-size:14px}.schedule-row{align-items:flex-start;flex-wrap:wrap}.schedule-row>div{min-width:0;overflow-wrap:anywhere}.stepper,.stage-labels{min-width:0}}
@media(max-width:359px){.channelgrid{grid-template-columns:1fr}.global-daybar .daybar-actions{gap:4px}.global-daybar .btn{padding:8px}.v021-calendar-toolbar .btn{padding:7px 4px}}
.recruit-launch{justify-content:flex-end}
.candidate-action-modal #dialog-form{display:flex;flex-direction:column;min-height:0;overflow:hidden;max-height:calc(90dvh - 70px)}
.candidate-action-modal .modalbody{overflow:auto;min-height:0;flex:1;padding-bottom:20px;scroll-padding-bottom:24px}
.candidate-action-modal .candidate-fixed-actions{position:relative;flex-shrink:0;background:var(--paper);padding:12px 20px max(12px,env(safe-area-inset-bottom));border-top:1px solid var(--line);z-index:1}
.candidate-fixed-actions .candidate-actions{display:flex;gap:12px;margin:0;flex-wrap:wrap;width:100%}.candidate-fixed-actions .candidate-actions>.btn{flex:1 1 0}
@media(max-width:599px){.candidate-action-modal{max-height:calc(100dvh - 24px - env(safe-area-inset-top));margin:auto}.candidate-action-modal #dialog-form{max-height:calc(100dvh - 110px - env(safe-area-inset-top))}.candidate-action-modal .candidate-fixed-actions{padding-left:16px;padding-right:16px}}
@media(max-width:359px){.candidate-fixed-actions .candidate-actions{flex-direction:column}.candidate-fixed-actions .candidate-actions>.btn{flex-basis:auto}}
[hidden]{display:none!important}
.w1-member-main .person-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.w1-member-main .person-tabs button{font-size:14px}
.person-tabs [aria-selected=true]{background:var(--light);color:var(--deep);border-bottom:3px solid var(--primary)}
.member-position,.contract-state{padding:16px 0;border-bottom:1px solid var(--line);margin:12px 0}.member-position .btn{margin-left:12px}
.v021-sns-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px}
.v021-sns-grid>div{min-width:0;padding:10px 6px;background:var(--bg);border:1px solid var(--line);border-radius:12px}
.v021-sns-grid small{font-size:14px}.v021-sns-grid strong{display:block;font-size:clamp(14px,3.5vw,20px);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.contract-pay-summary{grid-template-columns:repeat(2,minmax(0,1fr));margin:14px 0}.contract-pay-summary>div{min-width:0}.contract-pay-summary strong{overflow-wrap:anywhere}
.v021-member-contract .notice{margin:12px 0}.v021-member-contract h4{font-size:16px;margin:0 0 8px}
.v021-member-detail .w1-member-condition{margin-top:0;padding:16px;border:1px solid var(--line);border-radius:12px}
.w1-member-main .ability{background:var(--bg)}.w1-member-main .ability small{font-size:14px}
@media(min-width:900px){.v021-member-photo .w1-portrait.is-large{width:280px}.v021-member-identity.w1-member-identity{max-width:none}}
.chat-message .chat-bubble{font-size:16px;background:#fff;color:var(--text);border:1px solid var(--line);white-space:pre-wrap;overflow-wrap:anywhere}
.chat-message.outgoing .chat-bubble{background:#EAF2FF;color:#223149;border-color:#D8E4F2}
.chat-message.incoming{align-self:flex-start;margin-right:auto;margin-left:42px;position:relative}.chat-message.outgoing{align-self:flex-end;margin-left:auto;margin-right:0;max-width:86%}
.chat-message.system{max-width:100%;color:var(--muted)}
.chat-avatar{display:inline-flex;flex-shrink:0;width:48px;height:48px;min-width:48px;align-items:center;justify-content:center;overflow:hidden;border-radius:50%;background:var(--light)}
.chat-avatar .member-avatar.w1-portrait{width:100%;height:100%;min-width:0;border-radius:50%;border:0;display:block}.chat-avatar .w1-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 24%}
.chat-avatar.face-head{width:40px;height:40px;min-width:40px}.chat-avatar.face-bubble{position:absolute;width:32px;height:32px;min-width:32px;left:-42px;top:24px}
.chat-contact{display:flex;align-items:flex-start;gap:12px;min-width:0}.chat-contact>span:nth-child(2){flex:1;min-width:0;overflow-wrap:anywhere}.chat-contact>span:nth-child(2)>small{white-space:normal;overflow-wrap:anywhere;font-size:14px}
.chat-contact.selected{background:var(--light);border-color:var(--primary)}.conversation-badges{display:flex;flex-direction:column;gap:6px;align-items:center;flex:0 0 auto}
.chat-room-head{display:flex;align-items:center;gap:10px;min-width:0;background:var(--paper)}.chat-room-head>div{min-width:0;overflow-wrap:anywhere}.chat-room-head small{display:block;font-size:14px}
.chat-messages{min-width:0;overflow:auto;overscroll-behavior:contain}.chat-replies{background:var(--paper);padding-bottom:max(16px,env(safe-area-inset-bottom))}.chat-replies .actions{flex-wrap:wrap}.chat-replies .btn{max-width:100%;white-space:normal}
.mail-body,.mail-message{color:var(--text);overflow-wrap:anywhere}.production-terms,.mail-meta{font-size:14px}
@media(max-width:767px){.chat-layout{grid-template-columns:1fr}.chat-layout.has-thread .chat-inbox{display:none}.chat-layout:not(.has-thread) .chat-room{display:none}.chat-contact{padding:14px 10px}.chat-messages{max-height:50dvh;padding:12px}.chat-room-head{padding:12px;flex-wrap:wrap}.chat-replies .btn{width:100%}.chat-message{max-width:calc(100% - 42px)}.production-terms{grid-template-columns:90px minmax(0,1fr)}}
.chat-contact small,.chat-room-head small,.chat-message>small,.chat-reply>small{color:var(--muted)}
.v021-member-detail small,.w1-member-condition p,.w1-member-main .metrics small,.v021-member-detail .member-color-label,.modalbody .field>span,.cash-confirm>div{font-size:14px}
.v021-calendar-day{border-color:var(--form-line)}.v021-calendar-legend{font-size:14px}.v021-calendar-weekday.sunday{color:var(--red)}
/* Real-browser QA: keep full date touch width at 360px without horizontal scroll. */
@media(max-width:374px){.v021-calendar.panel{padding:0}.v021-calendar-grid{gap:0}.v021-calendar-toolbar,.v021-calendar>.actions,.v021-calendar>p,.v021-calendar-legend{margin-left:4px;margin-right:4px}.v021-calendar-day{border-radius:4px}}
.candidate-fixed-actions .candidate-actions{align-items:stretch}.candidate-fixed-actions [data-action="selection"]{flex-direction:column;gap:2px}.candidate-fixed-actions [data-action="selection"] small{white-space:nowrap;font-size:14px}
/* Keep the actual member scrolling element aligned with the per-tab memory. */
.w1-member-modal #dialog-form{display:flex;flex-direction:column;min-height:0;overflow:hidden;max-height:calc(92dvh - 82px)}
.w1-member-modal .modalbody{overflow-y:auto;min-height:0;flex:1;overscroll-behavior:contain}
@media(max-width:599px){.w1-member-modal #dialog-form{max-height:calc(100dvh - 110px - env(safe-area-inset-top))}}
.w3-stat-grid>div{background:var(--bg)}
