/* R176: editor controls use their own native art, never popup/area slices.
   Loaded after shared control styles; asset crop variables are shared with the
   original-art registry so the same edges remain continuous at every width. */
:is(.profile-sheet,#deck-dialog,#library-dialog,.cosmetics-picker){
 --editor-action-size:var(--control-action-ivory-size,100% 100%);
 --editor-action-position:var(--control-action-ivory-position,50% 50%);
 --editor-tab-size:var(--control-tab-dark-size,100% 100%);
 --editor-tab-position:var(--control-tab-dark-position,50% 50%);
}
:is(.profile-option,.profile-option-art,.profile-option-badge,.profile-preview-status,
 .profile-tab,.profile-change-button,.profile-small-button,.profile-name-edit,.profile-name-save,.profile-name-cancel,.profile-nickname-input,
 .deck-name-input,.deck-gear-slots select,.deck-hero-choice,.editor-tabs,.editor-tab,.editor-type,.editor-filter,
 .editor-unequip,.editor-empty-slot,.editor-copy-remove,.editor-delete-chip,.editor-card-controls,.editor-card-remaining,.editor-choose-hero,.editor-card-used,
 .cosmetics-control,.cosmetics-coin-flip,.cosmetics-filter,.cosmetics-option,.collection-toggle,.collection-bulk-open,.collection-lock,
 .collection-melt-group,.collection-melt-count,.collection-copy-count,.collection-tools input,.collection-filter select){
 border-image:none!important;text-shadow:none;
}

