.board{--modifier-frame-item:1.05px;--modifier-frame-lining:.7px}
/* Shared Character/Morok/Pet layout. All dimensions include the frame. K = 1.4. */
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene{overflow:auto!important;min-width:0;align-items:center!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene .board.manikin_human{width:400px!important;min-width:400px!important;max-width:none!important;height:528px!important;display:block!important;position:relative!important;transform:none!important;zoom:1!important;margin:12px auto 12px!important;filter:none!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene .combat-summary{margin-bottom:16px!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__left,
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__right,
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot-group{position:static!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;transform:none!important;background:none!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__center{position:absolute!important;left:calc(50% - 81.1764706px)!important;top:20px!important;width:162.3529412px!important;height:450px!important;margin:0!important;padding:0!important;transform:none!important;zoom:1!important;z-index:2}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__center .manikin{position:static!important;width:auto!important;height:450px!important;max-width:none!important;max-height:none!important;transform:none!important;zoom:1!important;margin:0!important;object-fit:contain!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .leaders,
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot:after,
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot-group:after{display:none!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot[data-slot]{box-sizing:border-box!important;left:var(--slot-x)!important;top:var(--slot-y)!important;right:auto!important;bottom:auto!important;width:var(--slot-w)!important;height:var(--slot-h)!important;padding:4px!important;margin:0!important;transform:none!important;border:3px solid transparent!important;border-image:linear-gradient(135deg,#fff0af 0%,#a66625 18%,#4f2b10 36%,#efc977 49%,#7d421b 67%,#ffda89 85%,#75421a 100%) 1!important;border-image-width:var(--modifier-frame-item)!important;background:transparent!important;backdrop-filter:none!important;opacity:1!important;mix-blend-mode:normal!important;box-shadow:none!important;transition:box-shadow .15s!important;filter:none!important;z-index:3}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot[data-slot]:before{display:none!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot[data-slot]:hover,
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot[data-slot]:focus-within{transform:none!important;filter:none!important;box-shadow:none!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .slot-main-hit{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:transparent;z-index:5;cursor:pointer;color:transparent}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .slot-main-hit:focus-visible{outline:2px solid #fff0b2;outline-offset:2px}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot[data-slot] > img{inset:3px!important;width:calc(100% - 6px)!important;height:calc(100% - 6px)!important;object-fit:contain!important;pointer-events:none;opacity:1!important;mix-blend-mode:normal!important;background:transparent!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot[data-slot] > .lining{box-sizing:border-box!important;left:auto!important;top:auto!important;right:0!important;bottom:0!important;width:var(--lining-w)!important;height:var(--lining-h)!important;transform:none!important;outline:0!important;border:2px solid transparent!important;border-image:linear-gradient(135deg,#ffe2a0,#875024 35%,#dcb56e 65%,#835025) 1!important;border-image-width:var(--modifier-frame-lining)!important;background:transparent!important;backdrop-filter:none!important;opacity:1!important;mix-blend-mode:normal!important;box-shadow:none!important;z-index:8!important;color:#ead29b!important;font:11px Georgia,serif!important;cursor:pointer}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot[data-slot] > .lining:focus-visible{outline:2px solid #fff0b2!important;outline-offset:1px!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .bottom{top:494px!important;bottom:auto!important;height:27px!important;left:50%!important;transform:translateX(-50%)!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .vital{top:30px!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .vital-mana{left:6px!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .vital-life{right:6px!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .slot-tooltip{display:none!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot:not(.filled):hover > .slot-tooltip{display:block!important}
@media(max-width:700px){body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene{display:block!important;overflow-x:auto!important;max-width:100%!important}body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene .board.manikin_human{margin:16px 0!important}body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene .build-share{max-width:calc(100vw - 32px)!important}}

/* Mobile: fit the complete 400px composition once, reserving scaled space. */
.mobile-scene-viewport,.mobile-scene-frame{display:contents}
.mobile-scene-zoom{display:none}
@media(max-width:700px){
 body .app,body .app>.panel{box-sizing:border-box!important;min-width:0!important;max-width:100%!important}
 body .app>.panel{width:100%!important}
 body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene{display:flex!important;flex-direction:column!important;overflow:visible!important}
 body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .mobile-scene-zoom{display:block;align-self:center;margin:6px 0 10px;padding:8px 15px;min-height:36px;border:1px solid #b58d4e;color:#efd29a;background:#171810;cursor:pointer}
 body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .mobile-scene-viewport{display:block;box-sizing:border-box;width:100%;min-width:0;max-width:100%;overflow-x:auto;overflow-y:hidden;flex:none;padding:4px;}
 body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .mobile-scene-frame{display:block;position:relative;width:var(--mobile-scene-width);height:var(--mobile-scene-height);margin:0 auto;}
 body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene .board.manikin_human{position:absolute!important;left:0!important;top:0!important;margin:0!important;transform:scale(var(--mobile-scene-scale))!important;transform-origin:0 0!important;}
 body #coreStats .game-stat:has(.allocation-values){grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important;margin-bottom:5px}
 body #coreStats .game-stat:has(.allocation-values)>span:first-child{grid-column:1/-1}
 body #coreStats .game-stat:not(:has(.allocation-values)){grid-template-columns:minmax(0,1fr) minmax(0,7ch) minmax(0,7ch)!important}
 body #coreStats .game-stat .sum,body #coreStats .game-stat__negative{white-space:normal!important;overflow-wrap:anywhere}
 body .points-cell{flex-wrap:wrap;gap:4px}
 body .scene .build-share{box-sizing:border-box!important;width:calc(100% - 20px)!important;max-width:calc(100% - 20px)!important;min-width:0!important}
 body .build-share__load>div{min-width:0}
 body .build-share__load input{min-width:0!important;width:100%!important}
 body .build-share__save,body .build-share__result{flex-wrap:wrap}
}

/* Reserve the whole armor indicator, including its surrounding numbers. */
@media(max-width:700px){
 body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene .combat-summary{width:calc(100% - 112px)!important;max-width:none!important;margin-left:8px!important;margin-right:auto!important;align-self:flex-start!important}
 body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .scene .combat-summary__damage{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Kind-only labels, centered without changing the mini-slot geometry. */
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot > .lining{display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important;text-align:center!important;font-size:11px!important;font-weight:600!important;text-shadow:0 1px 1px #000!important}
body:is([data-mode="character"],[data-mode="morok"],[data-mode="pet"]) .board .manikin__slot > .lining.lining-magic{color:#fff4d3!important;font-size:10px!important;border-image:linear-gradient(135deg,#fff6d5,#b39861 35%,#f5e6b7 65%,#a68b58) 1!important;border-image-width:var(--modifier-frame-lining)!important;box-shadow:none!important;text-shadow:0 1px 1px #000!important}

/* Morok used to hide earrings/shoulders and force a desktop grid on phones. */
body[data-mode="morok"] .board.manikin_human .manikin__slot[data-slot]:not([hidden]){display:block!important}
body[data-mode="morok"] .board.manikin_human .manikin__slot[data-slot][hidden],body[data-mode="morok"] .board.manikin_human .manikin__slot > .lining{display:none!important}
@media(max-width:700px){body[data-mode="morok"] .app{grid-template-columns:minmax(0,1fr)!important;width:100%!important;min-width:0!important}}

/* Excluded Morok slots stay absent throughout rendering, including focus targets. */
body[data-mode="morok"] .board.manikin_human .manikin__slot:is([data-slot="earring1"],[data-slot="earring2"],[data-slot="shoulders1"],[data-slot="shoulders2"],[data-slot="pants"]){display:none!important}

/* Circles are decorative only. Empty states are 18% smaller and half-bright. */
.board .modifier-strip{position:absolute;display:flex;align-items:center;justify-content:center;gap:2px;pointer-events:auto!important;z-index:10;line-height:0;transform:translate(-50%,-50%);--circle-filled:8px;--circle-empty:6.6px}
.board .modifier-strip--item{flex-direction:column}
.board .modifier-strip--lining{gap:1px;--circle-filled:6px;--circle-empty:4.9px}
.board .modifier-cell{display:block;position:relative;flex:none;width:var(--circle-filled);height:var(--circle-filled);padding:0;margin:0;border:0;appearance:none;font:inherit;line-height:0;cursor:pointer;pointer-events:auto!important;background:transparent!important}
.board .modifier-cell[data-filled="false"]{width:var(--circle-empty);height:var(--circle-empty)}
.board .modifier-cell:hover{filter:brightness(1.35)}
.board .modifier-cell:focus-visible{outline:1px solid #ffe7a9!important;outline-offset:2px;filter:brightness(1.35);box-shadow:0 0 0 2px #1b1208,0 0 7px #edbf64}
.board .modifier-cell:before{content:"";position:absolute;inset:0;border:0;border-radius:50%;box-sizing:border-box;box-shadow:inset 0 0 0 .65px #e2bd78;pointer-events:none}
.board .modifier-cell[data-filled="false"]:before{opacity:.5}
.board .modifier-cell[data-filled="true"]:before{box-shadow:inset 0 0 0 .65px #f0d296}
.board .modifier-cell[data-bright="true"]:before{box-shadow:inset 0 0 0 .65px #fff4d0}
.board .modifier-glyph{position:absolute;inset:.55px;background-position:center;background-size:contain;background-repeat:no-repeat;clip-path:circle(50%);pointer-events:none}
.board .modifier-cell:is([data-modifier="mod"],[data-modifier="bright"]) .modifier-glyph{inset:.45px;background-size:125%;filter:brightness(1.2) saturate(1.08)}
.board .modifier-glyph svg{width:100%;height:100%;overflow:visible;fill:none;stroke:#ffe3a3;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.board .modifier-cell[data-modifier="seal"] .modifier-glyph svg{fill:#7d3e20;stroke:#f1c278;stroke-width:1.2}
.board .modifier-compact>.modifier-strip--item{gap:1px;--circle-filled:6px;--circle-empty:4.9px}
.board .modifier-tiny>.modifier-strip--item{--circle-filled:4.8px;--circle-empty:3.9px}
.board .modifier-strip--lining.modifier-strip--small{--circle-filled:4.6px;--circle-empty:3.8px}
.board .modifier-strip--lining.modifier-strip--tiny{gap:.6px;--circle-filled:3.4px;--circle-empty:2.8px}
/* Jewelry gets another small reduction, without resizing its main or lining slot. */
.board .manikin__slot:is([data-slot^="ring"],[data-slot^="earring"])>.modifier-strip--item{--circle-filled:5.6px;--circle-empty:4.4px}
.board .manikin__slot:is([data-slot^="ring"],[data-slot^="earring"])>.modifier-strip--lining{--circle-filled:4.2px;--circle-empty:3.4px}
.board .manikin__slot.modifier-tiny:is([data-slot^="ring"],[data-slot^="earring"])>.modifier-strip--item{--circle-filled:4.4px;--circle-empty:3.5px}
.board .manikin__slot:is([data-slot^="ring"],[data-slot^="earring"])>.modifier-strip--lining.modifier-strip--tiny{--circle-filled:3.2px;--circle-empty:2.5px}
.board .modifier-strip--small .modifier-glyph,.board .modifier-strip--tiny .modifier-glyph{inset:.35px}

/* Upgrade-cell contextual actions reuse the existing slot-editor shell. */
.slot-editor.upgrade-cell-menu .slot-editor__dialog{width:min(360px,calc(100vw - 24px))}
.upgrade-cell-menu__value{margin:0;padding:12px;border:1px solid #c9a45f;background:#fff9ea;color:#3b2615;line-height:1.45}
.upgrade-cell-menu__actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.upgrade-cell-menu__actions button{flex:1 1 120px;min-height:38px}
.upgrade-cell-menu__actions [data-upgrade-remove]{border-color:#a85843;color:#7c251c}

@media(max-width:700px){
  /* Keep each tiny control independently tappable without overlapping neighbors. */
  .board .modifier-cell{min-width:8px;min-height:8px}
  .board .modifier-cell:before{inset:calc((8px - var(--circle-filled))/2)}
  .board .modifier-cell[data-filled="false"]:before{inset:calc((8px - var(--circle-empty))/2)}
  .board .modifier-cell .modifier-glyph{inset:1.5px}
}

/* Keep native border widths for layout; transfer only their paint to masked layers.
   No mask is ever applied to the slot, its item image or the lining label. */
body:is([data-mode="character"][data-battle="regular"],[data-mode="pet"]) .board .manikin__slot[data-slot].modifier-framed,
body:is([data-mode="character"][data-battle="regular"],[data-mode="pet"]) .board .manikin__slot[data-slot].modifier-framed>.lining{border-color:transparent!important;border-image:none!important;box-shadow:none!important;outline:none!important}
body:is([data-mode="character"][data-battle="regular"],[data-mode="pet"]) .board .manikin__slot[data-slot].modifier-framed:before{display:none!important}
.board .modifier-frame{position:absolute;box-sizing:border-box;pointer-events:none!important;background-color:transparent;background-repeat:no-repeat;background-size:100% 100%;border:0;box-shadow:none;z-index:6;mask-repeat:no-repeat;mask-size:100% 100%;mask-mode:alpha}
.board .modifier-frame--item:before{display:none}
.board .modifier-frame--lining{z-index:9}
.board .modifier-framed:is(:hover,:focus-within)>.modifier-frame--item{filter:brightness(1.12)}
.board .modifier-framed>.lining:focus-visible~.modifier-frame--lining{filter:brightness(1.2)}
body .board .modifier-framed>.slot-main-hit:focus-visible,
body .board .manikin__slot.modifier-framed>.lining:focus-visible{outline:none!important}
/* Hide decoration synchronously while the original excluded-mode frame is restored. */
body[data-mode="morok"] :is(.modifier-strip,.modifier-frame),
body[data-mode="character"]:not([data-battle="regular"]) :is(.modifier-strip,.modifier-frame),
.board .pet-slot-locked>:is(.modifier-strip,.modifier-frame){display:none!important}

/* The same grid; only the figure differs. Original dog PNG: 164 × 227. */
body[data-mode="pet"] .scene .board .manikin__center{left:calc(50% - 162.555066px)!important;width:325.110132px!important}
body[data-mode="pet"] .board .vital-mana{display:none!important}
/* Closed slots retain their footprint and saved data, without guides or Xs. */
body[data-mode="pet"] .board .manikin__slot.pet-slot-locked[data-slot]{border-image:linear-gradient(#625d4c,#403f35) 1!important;border-image-width:var(--modifier-frame-item)!important;cursor:not-allowed!important}
body[data-mode="pet"] .board .pet-slot-locked > :is(img,.lining,.slot-tooltip){display:none!important}
body[data-mode="pet"] .board .pet-slot-locked > .slot-main-hit{cursor:not-allowed}
.pet-slot-status{position:relative;order:20;flex-shrink:0;box-sizing:border-box;width:calc(100% - 24px);max-width:620px;margin:12px auto 0;padding:10px 12px;border:1px solid #62543a;color:#c6b990;background:transparent;font:13px/1.5 Arial,sans-serif}
.pet-slot-status[hidden]{display:none}
.pet-slot-status p{margin:0 0 4px}
.pet-slot-status small{display:block}
.pet-slot-status .pet-slot-warning{margin-top:8px;color:#e6c18a}

/* Mobile only: reduce the dog by 20%; keep the shared grid, fit and hit areas intact. */
@media(max-width:700px){
 body[data-mode="pet"] .scene .board .manikin__center{left:calc(50% - 130.044053px)!important;width:260.088106px!important;height:360px!important}
 body[data-mode="pet"] .scene .board .manikin__center .manikin{height:360px!important}
}

/* Jewelry mini-slots keep the lining cell visually separate from the tiny item.
   Pointer routing is handled explicitly in JS and does not depend on this offset. */
body:is([data-mode="character"],[data-mode="pet"]) .board .manikin__slot:is([data-slot^="ring"],[data-slot^="earring"]) > .lining{
  right:-3px!important;
  bottom:-3px!important
}