/* Recoil Ready player-only final polish. Admin is explicitly excluded, including its portals. */
body:has(.app-shell):not(:has(.admin-shell)),body:has(.app){--rr-accent:var(--player-accent,var(--fieldlog-accent,var(--accent)));--rr-text:var(--player-text,var(--foreground,var(--text)));--rr-line:var(--player-line,var(--border,var(--line)));--rr-card:var(--player-card,var(--card));}
/* Every UI rectangle stays square in all states. The circular colour tool is artwork/interaction, not a rectangular surface. */
body:has(.app-shell):not(:has(.admin-shell)) :where(*):not(svg):not(svg *),body:has(.app) :where(*):not(svg):not(svg *){border-radius:0!important;}
body:has(.app-shell):not(:has(.admin-shell)) :where(*)::before,body:has(.app-shell):not(:has(.admin-shell)) :where(*)::after,body:has(.app) :where(*)::before,body:has(.app) :where(*)::after{border-radius:0!important;}
body:has(.app-shell):not(:has(.admin-shell)) :is(.colour-disc,.colour-disc-knob,.accent-wheel,.accent-wheel-knob),body:has(.app) :is(.colour-disc,.colour-disc-knob,.accent-wheel,.accent-wheel-knob){border-radius:50%!important;}
/* Use the saved/preview appearance for legacy accent tokens as well as newer controls. Semantic danger colours remain distinct. */
body:has(.app-shell):not(:has(.admin-shell)),body:has(.app){--fl-ffaf6e:var(--rr-accent);--fl-ffd9b9:var(--rr-accent);--fl-ffb454:var(--rr-accent);--fl-ffb070:var(--rr-accent);--fl-ffad45:var(--rr-accent);--fl-ffb172:var(--rr-accent);--fl-ffb44e:var(--rr-accent);--fl-ffb14b:var(--rr-accent);--fl-ffbd67:var(--rr-accent);--fl-ffe5cf:var(--rr-text);--fl-ffc493:var(--rr-accent);--fl-ffbb65:var(--rr-accent);--fl-fff3ea:var(--rr-text);--fl-ffc99c:var(--rr-accent);--fl-fce6d4:var(--rr-text);--fl-ffc392:var(--rr-accent);--fl-ffba81:var(--rr-accent);--fl-ffc08d:var(--rr-accent);--fl-f2a15f:var(--rr-accent);--fl-fff2e7:var(--rr-text);--fl-ffc18f:var(--rr-accent);--fl-f4ac71:var(--rr-accent);--fl-fff6ee:var(--rr-text);--fl-ffc79a:var(--rr-accent);--fl-ffca9e:var(--rr-accent);--fl-ffc291:var(--rr-accent);--fl-ffd2ad:var(--rr-accent);--fl-ffd0a9:var(--rr-accent);--fl-f8bc8a:var(--rr-accent);--fl-ffd1ab:var(--rr-accent);--fl-ffe6d2:var(--rr-accent);--fl-f6bc8d:var(--rr-accent);--fl-ff9a32:var(--rr-accent);--fl-ffb15c:var(--rr-accent);--fl-ffc281:var(--rr-accent);--fl-fa8526:var(--rr-accent);--fl-ffc16a:var(--rr-accent);--fl-ff9b44:var(--rr-accent);--fl-ff962d:var(--rr-accent);--fl-ffb665:var(--rr-accent);--fl-ffa33e:var(--rr-accent);--fl-ffb865:var(--rr-accent);--fl-ffc078:var(--rr-accent);--fl-ffbd70:var(--rr-accent);--fl-e88b30:var(--rr-accent);}
:is(.app-shell,.app) :is(.calendar-intro,.calendar-shell,.g3-calendar,.calendar-selection,.calendar-planner,.calendar-day,.calendar-activity,.daily-plan){background:var(--player-card)!important;color:var(--player-text);border-color:var(--player-line)!important;}
:is(.app-shell,.app) :is(.calendar-intro .eyebrow,.calendar-intro span,.calendar-selection>span,.calendar-legend-plan,.calendar-day-status .day-planned,.calendar-day-markers .planned){color:var(--player-accent)!important;}
:is(.app-shell,.app) :is(.calendar-day.selected,.calendar-shell nav button.active,.calendar-day[aria-pressed=true]){background:color-mix(in srgb,var(--player-accent) 14%,var(--player-card))!important;border-color:var(--player-accent)!important;color:var(--player-text)!important;}
:is(.app-shell,.app) :is(.calendar-legend-report,.calendar-day-status .day-played,.calendar-day-markers .played){color:var(--player-text)!important;}
body:has(.app-shell):not(:has(.admin-shell)) :is(button,a,input,select,textarea,[tabindex]):focus-visible,body:has(.app) :is(button,a,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--rr-accent);outline-offset:3px;}
:is(.app-shell,.app) :is(.primary-button,.primary){background:var(--player-accent)!important;color:var(--primary-foreground,var(--accent-text,#171321))!important;}
:is(.app-shell,.app) :is(.primary-button,.primary):hover{background:var(--player-accent)!important;filter:brightness(1.06);}
:is(.app-shell,.app) :is(.chrono-picker,.chrono-gun-card,.config-group,.gun-detail-group,.optional-gun-slot){border-color:var(--player-line);}
:is(.app-shell,.app) :is(.config-option:has(input:checked),.compact-check:has(input:checked),.visual-kit-choice:has(input:checked)){background:color-mix(in srgb,var(--player-accent) 12%,var(--player-card));border-color:var(--player-accent);}
/* Both products shade flags with the actual selected appearance; the dark base keeps text readable. */
body:has(.app-shell):not(:has(.admin-shell)),body:has(.app){--player-flag-shade:color-mix(in srgb,var(--fieldlog-selected-accent,var(--rr-accent)) 20%,#04050c);}
:is(.app-shell,.app) :is(.safe-identity-copy,.g1-player-details){color:#f4f5f8;}
/* Keep the fade behind the character, while actual copy/actions and earned badges stay above him. */
:is(.app-shell,.app) :is(.g1-player-card.profile-banner,.safe-identity-banner){--rr-character-height:72%;--rr-badge-size:64px;}
:is(.app-shell,.app) :is(.g1-player-card.profile-banner,.safe-identity-banner)::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,var(--player-flag-shade) 0%,rgba(6,7,12,.76) 34%,transparent 68%);}
:is(.app-shell,.app) :is(.g1-player-card.profile-banner,.safe-identity-banner)>:is(.g1-player-details,.safe-identity-copy){position:relative;z-index:3;background:none!important;box-shadow:none;text-shadow:0 1px 4px #000;}
:is(.app-shell,.app) :is(.g1-player-card.profile-banner,.safe-identity-banner)>.identity-player-silhouette{z-index:2;right:0;bottom:0;width:auto!important;max-width:none;height:var(--rr-character-height)!important;max-height:var(--rr-character-height)!important;object-fit:contain;object-position:right bottom;transform:translateX(15%);pointer-events:none;}
/* Shrink-wrap the badge plate rather than reserving a broad empty panel. Both DOM shapes share these rules. */
:is(.app-shell,.app) .player-badges-position{z-index:4;display:flex;left:auto;right:10px;bottom:10px;width:max-content;max-width:calc(100% - 20px);}
:is(.app-shell,.app) .player-card-badges{width:max-content;max-width:100%;gap:4px;padding:4px;justify-content:flex-end;background:rgba(8,11,20,.5);}
:is(.app-shell,.app) .player-card-badges.player-badges-position{max-width:calc(100% - 20px);}
:is(.app-shell,.app) .player-weapon-badge{flex:0 0 var(--rr-badge-size);width:var(--rr-badge-size);max-width:var(--rr-badge-size);gap:1px;font-size:10px;line-height:1.15;}
:is(.app-shell,.app) .player-weapon-badge :is(img,svg){width:var(--rr-badge-size);height:var(--rr-badge-size);}
:is(.app-shell,.app) .player-weapon-badge small{font-size:9px;line-height:1.15;}
:is(.app-shell,.app) .player-card-badges.is-empty{width:1px;min-height:72px;padding:0;border:0;background:none;}
/* Count labels and actions do not position the artwork. The symmetric stack has its own centred frame. */
:is(.app-shell,.app) .magazine-art-stack{width:160px;max-width:100%;height:110px;flex:none;margin-inline:auto;justify-self:center;align-self:center;}
:is(.app-shell,.app) .magazine-art-stack>.attachment-art{object-fit:contain;object-position:center center;max-width:none;}
:is(.app-shell,.app) .magazine-choice{display:grid;grid-template-columns:160px minmax(0,1fr);align-items:center;gap:16px;min-width:0;padding:12px 0;}
:is(.app-shell,.app) .magazine-choice>.magazine-art-stack{width:160px;height:110px;grid-column:1;grid-row:1;}
:is(.app-shell,.app) .magazine-choice>button{grid-column:2;justify-self:start;}
:is(.app-shell,.app) :is(.quantity-row,.magazine-choice label){min-width:0;max-width:100%;}
:is(.app-shell,.app) :is(.quantity-row,.loadout-support .button-row,.step-actions,.dialog-actions,.configurator .button-row){display:flex;flex-wrap:wrap;align-items:center;gap:10px;}
:is(.app-shell,.app) :is(.quantity-row,.magazine-choice,.configurator,.step-actions,.dialog-actions) button{min-height:44px;min-width:44px;max-width:100%;height:auto;padding:10px 14px;white-space:normal;line-height:1.35;flex-shrink:0;}
:is(.app-shell,.app) .quantity-row>div{min-width:0;flex:1 1 160px;}
:is(.app-shell,.app) :is(.config-options,.gun-detail-group,.compact-supplies){min-width:0;max-width:100%;}
:is(.app-shell,.app) .config-option:has(input:disabled){opacity:.7;cursor:not-allowed;}
:is(.app-shell,.app) .config-option-copy{min-width:0;overflow-wrap:anywhere;}
body:has(.app-shell):not(:has(.admin-shell)) :is(input[type=date],input[type=datetime-local]),body:has(.app) :is(input[type=date],input[type=datetime-local]){min-width:0;width:100%;max-width:100%;min-height:44px;box-sizing:border-box;font:inherit;}
body:has(.app-shell):not(:has(.admin-shell)) input[type=date]::-webkit-date-and-time-value,body:has(.app) input[type=date]::-webkit-date-and-time-value{text-align:left;}
@media(max-width:600px){
 :is(.app-shell,.app) :is(.g1-player-details,.safe-identity-copy){width:60%!important;}
 :is(.app-shell,.app) .magazine-choice{grid-template-columns:minmax(0,1fr);gap:12px;}
 :is(.app-shell,.app) .magazine-choice>.magazine-art-stack{grid-column:1;grid-row:auto;}
 :is(.app-shell,.app) .magazine-choice>button{grid-column:1;justify-self:stretch;width:100%;}
 :is(.app-shell,.app) :is(.step-actions,.dialog-actions) button{flex:1 1 140px;}
 :is(.app-shell,.app) :is(.player-gun-grid,.chrono-gun-grid){grid-template-columns:minmax(0,1fr);}
 body:has(.app-shell):not(:has(.admin-shell)) .field-dialog,body:has(.app) .dialog{min-width:0;overscroll-behavior:contain;max-width:100%;}
}

/* Portal tutorial examples are deliberately read-only, independently scrollable and placed beside the coach on desktop. */
body:has(.app-shell):not(:has(.admin-shell)) .tutorial-example,body:has(.app) .tutorial-example{position:fixed;left:16px;top:max(16px,env(safe-area-inset-top));width:min(640px,calc(100vw - 416px));max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;box-sizing:border-box;z-index:1;padding:20px;background:var(--rr-card);color:var(--rr-text);border:2px solid var(--rr-accent);pointer-events:auto;font:400 16px/1.55 var(--player-font);}
body:has(.app-shell):not(:has(.admin-shell)) .tutorial-example-fields,body:has(.app) .tutorial-example-fields{border:0;padding:0;margin:0;min-width:0;}
body:has(.app-shell):not(:has(.admin-shell)) .tutorial-example-fields *,body:has(.app) .tutorial-example-fields *{opacity:1;pointer-events:none;}
body:has(.app-shell):not(:has(.admin-shell)) .tutorial-example .field,body:has(.app) .tutorial-example .field{display:grid;gap:8px;margin:12px 0;}
body:has(.app-shell):not(:has(.admin-shell)) .tour-coach,body:has(.app) .tour-coach{display:block;overflow-y:auto;overscroll-behavior:contain;box-sizing:border-box;background:var(--rr-card);color:var(--rr-text);font:400 16px/1.55 var(--player-font);border-color:var(--rr-accent);z-index:3;}
body:has(.app-shell):not(:has(.admin-shell)) .tour-spotlight,body:has(.app) .tour-spotlight{z-index:2;border-color:var(--rr-accent);box-shadow:0 0 0 4px var(--rr-card),0 0 0 7px var(--rr-accent);}
body:has(.app-shell):not(:has(.admin-shell)) .tour-controls,body:has(.app) .tour-controls{display:flex;flex-wrap:wrap;gap:10px;background:var(--rr-card);}
body:has(.app-shell):not(:has(.admin-shell)) .tour-controls>button,body:has(.app) .tour-controls>button{flex:1 1 100px;min-height:44px;white-space:normal;padding:10px;}
body:has(.app-shell):not(:has(.admin-shell)) .tour-task-details,body:has(.app) .tour-task-details{margin:12px 0;line-height:1.6;}
body:has(.app-shell):not(:has(.admin-shell)) .tour-task-details li,body:has(.app) .tour-task-details li{margin:8px 0;overflow-wrap:anywhere;}
body:has(.app-shell):not(:has(.admin-shell)) .tour-task-details summary,body:has(.app) .tour-task-details summary{min-height:44px;padding:10px 0;cursor:pointer;}
:is(.app-shell,.app) :is(.hero,.section-page,.panel,.calendar-planner,.kit-card-grid,.kit-item,.chrono-picker){min-width:0;max-width:100%;box-sizing:border-box;}
:is(.app-shell,.app) :is(.kit-item-actions,.kit-add-actions,.kit-actions,.button-row){align-items:center;}
:is(.app-shell,.app) :is(.kit-item-actions,.kit-add-actions,.kit-actions)>button{display:inline-flex;align-items:center;justify-content:center;gap:8px;}
:is(.app-shell,.app) :is(button,.dialog-close)>svg{flex-shrink:0;vertical-align:middle;}
:is(.app-shell,.app) .chrono-picker{padding:clamp(16px,3vw,28px);display:grid;gap:16px;}
:is(.app-shell,.app) .chrono-picker label{display:grid;gap:8px;min-width:0;}
:is(.app-shell,.app) .chrono-picker select{min-width:0;max-width:100%;min-height:44px;width:100%;}
@media(min-width:1024px){:is(.app-shell,.app) .chrono-gun-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:24px}:is(.app-shell,.app) .kit-card-grid{gap:24px}}
@media(max-width:720px){
 body:has(.app-shell):not(:has(.admin-shell)) .tutorial-example,body:has(.app) .tutorial-example{left:12px;right:12px;width:auto;top:max(12px,env(safe-area-inset-top));max-height:43dvh;padding:16px;}
 body:has(.app-shell):not(:has(.admin-shell)) .tour-coach,body:has(.app) .tour-coach{font-size:16px;line-height:1.55;padding:16px;}
 :is(.app-shell,.app) :is(.g1-player-card.profile-banner,.safe-identity-banner){--rr-character-height:76%;--rr-badge-size:clamp(32px,calc((100vw - 148px)/5),44px);}
 :is(.app-shell,.app) .player-weapon-badge{font-size:9px;}
 :is(.app-shell,.app) :is(.g1-player-card.profile-banner,.safe-identity-banner){min-height:460px!important;}
 :is(.app-shell,.app) :is(.g1-player-card.profile-banner,.safe-identity-banner) :is(.g1-player-details,.safe-identity-copy){min-height:460px!important;padding:16px 16px 104px!important;}
}

:is(.app-shell,.app) .tutorial-mini-screen{background:var(--player-card);border-color:var(--player-line);color:var(--player-text);}
:is(.app-shell,.app) .chrono-callout{background:color-mix(in srgb,var(--player-accent) 12%,var(--player-card))!important;border-color:var(--player-accent)!important;color:var(--player-text)!important;}