:root {
  color-scheme: light;
  --bg: #f3eefb;
  --panel: #fffcf7;
  --raised: #f3edf9;
  --line: #e2d7e9;
  --text: #382e49;
  --muted: #5f576e;
  --accent: #c5ecd7;
  --ink: #24513e;
  --app-height: 100dvh;
  --safe-top: max(env(safe-area-inset-top), var(--tg-top, 0px));
  --safe-right: max(env(safe-area-inset-right), var(--tg-right, 0px));
  --safe-bottom: max(env(safe-area-inset-bottom), var(--tg-bottom, 0px));
  --safe-left: max(env(safe-area-inset-left), var(--tg-left, 0px));
  font: 100%/1.4 system-ui, "Segoe UI", sans-serif;
  color: var(--text);
  background: var(--bg);
}
* { box-sizing: border-box; }
:root:has(#battle-screen:not([hidden])) {
  scrollbar-gutter: stable;
  scroll-padding-bottom: calc(2.75rem + 18px + var(--safe-bottom));
}
[hidden], .symbol-library { display: none !important; }
body { margin: 0; padding: 0 var(--safe-right) 0 var(--safe-left); }
button { color: inherit; font: inherit; border: 0; cursor: pointer; min-height: 44px; background: none; }
button:disabled { color: #5c7788; cursor: default; }
button:focus-visible, .viewport:focus-visible { outline: 2px solid #72568e; outline-offset: -3px; }
.app { max-width: 480px; min-height: var(--app-height); margin: 0 auto; background: radial-gradient(120% 90% at 18% 0%, #f0e7fb, var(--panel) 55%); display: flex; flex-direction: column; }
.app > section { flex: 1; display: flex; flex-direction: column; }
.app-events { display: grid; gap: 4px; }
.side-rail { display: contents; }
.wide-roster { display: none; }
.entry { min-height: var(--app-height); padding: max(16px, var(--safe-top)) 16px max(16px, var(--safe-bottom));
  display: grid; grid-template-columns: minmax(0, 32rem); place-content: center; justify-items: center; gap: 12px; text-align: center; }
.entry-title { margin: 0; max-width: 100%; }
.entry-title img { display: block; width: auto; height: auto; max-width: 100%; max-height: min(28rem, calc(var(--app-height) * .56));
  border: 1px solid var(--line); border-radius: 16px; }
.entry > p { margin: 0; }
.icon { width: 23px; height: 23px; flex: 0 0 auto; object-fit: contain; pointer-events: none; }
.accent { color: #72568e; }
.resources { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px;
  padding: max(5px, var(--safe-top)) 8px 5px; background: var(--bg); }
.resource-balances, .resource-row, .resource-tools { display: grid; gap: 3px; min-width: 0; }
.resource-summary { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.resource-vitals { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.resource-tools { grid-template-columns: repeat(2, 48px); }
.resource-row > *, .resource-tools > button { display: flex; align-content: center; align-items: center;
  justify-content: center; gap: 1px 4px; min-width: 0; min-height: 24px; padding: 2px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 8px; }
.resource-row > * { flex-wrap: wrap; font-size: .75rem; line-height: 1.18; text-align: center; }
.resource-vitals > * { column-gap: 2px; padding-inline: 1px; }
.resource-level { background: var(--raised); }
.resource-level > span { color: var(--muted); }
.resource-row strong { min-width: 0; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.resource-row .icon { width: 15px; height: 15px; }
.resource-vitals .icon { width: 12px; height: 12px; }
.resource-tools > button { min-height: 48px; }
.resource-tools .icon { width: 22px; height: 22px; }
#item-details { box-sizing: border-box; width: min(calc(100% - 28px), 350px); max-height: 76dvh; margin: auto;
  padding: 0; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); color: var(--ink); }
#item-details::backdrop { background: #29213866; }
#item-details > .dialog-heading { padding: 8px 10px 8px 14px; }
#item-details-title { margin: 0; font-size: 1.1rem; overflow-wrap: anywhere; }
#item-details-content { display: grid; gap: 8px; padding: 0 14px 14px; }
#item-details-content p { margin: 0; }
#item-details-content .item-card-lead { display: flex; align-items: center; gap: 10px; }
#item-details-content .item-card-lead .item-art-frame { width: 56px; height: 56px; flex: 0 0 56px; }
.inventory-list { display: grid; gap: 6px; }
.inventory-list > button { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 8px;
  min-height: 48px; padding: 5px 8px; text-align: left; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); }
.inventory-list > button small { display: block; color: var(--muted); }
.inventory-list > button .item-art-frame { width: 44px; height: 44px; }
.inventory-list > button > span:last-child { overflow-wrap: anywhere; }
.hp-icon { color: #a44359; line-height: 1; }
.vital-bar { display: block; width: 100%; height: 12px; margin: 0 0 8px; accent-color: #347a62; }
.vital-bar[data-vital-bar="hp"] { accent-color: #a44359; }
.vital-bar[data-vital-bar="mana"] { accent-color: #3979a8; }
#journal-button { position: relative; }
#journal-badge { position: absolute; top: 5px; right: 5px; width: 8px; height: 8px; border-radius: 999px; background: #6c5190; pointer-events: none; }
#journal-badge.journal-badge-count { width: auto; min-width: 16px; height: 16px; padding-inline: 3px; color: white; font-size: 11px; font-weight: 700; line-height: 16px; }
.wallet-view { display: grid; gap: 12px; }
#details:modal:has(> #detail-content > [data-wallet]) { max-width: none; }
#details:has(> #detail-content > [data-wallet]) .dialog-heading h2 { min-width: 0; font-size: 1.3125rem; overflow-wrap: anywhere; }
.wallet-totals, .wallet-last dl { margin: 0; display: grid; gap: 6px; }
.wallet-totals { grid-template-columns: repeat(auto-fit, minmax(min(100%, 7em), 1fr)); }
.wallet-totals > div, .wallet-holds, .wallet-last { padding: 12px; border-radius: 12px; background: var(--raised); }
.wallet-view dt, .wallet-view small { color: var(--muted); }
.wallet-totals dd, .wallet-last dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.wallet-totals dd { font-size: 1.25rem; }
.wallet-fish { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; font-variant-numeric: tabular-nums; }
.wallet-fish strong { min-width: 0; overflow-wrap: anywhere; }
.wallet-fish img { flex: none; width: 20px; height: 20px; object-fit: contain; }
.wallet-holds { margin: 0; list-style: none; display: grid; gap: 8px; }
.wallet-holds li, .wallet-last dl > div { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.wallet-holds small, .wallet-last small { display: block; }
.wallet-last h3 { margin: 0 0 8px; font-size: 1rem; }
.wallet-last p + dl { margin-top: 8px; }
.settings-icon { color: #6c5190; font-size: 25px; line-height: 1; }
.settings-panel { display: grid; gap: 8px; }
.settings-panel label { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 48px;
  padding: 0 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); }
.settings-panel input { width: 21px; height: 21px; margin: 0; accent-color: #6c5190; }
.settings-panel select { max-width: 66%; min-height: 44px; font: inherit; color: inherit; background: var(--panel); border: 0; }
.room-text { margin-inline: 10px; max-height: clamp(235px, calc(var(--app-height) - 318px - var(--safe-bottom) - var(--safe-top)), 567px);
  padding: 10px; overflow-y: auto; border: 1px solid var(--line); border-radius: 15px; background: var(--panel); }
.room-text h2 { margin-block: 4px 7px; font-size: 1.05rem; }
.room-text .detail-list { margin-bottom: 8px; }
.resource-value { white-space: nowrap; font-variant-numeric: tabular-nums; }
.room-heading { padding: 7px 15px 8px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 5px; }
h1, h2, p { margin: 0; }
h1 { font-size: 27px; line-height: 1.13; letter-spacing: -.045em; }
.room-frame { position: relative; margin-inline: 10px; overflow: hidden; border: 1px solid #c9bad8; border-radius: 15px; background: var(--bg); box-shadow: 0 8px 14px #426b7a2a; }
.viewport { height: clamp(235px, calc(var(--app-height) - 318px - var(--safe-bottom) - var(--safe-top)), 567px); overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; scrollbar-width: none; cursor: grab; touch-action: pan-x pan-y; }
.viewport::-webkit-scrollbar { display: none; }
.viewport.dragging { cursor: grabbing; user-select: none; }
.world { width: 300%; height: 100%; overflow: clip; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); background: #e2d6b2 url("assets/room-stage-96.jpg") left bottom / 100% 110% no-repeat; }
.room-scenery { display: none; position: absolute; top: 0; left: 0; pointer-events: none; }
.room-frame[data-room-renderer="pixi"] > .viewport { position: relative; }
/* Use the CSS scenery when modals or inspection warnings change the room layout. */
.app:not(:has(dialog:modal, .inspection-banner:not([hidden]))) .room-frame[data-room-renderer="pixi"] > .room-scenery { display: block; }
.app:not(:has(dialog:modal, .inspection-banner:not([hidden]))) .room-frame[data-room-renderer="pixi"] .world { background: transparent; }
.app:not(:has(dialog:modal, .inspection-banner:not([hidden]))) .room-frame[data-room-renderer="pixi"] .room-window { visibility: hidden; }
.area { position: relative; isolation: isolate; container-type: size; }
/* Let the top edge of the scene crop the frame. Keep the sill clear of the plinth. */
.room-window { position: absolute; top: min(10cqw, 10cqh); left: 50%; translate: -50% -100%; width: 46%;
  aspect-ratio: 1855 / 848; pointer-events: none; user-select: none; }
.room-window-frame { position: relative; display: block; width: 100%; height: 100%; }
.room-window-yard { position: absolute; inset: 10.8% 7.7% 12.3%; overflow: hidden; background: #58b5d5; }
.room-window-yard img { position: absolute; left: -12px; width: calc(100% + 24px); height: 100%;
  object-fit: cover; translate: var(--window-shift, 0px) 0; }
:root:is([data-motion="reduced"], [data-room-view="still"]) .room-window-yard img { translate: none; }
.wall-decor { position: absolute; width: auto; object-fit: contain; pointer-events: none; user-select: none; }
.wall-decor[src$="plant.png"] { left: 84%; top: 1%; height: 16cqh; max-width: 13%; }
.wall-decor[src$="calendar-96.png"] { left: 11%; top: 4%; height: 17cqh; max-width: 16%; }
.floor-rug { position: absolute; left: 50%; top: 44%; translate: -50% 0; width: 70%; max-height: 31cqh;
  object-fit: contain; object-position: center top; pointer-events: none; user-select: none; }
.throne-lamp { position: absolute; left: 29%; top: 35.5%; translate: -50% -100%; height: clamp(42px, 15cqh, 86px);
  aspect-ratio: 551 / 1464; pointer-events: none; }
.throne-lamp::before { content: ""; position: absolute; inset: -14% -70% 46%; background: radial-gradient(ellipse, #ffdf936e, transparent 69%); }
.throne-lamp::after { content: ""; position: absolute; bottom: -2%; left: 18%; width: 68%; height: 6%; border-radius: 50%; background: #65422b38; }
.throne-lamp img { position: absolute; inset: 0; width: 100%; height: 100%; }
.throne-gallery { position: absolute; bottom: calc(73% + min(2.5cqh, 12px)); left: 74%; display: flex; align-items: end; gap: 3px; pointer-events: none; }
.throne-gallery > span:not(.throne-portrait) { display: grid; gap: 1px; }
.throne-portrait { position: relative; display: block; width: clamp(28px, 11cqw, 48px); }
.throne-portrait.former { width: clamp(16px, 5.8cqw, 25px); }
.throne-frame { width: 100%; display: block; }
.throne-picture { position: absolute; inset: 21.4% 5.4% 5.9%; overflow: hidden; background: #a9bb90; }
.throne-picture .cat-rig { width: 92%; margin: 2% auto 0; }
.throne-picture .cast-shadow { display: none; }
.actor { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; position: absolute; left: var(--x); top: var(--y); width: min(19%, max(44px, 17cqh)); padding: 0; transform: translate(-50%,-100%); z-index: var(--depth,2); }
.room-rig-slot { position: relative; display: grid; justify-items: center; width: 100%; }
.room-rig-slot[data-loading-art] > .cat-rig { visibility: hidden; }
.room-rig-slot[data-loading-art]::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: url("assets/icon-cat.png") center / 46% auto no-repeat; }
.actor .cat-rig { width: 100%; pointer-events: none; }
.room-pose-stage { position: absolute; inset: auto 0 0; opacity: 0; pointer-events: none; }
.room-pose-transfer .head-assembly { transform: translateY(-1.4%) rotate(-2deg); }
.room-pose-drop .cat-rig { transform-origin: 50% 94%; transform: rotate(-29deg); }
.room-pose-drop .cat-rig::before { display: none; }
.actor .tag { position: relative; z-index: 1; background: #fbf3f9e8; color: #463253; padding: 1px 4px; border-radius: 5px; font-size: 10px; line-height: 1.25; white-space: nowrap; box-shadow: 0 1px 2px #243d5f36; }
.actor .tag-label { display: flex; gap: 3px; max-width: 86px; }
.actor .tag-level { flex: none; min-width: 11px; padding: 0 2px; border-radius: 3px; text-align: center;
  font-weight: 750; font-variant-numeric: tabular-nums; background: color-mix(in srgb, currentColor 14%, transparent); }
.actor .tag-name { overflow: hidden; text-overflow: ellipsis; }
.actor .walking-rig { width: calc(100% * 318 / 339); }
.actor.mine .tag { background: #6d5488; color: #fff9ff; font-weight: 750; }
.actor.selected .tag { outline: 2px solid #6d5488; }
.actor.mine { width: min(22%, 20cqh); }
.room-crowd { position: absolute; left: 32%; bottom: 0; translate: -50% 0; z-index: 1; display: grid;
  justify-items: center; align-content: end; min-width: 96px; min-height: 48px; padding: 0 0 10px; white-space: nowrap; }
.room-crowd span { border: 1px solid #c7abd8; border-radius: 12px; padding: 4px 8px; background: #fff9f5;
  color: #513c65; font-size: 11px; font-weight: 700; box-shadow: 0 1px 3px #51406a38; }
.cat-directory { display: grid; gap: 6px; }
.cat-directory input { width: 100%; min-height: 48px; padding: 0 10px; font: inherit; color: inherit;
  border: 1px solid var(--line); border-radius: 10px; background: var(--panel); }
.cat-directory-count { color: var(--muted); font-size: 13px; }
.resident-list button > span { flex: 0 1 auto; min-width: 0; overflow-wrap: anywhere; }
.resident-list small { text-align: right; }
.actor.mine:not(.resting)::before { content: ""; position: absolute; bottom: 9px; width: 80%; height: 11px; border: 2px solid #fae4ff; background: #f1cff342; border-radius: 50%; pointer-events: none; }
.actor.resting { --rest-lift: 9cqw; width: 20%; min-width: 44px; transform: translate(-50%, calc(-100% - var(--rest-lift))); }
.actor:is(.resting, [data-name-above]) .tag { position: absolute; bottom: calc(100% + 2px); }
.actor.at-aquarium { width: min(16%, 15cqh); }
.actor.inspection-down .cat-rig { transform: translate(8%, 17%) scaleY(.72) rotate(-135deg); }
.actor.inspection-down .cat-rig::before { display: none; }
.actor.inspection-down .room-rig-slot::before { content: ""; position: absolute; bottom: 5%; left: -4%; width: 108%; height: 15%;
  border-radius: 50%; background: #65422b33; pointer-events: none; }
.actor.at-aquarium .head-assembly { transform: rotate(5deg); }
:root:not([data-motion="reduced"]) .actor.at-aquarium[data-room-active] .head-assembly {
  animation: watch-carp 5.5s steps(1, end) infinite;
}
@keyframes watch-carp {
  0%, 100% { transform: rotate(5deg); }
  40% { transform: rotate(8deg); }
  67% { transform: rotate(2deg); }
}
.room-place-link, .room-occupant { display: flex; align-items: center; gap: 8px; min-height: 48px; }
.room-place-link img { width: 30px; height: 30px; object-fit: contain; }
.room-occupant { justify-content: space-between; }
.room-occupant-row { display: flex; align-items: center; gap: 6px; }
.room-occupant-row .room-occupant { flex: 1; min-width: 0; padding-inline: 8px; text-align: left; }
.room-occupant-row .room-occupant span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.room-occupant-row :is(time, .room-expel, .room-expel-wait) { flex: none; }
.room-occupant-row .room-expel { min-height: 44px; padding-inline: 8px; color: #6c5190; }
.room-expel-wait { padding-inline: 5px; color: var(--muted); }
.actor.having-tea { width: min(14%, 13cqh); }
.furniture { display: grid; align-content: end; position: absolute; left: var(--x); top: var(--y); width: 38%; min-width: 48px; min-height: 48px; padding: 0; transform: translate(-50%,-100%); z-index: calc(var(--depth) - 1); }
.furniture .prop-sprite { display: block; position: relative; margin-inline: auto; width: 100%; height: auto; max-height: min(38cqh, 164px); object-fit: contain; object-position: bottom; }
.friday-tray { position: absolute; right: -2%; bottom: -1px; width: clamp(30px, 37%, 54px);
  filter: drop-shadow(2px 2px 1px #65422b55); pointer-events: none; }
.furniture[data-object="chair"] { top: max(var(--y), calc(22% + min(34cqh, 128px))); width: 34%; }
.furniture[data-object="chair"] .prop-sprite { max-height: min(34cqh, 128px); }
.furniture[data-object="scratch"] { width: 34%; }
.furniture[data-object="scratch"] .prop-sprite { max-height: min(27cqh, 125px); }
.furniture[data-object="cot"] { width: 29%; }
.furniture[data-object="cot"] .prop-sprite { max-height: min(27cqh, 112px); }
.cast-shadow { --shadow-opacity: .23; width: 100%; height: 100%; transform-origin: 50% 99%; transform: skewX(44deg) scaleY(-.13);
  filter: brightness(0) saturate(100%) invert(24%) sepia(20%) saturate(1683%) hue-rotate(350deg) blur(2px); opacity: var(--shadow-opacity); pointer-events: none; }
.furniture::before, .actor:not(.resting) .cat-rig::before, .duelist .cat-rig::before { content: ""; position: absolute; bottom: -3%;
  left: 23%; width: 57%; height: 8%; background: #65422b33; border-radius: 50%; pointer-events: none; }
.furniture[data-object="bed"]::before { left: 4%; width: 92%; }
.bed-gesture { position: absolute; width: 74%; height: 58%; top: 4%; left: 13%; pointer-events: none; z-index: 2; }
.bed-gesture img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; }
.bed-gesture img:first-child { animation: cushion-touch .6s steps(1); }
.bed-gesture img:last-child { animation: cushion-press .6s steps(1); }
@keyframes cushion-touch { 0%, 67% { opacity: 1; } 33%, 100% { opacity: 0; } }
@keyframes cushion-press { 0%, 67% { opacity: 0; } 33% { opacity: 1; } }
.actor.bed-arrival { visibility: hidden; }
:root[data-motion="reduced"] .bed-gesture img { animation: none; }
.prop-shadow { position: absolute; inset: 0; object-fit: contain; object-position: bottom; }
.actor.resting .cast-shadow, .actor.knockout .cast-shadow, .preview-stage .cast-shadow, .challenge-portrait .cast-shadow { display: none; }
.furniture.unbuilt .prop-sprite { opacity: .90; }
.furniture[data-object="weight"] .prop-sprite { max-height: min(31cqh, 88px); }
:root {
  --weight-stand-seam: 100% 72.5%, 83% 72.5%, 77% 75.4%, 73.5% 80.4%, 70.5% 84.2%, 65% 87.5%,
    35.5% 87.5%, 30.2% 84.2%, 27% 80.4%, 23.2% 75.4%, 17% 72.5%, 0% 72.5%;
}
.furniture[data-weight-stand] .prop-sprite { width: auto; height: min(31cqh, 88px); }
.furniture[data-weight-stand] .prop-shadow,
.furniture[data-weight-stand="1"] .prop-sprite { visibility: hidden; }
.furniture[data-weight-stand="1"]::before { background: #8b74515e; }
.furniture[data-weight-stand="2"] .prop-sprite {
  clip-path: polygon(100% 100%, var(--weight-stand-seam), 0 100%);
}
.furniture[data-weight-stand="3"] .prop-sprite { clip-path: inset(87.5% 0 0); }
.furniture[data-object="table"] { width: 28%; }
.furniture[data-object="table"] .prop-sprite { max-height: min(27cqh, 103px); }
.furniture[data-object="bottle"] { width: 21%; }
.furniture[data-object="bottle"] .prop-sprite { max-height: min(29cqh, 112px); }
.furniture[data-object="pinball"] .prop-sprite, .furniture[data-object="radio"] .prop-sprite { max-height: min(38cqh, 124px); }
.furniture.arcade-playing .prop-sprite[src$="room-eggs-3.png"] { filter: drop-shadow(0 0 3px #8aeac6); }
.actor.at-weight, .actor.at-pinball, .actor.at-radio { width: min(18%, 16cqh); }
.room-lift-rig .body-assembly { position: absolute; inset: 0; }
[data-weight-lift] .body-assembly { animation: room-weight-lift 416.667ms steps(1, end) both; }
@keyframes room-weight-lift {
  0% { transform: translateY(3.3%); }
  30% { transform: translateY(-2.3%); }
  60%, 100% { transform: none; }
}
.room-weight-grip.weight-level-2 {
  clip-path: polygon(0 0, 100% 0, var(--weight-stand-seam));
}
.room-weight-grip.weight-level-3 { clip-path: inset(0 0 12.5%); }
.radio-signal { pointer-events: none; position: absolute; top: -9px; right: 7%; border-radius: 7px; padding: 1px 5px;
  background: var(--panel); color: var(--text); box-shadow: 0 1px 3px #44345135; font-size: .87rem; }
.radio-summary { display: flex; align-items: center; gap: 8px; padding: 7px 9px;
  border-radius: 9px; background: var(--raised); font-variant-numeric: tabular-nums; }
.radio-summary strong { margin-inline-end: auto; }
.radio-summary time { white-space: nowrap; color: var(--muted); }
.radio-summary:focus-visible, #radio-vote-status:focus-visible { outline: 2px solid #72568e; outline-offset: 1px; }
.radio-tape-art { flex: none; width: 32px; height: 32px; object-fit: contain; }
.radio-vote-options button[data-tape] { display: grid; grid-template-columns: 32px minmax(0, 1fr) max-content; min-height: 48px; }
.radio-vote-options button[aria-pressed="true"] { background: var(--raised); border-color: #765790; color: var(--text); }
[data-energy-card="radio"] .route-tendency { flex-wrap: wrap; }
.workout-ready { border-radius: 9px; background: var(--raised); padding: 7px 9px; }
.egg-console { display: grid; gap: 7px; padding: 9px; border: 4px solid #337665; border-radius: 18px;
  background: #e8e3ce; box-shadow: 0 3px 0 #285c50, inset 0 0 0 1px #fdf7e4; }
.egg-display { overflow: hidden; border: 4px solid #5c6645; border-radius: 9px; background: #bbc88c; color: #23341e;
  box-shadow: inset 0 2px 5px #38402450; }
.egg-score { display: flex; align-items: baseline; justify-content: space-between; gap: 4px; padding: 3px 7px 0;
  font-size: .875rem; font-variant-numeric: tabular-nums; }
.egg-score strong { font-family: ui-monospace, monospace; font-size: 1.1rem; }
.egg-field { position: relative; aspect-ratio: 1.8; overflow: hidden; isolation: isolate; }
.egg-field::after { content: ""; position: absolute; inset: auto 6% 5%; height: 2px; background: #71804e; z-index: -1; }
.egg-rail { position: absolute; left: 7%; top: 26%; width: 33%; height: 4px; border-block: 1px solid #51613d;
  background: repeating-linear-gradient(90deg, #51613d 0 2px, transparent 2px 7px); transform-origin: left; rotate: 14deg; }
.egg-rail:is([data-lane="1"], [data-lane="3"], [data-lane="5"]) { left: auto; right: 7%; transform-origin: right; rotate: -14deg; }
.egg-rail:is([data-lane="2"], [data-lane="3"]) { top: 48%; }
.egg-rail:is([data-lane="4"], [data-lane="5"]) { top: 70%; }
.egg-catcher { position: absolute; left: 50%; bottom: 0; width: 36%; height: 56%; object-fit: contain;
  transform: translateX(-50%); }
.egg-catcher:is([data-aim="0"], [data-aim="1"]) { bottom: 44%; }
.egg-catcher:is([data-aim="2"], [data-aim="3"]) { bottom: 22%; }
.egg-catcher:is([data-aim="1"], [data-aim="3"], [data-aim="5"]) { transform: translateX(-50%) scaleX(-1); }
.egg-piece { position: absolute; width: 5.5%; aspect-ratio: .76; transform: translate(-50%, -55%) rotate(-22deg);
  border: 2px solid #26381b; border-radius: 48% 52% 48% 48% / 62% 62% 38% 38%; background: #d9dfa2; }
.egg-controls { display: grid; grid-template-columns: repeat(2, minmax(48px, 1fr)); gap: 6px 14px; }
.egg-controls button.detail-action { min-height: 48px; color: #fffaf1; background: #af432c; border-color: #793624;
  border-radius: 12px; font-size: 1.35rem; font-weight: 800; box-shadow: inset 0 -3px 0 #7b3525; }
.egg-controls button[aria-pressed="true"] { background: #733e34; outline: 2px solid #fff0ae; outline-offset: -5px; }
.egg-controls button[aria-disabled="true"] { opacity: .75; }
.egg-controls button:focus-visible { outline: 3px solid #33264e; outline-offset: 1px; }
.egg-mode-pick { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.furniture[data-object="bed"] { width: 41%; }
.cot-progress { position: absolute; left: 25%; bottom: -10px; width: 50%; height: 5px; accent-color: #416e5d; pointer-events: none; }
.steam { position: absolute; z-index: 1; left: 44%; bottom: 48%; width: 17%; pointer-events: none; animation: steam 1.65s ease-out infinite; }
@keyframes steam { from { opacity: .75; transform: translateY(3px) scale(.8); } to { opacity: 0; transform: translate(4px, -10px) scale(1.18); } }
.square { width: 44px; min-width: 44px; display: grid; place-items: center; padding: 0; border-radius: 7px; }
.room-pan { position: absolute; left: 40%; right: 40%; bottom: 6px; height: 4px; border-radius: 3px; background: #5d486555; pointer-events: none; }
.room-pan i { position: absolute; inset-block: 0; background: #fff9fd; border-radius: 3px; }
.locate { position: absolute; top: 7px; right: 7px; background: #fffaf1e6; border-radius: 50%; box-shadow: 0 2px 6px #513d663b; }
.room-tools { display: flex; gap: 5px; }
.room-tools button { display: flex; gap: 4px; min-width: 48px; min-height: 48px; justify-content: center; align-items: center; padding: 0 7px; border: 1px solid var(--line); background: var(--panel); border-radius: 10px; font-size: 14px; }
.room-tools [data-telegram-fullscreen] { font-size: 22px; line-height: 1; }
[data-telegram-fullscreen][aria-pressed="true"] { background: #ebe0f6; }
:root[data-room-view="list"] .room-tools [data-telegram-fullscreen] { display: none; }
.count { background: var(--raised); color: #655082; border-radius: 5px; padding: 0 4px; }
.quest { padding: 10px 12px; margin: auto 10px 8px; border: 1px solid #ded0ea; background: var(--raised); border-radius: 16px; }
.eyebrow { color: #196d64; font-size: 14px; }
h2 { font-size: 21px; letter-spacing: -.025em; }
.quest p { display: flex; align-items: center; gap: 5px; margin: 2px 0 7px; color: var(--muted); font-size: 14px; }
.quest p .icon { width: 24px; height: 24px; padding: 2px; background: var(--panel); border-radius: 7px; }
.energy-quest-copy { display: grid; gap: 2px; }
.quest-actions { display: grid; grid-template-columns: 1fr auto; gap: 6px; }
.quest-actions button { min-height: 48px; border-radius: 9px; padding: 0 10px; font-size: 14px; }
.primary { background: linear-gradient(#d8f5e4, var(--accent)); color: var(--ink); font-weight: 750; box-shadow: inset 0 1px 0 #ecfff3; }
.quest-actions button + button { color: #655082; }
.quest-links { display: flex; flex-wrap: wrap; gap: 3px 8px; }
.quest-links button { min-height: 48px; padding-inline: 4px; color: #655082; font-size: .82rem; }
.today-card h3 { margin: 3px 0; font-size: .9rem; }
.tabs { display: flex; flex-wrap: wrap; background: var(--bg); border-top: 1px solid var(--line); padding-bottom: var(--safe-bottom); }
.tabs button { flex: 1 1 3.4rem; min-width: 0; min-height: 57px; display: grid; align-content: center; justify-items: center;
  gap: 2px; border-top: 2px solid transparent; padding: 0; font-size: .875rem; overflow-wrap: anywhere; }
.tabs button[aria-current] { color: #655082; border-color: #6c5190; }
.tabs button[data-open="yard"] { position: relative; }
.tab-ready { position: absolute; top: 7px; left: calc(50% + 9px); width: 9px; height: 9px; border: 1px solid var(--bg); border-radius: 50%; background: #2f775d; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
dialog { width: min(calc(100% - 18px - var(--safe-left) - var(--safe-right)), 462px); max-height: calc(min(var(--app-height), 100dvh) - 30px - var(--safe-top) - var(--safe-bottom)); margin: auto auto calc(max(8px, var(--safe-bottom)) + var(--tg-covered-bottom, 0px)); padding: 0 13px 14px; border: 1px solid #cfbddf; border-radius: 15px; color: var(--text); background: var(--panel); box-shadow: 0 8px 28px #0006; scroll-padding-top: 60px; overscroll-behavior: contain; }
dialog::backdrop { background: #1b405a86; }
.dialog-heading { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-block: 5px; background: var(--panel); }
#details:has([data-own-profile], [data-other-cat]) #detail-title { overflow-wrap: anywhere; }
.dialog-heading:has(> :is(.battle-return, .urgent-action, .inspection-banner):not([hidden])) { flex-wrap: wrap; }
.dialog-heading > :is(.battle-return, .urgent-action, .inspection-banner) { flex: 1 0 100%; order: 1; margin: 0; }
.dialog-heading button { width: 48px; min-height: 48px; font-size: 24px; color: var(--muted); border-radius: 50%; }
.dialog-heading button:hover { background: var(--raised); }
#details:has([data-own-profile], [data-yard-mount]) .profile-heading-name { display: flex; align-items: center; gap: 4px; }
#details:has([data-own-profile]) .profile-heading-name h2 { min-width: 0; overflow-wrap: anywhere; }
#cat-rename-open { flex: 0 0 48px; font-size: 22px; }
#details:not(:has([data-own-profile])) #cat-rename-open { display: none; }
#details #yard-move { width: 44px; min-height: 44px; padding: 0; font-size: 17px; }
#details:not(:has([data-yard-mount])) #yard-move { display: none; }
.cat-rename-form, .cat-rename-form label { display: grid; gap: 8px; }
.cat-rename-form input { width: 100%; min-height: 48px; padding: 8px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--panel); color: var(--text); font: inherit; }
.cat-rename-form p { margin: 0; color: var(--muted); }
@media (max-width: 859px) {
  .app:has(> #room-screen:not([hidden])):not(:has(#details.section-page[open])) > .tabs {
    position: sticky; bottom: var(--tg-covered-bottom, 0px); z-index: 5;
  }
  .app:has(#details.section-page[open]) { height: min(var(--app-height), 100dvh); min-height: 0; }
  .app:has(#details.section-page[open]) > #room-screen { display: none; }
  .app:has(#details.section-page[open]) > .tabs { order: 1; flex: none; }
  #details.section-page { position: relative; inset: auto; width: 100%; max-width: none; max-height: none;
    flex: 1 1 0; min-height: 0; margin: 0; padding: 0 12px 14px; overflow: auto;
    border: 0; border-radius: 0; box-shadow: none; background: var(--panel);
    scrollbar-width: thin; scrollbar-color: #a99ab4 transparent; }
}
#details.section-page .dialog-heading button { font-size: 28px; }
@media (min-width: 860px) {
  .app {
    --rail-width: clamp(320px, 35vw, 408px);
    --edge: max(16px, var(--safe-top));
    display: grid; grid-template: auto auto 1fr auto / minmax(0, 1fr) var(--rail-width); column-gap: 18px;
    width: min(calc(100% - 32px - var(--safe-left) - var(--safe-right)), 1320px); max-width: none;
    min-height: calc(var(--app-height) - var(--edge) - max(16px, var(--safe-bottom))); margin: var(--edge) auto max(16px, var(--safe-bottom));
    padding: 14px; border-radius: 21px;
  }
  .app > :is(.resources, .app-events, #room-screen, #battle-screen, .tabs) { grid-column: 1; min-width: 0; }
  .app > .resources { grid-row: 1; padding-top: 0; background: transparent; }
  .app > .app-events { grid-row: 2; }
  .app > :is(#room-screen, #battle-screen) { grid-row: 3; }
  .app > .tabs { grid-row: 4; }
  .viewport { height: clamp(235px, calc(var(--app-height) - 356px - var(--safe-bottom) - var(--safe-top)), 567px); }
  .room-text { max-height: clamp(235px, calc(var(--app-height) - 356px - var(--safe-bottom) - var(--safe-top)), 567px); }
  .room-window { width: min(46%, 194px); }
  .side-rail { display: grid; grid-column: 2; grid-row: 1 / 5; align-self: start; align-items: start;
    position: sticky; top: var(--edge); gap: 12px; min-width: 0;
    --rail-height: calc(min(var(--app-height), 100dvh) - var(--edge) - max(16px, var(--safe-bottom)) - 28px); }
  .wide-roster { display: flex; flex-direction: column; gap: 6px; min-width: 0; max-height: var(--rail-height);
    padding: 12px; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: var(--panel); }
  .wide-roster-heading { display: flex; justify-content: space-between; align-items: center; gap: 4px; min-height: 48px; }
  .wide-roster-heading h2 { font-size: 1.25rem; }
  .wide-roster-heading button { margin: 0; width: auto; padding-inline: 9px; }
  .wide-roster .cat-directory { display: flex; flex-direction: column; min-height: 0; }
  .wide-roster .cat-directory input { flex: none; }
  .wide-roster .cat-directory-results { min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
  .wide-roster .resident-list button { gap: 6px; }
  .wide-roster .resident-list small { font-size: .8rem; }
  #details.docked { position: static; width: 100%; max-width: none; max-height: var(--rail-height); margin: 0;
    min-width: 0; overflow: auto; border-radius: 15px; box-shadow: 0 3px 10px #4e36551f; }
  .side-rail:has(> #details.docked[open]) > .wide-roster { display: none; }
  .app:has(> #battle-screen:not([hidden])) { grid-template-columns: minmax(0, 1fr); max-width: 680px; }
  .app:has(> #battle-screen:not([hidden])) > .side-rail { display: none; }
}
@media (min-width: 1180px) {
  .app { --rail-width: clamp(566px, 47vw, 646px); }
  .side-rail:has(> #details.docked[open]) { grid-template-columns: minmax(215px, .65fr) minmax(0, 1fr); }
  .side-rail:has(> #details.docked[open]) > .wide-roster { display: flex; }
}
@media (min-width: 860px) {
  .app:has(#details.kiosk-page[open]) { grid-template: auto auto minmax(0, 1fr) auto / minmax(0, 1fr); max-width: 760px;
    height: calc(min(var(--app-height), 100dvh) - var(--edge) - max(16px, var(--safe-bottom))); min-height: 0; }
  .app:has(#details.kiosk-page[open]) > #room-screen { display: none; }
  .side-rail:has(> #details.kiosk-page[open]) { display: flex; grid-area: 3 / 1; position: static;
    align-self: stretch; align-items: stretch; min-height: 0; }
  .side-rail:has(> #details.kiosk-page[open]) > .wide-roster { display: none; }
  #details.docked.kiosk-page { min-height: 0; max-height: 100%; border: 0; border-radius: 0; box-shadow: none; }
}
#pause-hint { color: var(--muted); font-size: .78rem; }
#room-inspection-lock { margin: 0 0 5px; color: var(--muted); font-size: .78rem; }
#room-inspection-lock:not([hidden]) { display: block; }
#detail-content > p { color: var(--muted); margin: 5px 0 10px; }
.detail-list { display: grid; gap: 5px; }
.detail-list button, .outfits button, .detail-action { padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px; text-align: left; }
.detail-list button { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.detail-list small { font-size: 14px; color: var(--muted); }
.energy-summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; margin-bottom: 8px; border-radius: 10px; background: var(--raised); }
.energy-summary strong { display: flex; align-items: center; gap: 5px; }
.energy-goal, .samovar-stock { display: grid; gap: 5px; min-width: 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--raised); }
:is(.energy-goal, .samovar-stock) small { color: var(--muted); }
.samovar-stock form { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 6px; }
.samovar-stock select { min-height: 40px; }
.challenge-actions > .energy-goal { flex-basis: 100%; }
.energy-overview > .energy-goal { margin-bottom: 8px; }
.room-object-list { margin-bottom: 6px; }
.room-object-list button { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 8px; min-height: 48px; }
.room-text .room-object-list button { grid-template-columns: minmax(0, 1fr); }
.room-object-list img { width: 38px; height: 33px; object-fit: contain; }
.room-object-copy { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 8px; min-width: 0; }
.room-object-copy > * { max-width: 100%; overflow-wrap: anywhere; }
.room-object-list small { font-size: .8rem; }
[data-room-object-list] { container: room-objects / inline-size; }
@container room-objects (max-width: 12rem) {
  .room-object-list button { grid-template-columns: minmax(0, 1fr); }
  .room-object-list img { display: none; }
}
.energy-places button { grid-template-columns: 38px minmax(0, 1fr); gap: 2px 8px; text-align: left; }
.energy-places img { grid-row: span 2; }
.energy-places small { overflow-wrap: anywhere; }
.ui-disclosure { padding: 0 9px; border: 1px solid var(--line); border-radius: 8px; }
.ui-disclosure summary, .club-quote summary, .merchant-quote summary { display: list-item; align-content: center; min-height: 44px; font-weight: 600; cursor: pointer; }
.ui-disclosure[open] { padding-bottom: 8px; }
:is(.ui-disclosure, .club-screen details, .merchant-screen details, .kiosk-card details) > summary {
  position: relative; display: block; align-content: center;
  min-height: 44px; padding: 4px 23px 4px 4px; border-radius: 7px; list-style: none; font-weight: 650; cursor: pointer;
}
:is(.ui-disclosure, .club-screen details, .merchant-screen details, .kiosk-card details) > summary::-webkit-details-marker { display: none; }
:is(.ui-disclosure, .club-screen details, .merchant-screen details, .kiosk-card details) > summary::after {
  content: ""; position: absolute; inset-inline-end: 8px; top: calc(50% - 4px); width: 7px; height: 7px;
  border: solid var(--muted); border-width: 0 2px 2px 0; transform: rotate(-45deg);
}
:is(.ui-disclosure, .club-screen details, .merchant-screen details, .kiosk-card details)[open] > summary::after { transform: rotate(45deg); }
:is(.ui-disclosure, .club-screen details, .merchant-screen details, .kiosk-card details) > summary:focus-visible { outline: 2px solid #72568e; outline-offset: -2px; }
.throne-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.throne-card p, .throne-card h3, .throne-areas { margin: 0; }
.throne-holder { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 8px; border-radius: 10px; background: var(--panel); }
.throne-holder > div { flex: 1 1 8rem; min-width: 0; overflow-wrap: anywhere; }
.throne-holder > img { width: 68px; height: 60px; object-fit: contain; }
.throne-holder .throne-portrait { width: 48px; flex: none; }
.throne-holder small, .throne-pane small { display: block; color: var(--muted); }
.throne-pages.club-tabs { grid-template-columns: repeat(auto-fit, minmax(min(100%, 4.3rem), 1fr)); }
.throne-pane { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.throne-pane > .detail-action { min-height: 48px; }
.throne-score small { display: inline; }
.throne-areas { display: grid; grid-template-columns: 1fr 1fr; list-style: none; padding: 0; gap: 5px; }
.throne-areas li { display: flex; justify-content: space-between; align-items: center; padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; }
.throne-areas li > span { display: inline-flex; align-items: center; gap: 4px; }
.throne-areas .icon { width: 20px; height: 20px; }
.throne-outcome, .throne-history li { padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px; background: var(--raised); }
.throne-history { display: grid; gap: 6px; list-style: none; margin: 0; padding: 0; }
.throne-history li { display: flex; gap: 8px; align-items: center; }
.throne-history[data-throne-ranking] li { justify-content: space-between; overflow-wrap: anywhere; }
.throne-history[data-throne-ranking] li[aria-current="true"] { border-color: var(--accent); }
.throne-history .throne-portrait { width: 36px; flex: none; }
.throne-weight-steps { display: grid; gap: 3px; }
.throne-weight-rules { display: grid; gap: 5px; margin: 6px 0 0; padding-inline-start: 18px; }
.throne-tithe { display: grid; grid-template-columns: 1fr auto; gap: 5px; font-size: .85rem; }
.chair-project { display: grid; gap: 8px; }
.chair-project ol { display: grid; gap: 3px; margin: 0; padding: 0; list-style: none; }
.chair-project li { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--line); }
.chair-project button { min-height: 48px; }
.club-screen, #club-plan, .club-quote, .club-prep, .club-report, .club-morning { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.club-screen { overflow-wrap: anywhere; gap: 7px; }
#club-plan, .club-prep { gap: 7px; }
.club-screen p, .club-screen h3, .club-screen blockquote { margin: 0; }
.club-tabs, .club-split, .club-album-zones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
.club-tabs button, .club-album-zones button { min-height: 48px; text-align: center; }
.club-screen > .club-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.club-screen > .club-tabs button { display: grid; place-items: center; align-content: center; gap: 3px;
  min-height: 54px; padding: 4px 2px; border-radius: 9px; font-size: .75rem; font-weight: 650; }
.club-screen > .club-tabs img { width: 23px; height: 23px; object-fit: contain; }
.club-screen > .club-tabs button[aria-pressed="true"] { box-shadow: inset 0 -2px 0 #8967a7; }
.club-tabs [data-club-unread] { position: relative; }
.club-tabs [data-club-unread]::after { content: ""; position: absolute; top: 5px; right: 5px;
  width: 7px; height: 7px; border-radius: 50%; background: #6c5190; }
.club-tabs [aria-pressed="true"], .club-album-zones [aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
@media (max-width: 360px) {
  #details:has(.club-screen) .dialog-heading h2 { font-size: 1.125rem; }
}
.club-hero { border-radius: 10px; overflow: hidden; background: var(--raised); }
.club-hero > img, .club-dance-scene > img { display: block; width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: cover; }
.club-hero > div { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 8px; padding: 8px; }
.club-hero small, .club-muted { color: var(--muted); }
.club-visit-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); min-height: 74px;
  border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--raised); }
.club-visit-copy { display: grid; align-content: center; gap: 2px; min-width: 0; padding: 6px 8px; font-size: .84rem; }
.club-visit-copy small, .club-away small { color: var(--muted); }
.club-entrance { position: relative; min-width: 0; overflow: hidden; }
.club-door-background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 38% center; }
.club-door-figure { position: absolute; right: 8%; bottom: 6%; width: 29%; height: 70%; display: flex; align-items: end; justify-content: center; }
.club-door-figure:has(img)::before { position: absolute; bottom: 0; width: 52%; height: 7%; background: #4534514d;
  content: ""; border-radius: 50%; transform: translateX(13%); }
.club-door-guard { position: relative; max-width: 100%; max-height: 100%; height: 100%; width: 100%; object-fit: contain; object-position: bottom; }
.club-door-guard[src$="01.png"], .club-door-guard[src$="03.png"], .club-door-guard[src$="05.png"] { height: 86%; }
.club-zone-choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.club-zone-choices button { display: grid; align-content: start; gap: 3px; min-width: 0; min-height: 48px;
  padding: 3px 3px 5px; border-radius: 8px; font-size: .78rem; text-align: center; overflow-wrap: anywhere; }
.club-zone-choices button img { width: 100%; aspect-ratio: 2 / 1; object-fit: cover; border-radius: 5px; }
.club-zone-choices small { font-size: .66rem; color: var(--muted); }
.club-zone-choices [aria-pressed="true"], .club-style-picker [aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
.club-zone-choices [aria-pressed="true"] { box-shadow: inset 0 0 0 1px #9a7cb2; }
.club-style-choice, .detail-list .club-style-option { display: flex; gap: 8px; align-items: center; justify-content: start; min-height: 48px; }
.club-style-choice { min-height: 54px; background: var(--panel); }
.club-style-choice::after { content: "›"; margin-left: auto; }
.club-style-choice img, .club-style-option img { width: 37px; height: 37px; flex: none; object-fit: contain; }
.club-style-choice small, .club-style-option small { display: block; color: var(--muted); }
.club-style-choice .club-style-match, .club-style-option .club-style-match { color: #286554; }
.club-style-picker { max-height: min(72dvh, calc(var(--app-height) - 60px - var(--safe-top) - var(--safe-bottom))); }
.club-plan-hints { list-style: none; margin: -5px 0 0; padding: 6px 8px; border-radius: 6px; background: var(--raised); font-size: .84rem; }
.club-plan-hints:empty, [data-club-route]:empty { display: none; }
.club-entry-issue { font-weight: 650; }
[data-club-route="funding"] { display: grid; gap: 4px; }
[data-club-route="funding"] button { min-height: 48px; }
.club-slot-empty { border-style: dashed; }
.club-plan-actions { grid-template-columns: repeat(auto-fit, minmax(min(100%, 6rem), 1fr)); }
.club-plan-actions button { min-height: 48px; border-radius: 9px; text-align: center; }
.club-locked-setting { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 44px; }
.club-locked-setting small { white-space: nowrap; color: var(--muted); }
#club-plan label, .club-funding { display: grid; gap: 4px; font-size: .9rem; }
#club-plan select, .club-funding select { min-width: 0; max-width: 100%; min-height: 48px; padding: 4px 7px; border: 1px solid var(--line); border-radius: 7px; background: var(--panel); font: inherit; color: inherit; }
.club-quote { padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--raised); }
.club-departure { gap: 6px; padding: 8px; }
.club-quote > button { min-height: 48px; }
.club-quote > .primary { border-radius: 10px; text-align: center; }
.club-visits { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 8px; }
.club-visits > small, .club-door-risk { color: var(--muted); font-size: .82rem; }
.club-away { border: 1px solid var(--line); border-radius: 10px; background: var(--raised); }
.club-away > p { padding: 9px 8px; }
.club-away small { white-space: nowrap; }
.club-dance-scene { position: relative; display: block; isolation: isolate; overflow: hidden; --dance-time: 1.6s; }
.club-dance-scene .club-dance-rig {
  position: absolute; left: 50%; bottom: 3%; height: 70%; width: auto;
  translate: calc(-1 * var(--face-x, 55%)) 0;
}
.club-dance-rig::before {
  content: ""; position: absolute; bottom: -1%; left: calc(var(--face-x, 55%) - 27%);
  width: 54%; height: 7%; border-radius: 50%; background: #30191b52;
}
.club-dance-rig .body-assembly {
  position: absolute; inset: 0; transform-origin: var(--face-x, 55%) 89%;
  animation: club-dance-body var(--dance-time) steps(1, end) infinite;
}
.club-dance-rig .head-assembly { animation: club-dance-head var(--dance-time) steps(1, end) infinite; }
.club-dance-rig .tail-layer { animation: club-dance-tail var(--dance-time) steps(1, end) infinite; }
.club-dance-rig .walk-foot { animation: club-dance-foot var(--dance-time) steps(1, end) infinite; }
.club-dance-rig .foot-right { animation-delay: calc(-.5 * var(--dance-time)); }
@keyframes club-dance-body {
  0%, 50%, 100% { transform: none; }
  12.5% { transform: translate(-1.8%, 1.2%) rotate(-2deg); }
  25% { transform: translate(-2.5%, -1.4%) rotate(-3deg); }
  37.5% { transform: translate(-1%, .7%) rotate(-1deg); }
  62.5% { transform: translate(1.8%, 1.2%) rotate(2deg); }
  75% { transform: translate(2.5%, -1.4%) rotate(3deg); }
  87.5% { transform: translate(1%, .7%) rotate(1deg); }
}
@keyframes club-dance-head {
  0%, 50%, 100% { transform: none; }
  12.5%, 62.5% { transform: translateY(1.3%); }
  25%, 37.5% { transform: rotate(3deg); }
  75%, 87.5% { transform: rotate(-3deg); }
}
@keyframes club-dance-tail {
  0%, 50%, 100% { rotate: 0deg; }
  25%, 37.5% { rotate: 4deg; }
  75%, 87.5% { rotate: -4deg; }
}
@keyframes club-dance-foot {
  0%, 37.5%, 100% { transform: none; }
  12.5% { transform: translateY(-1%); }
  25% { transform: translateY(-3%); }
}
:root[data-motion="reduced"] .club-dance-rig :is(.body-assembly, .head-assembly, .tail-layer, .walk-foot, .eyes-blink) { animation: none; }
.club-odds, .club-score ul { list-style: none; margin: 0; padding: 0; }
.club-odds li, .club-score li { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 3px 0; }
.club-accounting li > b { flex-shrink: 0; white-space: nowrap; text-align: right; }
.club-terms li > b { flex: none; text-align: right; }
.club-screen details { padding: 0 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.club-screen details[open] { padding-bottom: 8px; }
.club-screen details p { margin: 6px 0; }
.club-morning:empty { display: none; }
.club-history button { display: grid; grid-template-columns: 35px minmax(0, 1fr) auto; align-items: center; min-height: 57px;
  padding: 6px 8px; border-radius: 9px; background: var(--panel); }
.club-history img { width: 32px; height: 32px; object-fit: contain; }
.club-history small { display: block; font-size: .75rem; }
.club-history b { font-variant-numeric: tabular-nums; color: var(--ink); font-size: .83rem; }
.club-reward { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 9px; background: var(--raised); }
.club-reward img { flex: none; width: min(34%, 96px); height: 104px; object-fit: contain; }
.club-reward small { color: var(--muted); }
.club-reward h3 { font-size: 1rem; line-height: 1.25; }
.club-reward strong { display: block; line-height: 1.25; }
.club-memory { overflow: hidden; border: 1px solid var(--line); border-radius: 14px;
  background: radial-gradient(ellipse at 26% 27%, var(--club-glow), transparent 68%),
    linear-gradient(90deg, #211b2d55, var(--club-night) 70%), var(--club-room-art) center / cover; }
.club-report-cover { display: flex; align-items: center; gap: 12px; width: 100%; min-width: 0;
  min-height: 66px; padding: 11px; text-align: left; color: #fff8fc; }
.club-memory-photo { flex: 0 0 41%; max-width: 148px; min-width: 0; height: clamp(102px, 36vw, 145px);
  display: block; overflow: hidden; border-radius: 8px; background: #241a2d66; }
.club-memory-photo img { display: block; width: 100%; height: 100%; object-fit: contain;
  filter: drop-shadow(0 3px 5px #19101c9c); }
[data-club-tone="warm"] .club-memory-photo img { object-fit: cover; object-position: center top;
  transform: scale(1.24); transform-origin: center top; }
.club-memory-caption { flex: 1; min-width: 0; }
.club-report-cover strong { display: block; margin: 4px 0; font-size: 1.05rem; line-height: 1.22; overflow-wrap: anywhere; }
.club-report-cover :is(small, .club-portrait-toggle) { color: #efe2ee; }
.club-report-cover small { display: block; }
.club-report-cover[aria-busy] .club-portrait-toggle { opacity: .45; }
.club-memory-place { display: flex; flex-wrap: wrap; align-content: end; align-items: baseline; justify-content: space-between;
  gap: 4px 12px; min-height: 114px; padding: 10px 12px; color: #fff8fc;
  background: linear-gradient(transparent, var(--club-night)); }
.club-memory-place small { color: #efe2ee; }
.club-memory > .club-score-banner { border: 0; border-radius: 0; background: var(--club-paper); }
.club-memory .club-hearts { margin-top: 5px; }
.club-memory .club-hearts span { font-size: 1.45rem; }
.club-screen .club-portrait { width: 100%; border: 1px solid var(--line); text-align: left; }
.club-portrait-toggle { margin-left: auto; font-size: 1.15rem; color: var(--muted); }
.club-photo-view { margin: auto; width: min(calc(100% - 24px - var(--safe-left) - var(--safe-right)), 490px); }
.club-photo-frame { max-height: min(58dvh, 500px); overflow: auto; margin-bottom: 8px; border-radius: 8px; background: var(--raised); }
.club-photo-frame img { display: block; width: 100%; max-height: min(58dvh, 500px); object-fit: contain; }
.club-photo-frame img:not([src]) { display: none; }
[data-club-photo-status] { margin: 0; min-height: 104px; display: grid; place-items: center; padding: 8px; text-align: center; }
.club-photo-view.zoomed img { width: 150%; max-width: none; max-height: none; }
.club-photo-view > button { width: 100%; min-height: 48px; text-align: center; }
.club-score { display: grid; gap: 6px; }
.club-score-banner {
  --heart-ink: #aa3b6b; --heart-empty: #e9cadb; --heart-edge: #b77c9a; --heart-paper: #ffeef4;
  padding: 9px 10px 8px; border: 1px solid color-mix(in srgb, var(--heart-edge), white 53%); border-radius: 12px;
  background: linear-gradient(112deg, var(--heart-paper), var(--raised));
}
.club-score-banner[data-club-score-grade="2"] {
  --heart-ink: #9f5b2e; --heart-empty: #efdbc9; --heart-edge: #b98b65; --heart-paper: #fff2db;
}
.club-score-banner[data-club-score-grade="1"] {
  --heart-ink: #7c5497; --heart-empty: #e5d6ec; --heart-edge: #a180b5; --heart-paper: #f5eafa;
}
.club-score-banner[data-club-score-grade="0"] {
  --heart-ink: #706084; --heart-empty: #e0d9e8; --heart-edge: #9a89a9; --heart-paper: #f6f2fa;
}
.club-score-banner[data-club-score-grade="4"] {
  --heart-ink: #9c245e; --heart-empty: #f0ccdc; --heart-edge: #bd7a7a; --heart-paper: #ffede0;
}
.club-score-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 8px; }
.club-score-heading strong { font-size: 1.04rem; }
.club-score-heading > span { padding: 3px 7px; border-radius: 7px; background: var(--panel); font-size: .8rem;
  font-weight: 700; font-variant-numeric: tabular-nums; }
.club-hearts { display: grid; grid-template-columns: repeat(5, max-content); justify-content: center; gap: 9px; margin-top: 3px; }
.club-hearts span { font-size: 1.95rem; line-height: 1.1;
  background: linear-gradient(90deg, var(--heart-ink) var(--heart-fill), var(--heart-empty) var(--heart-fill));
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-stroke: .65px var(--heart-edge);
  animation: club-heart-appear .22s ease-out var(--heart-delay) both; }
@keyframes club-heart-appear { from { opacity: .35; transform: scale(.85); } to { opacity: 1; transform: none; } }
:root[data-motion="reduced"] .club-hearts span { animation: none; }
@media (prefers-reduced-motion: reduce) { .club-hearts span { animation: none; } }
.club-score-causes > ul { padding-bottom: 4px; border-bottom: 1px solid var(--line); }
.club-score-prior { display: block; color: var(--muted); }
.club-record-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 10px; margin-bottom: 5px; }
.club-record-heading h3 { margin: 0; }
.club-record-heading small { padding: 2px 6px; border-radius: 5px; background: #eee4f6; color: #604875; font-size: .75rem; }
.club-score-causes > section { margin: 8px 0; }
[data-club-tone] { --club-glow: #57425e80; --club-night: #2e2138f5; --club-paper: #f5edf6; --club-caption: #69466e; }
[data-club-tone="warm"] { --club-glow: #eca76882; --club-night: #411a37f5; --club-paper: #fff0ed; --club-caption: #823352; }
[data-club-tone="neutral"] { --club-glow: #84614770; --club-night: #3c2b32f5; --club-paper: #faf1e6; --club-caption: #744e37; }
[data-club-tone="cold"] { --club-glow: #46556c8c; --club-night: #252c43f5; --club-paper: #edf0f7; --club-caption: #455473; }
[data-club-tone="tense"] { --club-glow: #604657a6; --club-night: #352839f5; --club-paper: #f4edf1; --club-caption: #79445a; }
.club-story { display: grid; overflow: hidden; list-style: none; margin: 0; padding: 0;
  border: 1px solid var(--line); border-radius: 12px; background: var(--club-paper); }
.club-story li { padding: 9px 12px; }
.club-story li + li { border-top: 1px solid color-mix(in srgb, var(--club-caption) 20%, transparent); }
.club-story li:has(blockquote) { border-left: 3px solid color-mix(in srgb, var(--club-caption) 52%, transparent); padding-left: 9px; }
.club-story strong { display: block; margin-bottom: 3px; font-size: .78rem; color: var(--club-caption); }
.club-story :is(p, blockquote, cite) { margin: 0; line-height: 1.4; }
.club-story :is(p, blockquote) { font-size: .9rem; }
.club-story[data-club-tone="warm"] blockquote { font-family: Georgia, serif; font-size: 1.025rem; }
.club-story cite { display: block; margin-top: 3px; color: var(--club-caption); font: .78rem/1.4 system-ui, sans-serif; }
.club-report-details > section { margin-top: 9px; }
.club-report-details h4 { margin: 4px 0; }
.club-morning-state {
  display: inline-block; margin-left: 4px; padding: 2px 5px;
  background: var(--raised); border-radius: 6px; color: var(--muted); font-size: .74rem; font-weight: 600;
}
.club-morning-effects li + li { border-top: 1px solid var(--line); }
.club-morning-effects li small { display: block; color: var(--muted); }
.club-morning-effects li > :is(small, time) { flex-shrink: 0; }
.club-result-note { margin: 0; color: var(--muted); font-size: .85rem; }
[data-album-best] { display: grid; gap: 8px; }
:is(.club-report, .club-album-detail) details > summary { min-height: 48px; padding-block: 12px; }
.club-story .club-story-event { margin-bottom: 4px; color: var(--muted); font-size: .8rem; }
.club-album-zones { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.club-album-zones button { display: grid; place-items: center; align-content: center; gap: 2px; padding: 3px; font-size: .78rem; }
.club-album-zones img { width: 100%; height: 27px; object-fit: cover; border-radius: 5px; }
.club-album-zones small { display: block; }
.club-album-progress { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 9px; background: var(--raised); }
.club-album-progress img { width: 54px; height: 47px; object-fit: contain; }
.club-album-progress small { display: block; color: var(--muted); }
.club-album, [data-album-heading], .club-album-detail { display: grid; gap: 8px; min-width: 0; }
.club-album-detail :is([data-album-best], [data-album-history]):empty { display: none; }
[data-album-report-link]:empty { display: none; }
[data-club-shared-story]:empty { display: none; }
[data-club-shared-story] img { display: block; width: 100%; height: auto; border-radius: 8px; }
.club-report-link { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 4px 6px; font-size: .78rem; }
.club-report-link img { width: 17px; height: 17px; }
.club-album-detail > button, .club-report > button { min-height: 48px; }
.club-album-hint { padding: 7px 9px; border-radius: 8px; background: var(--raised); }
.club-album-hint small { display: block; color: var(--muted); }
.club-album-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
#details.docked .club-album-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.club-album[data-album-tier="1"] .club-album-grid { border-left: 2px solid #9b80b1; padding-left: 4px; }
.club-album:is([data-album-tier="2"], [data-album-tier="3"], [data-album-tier="4"]) .club-album-grid {
  padding: 5px; border: 1px solid var(--line); border-radius: 10px; background: var(--raised); }
.club-album:is([data-album-tier="3"], [data-album-tier="4"]) .club-album-grid { border-width: 2px; border-color: #9173a5; }
.club-album-item { min-width: 0; min-height: 48px; aspect-ratio: 4 / 5; display: grid;
  grid-template: minmax(0, 1fr) auto / minmax(0, 1fr); gap: 2px; padding: 5px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--panel); text-align: left; font-size: .78rem; }
.club-album-item img { width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.club-album-item strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.club-album-item small, [data-album-result-count] { color: var(--muted); }
.club-album-item.closed-card, .club-locked-cover { display: grid; place-items: center; background: #f0e9f7; color: #6c5580; }
.club-album-item.closed-card { grid-template-rows: 1fr; font-size: 1.5rem; }
.club-locked-cover { width: 84px; height: 96px; border: 1px solid var(--line); border-radius: 9px; font-size: 2rem; }
.club-album-empty { grid-column: 1 / -1; color: var(--muted); }
.club-album-detail summary { min-height: 48px; align-content: center; cursor: pointer; }
.club-badges { display: block; white-space: nowrap; font-size: 11px; line-height: 1.1; }
.status-mark { display: inline-flex; align-items: center; border-radius: 5px; vertical-align: baseline; white-space: nowrap; }
.status-mark b { margin-inline-start: 1px; font-variant-numeric: tabular-nums; }
.profile-statuses:not(:empty) { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
.profile-statuses > button { display: grid; place-items: center; width: 44px; height: 44px; padding: 4px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--raised); }
.profile-effect-card :is(p, ul) { margin-block: 6px; }
.profile-effect-card ul:not(.green-values) { padding-inline-start: 16px; }
.profile-effect-card li small { display: block; }
.club-accessory { display: flex; align-items: center; gap: 8px; }
.club-accessory img { width: 64px; height: 64px; object-fit: contain; }
.club-pass { display: flex; align-items: center; gap: 10px; }
.club-pass img { width: 64px; height: 56px; object-fit: contain; }
.club-pass small { color: var(--muted); }
.merchant-screen, .merchant-quote, .merchant-list, [data-stock-card], [data-forge-quote], [data-receipt-drops] { display: grid; gap: 9px; }
.merchant-screen { grid-template-columns: minmax(0, 1fr); }
.merchant-screen h3, .merchant-screen h4, .merchant-screen p { margin: 0; }
.merchant-screen button, :is(.merchant-screen, .yard-prize-choice) select { min-height: 48px; }
.merchant-tabs, .merchant-subtabs, .merchant-chest-grid, .merchant-filters { display: grid; gap: 5px; }
.merchant-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.merchant-tabs button { display: grid; align-content: center; justify-items: center; gap: 3px;
  min-width: 0; padding: 4px 2px; text-align: center; font-size: .75rem; line-height: 1.12; overflow-wrap: anywhere; }
.merchant-tabs img { width: 24px; height: 24px; object-fit: contain; }
@media (max-width: 360px) {
  .merchant-tabs button { font-size: .6875rem; }
}
.merchant-subtabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.merchant-chest-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr)); }
.merchant-subtabs button { text-align: center; padding-inline: 5px; font-size: .87rem; }
.merchant-screen [aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
.merchant-filters label, .merchant-quote label { display: grid; gap: 3px; font-size: .88rem; }
:is(.merchant-screen, .yard-prize-choice) select { width: 100%; min-width: 0; font: inherit; color: inherit;
  background: var(--panel); border: 1px solid var(--line); border-radius: 7px; padding: 5px; }
.merchant-list button, .merchant-loot-row, .merchant-item-card { display: flex; align-items: center; gap: 8px; }
.merchant-list button, .merchant-loot-row, .merchant-quote, .merchant-chest-grid button, .merchant-screen details, .merchant-feedback {
  padding: 8px; text-align: left; border: 1px solid var(--line); border-radius: 9px; }
.merchant-item-card, .merchant-quote, .merchant-feedback { padding: 10px; border-radius: 9px; background: var(--raised); }
.merchant-list small, .merchant-loot small, .merchant-item-card small, .merchant-muted { display: block; color: var(--muted); }
.stock-screen { display: grid; gap: 9px; min-width: 0; container-type: inline-size; }
.stock-tools, .stock-filter-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.stock-tools .shop-search { flex: 1 1 5rem; min-width: 0; }
.stock-tools button { display: flex; align-items: center; gap: 6px; font-size: .875rem; }
.stock-filter-count { background: var(--raised); border-radius: 1em; padding: 2px 6px; }
.stock-filters { grid-template-columns: repeat(auto-fit, minmax(min(100%, 7rem), 1fr)); padding: 8px;
  border: 1px solid var(--line); border-radius: 9px; }
.stock-filters[hidden] { display: none; }
.stock-filter-actions { grid-column: 1 / -1; justify-content: flex-end; }
.shop-search input { width: 100%; min-width: 0; min-height: 48px; padding: 8px 12px; color: var(--ink);
  font: inherit; background: var(--panel); border: 1px solid var(--line); border-radius: 9px; }
.merchant-screen .shop-filter-panel { padding-block: 0; }
.shop-filter-panel summary { min-height: 48px; align-content: center; cursor: pointer; }
.shop-filter-panel .merchant-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-block-end: 8px; }
.merchant-filters .shop-availability { display: flex; align-items: center; gap: 8px; min-height: 48px; grid-column: 1 / -1; cursor: pointer; }
.shop-availability input { width: 18px; height: 18px; accent-color: #64517e; }
.shop-result-heading { display: flex; align-items: center; justify-content: space-between; gap: 6px 12px; flex-wrap: wrap; }
.shop-result-heading p { color: var(--muted); font-size: .88rem; }
.stock-list button { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; width: 100%; overflow-wrap: anywhere; }
.stock-list .item-art-frame { width: 48px; height: 44px; }
.stock-meta { display: grid; justify-items: end; gap: 2px; }
.stock-price { white-space: nowrap; font-size: .86rem; font-weight: 700; }
.stock-lock { margin-inline-end: 3px; font-size: .72rem; }
@container (max-width: 11rem) {
  .stock-list button { grid-template-columns: 48px minmax(0, 1fr); }
  .stock-meta { grid-column: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; }
}
.item-art-frame { position: relative; display: grid; place-items: center; box-sizing: border-box; flex-shrink: 0;
  width: 54px; height: 48px; padding: 4px; border: 1px solid #b7aab2; border-radius: 7px; background: var(--panel); }
.item-art-frame img { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.item-art-frame:has(img[src^="assets/technique-"])[data-rank="0"] { background: #f1edf1; }
.item-art-frame:has(img[src^="assets/technique-"])[data-rank="1"] { background: #ddf2e6; }
.item-art-frame:has(img[src^="assets/technique-"])[data-rank="2"] { background: #eee1fa; }
.item-art-frame:has(img[src^="assets/technique-"])[data-rank="3"] { background: #ffedc5; }
.item-art-frame { container-type: size; }
.item-art-frame:not(.monochrome) img { --item-d: min(100cqw, 100cqh); }
.technique-art { --item-d: 36px; }
.item-art-frame img, .technique-art { filter: var(--rarity-light, none); }
.item-art-frame[data-rank="1"]:not(.monochrome) img, .technique-art[data-rank="1"] {
  --rarity-light: drop-shadow(0 0 calc(var(--item-d) * .017) #83d7ce);
}
.item-art-frame[data-rank="2"]:not(.monochrome) img, .technique-art[data-rank="2"] {
  --rarity-light: drop-shadow(0 0 calc(var(--item-d) * .017) #ba8df1)
    drop-shadow(0 0 calc(var(--item-d) * .04) #ab78e89c);
}
.item-art-frame[data-rank="3"]:not(.monochrome) img, .technique-art[data-rank="3"] {
  --rarity-light: drop-shadow(0 0 calc(var(--item-d) * .029) #ffbd53)
    drop-shadow(0 0 calc(var(--item-d) * .071) #d98b23ad);
}
.grade-badge { display: inline-flex; align-items: center; padding: 1px 5px; border-radius: 5px; font-size: .75rem; }
:is(.item-art-frame, .grade-frame)[data-rank] { position: relative; border: 1px solid #b7aab2; }
:is(.item-art-frame, .grade-frame)[data-rank="1"] { border-color: #4c806b; }
:is(.item-art-frame, .grade-frame)[data-rank="2"] { border: 3px double #78559a; }
:is(.item-art-frame, .grade-frame)[data-rank="3"] { border: 2px solid #a36b24; box-shadow: inset 0 0 0 1px #f5cd81; }
:is(.item-art-frame, .grade-frame)[data-rank]::after { pointer-events: none; }
:is(.item-art-frame, .grade-frame)[data-rank="1"]::after {
  content: ""; position: absolute; top: -1px; right: 12%; width: min(25%, 9px); border-top: 3px solid #4c806b;
}
:is(.item-art-frame, .grade-frame)[data-rank="2"]::after {
  content: ""; position: absolute; inset: -2px; border-radius: inherit; border: 1px solid #bd8ee7;
  box-shadow: 0 0 4px #ab78e899; opacity: .45; animation: epic-frame 3.2s ease-in-out infinite;
}
:is(.item-art-frame, .grade-frame)[data-rank="3"]::before {
  content: ""; position: absolute; inset: 1px; pointer-events: none;
  background: linear-gradient(#ffe8a3 0 0) top right / min(25%, 12px) 2px no-repeat,
    linear-gradient(#ffe8a3 0 0) top right / 2px min(25%, 12px) no-repeat,
    linear-gradient(#ffe8a3 0 0) bottom left / min(25%, 12px) 2px no-repeat,
    linear-gradient(#ffe8a3 0 0) bottom left / 2px min(25%, 12px) no-repeat;
}
:is(.item-art-frame, .grade-frame)[data-rank="3"]::after {
  content: ""; position: absolute; inset: -2px; border-radius: inherit; border: 2px solid #ffd77d;
  box-shadow: 0 0 9px #f6a941db, inset 0 0 4px #ffd977a0; opacity: .7;
  animation: legendary-frame 3.8s ease-in-out infinite;
}
@keyframes epic-frame { 0%, 100% { opacity: .3; } 50% { opacity: .7; } }
@keyframes legendary-frame {
  0%, 100% { opacity: .34; transform: scale(.99); }
  35% { opacity: 1; transform: scale(1.045); }
  62% { opacity: .82; transform: scale(1.015); }
}
:root[data-motion="reduced"] :is(.item-art-frame, .grade-frame):is([data-rank="2"], [data-rank="3"])::after { animation: none; }
.item-art-frame.monochrome img { filter: grayscale(1); }
.status-mark[data-rank] { padding-inline: 2px; }
.club-photo-frame.grade-frame[data-rank]::after { inset: 1px; }
.club-accessory .item-art-frame { width: 64px; height: 64px; }
.item-art-frame img:is([src$="gear-c2-reinforced-work-weapon.png"], [src$="gear-phone-canopy-weapon.png"],
  [src$="gear-c2-video-couriers-weapon.png"]) { transform: rotate(36deg); }
.merchant-item-card .item-art-frame { width: clamp(54px, 18vw, 78px); height: 66px; }
.merchant-item-card > div { min-width: 0; overflow-wrap: anywhere; }
.book-index { display: grid; gap: 8px; min-width: 0; container-type: inline-size; }
.book-counts { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px 12px;
  padding: 8px 10px; background: var(--raised); border-radius: 8px; font-size: .88rem; color: var(--muted); }
.book-counts strong { color: var(--ink); }
.book-ranks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.book-ranks button { display: flex; align-items: center; justify-content: center; gap: 6px; min-width: 0;
  min-height: 48px; padding-inline: 4px; font-size: .87rem; overflow-wrap: anywhere; }
.book-ranks button[aria-pressed="true"] { font-weight: 700; }
.book-ranks i { flex: 0 0 10px; width: 10px; height: 10px; border: 1px solid #746e81; border-radius: 2px; }
.book-ranks i[data-rank="1"] { border-color: #4c806b; background: #cbeade; }
.book-ranks i[data-rank="2"] { border: 3px double #78559a; background: #e8dcf6; }
.book-ranks i[data-rank="3"] { border: 2px solid #936827; background: #f1d6a2; transform: rotate(45deg); }
.book-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.book-results, .book-set { display: grid; gap: 7px; min-width: 0; }
.book-results, .merchant-screen:has(.book-art) { container-type: inline-size; }
.book-set > button, .book-grid > button { padding: 5px; border: 1px solid var(--line); border-radius: 9px;
  color: inherit; background: var(--panel); min-width: 0; }
.book-set > button { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px; text-align: left; }
.book-set small, .book-grid small { display: block; color: var(--muted); }
.book-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.book-grid > button { display: grid; align-content: start; justify-items: center; gap: 3px; font-size: .76rem;
  line-height: 1.22; text-align: center; }
.book-grid strong { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
  max-width: 100%; overflow: hidden; overflow-wrap: break-word; hyphens: auto; }
.book-grid .item-art-frame { width: min(100%, 64px); height: 48px; }
@container (max-width: 21rem) {
  .book-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@container (max-width: 13rem) {
  .book-grid, .book-ranks, .book-index .merchant-subtabs, .book-index .book-filters { grid-template-columns: minmax(0, 1fr); }
  .book-grid > button { grid-template-columns: 64px minmax(0, 1fr); justify-items: start;
    align-items: center; align-content: center; column-gap: 8px; text-align: left; }
  .book-grid .item-art-frame { grid-row: span 2; }
  .book-grid strong { display: block; }
}
.book-art { padding: 0; border: 0; border-radius: 7px; background: transparent; }
.merchant-item-card.book-art-expanded { flex-direction: column; align-items: stretch; }
.book-art-expanded .book-art { display: grid; place-items: center; }
.book-art-expanded .item-art-frame { width: min(100%, 240px); height: min(50vw, 220px); }
.merchant-chest-grid button { display: grid; align-content: start; justify-items: center; text-align: center; gap: 4px; }
.merchant-chest-grid img { width: 100%; height: 65px; object-fit: contain; }
.merchant-chest-grid strong { font-size: .86rem; overflow-wrap: anywhere; }
[data-chest-quote] summary { min-height: 48px; }
.merchant-chest-stage { display: grid; justify-items: center; gap: 7px; padding: 9px; background: var(--raised); border-radius: 10px; }
.merchant-chest-figure { position: relative; display: block; height: 130px; aspect-ratio: var(--chest-ratio); }
.merchant-chest-figure img { position: absolute; display: block; pointer-events: none; }
.chest-frame { inset: 0; width: 100%; height: 100%; }
.chest-lock { position: absolute; overflow: hidden; }
.chest-lock.round { border-radius: 50%; }
.merchant-chest-stage.opening .chest-open { animation: chest-lid var(--chest-duration) var(--chest-elapsed) steps(1, end) both; }
.chest-closed { animation: chest-body var(--chest-duration) var(--chest-elapsed) steps(1, end) both; }
.chest-lock { animation: chest-unlock var(--chest-duration) var(--chest-elapsed) steps(1, end) both; }
.chest-lock img { max-width: none; animation: chest-lock-turn var(--chest-duration)
  calc(var(--chest-elapsed) + var(--lock-lag)) steps(1, end) both; }
@keyframes chest-lid { 0% { opacity: 0; } 53%, 100% { opacity: 1; } }
@keyframes chest-body { 0% { opacity: 1; } 53%, 100% { opacity: 0; } }
@keyframes chest-unlock { 0% { opacity: 0; } 17% { opacity: 1; } 53%, 100% { opacity: 0; } }
@keyframes chest-lock-turn {
  0%, 17% { transform: none; }
  25% { transform: translateY(calc(var(--lock-lift) * .5)) rotate(calc(var(--lock-turn) * .55)); }
  41%, 100% { transform: translateY(var(--lock-lift)) rotate(var(--lock-turn)); }
}
:root[data-motion="reduced"] .merchant-chest-stage.opening .chest-open { animation: none; }
:root[data-motion="reduced"] :is(.chest-closed, .chest-lock) { display: none; }
.chest-reel { --reel-tile: 58px; --reel-step: calc(var(--reel-tile) + 8px); position: relative;
  overflow: hidden; min-width: 0; padding-block: 10px; border: 1px solid var(--line);
  border-radius: 10px; background: #efe6f7; }
.chest-reel-track { position: relative; left: 50%; display: flex; gap: 8px; width: max-content;
  animation: chest-spin var(--reel-time) cubic-bezier(.12,.66,.14,1) var(--reel-delay) both; }
.chest-reel-tile { width: var(--reel-tile); height: var(--reel-tile); display: grid; place-items: center;
  border-radius: 8px; background: var(--panel); }
.chest-reel-tile .item-art-frame { width: 100%; height: 100%; padding: 3px; border-radius: inherit; }
.chest-reel-tile > .icon { width: 34px; height: 34px; }
.chest-reel::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, #efe6f7 0%, transparent 14%, transparent 86%, #efe6f7 100%); }
.chest-reel-marker { position: absolute; z-index: 1; inset: 2px auto 2px 50%; width: calc(var(--reel-tile) + 4px);
  transform: translateX(-50%); border: 2px solid #36705c; border-radius: 10px; pointer-events: none; }
.chest-reel-marker::before, .chest-reel-marker::after { content: ""; position: absolute; left: 50%;
  transform: translateX(-50%); border: 5px solid transparent; }
.chest-reel-marker::before { top: -1px; border-top-color: #36705c; }
.chest-reel-marker::after { bottom: -1px; border-bottom-color: #36705c; }
@keyframes chest-spin {
  from { transform: translateX(calc(-5 * var(--reel-step) - var(--reel-tile) / 2)); }
  to { transform: translateX(calc(-1 * var(--reel-stop) * var(--reel-step) - var(--reel-tile) / 2)); }
}
:root[data-motion="reduced"] .chest-reel-track { animation-duration: 1ms; animation-delay: 0ms; }
.merchant-loot { margin: 0; padding: 0; list-style: none; display: grid; gap: 5px; }
button.merchant-loot-row { width: 100%; min-height: 48px; background: var(--raised); }
.merchant-loot-arrow { margin-inline-start: auto; color: var(--muted); font-size: 1.2em; }
.merchant-screen details p, .merchant-screen details button { margin-top: 6px; }
.forge-levels { display: grid; gap: 6px; }
.workshop-confirm { display: grid; gap: 9px; }
.workshop-confirm .detail-action { min-height: 48px; }
.scrap-receipt { display: grid; gap: 8px; }
.scrap-stage { display: grid; place-items: center; height: 146px; padding: 10px; background: var(--raised); border-radius: 9px; }
.scrap-stage img { display: block; width: min(100%, 180px); height: 120px; object-fit: contain; }
.scrap-stage .scrap-vise { animation: scrap-press 850ms steps(1, end); }
.scrap-receipt p { display: grid; gap: 2px; }
.scrap-receipt small { color: var(--muted); }
.scrap-receipt button { min-height: 48px; }
@keyframes scrap-press { 52% { transform: translateY(2px); } 68% { transform: none; } }
:root[data-motion="reduced"] .scrap-stage .scrap-vise { animation: none; }
.forge-level-label { display: flex; flex-wrap: wrap; gap: 0 8px; align-items: baseline; font-variant-numeric: tabular-nums; }
.forge-level-label small { color: var(--muted); }
.forge-cuts { display: grid; grid-template-columns: 2fr 3fr 3fr; gap: 6px; }
.forge-cuts span { display: flex; gap: 3px; }
.forge-cuts i { flex: 1; height: 8px; border: 1px solid #c1b6c7; border-radius: 2px; }
.forge-cuts .filled { background: #516f61; border-color: #516f61; }
.forge-cuts .next { border-color: #78559a; box-shadow: inset 0 0 0 1px #78559a; }
.cat-rig .catalog-weapon { left: 65%; top: 35%; width: 25%; height: 37%; transform: none; z-index: 2; }
.cat-rig[data-pose="seated"] .catalog-weapon { left: 65%; top: 66%; width: 22%; height: 33%; }
.cat-rig.armed-catalog .grip-right { z-index: 3; }
.cat-rig .catalog-collar { top: calc(var(--chin) + 1%); }
.preview-stage { position: relative; padding: 8px; border-radius: 12px; background: radial-gradient(ellipse at center, #fff8dc 0, #eee4f7 72%); }
.preview-placeholder, .icon-fallback { display: none; }
.preview-stage:has(.body-layer[hidden]) .preview-placeholder {
  display: grid; position: absolute; inset: 0; place-content: center; padding: 4px;
  color: var(--muted); text-align: center; font-size: 11px; overflow-wrap: anywhere;
}
.icon[hidden] + .icon-fallback { display: inline; font-size: 11px; }
.cat-preview { width: clamp(87px, 16vh, 142px); margin: 0 auto; }
.framed-preview { display: grid; place-items: center; aspect-ratio: 1; }
.framed-preview .cat-preview { width: 74%; }
.trophy-frame { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.trophy-key { position: absolute; right: 4px; bottom: 4px; width: 26%; max-width: 44px; pointer-events: none; }
.trophy-line { display: flex; align-items: center; gap: 6px; }
.trophy-icon { width: 32px; height: 32px; object-fit: contain; flex: none; }
.trophy-title { font-weight: 700; color: var(--ink); }
.cat-profile > p { color: var(--muted); margin: 3px 0 8px; font-size: 14px; }
.object-preview { display: block; margin: 6px auto; width: min(58%, 170px); height: 108px; object-fit: contain; }
.cat-vitals { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 7px; color: var(--muted); font-size: 13px; }
.cat-vitals .resource-value { background: var(--raised); padding: 3px 8px; border-radius: 7px; }
[data-other-cat] { display: grid; gap: 8px; }
.neighbor-hero { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: stretch; gap: 8px; }
.neighbor-hero .preview-stage { display: grid; place-items: center; }
.neighbor-hero .cat-preview { width: min(100%, 108px); }
.neighbor-overview { display: grid; align-content: center; gap: 7px; padding: 8px; border-radius: 12px; background: var(--raised); }
.neighbor-overview p { margin: 0; color: var(--muted); font-size: .75rem; }
.neighbor-vitals { display: grid; gap: 4px; }
.neighbor-vitals > div { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 1px 5px; font-size: .75rem; }
.neighbor-vitals strong { text-align: right; font-variant-numeric: tabular-nums; }
.neighbor-vitals .vital-bar { grid-column: 1 / -1; margin: 0; }
.neighbor-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.neighbor-actions > button { display: grid; justify-items: center; align-content: center; gap: 2px; min-height: 44px;
  padding: 4px 2px; font-size: .75rem; }
.neighbor-actions > button > span { font-size: .95rem; line-height: 1; }
[data-neighbor-place]:empty { display: none; }
[data-neighbor-place] > button { width: 100%; }
.energy-room-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; overflow-wrap: anywhere; }
.energy-room-card > p { margin: 0; }
.energy-room-card .object-preview { margin: 0 auto; max-height: 128px; }
.energy-room-card progress { width: 100%; accent-color: #347a62; }
.energy-rest-meter { position: relative; padding-block: 2px; }
.energy-rest-meter::after { content: ""; position: absolute; inset: 0 auto 0 50%; translate: -50% 0;
  width: 2px; border-radius: 2px; background: #54406a; box-shadow: 0 0 0 1px #fff; pointer-events: none; }
.energy-rest-result { padding: 6px 8px; border-radius: 8px; background: var(--raised); }
.friday-supper { display: grid; gap: 5px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.friday-supper h3 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 1rem; }
.friday-supper h3 img { width: 38px; height: 28px; object-fit: contain; }
.energy-room-card button { text-align: center; min-height: 48px; }
.room-place-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.bed-rest-choices button { padding: 5px 3px; line-height: 1.3; }
.bed-rest-choices small { font-size: .75rem; white-space: nowrap; }
.energy-upgrade { border: 1px solid var(--line); border-radius: 8px; padding: 0 8px; }
.energy-upgrade summary { display: list-item; align-content: center; min-height: 48px; cursor: pointer; }
.energy-upgrade[open] { padding-bottom: 8px; }
.energy-upgrade p { margin: 3px 0 6px; }
.room-funding-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5px; margin-top: 8px; }
.room-funding-form :is(label, .fund-amounts, small) { grid-column: 1 / -1; }
.room-funding-form :is(label, small) { font-size: .85rem; color: var(--muted); }
.room-funding-form input { min-width: 0; min-height: 48px; width: 100%; padding: 5px 8px; color: var(--ink);
  background: var(--panel); border: 1px solid var(--line); border-radius: 7px; font: inherit; }
.fund-amounts { display: flex; flex-wrap: wrap; gap: 5px; }
.fund-amounts .detail-action { flex: 1 1 auto; min-width: 0; min-height: 48px; text-align: center; }
.fund-amounts .detail-action[aria-pressed="true"] { background: var(--raised); border-color: #9a7cb2; }
.room-funding-form button { min-height: 48px; overflow-wrap: anywhere; }
.room-funding-note { padding: 8px 10px; border-radius: 8px; background: var(--raised); }
.room-funding-done { display: grid; gap: 5px; }
.room-funding-done p { margin: 0; }
.room-project-next { display: flex; align-items: center; gap: 10px; padding: 6px 10px; margin-bottom: 8px;
  border-radius: 8px; background: var(--raised); }
.room-project-next small, .room-project-copy small { display: block; color: var(--muted); }
:is(.room-project-progress, .energy-rest-meter progress) { display: block; appearance: none; width: 100%; height: 7px; border: 0; border-radius: 6px;
  background: #e9e0f0; accent-color: #347a62; }
:is(.room-project-progress, .energy-rest-meter progress)::-webkit-progress-bar { border-radius: 6px; background: #e9e0f0; }
:is(.room-project-progress, .energy-rest-meter progress)::-webkit-progress-value { border-radius: 6px; background: #417f68; }
:is(.room-project-progress, .energy-rest-meter progress)::-moz-progress-bar { border-radius: 6px; background: #417f68; }
.room-project-art { position: relative; display: block; width: 56px; height: 52px; flex-shrink: 0; }
.room-project-art img { display: block; width: 100%; height: 100%; object-fit: contain; }
.room-project-art .project-lamp { position: absolute; width: 32%; height: 49%; left: 0; top: 0; }
.room-project-art .project-frame { position: absolute; width: 34%; height: 37%; right: 0; top: 0; }
.room-project-main .room-project-art { width: 148px; height: 108px; margin: auto; }
.room-project-next .room-project-art { width: 66px; height: 64px; }
.detail-list .energy-shop { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; min-height: 76px; }
.room-project-copy { display: grid; gap: 3px; }
.room-project-copy strong small { display: inline; margin-inline-start: 4px; font-weight: 500; }
.room-project-copy > small { font-size: .81rem; }
.outfits button:not(.primary)[aria-pressed="true"] { border-color: #6b5288; color: #42305c; background: #eee3fb; }
.notice { position: fixed; z-index: 8; bottom: calc(60px + var(--safe-bottom)); left: 50%; transform: translateX(-50%); background: var(--accent); color: var(--ink); font-weight: 650; padding: 8px 12px; border-radius: 8px; max-width: min(95%,460px); pointer-events: none; }
.operation-recovery { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 8px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--panel); color: var(--text); font-size: .86rem; }
.operation-recovery button { min-height: 48px; font-weight: 650; }
body > .operation-recovery { position: fixed; z-index: 9; bottom: calc(67px + var(--safe-bottom)); left: 50%;
  transform: translateX(-50%); width: min(calc(100% - 20px), 360px); box-shadow: 0 3px 10px #4e365530; }
#details > .operation-recovery { position: sticky; top: 54px; z-index: 2; margin-bottom: 7px; }
dialog .notice { top: max(8px, var(--safe-top)); bottom: auto; width: max-content;
  max-width: min(calc(100vw - 32px), 440px); text-align: center; }
:root[data-motion="reduced"] .cat-rig .head-layer { animation: none; }
@media (min-width: 481px) {
  .app { box-shadow: 0 0 0 1px var(--line), 0 0 50px #0005; }
}
#battle-screen { gap: 8px; padding: max(9px, var(--safe-top)) 12px max(14px, var(--safe-bottom)); }
.battle-markup { display: contents; }
.fight-status-detail p { margin: 4px 0 8px; }
.fight-forecast p { margin: 4px 0 7px; color: var(--muted); font-size: .85rem; }
.forecast-response { border-block-start: 1px solid var(--line); }
.forecast-response summary { font-size: .9rem; }
.forecast-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: .85rem; margin-bottom: 5px; }
.forecast-table :is(th, td) { padding: 4px 2px; text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.forecast-table :is(th, td):first-child { width: 50%; text-align: left; }
.forecast-picked { background: #e3f4eb; }
.forecast-threat { padding: 6px 8px; border-radius: 8px; background: var(--raised); }
.fight-title { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 2px; }
.fight-title > div { flex: 1 1 min-content; min-width: 0; overflow-wrap: break-word; }
.fight-title h1, .fight-result h1 { margin-top: 2px; }
.fight-title h1 { margin: 0; font-size: 1.2rem; line-height: 1.25; }
.fight-title .eyebrow { font-size: .75rem; }
.fight-title button { flex: none; max-width: 100%; margin-inline-start: auto; padding: 4px 8px; min-height: 48px; font-size: .84rem; text-align: center; }
.fight-surrender { padding-top: 12px; }
.fight-surrender p { margin-block: 6px 12px; }
.fight-surrender button[data-game="surrender"] { background: #fff0e7; border-color: #ddab9d; color: #6b352d; }
:is(.battle-return, .urgent-action) { display: flex; gap: 8px; align-items: center; justify-content: space-between;
  margin: 3px 10px; padding: 4px 6px 4px 9px; background: #f4e8fa; border: 1px solid #ceb5df; border-radius: 10px; }
:is(.battle-return, .urgent-action) > div { min-width: 0; }
:is(.battle-return, .urgent-action) strong, .battle-return small { display: block; overflow-wrap: anywhere; }
:is(.battle-return, .urgent-action) strong { font-size: .9rem; }
.battle-return small, .urgent-action time { color: var(--muted); font-size: .8rem; }
.urgent-action.invite-in-card { display: none; }
:is(.battle-return, .urgent-action) time { font-variant-numeric: tabular-nums; font-weight: 700; }
.battle-return time { margin-right: 6px; }
:is(.battle-return, .urgent-action) button { flex: none; min-height: 48px; max-width: 44%; text-align: center; font-size: .84rem; }
.app:has(.battle-return:not([hidden])) > #room-screen > .quest { display: none; }
.dialog-heading > :is(.battle-return, .urgent-action) button { width: auto; min-width: 48px; padding-inline: 8px; font-size: .84rem;
  border-radius: 7px; color: var(--ink); }
.dialog-heading > :is(.battle-return, .urgent-action) button:hover { background: var(--accent); }
.arena { position: relative; isolation: isolate; container-type: inline-size; overflow: hidden; background: #ead8b4;
  border: 1px solid var(--line); border-radius: 14px; padding: 8px 10px 5px;
  --round-frame: 41.6667ms; --round-contact: calc(4 * var(--round-frame));
  --motion-beat: calc(14 * var(--round-frame)) steps(1, end) both; }
.arena-stage { --arena-horizon: 65%; position: absolute; inset: 0; pointer-events: none; z-index: -1; }
.arena-stage.floor { --arena-horizon: 100%; }
.arena-backdrop, .arena-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.arena-backdrop { object-fit: cover; object-position: center var(--arena-horizon); }
.arena-stage:not([data-renderer]) canvas, .arena-stage[data-renderer] img { visibility: hidden; }
.arena[data-actors-renderer] .duelist .cat-rig { clip-path: inset(50%); }
.arena[data-actors-renderer] .duelist.down::before { visibility: hidden; }
.arena[data-actors-renderer] .duelist.down::before, .arena[data-actors-renderer] .technique-cue img { visibility: hidden; }
.cat-raid-card, .cat-raid-quote, .cat-truce-card { display: grid; gap: 8px; }
.cat-raid-card button, .cat-truce-card button, .cat-raid-card select { min-height: 48px; }
.neighbor-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; overflow-wrap: anywhere; }
.neighbor-card button { min-height: 48px; }
.neighbor-card [data-neighbor-confirmation] { display: grid; gap: 6px; }
.neighbor-card [data-neighbor-confirmation] .room-place-actions { grid-template-columns: minmax(0, 1fr) auto; }
.supply-panel, .supply-detail { display: grid; gap: 8px; }
.supply-filters { display: flex; flex-wrap: wrap; gap: 4px; }
.supply-filters button { flex: 1 1 auto; min-height: 48px; text-align: center; }
.supply-filters [aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
.supply-panel button { min-height: 48px; }
.detail-list .supply-row { display: flex; justify-content: start; align-items: center; gap: 8px; }
.detail-list .supply-row { font-size: .875rem; line-height: 1.25; }
.supply-row .item-art-frame { width: 40px; height: 40px; padding: 2px; }
.supply-row small { display: block; }
.supply-row b { margin-left: auto; white-space: nowrap; }
.supply-detail { grid-template-columns: 50px minmax(0, 1fr); align-items: center; border: 1px solid var(--line); border-radius: 9px; padding: 8px; }
.supply-detail > .item-art-frame, .kiosk-effect-preview .item-art-frame { width: 50px; height: 50px; padding: 3px; }
.supply-detail > p, .supply-detail > button, .supply-detail > details { grid-column: 1 / -1; }
.supply-detail > div > small { display: block; color: var(--muted); }
.supply-preview { padding: 6px 8px; border-radius: 7px; background: var(--raised); }
.table-meta, .table-stakes, .table-actions { display: flex; gap: 7px; align-items: center; justify-content: space-between; }
.table-meta, .table-quota { font-size: .85rem; font-variant-numeric: tabular-nums; }
.table-quota { color: var(--muted); }
.table-stakes > button, .table-actions > button { flex: 1; text-align: center; min-width: 0; min-height: 48px; }
.table-stakes [aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
.table-odds { display: grid; gap: 4px; background: var(--raised); padding: 7px 9px; border-radius: 8px; }
.table-odds > span { display: flex; justify-content: space-between; gap: 6px; }
.table-odds b { flex-shrink: 0; white-space: nowrap; }
.table-board { display: grid; gap: 10px; padding: 9px; background: #e5eee5; border: 1px solid #b7c9b9; border-radius: 9px; }
.table-hand { display: grid; gap: 4px; }
.table-hand > strong { display: flex; align-items: baseline; justify-content: space-between; font-size: .9rem; }
.table-total { font-variant-numeric: tabular-nums; }
.table-cards { display: flex; flex-wrap: wrap; gap: 4px; }
.table-card { display: grid; justify-items: center; align-content: center; flex: 0 0 34px; min-height: 44px; line-height: 1.05;
  color: #253342; background: #fffaf1; border: 1px solid #92828e; border-radius: 5px; font-size: 1rem; }
.table-card.red { color: #9b3045; }
.table-card-back { background: #6b5791; color: #f5effb; border-color: #574672; box-shadow: inset 0 0 0 3px #f4ebed; }
.table-reveal { animation: table-reveal .18s steps(1, end); }
@keyframes table-reveal { 0% { transform: scaleX(.2); } 50% { transform: none; } }
:root[data-motion="reduced"] .table-reveal { animation: none; }
.table-result > p { margin: 6px 0; }
.neighbor-card .detail-list button > span:first-child { display: grid; gap: 2px; min-width: 0; }
.neighbor-card .detail-list button > span + span { flex: none; white-space: nowrap; }
.neighbor-summary { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 7px 9px;
  border-radius: 8px; background: var(--raised); }
.neighbor-wave { pointer-events: none; position: absolute; width: 26px; top: -9px; right: -6px;
  transform-origin: bottom left; animation: neighbor-wave .45s steps(1) 5 alternate; }
@keyframes neighbor-wave { 50% { transform: rotate(15deg); } }
:root[data-motion="reduced"] .neighbor-wave { animation: none; }
.cat-raid-card select { font: inherit; color: inherit; }
.raid-money { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.raid-money span { display: grid; padding: 7px; border: 1px solid var(--line); border-radius: 8px; background: var(--raised); }
.bed-arena-prop { position: absolute; width: 19%; right: 9%; bottom: 46%; pointer-events: none; }
.bed-tactics { border: 1px solid var(--line); border-radius: 8px; padding: 0 8px; }
.bed-tactics summary { min-height: 48px; align-content: center; cursor: pointer; }
.bed-tactics[open] { padding-bottom: 8px; }
.bed-tactics p, .bed-tactics select, .bed-tactics .room-place-actions { margin: 4px 0 7px; }
.bed-tactics select { display: block; width: 100%; min-height: 48px; padding: 6px; font: inherit; color: inherit; }
.bed-tactics .route-tendency select { width: auto; }
.bed-tactics small { display: block; margin-block: 4px 7px; }
.bed-tactics .room-place-actions { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
.bed-tactics .room-place-actions button { padding-inline: 5px; }
.hp-pair { position: relative; z-index: 4; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.fighter-hp { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; font-size: .8125rem; gap: 3px 5px; background: var(--panel); padding: 5px 7px; border-radius: 8px; }
.fighter-title { grid-column: 1 / -1; display: flex; align-items: baseline; justify-content: space-between; gap: 4px; }
.fighter-title strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fighter-hp .resource-value { grid-column: 2; grid-row: 2; color: var(--muted); }
.fighter-hp progress { grid-column: 1; grid-row: 2; align-self: center; width: 100%; height: 7px; accent-color: #2a8b77; }
.fighter-hp + .fighter-hp progress { accent-color: #a45a66; }
.duel-actors { height: clamp(124px, calc(var(--app-height) - 516px - var(--safe-top) - var(--safe-bottom)), 260px);
  max-height: max(124px, 56cqw); position: relative; }
.signal { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; min-height: 34px;
  gap: 2px 8px; border: 1px solid var(--line); border-radius: 9px; background: var(--raised);
  padding: 4px 8px; font-size: .77rem; }
.signal-move { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 5px; }
.signal-move .eyebrow { font-size: inherit; }
.signal-move .icon { width: 18px; height: 18px; }
.fight-warnings, .round-log, .fight-resources { color: var(--muted); font-size: .875rem; }
.fight-warnings { display: grid; gap: 4px; padding: 5px 8px; border-radius: 8px; background: var(--raised); }
.round-meta { display: flex; align-items: center; gap: 5px; margin-inline-start: auto; color: var(--muted);
  white-space: nowrap; font-variant-numeric: tabular-nums; }
#fight-clock { padding: 1px 4px; border-radius: 5px; background: var(--panel); color: var(--text); }
.round-log { margin: 0; padding: 0 6px; max-block-size: 8rem; overflow-y: auto; scrollbar-width: thin;
  list-style: none; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; font-size: .75rem; }
.round-log li { display: grid; grid-template-columns: 1.4rem repeat(2, minmax(0, 1fr)); gap: 5px; padding-block: 4px; }
.round-log li + li { border-top: 1px solid var(--line); }
.round-log-number { font-variant-numeric: tabular-nums; align-self: start; }
.battle-connection { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 8px;
  padding: 4px 8px; border-radius: 8px; background: var(--raised); color: var(--muted); font-size: .875rem; }
.battle-connection button { min-height: 48px; }
#battle-screen button[aria-disabled="true"] { color: #586b76; cursor: default; }
#battle-screen button[aria-disabled="true"]:not([aria-pressed="true"]) { background: #e7f0ee; }
.attempt-cost { color: var(--muted); font-size: .8125rem; }
.quote-notice { border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; background: var(--raised); font-size: 13px; }
.round-side { display: grid; align-content: start; gap: 1px; }
.round-side-hit { display: flex; flex-wrap: wrap; align-items: center; gap: 0 3px; }
.round-side b { color: var(--text); }
.round-side .icon { display: block; width: 14px; height: 14px; }
.round-hit { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.round-effects { font-size: .6875rem; line-height: 1.2; }
.round-effects span { white-space: nowrap; }
.round-journal, .recovery-result { border: 1px solid var(--line); border-radius: 9px; background: var(--raised); }
.round-journal { min-width: 0; }
.round-journal summary { min-height: 48px; padding: 13px 9px; cursor: pointer; overflow-wrap: anywhere; }
.round-details { display: grid; gap: 6px; margin: 0 8px 8px; padding: 8px; border-radius: 7px; background: var(--panel); font-size: .8125rem; }
.round-details h3 { margin: 0; font-size: .875rem; }
.round-details-side p { color: var(--muted); overflow-wrap: anywhere; }
.round-details-side + .round-details-side { border-top: 1px solid var(--line); padding-top: 5px; }
.recovery-result { padding: 8px 10px; }
.recovery-result + .detail-action { min-height: 48px; }
.fight-controls { display: grid; gap: 5px; }
.moves, .fight-options { display: grid; gap: 5px; }
.moves { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fight-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fight-commit button { width: 100%; }
:is(.fight-controls, .fight-commit) button { min-height: 48px; border: 1px solid var(--line); border-radius: 8px; padding: 4px 2px; font-size: .875rem; overflow-wrap: anywhere; }
.fight-controls .moves button { display: grid; align-content: center; justify-items: center; gap: 1px;
  min-height: 65px; background: var(--panel); font-size: .83rem; }
.moves button small { color: var(--muted); font-size: .68rem; }
.fight-resources, .recent-moves { display: flex; align-items: center; gap: 5px; }
.fight-resources { flex-wrap: wrap; justify-content: space-between; }
.recent-moves .icon { width: 20px; height: 20px; display: block; }
.fight-controls [aria-pressed="true"], .fight-controls .moves [aria-pressed="true"],
.fight-boosts [aria-pressed="true"] { border-color: #217869; background: #cff1e4; }
:is(.fight-controls, .fight-commit) button:disabled, .detail-action:disabled { background: #e7f0ee; color: #586b76; }
.fight-controls .moves button:disabled:not([aria-pressed="true"]) { opacity: .66; }
.fight-controls .fight-commit button:disabled { background: var(--raised); box-shadow: none; }
.fight-details { background: var(--panel); font-size: .84rem; }
.fight-details details { margin-block: 4px; }
.fight-details [data-surrender-offer] { color: #884558; }
.fight-support { display: grid; gap: 4px; min-width: 0; font-size: .8125rem; }
.fight-boosts { display: flex; align-items: stretch; gap: 4px; min-width: 0; }
.fight-boosts > button { flex: 1 1 0; display: grid; justify-items: center; align-content: center; gap: 1px;
  min-width: 44px; min-height: 48px; max-width: 8.5rem; padding: 2px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--panel); font-size: .75rem; line-height: 1.2; }
.fight-boosts > :is([data-game="tempo"], [data-game="potion"]) { flex-grow: .8; }
.fight-boost-value { display: flex; align-items: center; justify-content: center; gap: 2px;
  min-height: 22px; font-weight: 700; font-variant-numeric: tabular-nums; }
.fight-boost-value .item-art-frame { width: 22px; height: 22px; padding: 1px; }
.fight-boosts > button > small { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .68rem; }
.fight-boosts > button:disabled:not([aria-pressed="true"]) { opacity: .66; }
.fight-boost-meters { display: grid; justify-items: center; align-content: center; gap: 3px; padding-inline: 2px;
  color: var(--muted); font-size: .68rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fight-support p, .fight-technique-notes p { margin: 0; overflow-wrap: anywhere; }
.fight-support [data-support-outlook] { display: grid; gap: 2px; }
.fight-technique-notes { display: grid; gap: 5px; margin-block: 5px; }
.technique-setup { border: 1px solid var(--line); border-radius: 8px; min-width: 0; background: #f4f0fa; }
.technique-setup summary { min-height: 44px; padding: 11px 9px; cursor: pointer; overflow-wrap: anywhere; }
.technique-setup[open] { padding: 0 9px 9px; }
.technique-setup[open] summary { padding-inline: 0 23px; }
.technique-setup label { display: block; }
.technique-effect, .technique-setup > p { margin: 5px 0 10px; font-size: .8125rem; }
.technique-selected h3 { margin: 0 0 6px; overflow-wrap: anywhere; }
.technique-selected .detail-action + .detail-action { margin-top: 6px; }
.technique-card-art, .technique-queued { display: flex; align-items: center; gap: 8px; }
.technique-card-art .item-art-frame, .technique-queued .item-art-frame { width: 38px; height: 38px; padding: 2px; }
.technique-queued img { width: 24px; height: 24px; }
.technique-setup select { display: block; min-height: 44px; width: 100%; margin: 4px 0; padding: 5px;
  color: inherit; background: #fff; border: 1px solid var(--line); border-radius: 6px; }
.battle-statuses { display: inline-flex; flex-shrink: 0; gap: 2px; white-space: nowrap; font-size: 12px; }
.challenge-portrait { width: 100%; height: 124px; display: grid; place-items: center; border-radius: 8px; }
.challenge-summary { display: grid; grid-template-columns: minmax(76px, 29%) minmax(0, 1fr); align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; background: var(--raised); }
.challenge-summary .challenge-portrait { height: 92px; }
.challenge-info { display: grid; gap: 3px; }
.challenge-info p { color: var(--muted); font-size: .875rem; }
.challenge-loot { display: flex; align-items: center; gap: 5px; }
.quest-trophy.item-art-frame { width: 24px; height: 24px; padding: 2px; vertical-align: middle; display: inline-grid; }
.challenge-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 7px 0; }
.challenge-actions > .order-credit { flex-basis: 100%; color: var(--muted); }
.challenge-actions button { min-height: 48px; text-align: center; }
.challenge-actions .primary { flex: 1; }
.fight-result { display: grid; align-content: start; gap: 10px; flex: 1; min-width: 0; }
.fight-result > :is(h1, p) { margin: 0; }
.loot { display: grid; gap: 4px; padding: 12px; background: #fff4d8; border: 1px solid #e7d29c; border-radius: 12px; }
.loot span { font-size: 14px; color: var(--muted); }
.fight-loot { padding: 8px; }
.loot-item { display: flex; align-items: center; gap: 7px; min-width: 0; text-align: left; font-size: .875rem; line-height: 1.25; }
.loot-item > span:last-child { min-width: 0; overflow-wrap: anywhere; font-size: inherit; color: inherit; }
.loot-item .item-art-frame { width: 32px; height: 30px; padding: 2px; }
button.loot-item { min-height: 48px; padding: 4px 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
button.loot-item::after { content: ""; flex: 0 0 6px; height: 6px; margin-inline: auto 3px;
  border: solid var(--muted); border-width: 1px 1px 0 0; rotate: 45deg; }
.fight-credits { display: grid; gap: 4px; padding: 7px 9px; border-radius: 8px; background: var(--raised); font-size: .875rem; }
.fight-credits p { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 2px 8px; margin: 0; }
.fight-credits p > span { color: var(--muted); }
.fight-result-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.fight-result-actions > button { flex: 1 1 9rem; }
.fight-result-actions > .primary { flex-basis: 100%; }
.fight-result .detail-action { min-height: 48px; text-align: center; }

.kiosk-card, .kiosk-upgrades { display: grid; gap: 10px; }
.yard-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.yard-link { display: flex; align-items: center; gap: 6px; min-height: 48px; padding: 6px; background: var(--raised);
  border: 1px solid var(--line); border-radius: 11px; text-align: left; font-size: .875rem; }
.yard-link img { width: 36px; height: 36px; object-fit: contain; }
.yard-link small, .yard-route p { display: block; color: var(--muted); font-size: .86rem; }
.yard-route, .route-rivals { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.yard-route .detail-action { min-height: 48px; }
.route-hero { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--raised); }
.route-hero img { display: block; width: 100%; aspect-ratio: 3.6 / 1; object-fit: cover; }
.route-hero div { padding: 5px 9px 8px; }
.route-hero small, .route-today small, .route-gate small, .route-rival small { color: var(--muted); }
.route-hero h2 { font-size: 1.08rem; line-height: 1.22; }
.route-today, .route-gate { display: grid; gap: 2px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
.route-gate { background: #f5eff8; }
.route-gate button { margin-top: 2px; }
.route-progress-line { display: flex; align-items: center; gap: 8px; padding-inline: 2px; }
.route-progress-line small { flex: none; }
.route-progress { display: block; width: 100%; min-width: 0; height: 7px; accent-color: #548373; }
.route-map.ui-disclosure summary { min-height: 48px; }
.yard-group-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 116px), 1fr)); gap: 5px; margin-bottom: 8px; }
.yard-group-tabs button { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline;
  gap: 0 5px; padding: 5px 7px; font-size: .83rem; overflow-wrap: anywhere; }
.yard-group-tabs button small { color: var(--muted); }
.route-map-title { grid-column: 1 / -1; }
.yard-group-tabs [aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
.route-mark { flex: none; font-weight: 700; color: #3f6c58; }
.route-rivals .route-rival { grid-template-columns: 42px minmax(0, 1fr) auto; gap: 7px; min-height: 52px; margin: 0; }
.route-rivals .route-rival-portrait { width: 42px; height: 42px; }
.route-rival-info { min-width: 0; overflow-wrap: anywhere; }
.route-rival-info strong { display: flex; flex-wrap: wrap; gap: 3px 6px; align-items: baseline; }
.route-rival-info small { font-size: .76rem; }
.route-rivals .route-boss { border-color: #bba4d0; background: #f4edf9; }
.route-rival-action { font-size: .82rem; font-weight: 650; }
.yard-extras { display: grid; gap: 5px; }
.seal-mark { display: inline-block; width: .63em; height: .63em; margin-inline-end: .35em;
  border-radius: 50%; background: #2e2238; box-shadow: inset 0 0 0 1px #7b637f; }
.seal-progress { margin: 8px 0; padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: #f4eff9; }
.seal-progress progress { display: block; width: 100%; height: 8px; margin-block: 6px; accent-color: #70518a; }
.seal-progress p { margin: 4px 0; }
.seal-progress > details { margin-top: 6px; }
.seal-progress > details > summary { min-height: 48px; }
.yard-prize-options { grid-template-columns: repeat(auto-fit, minmax(min(100%, 8.25em), 1fr)); }
.yard-prize-options > p { grid-column: 1 / -1; }
.yard-prize-options button { display: grid; justify-items: center; justify-content: stretch; align-content: center; gap: 4px;
  min-height: 48px; min-width: 0; padding: 5px; font-size: .875rem; line-height: 1.25; text-align: center; background: var(--panel); }
.yard-prize-options button > span:not(.item-art-frame) { display: -webkit-box; -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; }
.yard-prize-options .item-art-frame { width: 36px; height: 34px; padding: 3px; }
.yard-prize-choice { min-width: 0; overflow-wrap: anywhere; }
.yard-prize-choice .detail-action { min-height: 48px; max-width: 100%; }
.yard-prize-title { display: flex; align-items: center; gap: 7px; }
.yard-prize-image { flex: 0 0 36px; width: 36px; height: 34px; object-fit: contain; }
.yard-prize-title .item-art-frame { width: 54px; height: 52px; }
.yard-reward { display: grid; gap: 9px; }
.yard-reward .detail-action { min-height: 48px; text-align: center; }
.yard-prize-options [aria-pressed="true"] { background: #e4f4eb; border-color: #95bcae; }
.yard-prize-choice .merchant-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-block: 7px; }
.yard-prize-choice .merchant-filters label { min-width: 0; }
.yard-prize-choice .merchant-filters:has([data-prize-filter="kind"]) label:has([data-prize-filter="set"]) { grid-column: 1 / -1; }
.yard-route [data-yard-xp][aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
.yard-route section h3 { margin: 8px 0 4px; font-size: .93rem; }
.journal-panel, .journal-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; overflow-wrap: anywhere; }
#details:modal:has(> #detail-content > .journal-panel) { height: 28rem; overflow-y: auto; scrollbar-gutter: stable;
  scrollbar-width: thin; scrollbar-color: #a99ab4 transparent; }
.journal-card .detail-list { grid-template-columns: minmax(0, 1fr); }
.order-next button { min-height: 48px; background: var(--panel); }
#yard-order [data-journal-action="task-branch"][aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
.journal-card { padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: var(--raised); }
.journal-card header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px; }
.journal-card p, .journal-rewards { margin: 0; }
.journal-card small, .journal-rewards small { display: block; color: var(--muted); }
#week-task .detail-list small { font-size: .875rem; overflow-wrap: anywhere; }
.starter-route .detail-list button { min-height: 48px; justify-content: flex-start; }
.journal-card progress { display: block; width: 100%; height: 8px; accent-color: #755597; }
.phone-scene, .phone-call-card { display: grid; gap: 8px; }
.phone-scene p, .phone-call-card p { margin: 0; }
.phone-current { display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: 8px; background: var(--raised); }
.phone-current small { display: block; }
.phone-wait, .phone-contact time { color: var(--muted); font-size: .82rem; }
.detail-list .phone-contact { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px; min-height: 48px; }
.journal-rewards { display: grid; gap: 8px; padding-left: 20px; }
.journal-panel .club-tabs { grid-template-columns: repeat(3,minmax(0,1fr)); }
.journal-panel .club-tabs button { padding-inline: 3px; font-size: .85rem; }
[data-journal-feed], .journal-pending, .journal-pending ul, .journal-timeline { display: grid; gap: 6px; min-width: 0; }
.journal-pending ul, .journal-timeline { padding: 0; margin: 0; list-style: none; }
.journal-pending h3 { font-size: .9rem; margin: 4px 0 0; }
.journal-category { display: flex; align-items: center; gap: 8px; color: var(--muted); }
.journal-category select { flex: 1; min-width: 0; min-height: 48px; border: 1px solid var(--line); border-radius: 8px;
  padding: 0 8px; background: var(--panel); color: var(--text); font: inherit; }
.journal-entry { background: var(--raised); border: 1px solid var(--line); border-radius: 8px; }
.journal-entry:is(li), .journal-entry summary { display: flex; align-items: center; gap: 8px; padding: 6px 8px; min-height: 48px; }
.journal-entry summary { cursor: pointer; list-style: none; }
.journal-entry summary::-webkit-details-marker { display: none; }
.journal-entry-label { display: grid; flex: 1; min-width: 0; }
.journal-entry :is(small, time) { color: var(--muted); font-size: .8rem; }
.journal-chevron { color: var(--muted); font-size: 20px; }
.journal-entry[open] .journal-chevron { transform: rotate(90deg); }
.journal-entry-body { display: grid; gap: 6px; border-top: 1px solid var(--line); padding: 8px; }
.journal-entry-body .detail-action, .journal-shortcuts .detail-action { min-height: 48px; }
.journal-shortcuts button { width: 100%; margin-bottom: 4px; }
.journal-empty { padding: 8px 0; color: var(--muted); }
.achievement-panel { display: grid; gap: 8px; }
.achievement-panel > p { margin: 0; }
.achievement-panel select { padding: 9px; min-height: 48px; border: 1px solid var(--line); border-radius: 8px; font: inherit; color: inherit; background: #fff; }
.achievement-card { border: 1px solid var(--line); border-radius: 10px; padding: 0 9px; background: #faf7fd; }
.achievement-card[open] { background: #fff; padding-bottom: 8px; }
.achievement-card summary { min-height: 48px; display: flex; gap: 6px; align-items: center; cursor: pointer; }
.achievement-card summary::-webkit-details-marker { display: none; }
.achievement-card summary::after { content: "›"; flex: none; }
.achievement-card[open] summary::after { transform: rotate(90deg); }
.achievement-card summary small { margin-left: auto; color: var(--muted); text-align: right; }
.achievement-icon { display: grid; place-items: center; width: 32px; flex: none; font-size: 1.2rem; }
.achievement-card p { margin: 5px 0 8px; }
.achievement-steps { display: grid; gap: 4px; list-style: none; padding: 0; margin: 0 0 8px; }
.achievement-steps li { display: flex; justify-content: space-between; gap: 6px; }
.achievement-steps strong { white-space: nowrap; }
.achievement-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.achievement-actions button { min-height: 48px; }
.achievement-actions [aria-pressed="true"] { background: #def0e7; }
.journal-panel[data-journal-style="watch"] .journal-card { border-left: 4px solid #735b91; }
.journal-panel[data-journal-style="lamp"] .journal-card { border-left: 4px solid #639b82; }
.journal-panel[data-journal-style="poster"] .journal-card { border-left: 4px solid #9d6888; }
.progression-panel, .training-list { display: grid; gap: 8px; }
.life-panel, .life-panel .progression-panel, .life-panel .species-picker, [data-build-restore] { grid-template-columns: minmax(0, 1fr); overflow-wrap: anywhere; }
[data-build-restore] > .detail-action { min-height: 48px; }
.life-panel .species-picker select { width: 100%; min-width: 0; }
.progression-panel > p { margin: 0; }
.progression-panel small, .life-badge small, .build-restore small { display: block; color: var(--muted); }
.training-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--raised); }
.training-pips { display: flex; gap: 3px; margin-block: 4px; }
.training-pips i { width: 13px; height: 4px; border-radius: 3px; background: #ddd0eb; }
.training-pips i.filled { background: #80619a; }
.training-row > div { flex: 1 1 min(100%, 7.5rem); min-width: 0; overflow-wrap: anywhere; }
.training-row p { margin: 3px 0 0; font-size: .82rem; }
.training-row button { margin-inline-start: auto; min-height: 48px; max-width: 100%; text-align: center; overflow-wrap: anywhere; }
.training-reset { grid-template-columns: minmax(0, 1fr); overflow-wrap: anywhere; }
.training-reset label { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-height: 48px; }
.training-reset select { min-width: 70px; min-height: 48px; margin-inline-start: auto; padding: 4px 8px;
  border: 1px solid var(--line); border-radius: 6px; color: inherit; background: var(--panel); font: inherit; }
.training-reset button { min-height: 48px; }
.training-reset button[aria-disabled="true"] { color: var(--muted); cursor: default; }
.training-reset-quote { padding: 8px; border-radius: 8px; background: var(--raised); overflow-wrap: anywhere; }
.training-reset-quote dl { margin: 4px 0 0; }
.training-reset-quote dl > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 8px; padding-block: 4px; }
.training-reset-quote dd { margin: 0 0 0 auto; text-align: end; font-variant-numeric: tabular-nums; }
.life-heading, .life-badge { display: flex; align-items: center; gap: 10px; }
.life-emblem { width: 42px; height: 42px; object-fit: contain; }
.life-conditions, .build-restore { display: grid; gap: 5px; list-style: none; padding: 0; margin: 4px 0; }
.life-conditions li { display: flex; gap: 7px; align-items: baseline; }
.life-conditions small { display: inline; }
[data-life-conditions] .detail-action, [data-progression="ascend"] { min-height: 48px; }
.build-restore li { background: var(--raised); border-radius: 7px; padding: 7px 8px; }
.life-technique { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 8px; }
.life-technique .item-art-frame { width: 42px; height: 42px; }
.species-picker { display: grid; gap: 6px; }
.species-card { display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: center; gap: 6px 8px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--raised); padding: 8px; }
.species-card p { margin: 4px 0; font-size: .85rem; }
.species-card .species-skill { grid-column: 1 / -1; margin: 0; }
.species-doll-preview { display: grid; place-items: center; height: 102px; }
.species-doll-preview .cat-rig { height: 98px; }
.species-doll-preview .cast-shadow { display: none; }
.species-skill-cue { position: absolute; z-index: 3; left: 4%; bottom: -8px; pointer-events: none;
  font-size: 11px; border-radius: 6px; background: #f0e8f9; padding: 2px 4px; white-space: nowrap; color: #382e49; }
.set-cue { position: absolute; z-index: 3; left: 9%; bottom: 25%; padding: 2px 5px;
  border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--text); font-size: 13px; }
.enemy .set-cue { left: auto; right: 10%; }
.set-note { font-size: .87rem; }
.route-rival { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; text-align: left;
  width: 100%; min-height: 48px; gap: 8px; border-top: 1px solid var(--line); }
.route-rival-portrait { width: 32px; height: 36px; padding: 2px; }
.route-rival small { display: block; }
.rival-brief { display: grid; gap: 5px; margin: 7px 0; color: var(--muted); font-size: .88rem; }
.rival-brief strong { color: var(--text); }
.route-tendency { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.route-tendency select { min-height: 44px; max-width: 55%; border: 1px solid var(--line); border-radius: 6px;
  background: var(--panel); color: var(--text); font: inherit; }
.boss-choice { padding: 8px; border: 1px solid var(--line); border-radius: 9px; background: var(--raised); }
.boss-choice summary, .rival-brief summary { cursor: pointer; }
.boss-choice > summary { padding-block: 12px; line-height: 24px; }
.kiosk-income { display: grid; gap: 6px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--raised); }
.kiosk-amount { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.kiosk-amount strong { font-size: 1.35rem; color: var(--ink); }
.kiosk-income progress { width: 100%; height: 10px; accent-color: #367259; }
.kiosk-income p, .kiosk-next { color: var(--muted); font-size: .86rem; }
.kiosk-income button { width: 100%; min-height: 48px; border-radius: 9px; }
.kiosk-income button:disabled { background: #e0e9e1; }
.kiosk-income .kiosk-reason { color: #8a4434; }
.kiosk-card button { min-height: 48px; }
.kiosk-card { grid-template-columns: minmax(0, 1fr); }
.kiosk-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
.kiosk-tabs button { display: grid; place-items: center; }
.kiosk-tabs img { width: 36px; height: 34px; object-fit: contain; }
.kiosk-tabs button, .kiosk-guard-list button { min-height: 48px; padding: 5px 4px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--panel); font-size: .84rem; }
.kiosk-tabs [aria-pressed="true"], .kiosk-guard-list [aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
.kiosk-stall { display: grid; justify-items: center; gap: 4px; padding: 10px 8px 6px; border-radius: 12px; background: radial-gradient(ellipse at 50% 42%, #fff9e5, #f2e8e1); }
.kiosk-art { width: min(86%, 214px); height: 155px; position: relative; --counter: 39%; }
.kiosk-art[data-body-level="1"] { --counter: 75%; }
.kiosk-art[data-body-level="2"] { --counter: 53%; }
.kiosk-table { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center bottom;
  filter: drop-shadow(0 3px 3px #78634b3d); }
.kiosk-prop { position: absolute; bottom: var(--counter); height: auto; max-height: 45%; object-fit: contain; object-position: center bottom; }
.kiosk-prop-display { left: 28%; width: 27%; }
.kiosk-prop-cash { left: 59%; width: 18%; }
.kiosk-prop-shutters { left: 1%; bottom: 5%; width: 15%; }
.kiosk-prop-post { right: -6%; bottom: 0; width: 23%; }
.kiosk-stall strong { font-size: .86rem; }
.kiosk-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 0; }
.kiosk-metrics div { border: 1px solid var(--line); border-radius: 8px; padding: 6px 4px; text-align: center; }
.kiosk-metrics dt { color: var(--muted); font-size: .76rem; }
.kiosk-metrics dd { margin: 2px 0 0; font-weight: 700; font-size: .87rem; }
.kiosk-metrics dd small { white-space: nowrap; font-size: .76rem; font-weight: 600; }
.kiosk-income-details, .kiosk-daily { font-size: .87rem; }
.kiosk-income-details summary, .kiosk-daily summary { min-height: 48px; align-content: center; cursor: pointer; }
.kiosk-income-details p, .kiosk-daily p, .kiosk-effects p, .kiosk-effects h3 { margin: 4px 0; }
.kiosk-daily .market-filters { margin-top: 6px; }
.kiosk-daily button { min-height: 48px; }
.kiosk-forecast { display: grid; gap: 4px; margin-top: 6px; }
.kiosk-forecast small { color: var(--muted); }
.kiosk-rate { white-space: nowrap; }
.kiosk-effects { display: grid; gap: 10px; overflow-wrap: anywhere; }
.market-preparation-panel { display: grid; gap: 8px; }
#details:has([data-market-incoming]) > .dialog-heading > #urgent-action:is([data-urgent-kind="invite-market"], [data-urgent-kind="market-status"]) { display: none; }
.market-preparation { display: grid; gap: 6px; padding: 9px; border: 1px solid var(--line); border-radius: 9px; background: var(--raised); }
.market-preparation p { margin: 0; }
.market-preparation small { color: var(--muted); }
.market-preparation time { font-variant-numeric: tabular-nums; white-space: nowrap; }
.kiosk-alarm-prop { position: absolute; left: 67%; top: 21%; width: 15%; height: 20%; object-fit: contain; filter: drop-shadow(1px 2px 1px #563d3455); }
.kiosk-effect-active, .kiosk-effect-preview { padding: 10px; background: var(--raised); border-radius: 10px; }
.kiosk-effect-active { display: flex; align-items: center; gap: 10px; }
.kiosk-effect-active img { width: 50px; height: 48px; object-fit: contain; }
.kiosk-effect-preview header { display: flex; align-items: center; gap: 10px; }
.kiosk-effect-preview header small { display: block; color: var(--muted); }
.kiosk-effects .detail-list .item-art-frame, .club-supply-preview .item-art-frame { width: 38px; height: 38px; padding: 2px; }
.kiosk-effects .detail-list button > span:nth-child(2) { flex: 1; }
.club-supply-preview:not(:empty) { display: flex; align-items: center; gap: 8px; color: var(--muted); }
.club-supply-preview:empty { display: none; }
.kiosk-effects button[aria-pressed="true"] { background: var(--raised); border-color: #9a7cb2; }
.kiosk-effect-prop { position: absolute; object-fit: contain; pointer-events: none; z-index: 1; }
.kiosk-effect-advert { width: 32%; height: 16%; left: 17%; top: 25%; }
.kiosk-effect-guard { width: 15%; height: 18%; right: 18%; top: 29%; }
.kiosk-upgrades h3 { margin: 0; font-size: 1rem; }
.kiosk-upgrade { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 7px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 9px; }
.kiosk-upgrade > img { width: 42px; height: 32px; object-fit: contain; }
.kiosk-upgrade p, .kiosk-upgrade small { font-size: .82rem; color: var(--muted); }
.kiosk-upgrade button { display: flex; justify-content: center; align-items: center; gap: 4px; min-height: 48px; min-width: 60px; padding: 4px 7px; background: var(--raised); }
.kiosk-upgrade button:disabled { background: #eeebef; }
.kiosk-upgrade button .icon { width: 18px; height: 18px; }
:is(.kiosk-purchase, .kiosk-purchase-receipt) { display: grid; gap: 9px; }
:is(.kiosk-purchase, .kiosk-purchase-receipt) .detail-action { min-height: 48px; }
.kiosk-plan-list { display: grid; gap: 4px; margin: 5px 0; padding: 0; list-style: none; font-size: .88rem; }
.kiosk-plan-list > :is(div, li) { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 5px; }
.kiosk-plan-list dd { margin: 0; text-align: end; }
.kiosk-card .kiosk-plan-list > :is(div, li) { flex-wrap: wrap; row-gap: 2px; }
.kiosk-card .kiosk-plan-list dd { margin-inline-start: auto; }
.kiosk-plan-list small { display: block; color: var(--muted); }
.kiosk-guards, .kiosk-guard-list { display: grid; gap: 6px; }
.kiosk-guards { grid-template-columns: minmax(0, 1fr); }
.kiosk-guard-list { grid-template-columns: repeat(auto-fit, minmax(min(100%, max(45%, 7rem)), 1fr)); }
.kiosk-guard-list button { display: grid; grid-template-columns: 29px minmax(0, 1fr); align-items: center; gap: 5px;
  padding-inline: 5px; text-align: left; overflow-wrap: anywhere; }
.kiosk-guard-list img { width: 29px; height: 38px; object-fit: contain; }
.kiosk-guard-list small { display: block; color: var(--muted); }
.kiosk-guards p { color: var(--muted); font-size: .87rem; }
.kiosk-guard-contract p { margin: 3px 0; }
.kiosk-guard-change { margin: 0; padding: 7px 9px; border-radius: 8px; background: var(--raised); }
.kiosk-guard-change span { display: block; }
.kiosk-guard-stats { margin: 5px 0 0; font-size: .82rem; }
.kiosk-guard-stats > div { display: flex; justify-content: space-between; gap: 6px; padding: 2px 0; }
.kiosk-guard-stats dd { margin: 0; text-align: end; font-weight: 700; }
.guard-preview { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 9px;
  padding: 7px; border-radius: 10px; background: var(--raised); }
.guard-preview img { width: 78px; height: 92px; object-fit: contain; }
.kiosk-guards .guard-preview:not([data-market-guard="3"]) { display: flex; flex-wrap: wrap; justify-content: center; }
.kiosk-guards .guard-preview:not([data-market-guard="3"]) img { width: 68px; }
.kiosk-guards .guard-preview > div { flex: 1 1 7rem; min-width: 0; overflow-wrap: anywhere; }
.guard-preview[data-market-guard="3"] { grid-template-columns: minmax(0, 1fr); }
.guard-preview[data-market-guard="3"] img { justify-self: center; width: min(100%, 170px); height: 116px; }
.kiosk-guards > button { min-height: 48px; text-align: center; }
.kiosk-defense { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 8px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--raised); overflow-wrap: anywhere; }
.kiosk-defense > small { color: var(--muted); }
.kiosk-defense-risk { margin-top: 4px; }
.kiosk-risk-row + .kiosk-risk-row { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line); }
.kiosk-damage { position: absolute; left: 33%; bottom: 38%; width: 36%; height: 39%; object-fit: contain; }
.kiosk-damage-demolish { left: 63%; bottom: 10%; width: 27%; height: 27%; }
.market-card, .market-quote { display: grid; gap: 6px; font-size: .9rem; }
.market-results { display: grid; gap: 6px; }
.market-card .market-own { background: var(--raised); }
.market-card [data-market-count] { margin-block: 2px; font-size: .84rem; }
.market-guard summary > span { display: inline-flex; vertical-align: middle; align-items: center; gap: 6px; }
.market-guard img { width: 32px; height: 38px; object-fit: contain; }
.market-guard[data-market-guard="3"] img { width: 54px; }
.market-guard small { display: block; color: var(--muted); }
.market-card p { color: var(--muted); }
.market-quote { padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--raised); }
.market-filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; }
.market-store, .market-offer { width: 100%; min-height: 48px; padding: 6px 8px; text-align: left;
  border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.market-store { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: center; gap: 8px; }
.market-store img { width: 48px; height: 42px; object-fit: contain; }
.market-store small, .market-offer small { display: block; color: var(--muted); }
.market-offer[aria-pressed="true"], .market-filters [aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; }
.market-card button { min-height: 48px; }
.arena-name { position: absolute; bottom: 5px; right: 8px; padding: 2px 5px; border-radius: 5px; background: #382e49c4; color: #fff; font-size: 11px; }
.arena-name { max-width: 59%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.duelist { position: absolute; left: 27%; bottom: 9px; translate: -50% 0; width: min(46%, 170px); height: 94%; z-index: 2;
  transform-origin: 50% 94%; --advance: 30px; --rise: -12px; --turn: -12deg; --fight-direction: 1; }
.duelist.enemy { left: 73%; bottom: 24%; height: 72%; z-index: 1; --advance: -29px; --rise: 13px; --turn: 12deg; --fight-direction: -1; }
.duelist .cat-rig { height: 100%; width: auto; margin: 0 auto; }
.duelist .rival-rig { container-type: size; }
.duelist:not(.down) .rival-rig { width: 100%; }
.duelist.enemy .rival-rig { transform: scaleX(-1); }
.duelist.enemy .rival-rig .cast-shadow { transform: skewX(-44deg) scaleY(-.13); }
.duelist.down { height: 47%; }
.duelist:not(.down, .dressed)[data-act="rush"] { animation: rush var(--motion-beat); }
.duelist:not(.down, .dressed)[data-act="block"] { animation: guard var(--motion-beat); }
.duelist:not(.down, .dressed)[data-act="feint"] { animation: feint var(--motion-beat); }
.rival-ready, .rival-reveal { animation: rival-pose-swap var(--motion-beat); }
.rival-reveal { --pose-from: var(--shadow-opacity, 1); --pose-to: 0; }
@keyframes rival-pose-swap {
  from { opacity: var(--pose-from, 0); }
  to { opacity: var(--pose-to, var(--shadow-opacity, 1)); }
}
@keyframes rush {
  28.5714% { transform: translate(var(--advance), var(--rise)) rotate(var(--turn)); }
  57.1429% { transform: translate(calc(var(--advance) * .7), calc(var(--rise) * .7)); }
}
@keyframes guard { 28.5714%, 57.1429% { transform: translateY(3px) rotate(calc(var(--turn) * -.25)); } }
@keyframes feint {
  14.2857% { transform: translateX(calc(var(--advance) * -.42)); }
  28.5714% { transform: translateX(calc(var(--advance) * .66)) rotate(var(--turn)); }
  57.1429% { transform: none; }
}
.duelist.dressed[data-act="rush"] {
  --body-windup: translateY(2%) rotate(calc(-7deg * var(--fight-direction)));
  --body-contact: translate(calc(2% * var(--fight-direction)), -2%) rotate(calc(9deg * var(--fight-direction)));
  --travel-contact: calc(var(--advance) * .62) calc(var(--rise) * .58);
  --left-windup: translateX(-2%); --right-windup: translate(1%, -3%);
  --left-contact: translate(-3%, -2.5%); --right-contact: translateX(3%);
}
.duelist.dressed[data-act="block"] {
  --body-windup: translateY(2%); --body-contact: translateY(3.3%) rotate(calc(-4deg * var(--fight-direction)));
  --left-contact: translateX(-3%); --right-contact: translateX(3%);
}
.duelist.dressed[data-act="feint"] {
  --body-windup: translateX(calc(-3% * var(--fight-direction))) rotate(calc(-9deg * var(--fight-direction)));
  --body-contact: translate(calc(1% * var(--fight-direction)), -1%) rotate(calc(6deg * var(--fight-direction)));
  --travel-windup: calc(var(--advance) * -.26) 0px;
  --travel-contact: calc(var(--advance) * .34) calc(var(--rise) * .25);
  --left-windup: translate(-3%, -2%); --left-contact: translateY(-1%); --right-contact: translate(3%, -3%);
}
.duelist.dressed[data-hit] {
  --body-impact: calc(-2.4% * var(--fight-direction)) 1.2%;
  --body-release: translate(calc(-2% * var(--fight-direction)), -1%) rotate(calc(-5deg * var(--fight-direction)));
}
/* Species reactions use the same contact and recovery beats as the round. */
.duelist.dressed[data-skill-pose="round"] {
  --skill-release: translateY(-3%) rotate(-4deg);
  --skill-hold: translateY(-2%);
  --head-release: translateY(-.8%) rotate(-2deg);
  --head-static: var(--head-release);
}
.duelist.dressed[data-skill-pose="long"] {
  --body-windup: translateY(1%) rotate(-10deg);
  --body-contact: translate(3%, -3%) rotate(12deg);
  --travel-contact: calc(var(--advance) * .78) calc(var(--rise) * .69);
  --right-contact: translate(5%, -1%);
  --head-prepare: translate(2.4%, -.4%) rotate(2deg);
  --head-contact: translate(1.2%, -.3%) rotate(1deg);
  --head-static: var(--head-prepare);
}
.duelist.dressed[data-skill-pose="short"] {
  --body-contact: translateY(5%) rotate(-3deg);
  --left-contact: translateX(-5%); --right-contact: translateX(5%);
}
.duelist.dressed[data-skill-pose="short"] .walk-foot { --foot-release: var(--foot-contact); }
.duelist.dressed[data-skill-pose="brush"] {
  --body-windup: none;
  --body-lead: translateX(-5%) rotate(-13deg);
  --body-contact: translate(2%, -1%) rotate(8deg);
  --travel-windup: 0 0;
  --left-windup: none;
}
.duelist.dressed[data-skill-pose="tuft"] {
  --body-contact: translate(3%, -2%) rotate(8deg);
  --travel-contact: calc(var(--advance) * .44) calc(var(--rise) * .32);
  --head-prepare: translateX(1%) rotate(2deg);
  --head-static: var(--head-prepare);
}
.duelist.dressed[data-skill-pose="plush"] {
  --body-contact: translateY(2.2%) rotate(-2deg);
  --skill-release: translateY(1.7%);
  --head-contact: translateY(2.7%);
  --head-release: translateY(1.6%);
  --head-static: var(--head-contact);
}
.duelist.dressed[data-skill-pose="lop"] {
  --skill-release: translateY(2%) rotate(-7deg);
  --skill-hold: translateY(1%) rotate(-3deg);
  --head-contact: translateY(1.3%) rotate(-2deg);
  --head-static: var(--head-contact);
}
.duelist.dressed[data-skill-pose="ring"] {
  --skill-release: translateX(2%) rotate(7deg);
  --skill-hold: rotate(3deg);
  --tail-hold: 4deg;
}
.combat-rig { --ankle-cut: 93%; animation: fight-travel var(--motion-beat); }
.combat-rig .body-assembly { position: absolute; inset: 0; transform-origin: var(--face-x, 56%) 89%; animation: fight-body var(--motion-beat); }
.combat-rig .walk-foot { animation: fight-foot var(--motion-beat); }
.combat-rig .foot-left { --foot-windup: var(--left-windup, none); --foot-contact: var(--left-contact, none); }
.combat-rig .foot-right { --foot-windup: var(--right-windup, none); --foot-contact: var(--right-contact, none); }
@keyframes fight-travel {
  0% { translate: var(--travel-windup, 0 0); }
  28.5714% { translate: var(--travel-contact, 0 0); }
  57.1429%, 100% { translate: 0 0; }
}
@keyframes fight-body {
  0% { transform: var(--body-windup, none); translate: 0 0; }
  14.2857% { transform: var(--body-lead, var(--body-windup, none)); }
  28.5714% { transform: var(--body-contact, none); translate: var(--body-impact, 0 0); }
  57.1429% { transform: var(--skill-release, var(--body-release, none)); translate: 0 0; }
  85.7143% { transform: var(--skill-hold, none); }
  100% { transform: none; }
}
.duelist[data-act] .tail-layer { animation: fight-tail-follow var(--motion-beat); }
.duelist[data-act] .skill-tail { animation-name: fight-tail; }
.skill-ear { animation: fight-ear var(--motion-beat); }
.head-assembly:is(.skill-head, .hit-head) { animation: fight-head var(--motion-beat); }
.hit-head { --head-impact: calc(-2.4% * var(--fight-direction)) 1.4%; }
.whisker-left { --whisker-spread: -1.7%; clip-path: polygon(var(--whisker-left)); }
.whisker-right { --whisker-spread: 1.7%; clip-path: polygon(var(--whisker-right)); }
:is(.whisker-left, .whisker-right) { animation: spread-whiskers var(--motion-beat); }
.gaze-pupil { animation: take-aim var(--motion-beat); }
@keyframes fight-tail {
  0% { rotate: -7deg; }
  14.2857% { rotate: -4deg; }
  28.5714% { rotate: 4deg; }
  57.1429%, 100% { rotate: 0deg; }
}
@keyframes fight-tail-follow {
  0%, 100% { rotate: 0deg; }
  28.5714% { rotate: var(--tail-out, -4deg); }
  57.1429% { rotate: 4deg; }
  85.7143% { rotate: var(--tail-hold, 0deg); }
}
@keyframes fight-ear {
  0% { rotate: 0deg; }
  28.5714% { rotate: 11deg; }
  42.8571% { rotate: -5deg; }
  57.1429%, 100% { rotate: 0deg; }
}
@keyframes fight-head {
  0% { transform: var(--head-prepare, none); translate: 0 0; }
  28.5714% { transform: var(--head-contact, none); translate: var(--head-impact, 0 0); }
  57.1429% { transform: var(--head-release, none); translate: 0 0; }
  85.7143%, 100% { transform: none; }
}
@keyframes spread-whiskers {
  0%, 85.7143%, 100% { translate: 0 0; }
  57.1429% { translate: var(--whisker-spread) 0; }
}
@keyframes take-aim {
  0% { translate: -2.52% 0; }
  14.2857%, 100% { translate: 0 0; }
}
@keyframes fight-foot {
  0% { transform: var(--foot-windup, none); }
  28.5714% { transform: var(--foot-contact, none); }
  57.1429% { transform: var(--foot-release, none); }
  85.7143%, 100% { transform: none; }
}
.duelist.down { --fall-x: 86%; --fall-angle: -84deg; --fall-start-scale: 2; }
.duelist.enemy.down { --fall-x: -86%; --fall-angle: 84deg; --fall-start-scale: 1.532; }
.duelist.down::before { content: ""; position: absolute; left: 23%; bottom: 0; width: 54%; height: 9%;
  background: #65422b39; border-radius: 50%; }
.duelist .fallen-rig {
  transform-origin: 50% 94%; translate: var(--fall-x) -37%; rotate: var(--fall-angle); scale: 1.28;
}
.fallen-rig .cast-shadow, .duelist .fallen-rig::before { display: none; }
.duelist[data-act] .fallen-rig { animation: fight-fall var(--motion-beat); }
@keyframes fight-fall {
  0% { translate: 0 0; rotate: 0deg; scale: var(--fall-start-scale); }
  28.5714% { translate: calc(var(--fall-x) * .32) -18%; rotate: calc(var(--fall-angle) * .33); scale: 1.43; }
  57.1429%, 100% { translate: var(--fall-x) -37%; rotate: var(--fall-angle); scale: 1.28; }
}
.rival-pose, .expression-window, .face-expression, .doll-eyes { position: absolute; inset: 0; pointer-events: none; }
.rival-rig .expression-window { inset: auto auto 0 50%; translate: -50% 0;
  width: min(100%, calc(100cqh * var(--expression-aspect))); aspect-ratio: var(--expression-aspect); }
.alternate-face .doll-eyes { inset: 0 auto auto 13%; width: 87%; height: var(--chin); --fur-filter: none; }
.doll-eyes { --eye-shut: 0; }
.eyes-held-closed { --eye-shut: 1; }
.eyes-open-frame { opacity: calc(1 - var(--eye-shut)); }
.eyes-closed-frame { opacity: var(--eye-shut); }
.eyes-closed-frame .doll-layer { filter: none; }
.eyes-hit { animation: fight-hit-eyes var(--motion-beat); }
.eyes-fall { --eyes-after-hit: 1; }
@keyframes fight-hit-eyes {
  0% { --eye-shut: 0; }
  28.5714% { --eye-shut: 1; }
  85.7143%, 100% { --eye-shut: var(--eyes-after-hit, 0); }
}
:root[data-motion="reduced"] .eyes-hit { animation: none; --eye-shut: 1; }
.move-burst, .damage { position: absolute; pointer-events: none; }
.move-burst { display: grid; place-items: center; left: 85%; bottom: 10%; width: 28px; height: 28px; border-radius: 50%; color: #784e2c; background: #ffe197de; box-shadow: 0 0 0 3px #fff8da91; animation: burst .76s ease-out both; }
.move-burst .icon { width: 18px; height: 18px; }
.enemy .move-burst { left: auto; right: 3%; bottom: 12%; }
.down .move-burst { display: none; }
[data-act="block"] .move-burst { color: #20647b; background: #c3eff1; box-shadow: 0 0 0 5px #d4faff90; }
[data-act="feint"] .move-burst { color: #77529d; background: #e8d4ff; box-shadow: 0 0 0 5px #f5e6ff91; }
.damage { top: calc(100% + 4px); left: 0; color: #952747; background: #fff6f4;
  padding: 1px 5px; border-radius: 6px; font-size: 13px; font-weight: 800; }
.enemy-damage { left: auto; right: 0; }
.battle-deltas { position: absolute; bottom: 1%; left: 4%; display: grid; gap: 2px;
  color: #235673; font-size: 11px; font-weight: 750; pointer-events: none; }
.species-skill-cue ~ .battle-deltas { bottom: 11%; }
.enemy .battle-deltas { left: auto; right: 2%; }
.battle-deltas span { width: max-content; padding: 1px 4px; border-radius: 5px; background: #e9f3fa; }
.battle-deltas .heal { color: #24513e; background: #d8f5e4; }
:is(.damage, .battle-deltas) { opacity: 0; animation: fight-number .7s var(--round-contact) forwards; }
.technique-cues { position: absolute; z-index: 3; left: 43%; bottom: 7%; translate: -50% 0;
  display: flex; align-items: flex-end; gap: 2px; pointer-events: none; --windup: -14px; --contact: 5px; --prop-angle: -9deg; }
.technique-cues.enemy { left: 64%; bottom: 26%; --windup: 14px; --contact: -5px; --prop-angle: 9deg; }
.technique-cue { --cue-size: clamp(38px, 12vw, 56px); display: block; position: relative; width: var(--cue-size); height: var(--cue-size);
  transform-origin: center bottom; animation: technique-beat var(--motion-beat); }
.technique-cue img { display: block; width: 100%; height: 100%; object-fit: contain;
  --item-d: var(--cue-size); filter: drop-shadow(0 2px 2px #30233555) var(--rarity-light, opacity(1)); }
.technique-cue.continued { border-bottom: 2px dotted #6c5190; }
@keyframes technique-beat {
  0% { transform: translate(var(--windup), 3px) rotate(var(--prop-angle)) scale(.74); }
  28.5714% { transform: translate(var(--contact), -5px) scale(1.1); }
  57.1429% { transform: translate(0, 1px); }
  100% { transform: scale(.8); }
}
@keyframes burst { 0% { opacity: 0; scale: .4; } 30% { opacity: 1; scale: 1; } 100% { opacity: 0; scale: 1.3; } }
@keyframes fight-number { 0%, 65% { opacity: 1; } 100% { opacity: 0; } }
.moves .icon { width: 22px; height: 22px; }
.moves button:disabled .icon { color: #657884; }
@media (max-height: 730px) {
  #battle-screen { gap: 6px; }
}
:root[data-motion="reduced"] :is(.duelist:not(.down)[data-act], .damage, .battle-deltas, .move-burst, .technique-cue, .rival-ready, .rival-reveal,
  .combat-rig, .combat-rig .body-assembly, .combat-rig .walk-foot, .duelist[data-act] .tail-layer,
  .skill-part, .skill-head, .hit-head, .duelist[data-act] .fallen-rig) { animation: none; }
:root[data-motion="reduced"] :is(.damage, .battle-deltas) { opacity: 1; }
:root[data-motion="reduced"] .rival-reveal { opacity: 0; }
:root[data-motion="reduced"] .combat-rig .body-assembly { transform: var(--skill-release, var(--body-contact, none)); }
:root[data-motion="reduced"] .combat-rig .walk-foot { transform: var(--foot-contact, none); }
:root[data-motion="reduced"] .skill-tail { rotate: -7deg; }
:root[data-motion="reduced"] .skill-ear { rotate: 8deg; }
:root[data-motion="reduced"] .skill-head { transform: var(--head-static, none); }
:root[data-motion="reduced"] :is(.whisker-left, .whisker-right) { translate: var(--whisker-spread) 0; }
:root[data-motion="reduced"] .move-burst { display: none; }
.room-heading h1, .fight-title h1, .quest h2, .fight-result h1 { font-family: "Trebuchet MS", system-ui, sans-serif; letter-spacing: -.035em; }
.room-frame { border-radius: 19px; }
.tabs button[aria-current] { background: #ebe0f6; border-radius: 12px 12px 0 0; }
.arena-name { background: #645176; color: #fffaff; }
.cat-rig { position: relative; display: block; aspect-ratio: 339 / 440; --chin: 57%; }
.cat-rig.rival-rig { aspect-ratio: 1; }
.doll-layer.rival-layer { inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.cat-rig[data-pose="standing"] { aspect-ratio: 318 / 440; --chin: 54%; }
.doll-layer, .head-assembly { position: absolute; pointer-events: none; }
.doll-layer.fur { inset: 0; width: 100%; height: 100%; filter: var(--fur-filter); }
:is(.walking-rig, .combat-rig, .room-lift-rig, .club-dance-rig) .body-layer {
  clip-path: polygon(0 var(--body-top, 0%), 100% var(--body-top, 0%), 100% var(--ankle-cut, 90.5%),
    var(--foot-edge) var(--ankle-cut, 90.5%), var(--foot-edge) 100%, 0 100%);
}
.species-doll .body-layer { clip-path: polygon(var(--body-edge), 100% 100%, 0 100%, var(--tail-seam, 0 100%)); }
.species-doll:is(.walking-rig, .combat-rig, .room-lift-rig, .club-dance-rig) .body-layer {
  clip-path: polygon(var(--body-edge), 100% var(--ankle-cut, 90.5%), var(--foot-edge) var(--ankle-cut, 90.5%),
    var(--foot-edge) 100%, 0 100%, var(--tail-seam, 0 100%));
}
.walk-foot { clip-path: inset(var(--foot-join, 87%) calc(100% - var(--foot-split)) 0 var(--foot-edge)); }
.walk-foot.foot-left { clip-path: polygon(var(--foot-tail-cut,
  var(--foot-edge) var(--foot-join, 87%), var(--foot-split) var(--foot-join, 87%), var(--foot-split) 100%, var(--foot-edge) 100%)); }
.walk-foot.foot-right { clip-path: inset(var(--foot-join, 87%) 0 0 var(--foot-split)); }
.alternate-face { --body-top: calc(var(--chin) - 7%); }
.alternate-face:not(.walking-rig, .combat-rig, .club-dance-rig) .body-layer { clip-path: inset(var(--body-top) 0 0); }
.head-assembly { inset: 0; }
.species-doll .head-assembly { transform-origin: var(--face-x) var(--chin); }
.fur.face-layer { clip-path: polygon(0 0, 100% 0, 100% 46%, 80% 51%, 65% var(--chin), 48% var(--chin), 30% 53%, 0 48%); }
.basic-doll { --body-top: calc(var(--chin) - 4%); }
.basic-doll:not(:is(.walking-rig, .combat-rig, .room-lift-rig, .club-dance-rig)) .body-layer { clip-path: inset(var(--body-top) 0 0); }
.basic-doll .fur.face-layer { clip-path: inset(0 0 calc(100% - var(--body-top) - 1%) 0); }
.alternate-face .face-layer { left: 13%; top: 0; width: 87%; height: var(--chin); }
.eyes-blink { animation: blink var(--room-blink-duration, 6.4s) steps(1, end) infinite; }
.actor:not([data-room-active]) :is(.eyes-blink, .neighbor-wave) { animation: none; }
.actor .eyes-blink { animation-delay: var(--room-blink-delay, 0ms); }
.duelist.enemy .eyes-blink { animation-delay: -1.6s; }
@keyframes blink {
  0%, 97%, 100% { --eye-shut: 0; }
  95% { --eye-shut: 1; }
}
.grip-left { clip-path: ellipse(8.4% 5.8% at 41.6% 66.1%); }
.grip-right { clip-path: ellipse(8.5% 5.8% at 70.3% 66.1%); }
.wear { object-fit: fill; }
.wear-jacket { left: 26%; top: calc(var(--chin) - 3%); width: 63%; height: 27%; }
.wear-vest { left: 35%; top: calc(var(--chin) - 3%); width: 45%; height: 24%; }
.wear-headwear { left: 32%; top: 5%; width: 50%; height: 18%; }
.wear-collar { left: 39%; top: calc(var(--chin) - 1%); width: 37%; height: 6%; }
.wear-mop { left: 68%; top: 58%; width: 6%; height: 34%; transform: rotate(22deg); transform-origin: center 24%; }
.wear-pipe { left: 65%; top: 56%; width: 25%; height: 16%; transform: rotate(-15deg); }
.cat-rig[data-pose="seated"] .wear-mop { top: 70%; }
.species-doll .fur.face-layer { clip-path: polygon(0 0, 100% 0, var(--head-edge)); }
.combat-rig .head-assembly:has(.whisker-left) > .face-layer { clip-path: polygon(var(--whisker-face)); }
.combat-rig .head-assembly:has(.skill-ear) > .face-layer {
  clip-path: polygon(0 0, 100% 0, var(--head-edge), var(--ear-seam));
}
.species-doll .wear-jacket { left: calc(var(--face-x) - var(--coat-width) / 2); width: var(--coat-width); }
.species-doll .wear-vest { left: calc(var(--face-x) - var(--coat-width) * .36); width: calc(var(--coat-width) * .72); }
.species-doll .wear-headwear { left: calc(var(--face-x) - 23%); top: max(0%, calc(var(--hat-top) - 6.5%)); width: 46%; }
.species-doll .wear-collar { left: calc(var(--face-x) - var(--coat-width) * .29); width: calc(var(--coat-width) * .58); }
.species-doll .grip-left { clip-path: ellipse(8.4% 5.8% at var(--grip-left) var(--grip-y)); }
.species-doll .grip-right { clip-path: ellipse(8.5% 5.8% at var(--grip-right) var(--grip-y)); }
.species-doll[data-pose="standing"] .wear-mop { left: calc(var(--grip-right) - 3%); top: calc(var(--grip-y) - 8%); }
.species-doll[data-pose="standing"] .catalog-weapon { left: calc(var(--grip-right) - 6%); top: calc(var(--grip-y) - 31%); }
.species-doll[data-pose="seated"] .wear-mop { left: calc(var(--face-x) + 18%); }
.species-doll[data-pose="seated"] .catalog-weapon { left: calc(var(--face-x) + 9%); }
.cat-rig[data-pose="standing"] .catalog-clothing[src$="gear-duty-r32-clothing.png"] {
  --duty-width: calc((var(--grip-right, 70.3%) - var(--grip-left, 41.6%)) / .42);
  --duty-height: clamp(24%, calc((var(--grip-y, 66.1%) - var(--chin) - .7%) / .30), 38%);
  left: calc(var(--grip-left, 41.6%) - var(--duty-width) * .29);
  top: calc(var(--grip-y, 66.1%) - var(--duty-height) * .455);
  width: var(--duty-width); height: var(--duty-height);
}
.fitted-cuff-coat { position: absolute; z-index: 3; pointer-events: none; }
.fitted-cuff-art { inset: 0; width: 100%; height: 100%; }
.cuff-paw { position: absolute; overflow: hidden; }
.cuff-paw-source { max-width: none; filter: var(--fur-filter); }
.cat-rig:has(.fitted-cuff-coat) :is(.head-assembly, .wear-collar) { z-index: 4; }
.cat-rig[data-pose="seated"] .fitted-seated-coat {
  --coat-hem: min(92%, calc(var(--grip-y, 73%) * .5 + 57%));
  --coat-height: calc((var(--coat-hem) - var(--chin) - .4%) / (1 - var(--coat-neck, .14)));
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .53);
  top: calc(var(--chin) + .4% - var(--coat-height) * var(--coat-neck, .14));
  width: calc(var(--coat-width, 63%) * 1.06); height: var(--coat-height);
}
.fitted-seated-coat[src$="gear-antenna-clothing-seated.png"] { --coat-neck: .15; }
.fitted-seated-coat[src$="gear-basement-clothing-seated.png"] { --coat-neck: .183; }
.fitted-seated-coat[src$="gear-night-shelter-clothing-seated.png"] { --coat-neck: .145; }
.fitted-seated-coat[src$="gear-mustard-flask-clothing-seated.png"] { --coat-neck: .127; }
.fitted-seated-coat[src$="gear-street-leather-clothing-seated.png"] { --coat-neck: .055; }
.fitted-seated-coat[src$="gear-stage-violin-clothing-seated.png"] { --coat-neck: .167; }
.fitted-seated-coat[src$="gear-fanzine-clothing-seated.png"] { --coat-neck: .039; }
.fitted-seated-coat[src$="gear-raspberry-clothing-seated.png"] { --coat-neck: .097; }
.fitted-seated-coat[src$="gear-cabaret-clothing-seated.png"] { --coat-neck: .122; }
.fitted-seated-coat[src$="gear-herbarium-clothing-seated.png"] { --coat-neck: .178; }
.fitted-seated-coat[src$="gear-last-concert-clothing-seated.png"] { --coat-neck: .033; }
.cat-rig .catalog-headwear[src$="gear-tram-headwear.png"] {
  left: calc(var(--face-x, 56%) - 43%); top: max(0%, calc(var(--hat-top, 16%) - 10%));
  width: 86%; height: 24%; object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-antenna-headwear.png"] {
  left: calc(var(--face-x, 56%) - 29%); top: calc(var(--hat-top, 16%) + 1%);
  width: 58%; height: 17%; object-fit: contain; object-position: center bottom;
}
.cat-rig .catalog-collar:is([src$="gear-tram-collar.png"], [src$="gear-antenna-collar.png"], [src$="gear-basement-collar.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .46);
  top: calc(var(--chin) - 1%); width: calc(var(--coat-width, 63%) * .92); height: 16%;
}
.cat-rig .catalog-headwear[src$="gear-race-headwear.png"] {
  left: calc(var(--face-x, 56%) - 32.5%); width: 65%; height: 11%;
  top: calc(var(--eye-y, 37%) - var(--eye-height, 18%) / 2 - 10%); object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-carpenter-headwear.png"] {
  left: calc(var(--face-x, 56%) - 23%); width: 46%; height: 24%;
  top: max(0%, calc(var(--hat-top, 16%) - 10%)); object-fit: contain; object-position: center bottom;
}
.cat-rig .catalog-clothing:is([src$="gear-race-clothing.png"], [src$="gear-race-clothing-seated.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .48);
  top: calc(var(--grip-y, 66%) + 7%); width: calc(var(--coat-width, 63%) * .96); height: 15%;
}
.cat-rig[data-pose="seated"] .catalog-clothing[src$="gear-race-clothing-seated.png"] {
  top: calc(var(--grip-y, 73%) * .5 + 41%); height: 14%;
}
.cat-rig .catalog-clothing:is([src$="gear-carpenter-clothing.png"], [src$="gear-carpenter-clothing-seated.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .39);
  top: calc(var(--chin) - 3%); width: calc(var(--coat-width, 63%) * .78); height: calc(92% - var(--chin) + 3%);
}
.cat-rig .catalog-collar:is([src$="gear-race-collar.png"], [src$="gear-carpenter-collar.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .42);
  top: calc(var(--chin) - 1%); width: calc(var(--coat-width, 63%) * .84); height: 14%;
}
.cat-rig .catalog-collar[src$="gear-race-collar.png"] { height: 17%; }
.cat-rig .catalog-clothing:is([src$="gear-repair-clarinet-clothing.png"], [src$="gear-repair-clarinet-clothing-seated.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .25);
  top: calc(var(--chin) - 4%); width: calc(var(--coat-width, 63%) * .5); height: calc(85% - var(--chin) + 4%);
}
.cat-rig[data-pose="seated"] .catalog-clothing[src$="gear-repair-clarinet-clothing-seated.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .30);
  width: calc(var(--coat-width, 63%) * .60); height: calc(89% - var(--chin) + 4%);
}
.cat-rig .catalog-headwear[src$="gear-boogie-headwear.png"] {
  left: calc(var(--face-x, 56%) - 27%); top: max(0%, calc(var(--hat-top, 16%) - 6%));
  width: 58%; height: 15%; object-fit: fill;
}
.cat-rig .catalog-collar[src$="gear-boogie-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .43);
  top: calc(var(--chin) - 1%); width: calc(var(--coat-width, 63%) * .86); height: 20%;
}
.cat-rig .catalog-headwear[src$="gear-night-shelter-headwear.png"] {
  left: var(--eye-x, var(--face-x, 56%)); top: max(0%, calc(var(--eye-y, 35%) - var(--eye-height, 18%) / 2 - 23.5%));
  width: 64%; height: 26%; transform: translateX(-50%); object-fit: fill;
}
.cat-rig .catalog-collar:is([src$="gear-night-shelter-collar.png"], [src$="gear-mustard-flask-collar.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .46);
  top: calc(var(--chin) - 1%); width: calc(var(--coat-width, 63%) * .92); height: 18%;
}
.cat-rig .catalog-headwear[src$="gear-phone-canopy-headwear.png"] {
  left: calc(var(--eye-x, 56%) - 32%); top: calc(var(--eye-y, 35%) - var(--eye-height, 18%) / 2 - 9%);
  width: 64%; height: 10%; object-fit: fill;
}
.cat-rig .catalog-clothing:is([src$="gear-phone-canopy-clothing.png"], [src$="gear-phone-canopy-clothing-seated.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .44);
  top: calc(var(--chin) - 8%); width: calc(var(--coat-width, 63%) * .88); height: calc(88% - var(--chin) + 8%);
}
.cat-rig .catalog-collar[src$="gear-phone-canopy-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .39);
  top: calc(var(--chin) - 2%); width: calc(var(--coat-width, 63%) * .78); height: 16%;
}
.cat-rig .catalog-headwear:is([src$="gear-boxing-headwear.png"], [src$="gear-siddur-headwear.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .27);
  top: max(0%, calc(var(--hat-top, 9%) - 6%)); width: calc(var(--coat-width, 63%) * .54); height: 12%;
  object-fit: contain; object-position: center bottom;
}
.cat-rig .catalog-clothing:is([src$="gear-boxing-clothing.png"], [src$="gear-boxing-clothing-seated.png"]) {
  --waist: max(72%, calc(var(--grip-y, 66%) + 6%));
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .46); top: var(--waist);
  width: calc(var(--coat-width, 63%) * .92); height: calc(92% - var(--waist));
}
.cat-rig[data-pose="seated"] .catalog-clothing[src$="gear-boxing-clothing-seated.png"] { --waist: 77%; }
.cat-rig .catalog-clothing:is([src$="gear-rewind-clothing.png"], [src$="gear-rewind-clothing-seated.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .43); top: calc(var(--chin) - 3%);
  width: calc(var(--coat-width, 63%) * .86); height: calc(84% - var(--chin));
}
.cat-rig .catalog-collar:is([src$="gear-boxing-collar.png"], [src$="gear-siddur-collar.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .42); top: calc(var(--chin) - 2%);
  width: calc(var(--coat-width, 63%) * .84); height: 22%;
}
.cat-rig .catalog-collar[src$="gear-siddur-collar.png"] { height: calc(87% - var(--chin)); }
.cat-rig .catalog-headwear[src$="gear-street-leather-headwear.png"] {
  --face-opening: calc(var(--eye-y, 35%) - var(--eye-height, 18%) / 2 - 3%);
  --hood-height: calc((var(--chin) - var(--face-opening)) / .52);
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--face-opening) - var(--hood-height) * .295);
  width: clamp(59%, calc(var(--eye-gap, 22%) * 3.45), 82%); height: var(--hood-height);
  transform: translateX(-50%);
}
.cat-rig .catalog-collar[src$="gear-street-leather-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .37); top: calc(var(--chin) + 1%);
  width: calc(var(--coat-width, 63%) * .74); height: 11%; z-index: 5;
}
.cat-rig .catalog-collar[src$="gear-stage-violin-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .39); top: calc(var(--chin) - 1%);
  width: calc(var(--coat-width, 63%) * .78); height: 19%;
}
.cat-rig[data-pose="standing"] .catalog-collar[src$="gear-stage-violin-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .335); top: calc(var(--chin) - 3%);
  width: calc(var(--coat-width, 63%) * .67); height: clamp(9%, calc(var(--grip-y, 66%) - var(--chin) - 1%), 13%);
}
.cat-rig .catalog-headwear[src$="gear-truck-stop-headwear.png"] {
  --brim: calc(var(--eye-y, 35%) - var(--eye-height, 18%) / 2 - 2%);
  --cord: calc(var(--chin) + 1%);
  --hat-height: calc((var(--cord) - var(--brim)) / .56);
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--cord) - var(--hat-height));
  width: clamp(55%, calc(var(--eye-gap, 22%) * 3.2), 76%); height: var(--hat-height);
  transform: translateX(-50%);
}
.cat-rig .catalog-clothing:is([src$="gear-truck-stop-clothing.png"], [src$="gear-truck-stop-clothing-seated.png"]) {
  --belt-top: calc(var(--grip-y, 66%) + 4%);
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .45); top: var(--belt-top);
  width: calc(var(--coat-width, 63%) * .9); height: calc(90% - var(--belt-top));
}
.cat-rig[data-pose="seated"] .catalog-clothing[src$="gear-truck-stop-clothing-seated.png"] { --belt-top: max(75%, calc(var(--grip-y, 73%) + 2%)); }
.cat-rig .catalog-collar[src$="gear-truck-stop-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .37); top: calc(var(--chin) - 1%);
  width: calc(var(--coat-width, 63%) * .74); height: 17%;
}
.cat-rig .catalog-headwear[src$="gear-fanzine-headwear.png"] {
  left: calc(var(--eye-x, var(--face-x, 56%)) + 2%); top: calc(var(--eye-y, 35%) - var(--eye-height, 18%) * .67);
  width: clamp(38%, calc(var(--eye-gap, 22%) * 2.3), 68%); height: calc(var(--eye-height, 18%) * 1.26);
  transform: translateX(-50%);
}
.cat-rig .catalog-collar[src$="gear-fanzine-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .355); top: calc(var(--chin) - 1%);
  width: calc(var(--coat-width, 63%) * .71); height: 10%;
}
.cat-rig .catalog-armguard {
  top: calc(var(--grip-y, 66%) - 15.5%); width: 16%; height: 13.5%; object-fit: contain;
  transform: translateX(-50%);
}
.cat-rig .left-armguard { left: var(--grip-left, 41.6%); }
.cat-rig .right-armguard { left: var(--grip-right, 70.3%); }
.cat-rig[data-pose="seated"] .catalog-armguard { top: calc(var(--grip-y, 73%) * .5 + 36%); height: 17%; }
.cat-rig .catalog-collar[src$="gear-silversmith-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .27);
  top: calc(var(--chin) - .8%); width: calc(var(--coat-width, 63%) * .54); height: 13%;
  object-fit: contain; object-position: center top;
}
.cat-rig .catalog-headwear[src$="gear-cabaret-headwear.png"] {
  left: calc(var(--face-x, 56%) - 23%); top: max(-6%, calc(var(--hat-top, 9%) - 24%)); width: 46%;
  height: clamp(23%, calc(var(--hat-top, 9%) + 11%), 29%); object-fit: contain; object-position: center bottom;
}
.cat-rig[data-pose] .catalog-collar[src$="gear-cabaret-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .41); top: calc(var(--chin) - 2%);
  width: calc(var(--coat-width, 63%) * .72); height: calc(var(--grip-y, 66%) - var(--chin) + 22%);
}
.cat-rig .catalog-headwear[src$="gear-raspberry-headwear.png"] {
  left: calc(var(--face-x, 56%) - 22%); top: max(0%, calc(var(--hat-top, 9%) - 6%)); width: 56%; height: 27%;
}
.cat-rig .catalog-collar[src$="gear-raspberry-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .39); top: calc(var(--chin) - 1%);
  width: calc(var(--coat-width, 63%) * .78); height: 10%;
}
.cat-rig .catalog-collar[src$="gear-herbarium-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .39); top: calc(var(--chin) - 1%);
  width: calc(var(--coat-width, 63%) * .78); height: 17%;
}
.cat-rig[data-pose="standing"] .catalog-collar[src$="gear-herbarium-collar.png"] {
  height: clamp(9%, calc(var(--grip-y, 66%) - var(--chin) + 1%), 15%);
}
.cat-rig .catalog-headwear[src$="gear-boarding-headwear.png"] {
  --helmet-height: clamp(49%, calc(var(--eye-height, 18%) * 3.4), 66%);
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--eye-y, 35%) - var(--helmet-height) * .73);
  width: clamp(59%, calc(var(--eye-gap, 22%) * 3.25), 80%); height: var(--helmet-height);
  transform: translateX(-50%);
}
.cat-rig .boarding-chest {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .41); top: calc(var(--chin) - 3%);
  width: calc(var(--coat-width, 63%) * .82); height: 25%;
}
.cat-rig :is(.boarding-left-plate, .boarding-right-plate) {
  top: calc(var(--chin) - 3%); width: 17%; height: 15%; object-fit: contain; transform: translateX(-50%);
}
.cat-rig .boarding-left-plate { left: calc(var(--grip-left, 42%) - var(--coat-width, 63%) * .13); }
.cat-rig .boarding-right-plate { left: calc(var(--grip-right, 70%) + var(--coat-width, 63%) * .13); }
.cat-rig .catalog-collar[src$="gear-boarding-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .35); top: calc(var(--chin) - 1%);
  width: calc(var(--coat-width, 63%) * .7); height: 19%; object-fit: contain; object-position: center top;
}
.cat-rig .catalog-headwear[src$="gear-last-concert-headwear.png"] {
  --wig-height: clamp(22%, calc(var(--eye-height, 16%) * 1.55), 30%);
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--eye-y, 35%) - var(--eye-height, 16%) * .55 - var(--wig-height) * .71);
  width: clamp(65%, calc(var(--eye-gap, 22%) * 3.3), 79%); height: var(--wig-height);
  transform: translateX(-51%);
}
.cat-rig .catalog-collar[src$="gear-last-concert-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .36); top: var(--chin);
  width: calc(var(--coat-width, 63%) * .72); height: 18%;
}
.ear-charm-mount { position: absolute; inset: 0; }
.ear-charm { max-width: 18%; max-height: 12%;
  transform: translate(calc(0% - var(--charm-pin-x)), calc(0% - var(--charm-pin-y))) rotate(7deg);
  transform-origin: var(--charm-pin-x) var(--charm-pin-y); }
.cat-rig .catalog-weapon[src$="gear-bench-r31-weapon.png"] {
  left: calc(var(--grip-right, 70.3%) - 8%); top: calc(var(--grip-y, 66.1%) - 25%); width: 16%; height: 32%;
  object-fit: contain; object-position: center bottom; transform: rotate(38deg); transform-origin: 50% 78%;
}
.cat-rig[data-pose="seated"] .catalog-weapon[src$="gear-bench-r31-weapon.png"] {
  left: calc(var(--face-x, 56%) + 13%); top: 64%; height: 28%; transform: rotate(14deg);
}
.cat-rig .catalog-collar[src$="gear-bench-r31-collar.png"] { top: calc(var(--chin) + 2%); height: 8%; }
.cat-rig .catalog-headwear[src*="/gear-c"] { object-fit: contain; object-position: center bottom; }
.cat-rig .catalog-headwear[src$="gear-bench-r31-headwear.png"],
.cat-rig .catalog-headwear[src$="gear-c0-evening-r31-headwear.png"] {
  left: calc(var(--face-x, 56%) - 21%); top: max(0%, calc(var(--hat-top, 9%) - 8%));
  width: 42%; height: 18%; object-fit: contain; object-position: center bottom;
}
.cat-rig .catalog-headwear[src$="gear-c0-kippah.png"],
.cat-rig .catalog-headwear[src$="gear-c2-family-r31-headwear.png"] {
  left: calc(var(--face-x, 56%) - 15%); top: max(0%, calc(var(--hat-top, 9%) - 5%)); width: 30%; height: 13%;
}
.cat-rig .catalog-headwear[src$="gear-c1-watch-headwear.png"] { top: max(0%, calc(var(--hat-top, 9%) - 8%)); height: 23%; }
.cat-rig .catalog-collar[src*="/gear-c"] { top: calc(var(--chin) + 1%); height: 9%; }
.cat-rig .catalog-collar[src$="gear-c0-cellar-collar.png"],
.cat-rig .catalog-collar[src$="gear-c0-mint-collar.png"] { height: 14%; }
.cat-rig .catalog-clothing[src$="gear-c0-copper-vest-r31.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .38); width: calc(var(--coat-width, 63%) * .76); height: 25%;
}
.cat-rig .catalog-weapon[src*="/gear-c"] {
  left: calc(var(--grip-right, 70.3%) - 10%); top: calc(var(--grip-y, 66.1%) - 22%); width: 20%; height: 29%;
  object-fit: contain; object-position: center bottom; transform: rotate(34deg); transform-origin: 50% 77%;
}
.cat-rig[data-pose="seated"] .catalog-weapon[src*="/gear-c"] {
  left: calc(var(--face-x, 56%) + 11%); top: 65%; transform: rotate(13deg);
}
.cat-rig .catalog-glove {
  top: var(--grip-y, 66.1%); width: 19%; height: 14%; object-fit: contain; z-index: 4;
  transform: translate(-50%, -50%);
}
.cat-rig .left-glove { left: var(--grip-left, 41.6%); }
.cat-rig .right-glove { left: var(--grip-right, 70.3%); transform: translate(-50%, -50%) scaleX(-1); }
.cat-rig[data-pose="seated"] .catalog-glove { top: 93%; width: 17%; height: 12%; }
.cat-rig[data-pose="seated"] .left-glove { left: calc(var(--face-x, 56%) - 8%); }
.cat-rig[data-pose="seated"] .right-glove { left: calc(var(--face-x, 56%) + 8%); }
.cat-rig .catalog-headwear[src$="gear-c1-gym-headwear.png"] {
  left: calc(var(--face-x, 56%) - 37%); top: calc(var(--chin) - 39%); width: 74%; height: 44%; object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-c1-knit-mask.png"] {
  left: calc(var(--face-x, 56%) - 33%); top: calc(var(--chin) - 35.5%); width: 66%; height: 38%; object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-c2-emo-r31-headwear.png"] {
  left: var(--eye-x, var(--face-x, 56%)); top: var(--eye-y, calc(var(--chin) - 19%));
  width: calc(var(--eye-gap, 21%) / .46); height: calc(var(--eye-height, 11%) / .76);
  transform: translate(-50%, -53%); object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-c2-stage-mask.png"] {
  left: calc(var(--face-x, 56%) - 34%); top: calc(var(--chin) - 32%); width: 68%; height: 31%; object-fit: fill;
}
.cat-rig[data-pose="standing"] .catalog-weapon[src*="/gear-c2-"] {
  left: calc(var(--grip-right, 70.3%) - 12%); top: calc(var(--grip-y, 66.1%) - 24%); width: 24%; height: 32%;
}
.cat-rig .catalog-weapon[src*="/gear-c3-"] {
  left: var(--grip-right, 70.3%); top: var(--grip-y, 66.1%); width: auto; height: 28%;
  transform: translate(var(--handle-x, -20%), var(--handle-y, -84%));
}
.cat-rig[data-pose="seated"] .catalog-weapon[src*="/gear-c3-"] {
  left: calc(var(--face-x, 56%) + 16%); top: 86%; height: 25%;
  transform: translate(var(--handle-x, -20%), var(--handle-y, -84%));
}
.cat-rig .catalog-weapon[src$="gear-c3-bars-r31-weapon.png"] {
  --handle-x: -86%; --handle-y: -78%;
}
.cat-rig .catalog-weapon[src$="gear-c3-stamp-sledge.png"],
.cat-rig .catalog-weapon[src$="gear-c3-recessed-lever.png"] {
  --handle-x: -26%; --handle-y: -75%;
}
.cat-rig .catalog-headwear[src$="gear-c3-crt-helmet.png"] {
  left: calc(var(--face-x, 56%) - 33%); top: calc(var(--chin) - 49%); width: 66%; height: 38%; object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-c3-trimmed-hood.png"] {
  left: calc(var(--face-x, 56%) - 41%); top: calc(var(--chin) - 47%); width: 82%; height: 48%; object-fit: fill;
}
.cat-rig .catalog-collar[src$="gear-c3-clarinet-collar.png"],
.cat-rig .catalog-collar[src$="gear-c3-smoky-collar.png"],
.cat-rig .catalog-collar[src$="gear-c3-oval-chain.png"] {
  top: var(--chin); height: 13%; object-fit: contain; object-position: center top;
}
.cat-rig .catalog-headwear[src$="gear-c3-brigadier-r31-headwear.png"] {
  left: calc(var(--face-x, 56%) - 24%); top: max(0%, calc(var(--hat-top, 9%) - 10%));
  width: 48%; height: 21%;
}
.cat-rig .catalog-headwear[src$="gear-c2-street-r31-headwear.png"] {
  left: calc(var(--face-x, 56%) - 34%); top: calc(var(--chin) - 39%); width: 68%; height: 45%; object-fit: fill;
}
.cat-rig .catalog-collar[src$="gear-c1-bar-r31-collar.png"] {
  left: calc(var(--face-x, 56%) - 13%); top: calc(var(--chin) - 1%); width: 26%; height: 21%; object-fit: contain;
}
.cat-rig .catalog-collar[src$="gear-c2-street-r31-collar.png"],
.cat-rig .catalog-collar[src$="gear-c3-brigadier-r31-collar.png"] {
  top: calc(var(--chin) - 2%); height: 14%; object-fit: contain;
}
.cat-rig[data-pose="standing"] .catalog-weapon[src$="gear-c2-street-r31-weapon.png"] {
  left: calc(var(--grip-right, 70.3%) - 12%); top: calc(var(--grip-y, 66.1%) - 18%);
  width: 24%; height: 36%; transform: rotate(43deg); transform-origin: center;
}
.cat-rig .catalog-weapon[src$="gear-c3-brigadier-r31-weapon.png"] {
  --handle-x: -50%; --handle-y: -24%; height: 33%;
}
.cat-rig[data-pose="seated"] .catalog-weapon[src$="gear-c3-brigadier-r31-weapon.png"] {
  top: calc(var(--chin) + 11%); height: 29%;
}
.cat-rig .catalog-headwear[src$="gear-c3-bars-r31-headwear.png"] {
  left: var(--eye-x, var(--face-x, 56%)); top: var(--eye-y, calc(var(--chin) - 19%));
  width: 72%; height: 48%; transform: translate(-50%, -49%); object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-c3-quiet-r31-headwear.png"] {
  left: calc(var(--face-x, 56%) - 20%); top: max(0%, calc(var(--hat-top, 9%) - 10%)); width: 40%; height: 23%;
}
.cat-rig .catalog-collar[src$="gear-c2-family-r31-collar.png"],
.cat-rig .catalog-collar[src$="gear-c2-emo-r31-collar.png"],
.cat-rig .catalog-collar[src$="gear-c3-bars-r31-collar.png"],
.cat-rig .catalog-collar[src$="gear-c3-herbal-r31-collar.png"] {
  top: calc(var(--chin) - 2%); height: 18%; object-fit: contain;
}
.cat-rig[data-pose] .catalog-weapon[src$="gear-c2-emo-r31-weapon.png"] {
  left: var(--grip-right, 70.3%); top: var(--grip-y, 66.1%); width: auto; height: 40%; transform: translate(-58%, -48%);
}
.cat-rig[data-pose="seated"] .catalog-weapon[src$="gear-c2-emo-r31-weapon.png"] {
  left: calc(var(--face-x, 56%) + 15%); top: 80%; height: 31%;
}
.cat-rig[data-pose] .catalog-weapon[src$="gear-c2-reinforced-work-weapon.png"] {
  left: var(--grip-right, 70.3%); top: calc(var(--grip-y, 66.1%) - 41%); width: auto; height: 50%;
  transform: translateX(-63%) rotate(48deg); transform-origin: 63% 82%;
}
.cat-rig[data-pose="seated"] .catalog-weapon[src$="gear-c2-reinforced-work-weapon.png"] {
  top: calc(var(--grip-y, 73%) * .5 + 22.5%); height: 39%; transform: translateX(-63%) rotate(38deg);
}
.seated-catalog-grip {
  clip-path: ellipse(4.5% 3.5% at var(--grip-right, 70.3%) calc(var(--grip-y, 73%) * .5 + 54.5%));
}
.seated-left-grip {
  clip-path: ellipse(4.5% 3.5% at var(--grip-left, 41.6%) calc(var(--grip-y, 73%) * .5 + 54.5%));
}
.cat-rig .catalog-headwear[src$="gear-c2-reinforced-work-headwear.png"] {
  left: calc(var(--face-x, 56%) - 28%); top: max(0%, calc(var(--hat-top, 14%) - 9%));
  width: 56%; height: 17%; object-fit: fill;
}
.cat-rig .catalog-clothing[src$="gear-c2-reinforced-work-clothing.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .39); top: calc(var(--chin) - 2%);
  width: calc(var(--coat-width, 63%) * .78); height: 26%;
}
.cat-rig .catalog-collar[src$="gear-c2-reinforced-work-collar.png"] {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .285); top: calc(var(--chin) - 2%);
  width: calc(var(--coat-width, 63%) * .57); height: 13%; object-fit: contain; object-position: center top;
}
.cat-rig .catalog-weapon[src$="gear-c1-cash-audit-weapon.png"] {
  --umbrella-length: 48%; --umbrella-seated: 36%; --umbrella-handle-x: 63%; --umbrella-handle-y: .89;
}
.cat-rig .catalog-weapon[src$="gear-c2-video-couriers-weapon.png"] {
  --umbrella-length: 39%; --umbrella-seated: 33%; --umbrella-handle-x: 48%; --umbrella-handle-y: .83;
}
.cat-rig[data-pose] .catalog-weapon[src$="gear-c2-video-couriers-weapon.png"] {
  left: var(--grip-right, 70.3%); top: calc(var(--grip-y, 66.1%) - var(--umbrella-length) * var(--umbrella-handle-y));
  width: auto; height: var(--umbrella-length); transform: translateX(calc(-1 * var(--umbrella-handle-x))) rotate(43deg);
  transform-origin: var(--umbrella-handle-x) calc(var(--umbrella-handle-y) * 100%);
}
.cat-rig[data-pose="seated"] .catalog-weapon[src$="gear-c2-video-couriers-weapon.png"] {
  top: calc(var(--grip-y, 73%) * .5 + 54.5% - var(--umbrella-seated) * var(--umbrella-handle-y));
  height: var(--umbrella-seated); transform: translateX(calc(-1 * var(--umbrella-handle-x))) rotate(38deg);
}
.cat-rig .catalog-collar[src$="gear-c2-video-couriers-collar.png"] {
  left: calc(var(--face-x, 56%) - 11%); top: calc(var(--chin) - 3%);
  width: 22%; height: 22%; object-fit: contain; object-position: center top;
}
.cat-rig .catalog-collar[src$="gear-c2-video-couriers-collar.png"] { height: 18%; }
.windbreaker-torso { clip-path: polygon(23% 0, 77% 0, 77% 22%, 72.4% 38%, 80.3% 64%, 81% 100%,
  19% 100%, 19.7% 64%, 27.6% 38%, 23% 22%); }
.windbreaker-sleeve.left.upper { clip-path: polygon(0 17%, 24.5% 17%, 29% 38%, 22% 67%, 7% 55%, 0 55%); }
.windbreaker-sleeve.right.upper { clip-path: polygon(100% 17%, 75.5% 17%, 71% 38%, 78% 67%, 93% 55%, 100% 55%); }
.windbreaker-sleeve.left.lower { clip-path: polygon(0 48%, 7% 49%, 24% 61%, 15% 93%, 0 93%); }
.windbreaker-sleeve.right.lower { clip-path: polygon(100% 48%, 93% 49%, 76% 61%, 85% 93%, 100% 93%); }
.windbreaker-torso[src$="gear-c2-rental-copy-clothing.png"] {
  clip-path: polygon(23% 0, 77% 0, 77% 17%, 72.4% 34%, 80.5% 62%, 82% 100%, 18% 100%, 19.5% 62%, 27.6% 34%, 23% 17%);
}
.windbreaker-sleeve.left.upper[src$="gear-c2-rental-copy-clothing.png"] {
  clip-path: polygon(0 13%, 24.5% 13%, 29% 34%, 22% 66%, 7% 52%, 0 52%);
}
.windbreaker-sleeve.right.upper[src$="gear-c2-rental-copy-clothing.png"] {
  clip-path: polygon(100% 13%, 75.5% 13%, 71% 34%, 78% 66%, 93% 52%, 100% 52%);
}
.windbreaker-sleeve.left.lower[src$="gear-c2-rental-copy-clothing.png"] {
  clip-path: polygon(0 44%, 7% 45%, 24% 57%, 15% 94%, 0 94%);
}
.windbreaker-sleeve.right.lower[src$="gear-c2-rental-copy-clothing.png"] {
  clip-path: polygon(100% 44%, 93% 45%, 76% 57%, 85% 94%, 100% 94%);
}
.windbreaker-torso:is([src*="/gear-c0-"], [src$="gear-c1-gym-r31-clothing.png"], [src$="gear-c1-patched-denim-r31.png"]) {
  clip-path: polygon(24% 0, 76% 0, 76% 15%, 73% 39%, 79% 64%, 89% 100%, 11% 100%, 21% 64%, 27% 39%, 24% 15%);
}
.windbreaker-sleeve.left.upper:is([src*="/gear-c0-"], [src$="gear-c1-gym-r31-clothing.png"], [src$="gear-c1-patched-denim-r31.png"]) {
  clip-path: polygon(0 19%, 24.8% 15%, 29% 34%, 23% 52%, 14% 53%, 0 50%);
}
.windbreaker-sleeve.right.upper:is([src*="/gear-c0-"], [src$="gear-c1-gym-r31-clothing.png"], [src$="gear-c1-patched-denim-r31.png"]) {
  clip-path: polygon(100% 19%, 75.2% 15%, 71% 34%, 77% 52%, 86% 53%, 100% 50%);
}
.windbreaker-sleeve.left.lower:is([src*="/gear-c0-"], [src$="gear-c1-gym-r31-clothing.png"], [src$="gear-c1-patched-denim-r31.png"]) {
  clip-path: polygon(0 36%, 14% 39%, 24% 46%, 20% 74%, 0 75%);
}
.windbreaker-sleeve.right.lower:is([src*="/gear-c0-"], [src$="gear-c1-gym-r31-clothing.png"], [src$="gear-c1-patched-denim-r31.png"]) {
  clip-path: polygon(100% 36%, 86% 39%, 76% 46%, 80% 74%, 100% 75%);
}
.windbreaker-sleeve.left.upper:is([src$="gear-c0-elbow-jacket-r31.png"], [src$="gear-c0-white-zip-r31.png"]) {
  clip-path: polygon(0 19%, 24.8% 15%, 29% 34%, 23% 59%, 14% 61%, 0 56%);
}
.windbreaker-sleeve.right.upper:is([src$="gear-c0-elbow-jacket-r31.png"], [src$="gear-c0-white-zip-r31.png"]) {
  clip-path: polygon(100% 19%, 75.2% 15%, 71% 34%, 77% 59%, 86% 61%, 100% 56%);
}
.windbreaker-sleeve.left.lower:is([src$="gear-c0-elbow-jacket-r31.png"], [src$="gear-c0-white-zip-r31.png"]) {
  clip-path: polygon(0 49%, 11% 49%, 22% 56%, 19% 86%, 0 88%);
}
.windbreaker-sleeve.right.lower:is([src$="gear-c0-elbow-jacket-r31.png"], [src$="gear-c0-white-zip-r31.png"]) {
  clip-path: polygon(100% 49%, 89% 49%, 78% 56%, 81% 86%, 100% 88%);
}
.windbreaker-torso[src$="gear-c2-herbal-jacket-r31.png"] {
  clip-path: polygon(22% 0, 78% 0, 78% 17%, 75% 36%, 84% 59%, 89% 100%, 11% 100%, 16% 59%, 25% 36%, 22% 17%);
}
.windbreaker-sleeve.left.upper[src$="gear-c2-herbal-jacket-r31.png"] {
  clip-path: polygon(0 24%, 25% 14%, 29% 25%, 23% 41%, 15% 44%, 0 43%);
}
.windbreaker-sleeve.right.upper[src$="gear-c2-herbal-jacket-r31.png"] {
  clip-path: polygon(100% 24%, 75% 14%, 71% 25%, 77% 41%, 85% 44%, 100% 43%);
}
.windbreaker-sleeve.left.lower[src$="gear-c2-herbal-jacket-r31.png"] {
  clip-path: polygon(0 29%, 13% 32%, 19% 39%, 15% 54%, 0 54%);
}
.windbreaker-sleeve.right.lower[src$="gear-c2-herbal-jacket-r31.png"] {
  clip-path: polygon(100% 29%, 87% 32%, 81% 39%, 85% 54%, 100% 54%);
}
.cat-rig .catalog-weapon[src$="gear-c0-draft-r31-weapon.png"] { --tool-pivot: .78; --tool-length: 31%; --tool-seated: 26%; }
.cat-rig .catalog-weapon[src$="gear-c0-patrol-r31-weapon.png"] { --tool-pivot: .77; --tool-length: 34%; --tool-seated: 30%; }
.cat-rig .catalog-weapon[src$="gear-c0-canvas-r31-weapon.png"] { --tool-pivot: .79; --tool-length: 38%; --tool-seated: 32%; }
.cat-rig[data-pose] .catalog-weapon:is([src$="gear-c0-draft-r31-weapon.png"], [src$="gear-c0-patrol-r31-weapon.png"], [src$="gear-c0-canvas-r31-weapon.png"]) {
  left: var(--grip-right, 70.3%); top: calc(var(--grip-y, 66.1%) - var(--tool-length) * var(--tool-pivot));
  width: auto; height: var(--tool-length); transform: translateX(-50%) rotate(34deg);
  transform-origin: 50% calc(100% * var(--tool-pivot));
}
.cat-rig[data-pose="seated"] .catalog-weapon:is([src$="gear-c0-draft-r31-weapon.png"], [src$="gear-c0-patrol-r31-weapon.png"], [src$="gear-c0-canvas-r31-weapon.png"]) {
  top: calc(var(--grip-y, 73%) * .5 + 54.5% - var(--tool-seated) * var(--tool-pivot));
  height: var(--tool-seated); transform: translateX(-50%) rotate(35deg);
}
.cat-rig .catalog-headwear:is([src$="gear-c0-patrol-r31-headwear.png"], [src$="gear-c0-canvas-r31-headwear.png"]) {
  left: calc(var(--face-x, 56%) - 24%); top: max(0%, calc(var(--hat-top, 9%) - 7%)); width: 48%; height: 18%;
}
.cat-rig .catalog-headwear:is([src$="gear-c0-burgundy-knit-r31.png"], [src$="gear-c0-striped-cotton-r31.png"], [src$="gear-c0-clip-visor-r31.png"]) {
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--eye-y, 35%) - 24%);
  width: 51%; height: 18%; transform: translateX(-50%);
}
.cat-rig .catalog-headwear[src$="gear-c0-clip-visor-r31.png"] {
  top: calc(var(--eye-y, 35%) - 18%); height: 12%;
}
.cat-rig .catalog-collar:is([src$="gear-c0-draft-r31-collar.png"], [src$="gear-c0-patrol-r31-collar.png"], [src$="gear-c0-canvas-r31-collar.png"]) {
  top: calc(var(--chin) - 1%); height: 14%; object-fit: contain; object-position: center top;
}
.cat-rig .catalog-collar:is([src$="gear-c0-cloth-label-r31.png"], [src$="gear-c0-card-tongue-r31.png"], [src$="gear-c0-flat-ring-r31.png"]) {
  top: calc(var(--chin) - .5%); height: 12%; object-fit: contain; object-position: center top;
}
.cat-rig .right-glove.boxing-glove { transform: translate(-50%, -50%); }
.cat-rig[data-pose="seated"] .boxing-glove { top: min(91.5%, calc(var(--grip-y, 73%) * .5 + 56%)); }
.cat-rig .catalog-weapon[src$="gear-c1-mic-stand-r31.png"] {
  --prop-grip: .57; --prop-length: 46%; --prop-seated: 31%; --prop-tilt: 49deg; --prop-seated-tilt: 49deg;
}
.cat-rig .catalog-weapon[src$="gear-c1-patrol-baton-r31.png"] {
  --prop-grip: .76; --prop-length: 34%; --prop-seated: 28%; --prop-tilt: 31deg; --prop-seated-tilt: 37deg;
}
.cat-rig[data-pose] .catalog-weapon:is([src$="gear-c1-mic-stand-r31.png"], [src$="gear-c1-patrol-baton-r31.png"]) {
  left: var(--grip-right, 70.3%); top: calc(var(--grip-y, 66.1%) - var(--prop-grip) * var(--prop-length));
  width: auto; height: var(--prop-length); transform: translateX(-50%) rotate(var(--prop-tilt));
  transform-origin: 50% calc(100% * var(--prop-grip));
}
.cat-rig[data-pose="seated"] .catalog-weapon:is([src$="gear-c1-mic-stand-r31.png"], [src$="gear-c1-patrol-baton-r31.png"]) {
  top: calc(var(--grip-y, 73%) * .5 + 54.5% - var(--prop-grip) * var(--prop-seated));
  height: var(--prop-seated); transform: translateX(-50%) rotate(var(--prop-seated-tilt));
}
.cat-rig .catalog-headwear[src$="gear-c1-gym-r31-headwear.png"] {
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--eye-y, 35%) - 24%);
  width: clamp(68%, calc(var(--eye-gap, 22%) * 3.25), 84%); height: 36%;
  transform: translateX(-50%); object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-c1-cassette-headphones-r31.png"] {
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--eye-y, 35%) - 29%);
  width: clamp(77%, calc(var(--eye-gap, 23%) * 3.45), 90%); height: 54%;
  transform: translateX(-50%); object-fit: fill;
}
.cat-rig .catalog-headwear:is([src$="gear-c1-video-cap-r31.png"], [src$="gear-c1-patrol-cap-r31.png"]) {
  left: calc(var(--face-x, 56%) - 24%); top: max(0%, calc(var(--hat-top, 9%) - 7%)); width: 48%; height: 18%;
}
.cat-rig .catalog-clothing:is([src$="gear-c1-ensemble-vest-r31.png"], [src$="gear-c1-garden-apron-r31.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .40);
  width: calc(var(--coat-width, 63%) * .80); height: 27%;
}
.cat-rig .catalog-collar:is([src$="gear-c1-gym-r31-collar.png"],
    [src$="gear-c1-catnip-pendant-r31.png"], [src$="gear-c1-brass-tag-r31.png"], [src$="gear-c1-heavy-buckle-r31.png"]) {
  top: calc(var(--chin) - 1%); height: 15%; object-fit: contain; object-position: center top;
}
.cat-rig[data-pose] .catalog-weapon.gear-hand-prop {
  left: var(--grip-right, 70.3%); top: var(--grip-y, 66.1%); width: auto; height: var(--held-length);
  transform: translate(calc(-1 * var(--held-x)), calc(-1 * var(--held-y))) rotate(var(--held-angle));
  transform-origin: var(--held-x) var(--held-y);
}
.cat-rig[data-pose="seated"] .catalog-weapon.gear-hand-prop {
  top: var(--held-seat-y, calc(var(--grip-y, 73%) * .5 + 54.5%)); height: var(--held-seated);
  transform: translate(calc(-1 * var(--held-x)), calc(-1 * var(--held-seat-y, var(--held-y)))) rotate(var(--held-seat-angle));
}
.cat-rig .catalog-headwear[src*="gear-set-"] {
  left: var(--face-x, 56%); top: calc(var(--hat-top, 15%) + 9%);
  width: 58%; height: 27%; object-fit: contain; object-position: center bottom;
  transform: translate(-50%, -100%);
}
.cat-rig .catalog-headwear[src$="gear-set-11-headwear.png"] { width: 34%; height: 16%; top: calc(var(--hat-top, 15%) + 14%); }
.cat-rig .catalog-headwear[src$="gear-set-14-headwear.png"] { width: 29%; height: 11%; }
.cat-rig .catalog-headwear[src$="gear-set-17-headwear.png"] { top: calc(var(--hat-top, 15%) + 11%); }
.cat-rig .catalog-headwear[src$="gear-set-15-headwear.png"] {
  --face-opening: calc(var(--eye-y, 35%) - var(--eye-height, 18%) / 2 - 3%);
  --hood-height: calc((var(--chin) - var(--face-opening)) / .52);
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--face-opening) - var(--hood-height) * .295);
  width: clamp(59%, calc(var(--eye-gap, 22%) * 3.45), 82%); height: var(--hood-height);
  object-fit: fill; transform: translateX(-50%);
}
.cat-rig .catalog-headwear[src$="gear-set-23-headwear.png"] {
  --helmet-height: clamp(45%, calc(var(--eye-height, 18%) * 3.2), 59%);
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--eye-y, 35%) - var(--helmet-height) * .72);
  width: clamp(59%, calc(var(--eye-gap, 22%) * 3.2), 77%); height: var(--helmet-height);
  object-fit: fill; transform: translateX(-50%);
}
.cat-rig .catalog-headwear[src$="gear-set-24-headwear.png"] {
  --wig-height: clamp(22%, calc(var(--eye-height, 16%) * 1.55), 30%);
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--eye-y, 35%) - var(--eye-height, 16%) * .55 - var(--wig-height) * .71);
  width: clamp(65%, calc(var(--eye-gap, 22%) * 3.3), 79%); height: var(--wig-height);
  object-fit: fill; transform: translateX(-51%);
}
.cat-rig .wear-beard {
  left: var(--face-x, 56%); top: calc(var(--chin) - 3%); width: 40%; height: 22%;
  object-fit: contain; object-position: center top; transform: translateX(-50%);
}
.cat-rig .catalog-collar[src*="gear-set-"] {
  left: var(--face-x, 56%); top: calc(var(--chin) - 1%); width: calc(var(--coat-width, 63%) * .74); height: 16%;
  object-fit: contain; object-position: center top; transform: translateX(-50%);
}
.cat-rig .catalog-collar[src$="gear-set-14-collar.png"] { width: calc(var(--coat-width, 63%) * .9); height: 33%; }
.cat-rig .catalog-collar[src$="gear-set-19-collar.png"] { height: 8%; z-index: 5; }
.cat-rig .catalog-clothing[src*="gear-set-12-clothing"] {
  left: var(--face-x, 56%); top: 79%; width: calc(var(--coat-width, 63%) * .96); height: 19%;
  transform: translateX(-50%); object-fit: fill;
}
.cat-rig[data-pose="seated"] .catalog-clothing[src*="gear-set-12-clothing"] { top: 80%; }
.cat-rig .catalog-weapon.gear-hand-prop[src*="gear-set-"] { z-index: 4; }
.cat-rig[data-pose="standing"]:has(.fitted-cuff-coat) .catalog-weapon:is([src$="gear-street-leather-weapon.png"], [src$="gear-stage-violin-weapon.png"], [src$="gear-fanzine-weapon.png"], [src$="gear-cabaret-weapon.png"], [src$="gear-raspberry-weapon.png"], [src$="gear-herbarium-weapon.png"], [src$="gear-last-concert-weapon.png"]) { z-index: 4; }
.cat-rig[data-pose] .catalog-weapon.gear-ram {
  left: calc((var(--grip-left, 41.6%) + var(--grip-right, 70.3%)) / 2); top: var(--grip-y, 66.1%);
  width: calc((var(--grip-right, 70.3%) - var(--grip-left, 41.6%)) * 2.45); height: 22%;
  transform: translate(-54%, -9%); object-fit: fill;
}
.cat-rig[data-pose="seated"] .catalog-weapon.gear-ram { top: calc(var(--grip-y, 73%) * .5 + 54.5%); height: 16%; }
.cat-rig .catalog-headwear[src$="gear-c2-felt-hat-r31.png"] {
  left: calc(var(--face-x, 56%) - 36%); top: max(0%, calc(var(--hat-top, 9%) - 9%)); width: 72%; height: 24%; object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-c2-field-cap-r31.png"] {
  left: calc(var(--face-x, 56%) - 23%); top: max(0%, calc(var(--hat-top, 9%) - 7%)); width: 46%; height: 19%;
}
.cat-rig .catalog-headwear[src$="gear-c2-stage-scarf-r31.png"] {
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--eye-y, 35%) - 26%);
  width: 76%; height: 34%; transform: translateX(-47%); object-fit: fill;
}
.cat-rig .catalog-headwear:is([src$="gear-c3-deck-headphones-r31.png"], [src$="gear-c3-wired-vr-r31.png"], [src$="gear-c3-rain-hood-r31.png"]) {
  left: var(--eye-x, var(--face-x, 56%)); top: calc(var(--eye-y, 35%) - 30%);
  width: clamp(80%, calc(var(--eye-gap, 23%) * 3.8), 95%); height: 51%;
  transform: translateX(-46%); object-fit: fill;
}
.cat-rig .catalog-headwear[src$="gear-c3-rain-hood-r31.png"] { transform: translateX(-50%); }
.cat-rig .catalog-clothing:is([src$="gear-c2-bar-vest-r31.png"], [src$="gear-c2-leather-apron-r31.png"]) {
  left: calc(var(--face-x, 56%) - var(--coat-width, 63%) * .39);
  top: calc(var(--chin) - 2%); width: calc(var(--coat-width, 63%) * .78); height: 28%;
}
.cat-rig .catalog-collar:is([src$="gear-c2-linen-sachet-r31.png"], [src$="gear-c2-uniform-tie-r31.png"], [src$="gear-c3-silk-bow-r31.png"], [src$="gear-c3-coin-necklace-r31.png"]) {
  top: calc(var(--chin) - 1%); height: 16%; object-fit: contain; object-position: center top;
}
.cat-rig[data-pose] .catalog-weapon[src$="gear-c2-rental-copy-weapon.png"] {
  left: var(--grip-right, 70.3%); top: calc(var(--grip-y, 66.1%) - 9%); width: auto; height: 37.5%;
  transform: translateX(-47%) rotate(-12deg); transform-origin: 47% 24%;
}
.cat-rig[data-pose="seated"] .catalog-weapon[src$="gear-c2-rental-copy-weapon.png"] {
  top: calc(var(--grip-y, 73%) * .5 + 46.58%); height: 33%; transform: translateX(-47%) rotate(-76deg);
}
.cat-rig .catalog-headwear[src$="gear-c3-clarinet-headwear.png"] {
  left: calc(var(--face-x, 56%) - 33%); top: max(0%, calc(var(--hat-top, 14%) - 12%));
  width: 66%; height: 20%; object-fit: fill;
}
.cat-rig .catalog-weapon[src$="gear-c3-klezmer-r31-weapon.png"] {
  --handle-x: -65%; --handle-y: -34%; height: 36%;
}
.cat-rig[data-pose="seated"] .catalog-weapon[src$="gear-c3-klezmer-r31-weapon.png"] {
  top: 79%; height: 29%;
}
.cat-rig .catalog-weapon[src$="gear-c3-quiet-r31-weapon.png"] { --handle-x: -30%; --handle-y: -72%; }
.cat-rig .catalog-weapon[src$="gear-c3-herbal-r31-weapon.png"] { --handle-x: -18%; --handle-y: -45%; }
.cat-rig[data-pose="seated"] .catalog-weapon[src$="gear-c3-herbal-r31-weapon.png"] { top: 80%; }
.challenge-portrait .cat-rig { height: 100%; width: auto; }
.challenge-summary .challenge-portrait .rival-rig { width: min(100%, 92px); height: auto; }
.cat-rig.laying { aspect-ratio: 440 / 296; }
.actor.knockout:not(.resting) { width: min(22%, 22cqh); }
.outfits { display: grid; gap: 8px; margin-top: 8px; }
.green-panel, .green-quote, .green-family { display: grid; gap: 7px; }
.green-panel h3, .green-panel p { margin: 0; }
.green-panel h3 { font-size: .96rem; }
.green-panel button { min-height: 48px; }
.green-hero { display: block; width: 100%; aspect-ratio: 3 / 1; object-fit: cover; border-radius: 10px; }
.green-entry { display: flex; align-items: center; gap: 6px; }
.green-strip { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 5px; padding: 6px 9px; border-radius: 8px; background: var(--raised); }
.green-stock, .green-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.green-stock button { display: grid; justify-items: center; align-content: start; gap: 3px; text-align: center; padding: 6px 4px; font-size: .86rem; }
.green-icon.item-art-frame { width: 48px; height: 48px; padding: 2px; }
.green-stock small, .green-quote small, .green-muted { color: var(--muted); }
.green-stock [aria-pressed="true"], .green-pocket [aria-pressed="true"] { background: #ebe0f6; outline: 1px solid #6c5190; outline-offset: -1px; }
.green-quote { padding: 8px; border-radius: 10px; background: var(--raised); }
.green-quote header { display: flex; align-items: center; gap: 8px; }
.green-quote header small { display: block; }
.green-quote .primary, .green-links button { text-align: center; }
.green-links button { padding-inline: 6px; }
.green-quote details[open] p { margin-bottom: 5px; }
.green-risk-select { display: grid; }
.green-risk-select select { max-width: 100%; }
.green-values { display: grid; gap: 3px; padding: 0; margin: 0; list-style: none; }
.green-values li { display: flex; justify-content: space-between; gap: 5px; align-items: baseline; }
.green-values strong { white-space: nowrap; }
.green-pocket { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
.green-pocket > * { display: grid; place-items: center; padding: 3px; min-height: 56px; border-radius: 8px; }
.green-pocket > span { color: var(--muted); border: 1px dashed var(--line); }
.inspection-banner { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 4px 7px; margin: 4px 10px 0;
  background: #fff2d9; border: 1px solid #e0c695; border-radius: 9px; font-size: .84rem; }
.fight-surrender > .inspection-banner { margin: 0 0 8px; }
.inspection-banner button { min-height: 48px; flex: none; text-align: center; background: var(--panel); }
.inspection-banner details { margin: 0; }
.inspection-banner:has(details[open]) > div { flex: 1; }
.inspection-banner:has(details[open]) > [data-inspection-review] { display: none; }
.inspection-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.inspection-banner small { display: block; color: var(--muted); }
.inspection-banner summary { cursor: pointer; }
.inspection-banner p { margin: 2px 0; }
.app:has(> .resources[hidden]) > .app-events > .inspection-banner { min-height: 58px; margin-top: max(4px, var(--safe-top)); }
.app:has(> .app-events > .inspection-banner:not([hidden])) #battle-screen { padding-top: 4px; }
.app:has(> .app-events > .inspection-banner:not([hidden])) .duel-actors {
  height: clamp(102px, calc(var(--app-height) - 570px - var(--safe-top) - var(--safe-bottom)), 210px);
}
.app:has(> .app-events > .inspection-banner:not([hidden])) .signal { min-height: 70px; }
.dialog-heading > .inspection-banner button { width: auto; padding-inline: 8px; font-size: .84rem; border-radius: 7px; }
#details:has(.dialog-heading > :is(.battle-return, .urgent-action, .inspection-banner):not([hidden])) > .operation-recovery { position: static; }
.inspection-scene { position: relative; }
.inspection-cat { position: absolute; width: 19%; bottom: 1%; left: 32%; filter: brightness(.40); }
.inspection-empty { display: flex; gap: 4px; }
.inspection-empty span { width: 22px; height: 17px; border: 1px dashed #9882ac; border-radius: 4px; }
.inspection-knockout { animation: inspection-reveal .32s ease-out; }
@keyframes inspection-reveal { from { filter: brightness(.45); } }
:root[data-motion="reduced"] .inspection-knockout { animation: none; }
.green-quote progress { width: 100%; accent-color: #a45a66; }
.cache-panel { display: grid; gap: 8px; }
.cache-panel h3, .cache-panel p { margin: 0; }
.cache-panel h3 { font-size: .96rem; }
.cache-panel button { min-height: 48px; }
.cache-heading { display: flex; align-items: center; gap: 9px; border-radius: 10px; background: var(--raised); padding: 8px 10px; }
.cache-heading img { width: 74px; height: 94px; object-fit: contain; }
.cache-heading small { display: block; color: var(--muted); }
.cache-panel progress { width: 100%; accent-color: #6d9780; }
.cache-cells { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
.cache-cells > * { display: grid; place-items: center; min-height: 48px; padding: 3px; border-radius: 8px; }
.cache-cells > span { border: 1px dashed var(--line); color: var(--muted); }
.cache-cells .green-icon { width: min(100%, 39px); height: 39px; }
.cache-cells [aria-pressed="true"] { background: #ebe0f6; outline: 1px solid #6c5190; outline-offset: -1px; }
.plant-panel { display: grid; gap: 8px; }
.plant-panel p { margin: 0; }
.plant-panel button { min-height: 48px; }
.plant-panel .cache-heading img { width: 48px; height: 48px; }
.plant-panel [aria-pressed="true"] { background: #ebe0f6; }
[data-own-profile] { display: grid; gap: 8px; }
.cat-quick-status { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 5px; }
[data-own-profile] .cat-vitals { margin: 0; justify-content: center; gap: 5px; }
.cat-progress { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 8px; align-items: center; }
.cat-progress > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 3px 6px; }
.cat-progress strong { grid-column: 1 / -1; }
.cat-progress small { color: var(--muted); }
.cat-progress progress { width: 100%; height: 7px; accent-color: #347a62; }
.cat-species { min-height: 44px; border: 0; padding: 2px 6px; background: transparent; color: var(--muted); font-size: .85rem; }
.cat-species::after { content: " ›"; font-size: 1rem; }
.cat-page-tabs, .cat-growth-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
.cat-page-tabs button { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 48px; padding: 4px; font-weight: 650; }
.cat-page-tabs img { width: 23px; height: 23px; object-fit: contain; }
.cat-page-tabs [aria-pressed="true"] { background: #ebe0f6; border-color: #9a7cb2; box-shadow: inset 0 -2px #9a7cb2; }
.cat-page-tabs:has([data-cat-page="garage"]) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.car-tab-icon { display: grid; place-items: center; width: 23px; height: 24px; font-size: 18px; line-height: 1; }
.neighbor-garage-heading { display: flex; align-items: center; justify-content: space-between; gap: 5px; }
.neighbor-garage-heading p { margin: 0; }
.neighbor-car-toggle.detail-action { display: grid; place-items: center; flex: 0 0 42px; min-height: 40px; padding: 0; font-size: 18px; }
.neighbor-car-toggle img { width: 24px; height: 24px; object-fit: contain; }
.car-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.car-tile.detail-action { display: grid; align-content: start; justify-items: center; gap: 5px; min-width: 0; padding: 6px; }
.car-tile strong { min-width: 0; overflow-wrap: anywhere; font-size: .8rem; line-height: 1.2; }
.car-tile small { color: inherit; }
.car-tile .car-art { width: 100%; height: clamp(66px, 22vw, 115px); }
#item-details:is([data-kind="car-shop"], [data-kind="car-garage"]) { width: min(calc(100% - 20px), 420px); }
[data-car-shop-card] { display: grid; gap: 8px; }
.car-preview-art { width: 100%; height: min(84vw, 50dvh, 370px); }
.car-preview-grade { text-align: center; }
[data-car-buy] { width: 100%; min-height: 46px; }
.car-empty { margin: 5px 0; }
.cat-shortcuts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
.cat-action { display: grid; place-items: center; align-content: center; gap: 4px; min-width: 0; min-height: 54px;
  padding: 4px 2px; text-align: center; line-height: 1.2; font-size: .75rem; font-weight: 650; border-radius: 9px; background: var(--panel); }
.cat-action img { width: 26px; height: 26px; object-fit: contain; }
.cat-growth-actions .cat-action { min-height: 81px; padding: 6px 4px; font-size: .875rem; background: var(--raised); }
.cat-growth-actions .cat-action img { width: 34px; height: 32px; }
.cat-action small { display: block; margin-top: 2px; font-weight: 400; color: var(--muted); }
.bag-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px; align-items: center; }
.bag-heading h3 { margin: 0; font-size: 1rem; }
.bag-sections { display: flex; flex-wrap: wrap; gap: 4px; }
.bag-sections button { min-height: 44px; padding: 4px 6px; text-align: center; font-size: .75rem; }
.cat-bag { container-type: inline-size; }
.cat-stats, .cat-stat-card, .bag-results { display: grid; gap: 6px; }
.cat-stats h3 { margin: 0; font-size: 1rem; }
.cat-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
.cat-stat { display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: center; gap: 2px 4px; min-width: 0; min-height: 48px;
  padding: 5px; font-size: .78rem; border-radius: 8px; background: var(--panel); overflow-wrap: anywhere; }
.cat-stat strong { grid-column: 2; }
.cat-stat strong, .cat-stat-card dd { font-variant-numeric: tabular-nums; }
.cat-stat-card > strong { color: var(--ink); }
.cat-stat-card button { min-height: 48px; }
.cat-stat-card dl { margin: 0; }
.cat-stat-card dl > div { display: flex; justify-content: space-between; gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--line); }
.cat-stat-card dd { margin: 0; }
.bag-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 5px; }
.bag-tools:has(.bag-filter-panel[open]) { grid-template-columns: minmax(0, 1fr); }
.bag-filter-panel summary { min-height: 46px; }
.bag-filter-panel .merchant-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bag-filter-panel select { width: 100%; min-width: 0; min-height: 44px; padding: 4px 7px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: inherit; font: inherit; }
.bag-search { display: grid; gap: 3px; font-size: .88rem; }
.bag-search input { min-width: 0; min-height: 48px; padding: 4px 8px; font: inherit; color: inherit;
  border: 1px solid var(--line); border-radius: 7px; background: var(--panel); }
.bag-result-head { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.bag-result-head button { min-height: 48px; }
.bag-filters-active { display: flex; flex-wrap: wrap; gap: 4px; }
.bag-filters-active span { padding: 2px 6px; border-radius: 6px; background: var(--raised); }
.gear-doll { display: grid; grid-template-columns: minmax(54px, 64px) minmax(0, 1fr) minmax(54px, 64px);
  width: 100%; max-width: 400px; margin-inline: auto; gap: 8px; align-items: center; }
.gear-doll .cat-preview { width: min(100%, 142px); }
.gear-doll .framed-preview .cat-preview { width: 68%; }
.gear-slots, .gear-bag { display: grid; gap: 5px; }
.gear-bag { grid-template-columns: repeat(auto-fit, minmax(max(64px, 3.9rem), 1fr)); }
.gear-slots button, .gear-bag button {
  display: grid;
  place-content: center;
  justify-items: center;
  min-height: 48px;
  padding: 4px 2px;
  text-align: center;
  font-size: 12px;
  line-height: 1.18;
  background: #fffcf7;
  overflow-wrap: anywhere;
}
.gear-bag button { min-height: 74px; font-size: .75rem; }
.gear-slots .gear-slot { aspect-ratio: 1; gap: 3px; border: 1px solid var(--line); border-radius: 9px; font-weight: 600; }
.gear-slots .gear-slot.empty { border-style: dashed; background: var(--raised); color: var(--muted); }
.gear-slot-empty { position: relative; display: grid; place-items: center; width: 36px; height: 36px; }
.gear-slot-empty img { width: 31px; height: 31px; object-fit: contain; filter: grayscale(1); opacity: .44; }
.gear-slot-empty b { position: absolute; right: 0; bottom: 0; display: grid; place-items: center; width: 15px; height: 15px;
  border-radius: 50%; background: var(--panel); color: var(--muted); font-size: .85rem; }
.bag-item-name { display: none; }
.bag-item-signs { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2px 4px; min-height: 16px; font-size: .6875rem; font-weight: 700; }
.bag-new { width: 8px; height: 8px; border-radius: 50%; background: #217869; }
.bag-worn { color: #217869; }
.gear-slots [aria-pressed="true"], .gear-bag [aria-pressed="true"] { outline: 1px solid #9a7cb2; outline-offset: -1px; }
.gear-slots .item-art-frame { width: 36px; height: 36px; padding: 3px; }
.gear-bag .item-art-frame { width: 52px; height: 44px; padding: 2px; }
@container (max-width: 11rem) {
  .gear-bag { grid-template-columns: 1fr; }
  .gear-bag button { grid-template-columns: auto minmax(0, 1fr); justify-items: start; padding-inline: 8px; column-gap: 8px; text-align: left; }
  .gear-bag .item-art-frame { grid-row: 1 / span 2; align-self: center; }
  .gear-bag .bag-item-name { display: block; }
  .gear-bag button > :not(.item-art-frame) { grid-column: 2; }
}
.outfits small { color: var(--muted); font-size: 11px; }
.outfits h3 { margin: 0; font-size: 15px; }
.build-comparison { display: grid; gap: 5px; }
.build-comparison ul { margin: 0; padding: 0; list-style: none; }
.build-comparison li { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 8px; padding-block: 3px; font-size: .9rem; }
.build-comparison li strong { margin-inline-start: auto; }
.build-parts { white-space: nowrap; }
.build-comparison p small { display: block; }
.item-source-rows { display: grid; gap: 5px; }
.item-source { display: grid; gap: 2px; }
.shop-comparison:empty { display: none; }
:root[data-motion="reduced"] :is(.eyes-blink, .actor:not(.resting), .steam),
:root[data-room-view="still"] #room-screen :is(.eyes-blink, .actor, .steam, .neighbor-wave, .head-layer) { animation: none; }