/* The original portrait/frame remains the only content in each square slot. */
.profile-sheet .profile-option{padding:4px 2px 6px;gap:5px;min-height:44px;background:none;border:0;box-shadow:none;color:var(--kit-quiet-ink,#706b63)}
.profile-sheet .profile-option-art{padding:6px;--control-kind:profile-slot;background:var(--control-profile-slot) var(--control-profile-slot-position,50% 50%)/var(--control-profile-slot-size,100% 100%) no-repeat;border:0;border-radius:0;box-sizing:border-box}
.profile-sheet .profile-option[aria-pressed=true]{background:none;box-shadow:none;color:var(--kit-ink,#292724)}
.profile-sheet .profile-option[aria-pressed=true] .profile-option-name{font-weight:800}
.profile-sheet .profile-option[data-locked=true] .profile-option-art{opacity:.6;filter:saturate(.6)}
.profile-sheet .profile-preview-status{display:grid;place-items:center;min-width:72px;min-height:25px;padding:3px 12px;border:0;border-radius:0;--control-kind:equipped-label;background:var(--control-equipped-label) var(--control-equipped-label-position,50% 50%)/var(--control-equipped-label-size,100% 100%) no-repeat;color:var(--kit-ink,#292724);line-height:1.2}
.profile-sheet .profile-preview-status[data-locked=true]{color:var(--kit-quiet-ink,#706b63);opacity:.7}
.profile-sheet .profile-option-badge{top:4px;right:3px;width:24px;height:24px;border:0;background:rgba(0,0,0,.8);color:#eddb9d;box-shadow:none}
.profile-sheet .profile-option-badge.profile-equipped{width:34px;height:22px;border-radius:0;--control-kind:equipped-label;background:var(--control-equipped-label) var(--control-equipped-label-position,50% 50%)/var(--control-equipped-label-size,100% 100%) no-repeat;color:#4f4023}
.profile-sheet .profile-tabs{gap:6px;padding-bottom:4px;background:none}
:is(.profile-sheet .profile-tab,#deck-dialog .editor-tab,#deck-dialog .editor-type,#deck-dialog .deck-hero-choice,.cosmetics-picker .cosmetics-filter){
 display:grid;place-items:center;min-width:44px;min-height:44px;padding:5px 10px;border:0;border-radius:0;--control-kind:tab-dark;background:var(--control-tab-dark) var(--editor-tab-position,50% 50%)/var(--editor-tab-size,100% 100%) no-repeat;color:var(--kit-on-dark,#faf5e8);box-shadow:none;line-height:1.25;touch-action:manipulation;
}
:is(.profile-sheet .profile-tab[aria-selected=true],#deck-dialog .editor-tab[aria-pressed=true],#deck-dialog .editor-type[aria-pressed=true],#deck-dialog .deck-hero-choice[aria-pressed=true],.cosmetics-picker .cosmetics-filter[aria-pressed=true]){
 --control-kind:tab-ivory;background-image:var(--control-tab-ivory);background-position:var(--control-tab-ivory-position);background-size:var(--control-tab-ivory-size);color:var(--kit-ink,#292724);font-weight:750;
}
:is(.profile-sheet .profile-name-edit,.profile-sheet .profile-name-save,.profile-sheet .profile-name-cancel,
 #deck-dialog .saved-deck-choose,.cosmetics-control,.cosmetics-coin-flip,.collection-bulk-open,.collection-lock){
 min-width:44px;min-height:44px;border:0;border-radius:0;--control-kind:action-ivory;background:var(--control-action-ivory) var(--editor-action-position,50% 50%)/var(--editor-action-size,100% 100%) no-repeat;box-shadow:none;color:var(--kit-ink,#292724);padding:7px 12px;line-height:1.25;touch-action:manipulation;
}
.profile-sheet .profile-name-cancel{--control-kind:action-dark;background:var(--control-action-dark) var(--control-action-dark-position)/var(--control-action-dark-size) no-repeat;color:var(--kit-on-dark,#faf5e8)}
.profile-sheet .profile-name-form{grid-template-columns:minmax(0,1fr) 48px 48px;gap:4px}
.profile-sheet :is(.profile-change-button,.profile-small-button){width:44px;height:44px;min-height:44px;border:0;border-radius:0;--control-kind:action-ivory;background:var(--control-action-ivory) var(--editor-action-position,50% 50%)/var(--editor-action-size,100% 100%) no-repeat;box-shadow:none}
:is(.profile-sheet .profile-nickname-input,#deck-dialog .deck-name-input,#deck-dialog .deck-gear-slots select,#library-dialog .collection-tools input,#library-dialog .collection-filter select){
 min-height:44px;height:44px;margin-top:0;border:0;border-bottom:1px solid #ac915775;border-radius:5px;background:rgba(0,0,0,.08);padding:9px 10px;color:var(--kit-ink,#292724);box-shadow:none;font-size:16px;
}
:is(.profile-sheet .profile-nickname-input,#deck-dialog .deck-name-input,#library-dialog .collection-tools input)::placeholder{color:var(--kit-quiet-ink,#706b63);opacity:.8}

/* Controls stay inside the fixed overview; the catalogue gives up height. */
#deck-dialog .editor-tabs{padding:0;border:0;background:none;box-shadow:none;gap:6px}
#deck-dialog .editor-types{margin-top:3px;gap:6px}
#deck-dialog .editor-fixed>.editor-filters{min-height:44px;gap:8px;padding:0}
#deck-dialog .editor-fixed .editor-filter-group{gap:8px}
#deck-dialog .editor-fixed .editor-filter-group>.editor-filter{position:relative;min-width:44px;min-height:44px;padding:0 3px;border:0;border-radius:0;background:none;box-shadow:none;color:var(--kit-on-dark,#faf5e8);font-size:11px;text-shadow:0 1px 3px #000}
#deck-dialog .editor-fixed .editor-filter-group>.editor-filter::before{width:15px;height:15px;flex:none;background:rgba(0,0,0,.7);border:1px solid #d3bd85;border-radius:3px}
#deck-dialog .editor-fixed .editor-filter-group>.editor-filter[aria-pressed=true]::before{background-color:#d6bd80;background-image:none;border-color:#f1dbaa}
#deck-dialog .editor-fixed .editor-filters>.editor-delete-chip{min-width:64px;min-height:44px;padding:0 9px;border:0;border-radius:0;--control-kind:action-dark;background:var(--control-action-dark) var(--control-action-dark-position,50% 50%)/var(--control-action-dark-size,100% 100%) no-repeat;color:#ffd4c0;box-shadow:none;text-shadow:none}
#deck-dialog .editor-fixed .editor-filters>.editor-delete-chip::before{content:none;display:none}
#deck-dialog :is(.editor-unequip,.editor-copy-remove){display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;top:-10px;right:-10px;border:0;border-radius:0;--control-kind:action-dark;background:var(--control-action-dark) var(--control-action-dark-position,50% 50%)/var(--control-action-dark-size,100% 100%) no-repeat;color:#f8ecce;box-shadow:none;line-height:1}
#deck-dialog :is(.editor-unequip,.editor-copy-remove)>.button-icon{width:13px;height:13px;margin:0}
#deck-dialog .editor-empty-slot{min-width:44px;min-height:44px;border:0;border-radius:5px;background:rgba(0,0,0,.35);color:#f8ecce;box-shadow:inset 0 0 0 1px #c6ad7170}
#deck-dialog .editor-card-remaining{padding:3px 5px;border:0;border-radius:4px;background:rgba(0,0,0,.82);color:#f8edce;box-shadow:none}
#deck-dialog .editor-card-controls{position:relative;grid-template-columns:repeat(2,minmax(44px,1fr));gap:2px;height:44px;min-height:44px;margin-top:25px;padding:0;overflow:visible;border:0;border-radius:0;background:none;box-shadow:none}
#deck-dialog #deck-body .editor-card-controls .quantity-button{display:grid;place-items:center;justify-self:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:0;border-radius:0;--control-kind:glyph-ivory;background:var(--control-glyph-ivory) center/var(--control-glyph-ivory-size) no-repeat;color:var(--kit-ink,#292724);box-shadow:none}
#deck-dialog .editor-card .editor-card-controls .editor-card-used{position:absolute;bottom:calc(100% + 2px);left:50%;transform:translateX(-50%);display:grid;place-items:center;width:auto;min-width:26px;min-height:23px;padding:2px 6px;border:0;border-radius:4px;background:rgba(0,0,0,.82);color:#faf0d6;box-shadow:none;font:750 13px/1 var(--font-ui);pointer-events:none}
#deck-dialog .editor-card-selected .editor-card-controls .editor-card-used{color:#ffe2a2;font-weight:850}
#deck-dialog .editor-card-controls:has(>.editor-choose-hero){margin-top:4px}
#deck-dialog .editor-card-controls>.editor-choose-hero{height:44px;min-height:44px;width:100%;padding:5px 6px;border:0;border-radius:0;--control-kind:tab-dark;background:var(--control-tab-dark) var(--editor-tab-position,50% 50%)/var(--editor-tab-size,100% 100%) no-repeat;color:var(--kit-on-dark,#faf5e8);line-height:1.25;font-size:11px}
#deck-dialog .editor-card-controls>.editor-choose-hero[aria-pressed=true]{--control-kind:tab-ivory;background-image:var(--control-tab-ivory);background-position:var(--control-tab-ivory-position);background-size:var(--control-tab-ivory-size);color:var(--kit-ink,#292724)}
#deck-dialog .editor-card-controls>.editor-choose-hero[aria-pressed=true]:disabled{opacity:1}
#deck-dialog #deck-body[data-mode=zone]>.deck-sheet-header .zone-card-count{border:0;border-radius:4px;background:rgba(0,0,0,.08);box-shadow:none}
.deck-delete-confirm .deck-delete-confirm-action.primary-action{--control-kind:action-dark;background:var(--control-action-dark) var(--control-action-dark-position)/var(--control-action-dark-size) no-repeat;border:0;border-image:none;box-shadow:none;border-radius:0;color:#ffd4c0}

/* Cosmetics use their actual art, with no second textured rectangle behind it. */
.cosmetics-editor-controls{gap:5px;margin-bottom:4px}
.cosmetics-control{min-height:44px;padding:5px 7px;gap:5px}
.cosmetics-picker :is(.cosmetics-picker-back,.cosmetics-picker-close){width:44px;height:44px;min-height:44px;background:none;border:0;box-shadow:none}
.cosmetics-picker .cosmetics-option{min-height:44px;padding:4px;border:0;background:none;box-shadow:none;color:var(--kit-quiet-ink,#706b63)}
.cosmetics-picker .cosmetics-option[aria-pressed=true]{background:none;box-shadow:none;color:var(--kit-ink,#292724)}
.cosmetics-picker .cosmetics-option[aria-pressed=true] .cosmetics-option-name{font-weight:800}
.cosmetics-picker .cosmetics-option[aria-pressed=true] .cosmetics-option-art{box-shadow:0 0 0 2px #c4a662}
.cosmetics-picker .cosmetics-filter{flex:1;min-width:44px;max-width:110px;padding-inline:7px;font-size:11px}
.cosmetics-picker .cosmetics-picker-filters{gap:5px;padding-block:4px}
.cosmetics-picker .cosmetics-coin-flip{min-height:44px}

/* Filter fields and passive counts are quiet; no area frame is a button. */
#library-dialog :is(.collection-toggle,.collection-reset,.collection-bulk-open,.collection-lock,.collection-back){min-height:44px;min-width:44px}
#library-dialog :is(.collection-toggle,.collection-lock){padding:6px 11px;border:0;border-radius:0;--control-kind:tab-dark;background:var(--control-tab-dark) var(--editor-tab-position,50% 50%)/var(--editor-tab-size,100% 100%) no-repeat;box-shadow:none;color:var(--kit-on-dark,#faf5e8);line-height:1.2}
#library-dialog :is(.collection-toggle,.collection-lock)[aria-pressed=true]{--control-kind:tab-ivory;background-image:var(--control-tab-ivory);background-position:var(--control-tab-ivory-position);background-size:var(--control-tab-ivory-size);color:var(--kit-ink,#292724);font-weight:750;box-shadow:none}
#library-dialog .collection-filter select{font-size:14px;padding-right:24px}
#library-dialog .collection-filters summary{min-height:44px;padding-block:12px}
#library-dialog .collection-melt-group{border:0;border-bottom:1px solid #9a82482d;border-radius:0;background:none;box-shadow:none}
#library-dialog :is(.collection-melt-count,.collection-copy-count){border:0;border-radius:4px;background:rgba(0,0,0,.08);padding:4px 7px;box-shadow:none;color:var(--kit-ink,#292724)}
#library-dialog .collection-footer .collection-melt-total{border-image:none!important;border:0;border-radius:0;background:none;box-shadow:none}
#library-dialog .collection-rarity-toggles .collection-toggle[data-rarity=SR]{color:#d6b4f2}
#library-dialog .collection-rarity-toggles .collection-toggle[data-rarity=SR][aria-pressed=true]{color:#72439b}
#library-dialog .collection-rarity-toggles .collection-toggle[data-rarity=UR]{color:#edcf8a}
#library-dialog .collection-rarity-toggles .collection-toggle[data-rarity=UR][aria-pressed=true]{color:#8b6413}

@media(max-width:569px){#deck-dialog .editor-scroll{padding-inline:12px}#deck-dialog .editor-card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 4px}}
@media(min-width:570px){#deck-dialog .editor-card-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 8px}}
@media(max-height:640px){
 #deck-dialog .editor-fixed{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:6px;row-gap:0;padding-top:5px}
 #deck-dialog .editor-fixed>*{grid-column:1/-1;min-width:0}
 #deck-dialog .editor-fixed>.deck-name-input{grid-row:1;grid-column:1;font-size:13px;padding-inline:7px}
 #deck-dialog .editor-fixed>.cosmetics-editor-controls{grid-row:1;grid-column:2;gap:2px;margin:0;grid-template-columns:repeat(3,minmax(44px,1fr))}
 #deck-dialog .editor-fixed .cosmetics-control{width:100%;padding:0;gap:0}
 #deck-dialog .editor-fixed .cosmetics-control>span:not(.cosmetics-control-thumb){display:none}
 #deck-dialog .editor-fixed>.editor-tabs{grid-row:4;grid-column:1}
 #deck-dialog .editor-fixed>.editor-types{grid-row:4;grid-column:2;margin-top:0}
 #deck-dialog .editor-fixed:not(:has(>.editor-types))>.editor-tabs{grid-column:1/-1}
 #deck-dialog .editor-fixed :is(.editor-tabs,.editor-types){gap:2px}
 #deck-dialog .editor-fixed :is(.editor-tab,.editor-type){padding-inline:2px;font-size:11px}
 #deck-dialog .editor-fixed>.editor-filters{grid-row:5}

 #deck-dialog .editor-loadout{min-height:74px;padding-top:4px;gap:19px}
 #deck-dialog .editor-loadout-slot{width:38px}
 #deck-dialog .editor-loadout-slot.editor-leader{width:44px}
 #deck-dialog .editor-copy-strip{height:86px}
 #deck-dialog .editor-fixed>.deck-status{padding-bottom:4px}
 .cosmetics-control{min-height:44px}
 .profile-sheet .profile-preview{min-height:112px;padding-block:7px}
}
#deck-dialog .editor-fixed.has-cosmetics .deck-name-input{background:#fff9edf2;color:#30291e;caret-color:#30291e}
#deck-body[data-mode=list] .deck-slot-count{color:var(--kit-quiet-ink)}
#deck-body[data-mode=list] .deck-slot-count b{color:var(--kit-ink)}
.profile-sheet .profile-option,.profile-sheet .profile-option[aria-pressed=true],.cosmetics-picker .cosmetics-option,.cosmetics-picker .cosmetics-option[aria-pressed=true]{--control-kind:none}
/* Short actions and square glyph controls use the compact button master. */
:is(.profile-sheet .profile-change-button,.profile-sheet .profile-small-button,
 .profile-sheet .profile-name-edit,.profile-sheet .profile-name-save,
 #deck-dialog .quantity-button,#deck-dialog .cosmetics-control,
 #library-dialog .collection-bulk-open,#library-dialog .collection-lock,
 .tutorial-selection-launch){--control-kind:glyph-ivory;background:var(--control-glyph-ivory) center/var(--control-glyph-ivory-size) no-repeat;color:#342c20}
:is(.profile-sheet .profile-name-cancel,#deck-dialog .editor-copy-remove,#deck-dialog .editor-unequip,
 #deck-dialog .editor-delete-chip){--control-kind:glyph-dark;background:var(--control-glyph-dark) center/var(--control-glyph-dark-size) no-repeat;color:#f8ecd2}
#deck-dialog .editor-delete-chip{color:#ffd4c0}
/* Keep a 44px target, but only a 24px art face at the thumbnail corner. */
#deck-dialog .editor-copy-remove{top:-22px;right:-10px}
#deck-dialog .editor-unequip{top:-18px;right:-10px}
#deck-dialog :is(.editor-copy-remove,.editor-unequip)>.control-art-layer{inset:10px!important;width:calc(100% - 20px);height:calc(100% - 20px)}