/* GEAR ABYSS — arcane workshop. Existing theme tokens keep all palette variants coherent. */
.workshop-screen { display: grid; gap: 18px; min-width: 0; }
.workshop-header { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 24px; border-block: 1px solid var(--accent-border); background: radial-gradient(ellipse at 0 0, rgb(var(--abyss-crystal-rgb) / .09), transparent 65%), var(--surface); }
.workshop-title { display: flex; align-items: center; gap: 16px; min-width: 0; }
.workshop-emblem { width: 80px; height: 80px; flex: 0 0 80px; object-fit: contain; filter: drop-shadow(0 0 12px rgb(var(--abyss-crystal-rgb) / .16)); }
.workshop-header[data-workshop="forge"] .workshop-emblem { filter: drop-shadow(0 0 12px rgba(213, 185, 113, .12)); }
.workshop-title > div { min-width: 0; }
.workshop-title h1 { margin: 3px 0 7px; font-size: 26px; letter-spacing: .12em; }
.workshop-title p:not(.eyebrow) { margin: 0; font-size: 12px; color: var(--muted); }
.workshop-wallet { display: flex; gap: 24px; flex-shrink: 0; }
.workshop-wallet span { display: grid; gap: 5px; }
.workshop-wallet small { color: var(--muted); font-size: 10px; letter-spacing: .08em; }
.workshop-wallet b { color: var(--gold); font-size: 23px; font-variant-numeric: tabular-nums; }
.workshop-wallet span:last-child b { color: var(--abyss-crystal); }
.workshop-wallet em { font-size: 10px; font-style: normal; }
.workshop-books { padding: 20px; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; }
.workshop-books > header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.workshop-books h2 { margin: 4px 0; font-size: 17px; }
.workshop-books > header > span { color: var(--abyss-crystal); font-variant-numeric: tabular-nums; }
.workshop-book-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 10px; }
.workshop-book { display: flex; align-items: center; gap: 10px; padding: 12px; border-left: 2px solid var(--abyss-crystal); background: var(--inset); }
.workshop-book-mark { width: 44px; height: 44px; flex: 0 0 44px; object-fit: contain; }
.workshop-material-icon { width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; }
.workshop-wallet b { display: flex; align-items: center; gap: 4px; }
.workshop-book > div { display: grid; gap: 4px; flex: 1; min-width: 0; }
.workshop-book strong { font-size: 13px; overflow-wrap: anywhere; }
.workshop-book small { font-size: 10px; color: var(--muted); }
.workshop-book button { min-height: 44px; font-size: 11px; }
.workshop-gear { border-top: 2px solid var(--accent-border); }
.workshop-implicit { display: flex; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.workshop-seal { color: var(--gold); font-size: 20px; }
.workshop-implicit small { display: block; font-size: 9px; letter-spacing: .1em; color: var(--gold); margin-bottom: 4px; }
.workshop-implicit strong { font-size: 13px; }
.workshop-implicit p { color: var(--muted); font-size: 11px; margin: 5px 0 0; line-height: 1.6; }
.workshop-slot-meter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 0; font-size: 11px; }
.workshop-slot-meter > small { margin-left: auto; color: var(--muted); font-size: 10px; }
.workshop-slot-marks { display: flex; align-items: center; gap: 2px; }
.workshop-slot-marks i { display: block; width: 20px; height: 20px; flex: 0 0 20px; }
.workshop-slot-marks img { display: block; width: 100%; height: 100%; object-fit: contain; }
.workshop-slot-marks i.filled { filter: drop-shadow(0 0 3px rgb(var(--abyss-crystal-rgb) / 25%)); }
.workshop-slot-marks i.empty { opacity: .25; filter: grayscale(1); }
.workshop-empty-slot { list-style: none; }
.workshop-empty-slot button { width: 100%; min-height: 48px; display: flex; justify-content: center; align-items: center; gap: 8px; background: var(--inset); border: 1px dashed var(--line); color: var(--abyss-crystal); border-radius: 5px; font-size: 12px; cursor: pointer; }
.workshop-empty-slot button:hover { border-color: var(--abyss-crystal); }
.workshop-empty-slot button:disabled { opacity: .45; cursor: default; }
.workshop-gear .ability-chip-detail { min-height: 48px; }
.workshop-gear .ability-chip-remove { min-width: 44px; min-height: 44px; }
.workshop-price { color: var(--abyss-crystal); text-align: right; font-size: 11px; white-space: nowrap; }
.workshop-payment { display: flex; justify-content: space-between; gap: 12px; padding: 16px 0; border-block: 1px solid var(--line); color: var(--muted); }
.workshop-payment b { color: var(--gold); }
.workshop-payment span:first-child b { color: var(--abyss-crystal); }
.workshop-payment-breakdown { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 14px 0; }
.workshop-payment-breakdown:has(> :only-child) { grid-template-columns: 1fr; }
.workshop-payment-resource { min-width: 0; padding: 11px 12px; border: 1px solid var(--line); border-radius: 6px; background: rgb(0 0 0 / 16%); font-size: 11px; }
.workshop-payment-resource > strong { color: var(--muted); font-size: 11px; }
.workshop-payment-resource dl { display: grid; gap: 6px; margin: 9px 0; }
.workshop-payment-resource dl > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 10px; }
.workshop-payment-resource dt { color: var(--muted); }
.workshop-payment-resource dd { margin: 0; color: var(--text); font-size: 12px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.workshop-payment-resource > span { display: block; color: #80cbb2; font-size: 10px; overflow-wrap: anywhere; }
.workshop-payment-resource.insufficient { border-color: rgb(225 137 137 / 35%); }
.workshop-payment-resource.insufficient > span { color: #eea1a1; }
.skill-book-hunting { display: grid; gap: 6px; padding: 10px 12px; margin-top: 10px; border-left: 2px solid var(--abyss-crystal); background: rgb(var(--abyss-crystal-rgb) / 5%); }
.skill-book-hunting p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.7; overflow-wrap: anywhere; }
.skill-book-hunting p b { color: var(--text); }
.skill-book-hunting details summary { min-height: 36px; display: flex; align-items: center; cursor: pointer; color: var(--abyss-crystal); font-size: 10px; }
.skill-book-hunting small { line-height: 1.6; }
.bulk-decompose-dialog .decompose-total, .bulk-decompose-dialog .sale-item-price { color: var(--abyss-crystal); }
.bulk-decompose-dialog .sale-item-row:disabled { opacity: 1; cursor: default; }
.bulk-decompose-dialog .sale-guide { font-size: 11px; }
.bulk-decompose-grade-filter { display: flex; align-items: flex-start; gap: 10px; color: var(--muted); font-size: 11px; }
.bulk-decompose-grade-filter > span { padding-top: 14px; }
.bulk-decompose-grade-picker { flex: 1; min-width: 0; }
.bulk-decompose-grade-trigger { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 44px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 7px; background: var(--inset); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.bulk-decompose-grade-trigger i { color: var(--gold-strong); font-size: 18px; font-style: normal; transition: transform 120ms ease-out; }
.bulk-decompose-grade-trigger[aria-expanded="true"] { border-color: var(--gold); }
.bulk-decompose-grade-trigger[aria-expanded="true"] i { transform: rotate(180deg); }
.bulk-decompose-grade-options { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; max-height: min(32dvh, 240px); margin-top: 6px; padding: 8px; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--accent-border); border-radius: 7px; background: var(--inset); }
.bulk-decompose-grade-options[hidden] { display: none; }
.bulk-decompose-grade-options button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-width: 0; min-height: 44px; padding: 6px 4px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface-2); color: var(--muted); font: inherit; cursor: pointer; }
.bulk-decompose-grade-options button > span { line-height: 1.3; }
.bulk-decompose-grade-options button > small { font-size: 10px; font-weight: 400; line-height: 1.2; font-variant-numeric: tabular-nums; }
.bulk-decompose-grade-options button[data-grade="all"] { grid-column: 1 / -1; flex-direction: row; gap: 8px; }
.bulk-decompose-grade-options button.selected { border-color: var(--gold); background: rgb(var(--accent-rgb) / 14%); color: var(--gold-strong); font-weight: 700; }
.bulk-decompose-grade-picker button:focus-visible { outline: 2px solid var(--gold-strong); outline-offset: -3px; }
.bulk-decompose-grade-picker button:disabled { opacity: .5; cursor: default; }
@media (max-width: 360px) { .bulk-decompose-grade-options { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.bulk-decompose-dialog { display: flex; flex-direction: column; overflow: hidden; }
.bulk-decompose-body { flex: 1 1 auto; min-height: 0; min-width: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.bulk-decompose-body .sale-item-list { min-height: 0; max-height: none; overflow: visible; }
.bulk-decompose-body .decompose-point-rewards ul { max-height: none; overflow: visible; }
.bulk-decompose-dialog > .sale-actions { flex: 0 0 auto; padding-top: 10px; border-top: 1px solid var(--line); }
.bulk-decompose-dialog .sale-quick-actions { flex-wrap: wrap; }
.bulk-decompose-dialog .sale-quick-actions button { min-height: 44px; }
.bulk-decompose-dialog .sale-rarity-filters button { min-height: 40px; }
.bulk-decompose-dialog .sale-slot-strip { flex-wrap: wrap; }
.bulk-decompose-dialog .sale-slot-strip > span { padding: 2px 5px; border: 1px solid var(--line); border-radius: 3px; color: var(--muted); font-size: 10px; line-height: 1.4; }
.bulk-decompose-dialog .sale-summary > div { flex-wrap: wrap; }
.inventory-toolbar { gap: 8px; flex-wrap: wrap; }
@media (max-width: 360px) {
  .workshop-payment-resource { padding: 10px 8px; }
  .bulk-decompose-dialog .sale-quick-actions button { font-size: 10px; }
}
.workshop-warehouse summary { cursor: pointer; padding: 12px 0; color: var(--muted); font-size: 12px; }
.workshop-warehouse-list { display: flex; flex-wrap: wrap; gap: 8px; max-height: 260px; overflow: auto; }
.workshop-warehouse-list button { display: flex; align-items: center; gap: 8px; min-height: 44px; }
.workshop-guide { display: flex; gap: 16px; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.workshop-guide span { display: grid; flex: 1; gap: 6px; }
.workshop-guide b { font-size: 13px; color: var(--gold); }
.workshop-guide small { font-size: 10px; color: var(--muted); }
.workshop-forge-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); align-items: start; gap: 10px; }
.workshop-forge-card { padding: 12px 14px; background: linear-gradient(115deg, rgb(var(--accent-rgb) / 4%), transparent 65%), var(--surface); border: 1px solid var(--line); border-top: 2px solid var(--accent-border); border-radius: 7px; min-width: 0; }
:is(.workshop-forge-card, .equipment-item-card).enhance-success { position: relative; isolation: isolate; overflow: hidden; animation: workshop-enhance-glow 1.8s ease-out both; }
:is(.workshop-forge-card, .equipment-item-card).enhance-success::before { content: ""; position: absolute; z-index: -1; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(0deg, transparent 5%, rgb(73 232 150 / 8%) 25%, rgb(111 255 184 / 32%) 45%, rgb(73 232 150 / 10%) 65%, transparent 90%); animation: workshop-enhance-rise 1.8s ease-out both; }
:is(.workshop-forge-card, .equipment-item-card).enhance-success .equipment-gear-enhancement, :is(.workshop-forge-card, .equipment-item-card).enhance-success .equipment-gear-stats b, :is(.workshop-forge-card, .equipment-item-card).enhance-success .workshop-plus, :is(.workshop-forge-card, .equipment-item-card).enhance-success .workshop-stat-grid b { animation: workshop-enhance-number 1.8s ease-out both; }
.workshop-enhance-success { position: absolute; z-index: 1; inset: 34% 12px auto; display: grid; justify-items: center; gap: 7px; pointer-events: none; text-align: center; color: #c4ffde; animation: workshop-enhance-feedback 1.8s ease-out both; }
.workshop-enhance-success > strong { padding: 6px 12px; border: 1px solid rgb(119 245 178 / 65%); border-radius: 20px; background: rgb(8 42 29 / 94%); font-size: 13px; box-shadow: 0 0 18px rgb(73 232 150 / 20%); }
.workshop-enhance-success > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
.workshop-enhance-success > div > span { padding: 4px 8px; border-radius: 5px; background: rgb(8 42 29 / 94%); font-size: 12px; }
.workshop-enhance-success b { color: #8dffbd; font-variant-numeric: tabular-nums; }
@keyframes workshop-enhance-glow { 0%, 100% { border-color: var(--line); box-shadow: none; } 15%, 65% { border-color: #65eca0; box-shadow: inset 0 0 30px rgb(73 232 150 / 16%), 0 0 14px rgb(73 232 150 / 25%); } }
@keyframes workshop-enhance-rise { 0% { transform: translateY(90%); opacity: 0; } 15% { opacity: 1; } 75% { opacity: .8; } 100% { transform: translateY(-90%); opacity: 0; } }
@keyframes workshop-enhance-number { 15%, 70% { color: #8dffbd; text-shadow: 0 0 10px rgb(73 232 150 / 45%); } }
@keyframes workshop-enhance-feedback { 0% { opacity: 0; transform: translateY(16px); } 18%, 72% { opacity: 1; } 100% { opacity: 0; transform: translateY(-24px); } }
@media (prefers-reduced-motion: reduce) {
  :is(.workshop-forge-card, .equipment-item-card).enhance-success { animation: none; border-color: #65eca0; box-shadow: inset 0 0 24px rgb(73 232 150 / 12%); }
  :is(.workshop-forge-card, .equipment-item-card).enhance-success::before { display: none; }
  :is(.workshop-forge-card, .equipment-item-card).enhance-success .equipment-gear-enhancement, :is(.workshop-forge-card, .equipment-item-card).enhance-success .equipment-gear-stats b, :is(.workshop-forge-card, .equipment-item-card).enhance-success .workshop-plus, :is(.workshop-forge-card, .equipment-item-card).enhance-success .workshop-stat-grid b { animation: none; color: #8dffbd; }
  .workshop-enhance-success { animation: none; }
}
.workshop-forge-card > header { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; gap: 8px; }
.workshop-forge-card > header > span:first-child { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--muted); }
.workshop-forge-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-top: 5px; }
.workshop-forge-status { max-width: 100%; padding: 2px 6px; border: 1px solid var(--accent-border); border-radius: 4px; color: var(--gold); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.workshop-forge-card .workshop-plus { grid-column: 3; justify-self: end; }
.workshop-plus { margin-left: auto; color: var(--gold); font-size: 16px; font-variant-numeric: tabular-nums; }
.workshop-forge-card h2 { font-size: 16px; margin: 0; line-height: 1.5; overflow-wrap: anywhere; }
.workshop-stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 14px 0; }
.workshop-stat-grid span { display: grid; gap: 5px; }
.workshop-stat-grid small { font-size: 10px; color: var(--muted); }
.workshop-stat-grid b { font-size: 13px; font-variant-numeric: tabular-nums; }
.workshop-forge-card .workshop-stat-grid { display: flex; flex-wrap: wrap; gap: 5px 14px; padding: 7px 0 4px; }
.workshop-forge-card .workshop-stat-grid span { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.workshop-forge-card .workshop-stat-grid b { overflow-wrap: anywhere; }
.workshop-forge-card .implicit-trait-note { margin-top: 5px; border: 0; border-left: 2px solid var(--accent-border); background: rgb(var(--accent-rgb) / 5%); }
.workshop-forge-card .implicit-trait-note summary { min-height: 44px; gap: 8px; padding: 6px 9px; }
.workshop-forge-card .implicit-trait-note summary small { flex-shrink: 0; color: var(--muted); font-size: 10px; }
.workshop-forge-card .implicit-trait-note strong { font-size: 12px; overflow-wrap: anywhere; }
.workshop-forge-card .implicit-trait-note p { padding: 0 9px 9px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.workshop-forge-card .implicit-trait-note summary:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; border-radius: 4px; }
.workshop-forge-card .workshop-slot-meter { gap: 4px 7px; padding: 8px 0; }
.workshop-forge-card .workshop-slot-meter > small { width: auto; margin-left: auto; font-size: 9px; }
.workshop-forge-card .workshop-slot-marks i { width: 17px; height: 17px; flex-basis: 17px; }
.workshop-forge-skills { margin-top: 5px; border: 1px solid var(--line); border-radius: 4px; background: rgb(var(--accent-rgb) / 3%); }
.workshop-forge-skills > summary { display: grid; grid-template-columns: auto minmax(0, 1fr) 8px; align-items: center; gap: 8px; min-height: 44px; padding: 6px 9px; list-style: none; cursor: pointer; }
.workshop-forge-skills > summary::-webkit-details-marker { display: none; }
.workshop-forge-skills > summary::after { width: 6px; height: 6px; border-right: 1px solid var(--muted); border-bottom: 1px solid var(--muted); transform: rotate(45deg); content: ""; }
.workshop-forge-skills[open] > summary::after { transform: rotate(225deg); }
.workshop-forge-skills > summary:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; border-radius: 4px; }
.workshop-forge-skill-heading { display: grid; gap: 2px; font-size: 10px; }
.workshop-forge-skill-heading small { color: var(--muted); font-size: 10px; }
.workshop-forge-skills .equipment-gear-general-preview { gap: 3px 8px; padding: 0; }
.workshop-forge-skills .equipment-gear-skill-name { color: var(--text); font-size: 11px; }
.workshop-forge-skills .equipment-gear-empty { color: var(--muted); font-size: 10px; }
.workshop-forge-skill-effects { padding: 0 9px 8px; font-size: 11px; }
.workshop-forge-skill-effects .equipment-effect-row { padding: 8px 0; }
.workshop-forge-slot-bonus { margin: 5px 0 0; color: var(--muted); font-size: 10px; }
.workshop-card-actions { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 7px; margin-top: 2px; padding-top: 9px; border-top: 1px solid var(--line); }
.workshop-card-actions:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
.workshop-card-actions button { min-width: 0; min-height: 44px; padding: 8px; font-size: 11px; overflow-wrap: anywhere; }
.workshop-card-actions .workshop-enhance-hold { display: flex; align-items: center; justify-content: center; gap: 8px; touch-action: pan-y pinch-zoom; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.workshop-enhance-copy { display: grid; gap: 2px; min-width: 0; }
.workshop-enhance-copy small { color: inherit; opacity: .8; font-size: 9px; font-weight: 400; line-height: 1.4; }
.workshop-enhance-gauge { flex: 0 0 24px; width: 24px; height: 24px; overflow: visible; transform: rotate(-90deg); pointer-events: none; }
.workshop-enhance-gauge circle { fill: none; stroke: currentColor; stroke-width: 2.5; }
.workshop-enhance-track { opacity: .25; }
.workshop-enhance-progress { stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--enhance-hold-progress, 0)); stroke-linecap: round; }
.workshop-enhance-hold.holding { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold); }
@media (max-width: 360px) { .workshop-card-actions:has(> .secondary-button) .workshop-enhance-copy small { display: none; } }
.workshop-review-name { display: block; font-size: 16px; margin: 16px 0; }
#workshop-review-dialog .workshop-review-name { overflow-wrap: anywhere; }
#workshop-review-dialog .workshop-enhance-quantity { display: grid; gap: var(--ga-space-2); margin: var(--ga-space-3) 0; font-size: var(--ga-font-body); }
.workshop-cost { display: flex; justify-content: space-between; padding-block: 16px; border-block: 1px solid var(--line); font-size: 13px; }
.workshop-cost b { color: var(--gold); }
.workshop-empty { padding: 16px 0; margin: 0; color: var(--muted); font-size: 12px; }
.workshop-codex-status { padding: 12px 0; font-size: 12px; border-top: 1px solid var(--line); }
.workshop-codex-status strong { color: var(--abyss-crystal); font-size: 11px; }
.workshop-codex-status small { color: var(--muted); font-size: 10px; }
.workshop-skill-effect { width: 100%; font-size: 11px; }
.workshop-skill-effect summary { display: flex; gap: 8px; min-height: 36px; align-items: center; cursor: pointer; }
.workshop-skill-effect summary small { margin-left: auto; color: var(--muted); }
.workshop-skill-effect p { line-height: 1.6; color: var(--muted); }
.equipment-item-card .ability-list { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px; margin: 0; }
.equipment-item-card .ability-row { flex: 0 1 auto; max-width: 100%; padding: 0; border-color: rgb(var(--abyss-crystal-rgb) / 19%); background: linear-gradient(135deg, rgb(var(--abyss-crystal-rgb) / 5%), rgb(0 0 0 / 12%)); }
.equipment-item-card .workshop-skill-effect summary { min-height: 44px; gap: 6px; padding: 6px 9px; list-style: none; }
.workshop-skill-effect summary::-webkit-details-marker { display: none; }
.equipment-item-card .workshop-skill-effect summary strong { min-width: 0; overflow-wrap: anywhere; }
.equipment-item-card .workshop-skill-effect summary small { font-size: 9px; white-space: nowrap; }
.equipment-skill-cue { color: var(--abyss-crystal); font-size: 10px; }
.equipment-item-card .ability-row:has(.workshop-skill-effect[open]) { flex-basis: 100%; }
.equipment-item-card .workshop-skill-effect[open] summary { border-bottom: 1px solid var(--line); }
.equipment-item-card .workshop-skill-effect p { margin: 0; padding: 9px; overflow-wrap: anywhere; }
.equipment-skill-meta { display: block; padding: 0 9px 9px; color: var(--muted); font-size: 10px; }
.equipment-item-card .implicit-trait-note summary { min-height: 44px; }
.equipment-item-card .implicit-trait-note strong { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.equipment-item-card .implicit-trait-note summary small { flex: 0 0 auto; }
.equipment-item-card .implicit-trait-note summary:focus-visible, .workshop-skill-effect summary:focus-visible { outline: 2px solid var(--abyss-crystal); outline-offset: -2px; border-radius: 4px; }
.equipment-item-card .workshop-slot-meter { gap: 6px; padding: 8px 0; }
.equipment-card-actions { display: flex; justify-content: flex-start; flex-wrap: wrap; gap: 7px; margin-top: 9px; }
.equipment-card-actions .equipment-equip-button { min-height: 44px; padding: 8px 16px; border: 1px solid rgb(var(--abyss-crystal-rgb) / 39%); border-radius: 5px; background: linear-gradient(145deg, rgb(var(--abyss-crystal-rgb) / 18%), rgb(var(--abyss-crystal-rgb) / 6%)); color: var(--text); font-size: 11px; }
.equipment-equip-button:disabled { opacity: .45; cursor: default; }
.inventory-grid:has(> .equipment-item-card) { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 9px; }
.equipment-item-card:has(> .equipment-gear-disclosure) { container: equipment-gear / inline-size; padding: 0; overflow: hidden; border: 1px solid rgb(var(--gear-rarity-rgb) / 72%); border-radius: 5px; background: linear-gradient(115deg, rgb(var(--gear-rarity-rgb) / 12%), transparent 70%), #0c1015; box-shadow: inset 0 1px rgb(var(--gear-rarity-rgb) / 8%), 0 3px 10px rgb(0 0 0 / 16%); }
.equipment-item-card.equipped:has(> .equipment-gear-disclosure) { border: 1px solid rgb(var(--gear-rarity-rgb) / 90%); }
.equipment-item-card.equipped:has(> .equipment-gear-disclosure):not(.enhance-success)::before { position: absolute; top: 12px; bottom: 12px; left: 0; width: 2px; background: rgb(var(--gear-rarity-rgb)); content: ""; pointer-events: none; }
.equipment-item-card:has(> .equipment-gear-disclosure[open]) { border-color: rgb(var(--gear-rarity-rgb)); box-shadow: inset 0 0 0 1px rgb(var(--gear-rarity-rgb) / 12%), 0 0 14px rgb(var(--gear-rarity-rgb) / 14%); }
.equipment-item-card.located:has(> .equipment-gear-disclosure) { border-color: rgb(var(--gear-rarity-rgb)); outline: 2px solid var(--text); outline-offset: 2px; }
.equipment-gear-summary { position: relative; display: grid; grid-template-columns: 62px minmax(0, .85fr) minmax(0, 1.15fr); grid-template-rows: auto auto auto; gap: 5px 10px; align-items: start; padding: 10px 12px; cursor: pointer; list-style: none; color: #dceaf5; }
.equipment-gear-summary::-webkit-details-marker { display: none; }
.equipment-gear-summary:focus-visible { outline: 2px solid rgb(var(--gear-rarity-rgb)); outline-offset: -3px; border-radius: 4px; }
.equipment-gear-visual { grid-column: 1; grid-row: 1 / 4; position: relative; display: grid; gap: 3px; align-self: stretch; align-content: center; justify-items: center; min-height: 88px; padding: 6px 3px; border: 0; border-radius: 0; background: none; box-shadow: none; }
.equipment-gear-icon { display: block; width: 49px; height: 49px; object-fit: contain; filter: saturate(.6) drop-shadow(0 3px 4px rgb(0 0 0 / 70%)); }
.equipment-gear-gems { display: flex; gap: 2px; align-items: center; }
.equipment-gear-gems i, .equipment-gear-gems img { display: block; width: 15px; height: 15px; }
.equipment-gear-gems i.empty { opacity: .22; filter: grayscale(1); }
.equipment-gear-equipped-status { display: inline-flex; align-items: center; gap: 3px; max-width: 100%; color: var(--gear-rarity-text); font-size: 8px; line-height: 1.1; white-space: nowrap; }
.equipment-gear-equipped-status small { font-size: inherit; }
.equipment-gear-equipped-status .equipment-owner-badge, .equipment-gear-equipped-status .equipment-owner-icon, .equipment-gear-equipped-status .actor-image { width: 28px; height: 28px; flex-basis: 28px; }
.equipment-gear-equipped-status .equipment-owner-badge { margin-left: 0; }
.equipment-gear-heading { grid-column: 2 / 4; grid-row: 1; display: flex; flex-wrap: wrap; align-items: center; gap: 3px 6px; min-height: 20px; padding-right: 56px; }
.equipment-gear-part { color: #bdcfdf; font-size: 10px; white-space: nowrap; }
.equipment-gear-heading .rarity-badge { min-height: 18px; margin: 0; padding: 1px 6px; border-color: rgb(var(--gear-rarity-rgb) / 82%); border-radius: 20px; background: rgb(var(--gear-rarity-rgb) / 14%); color: var(--gear-rarity-text); box-shadow: none; font-size: 9px; font-weight: 500; line-height: 1.4; letter-spacing: 0; }
.equipment-gear-slot-count { padding: 1px 5px; border: 1px solid rgb(var(--gear-rarity-rgb) / 45%); border-radius: 20px; color: #b6cada; font-size: 9px; line-height: 1.4; white-space: nowrap; }
.equipment-gear-grade { color: #8ca4b8; font-size: 9px; white-space: nowrap; }
.equipment-gear-heading .corruption-badge, .equipment-gear-heading .recent-loot-badge, .equipment-gear-heading .wishlist-hit-badge { min-height: 16px; padding: 1px 5px; font-size: 8px; }
.equipment-gear-name { grid-column: 2 / 4; grid-row: 2; margin: 0; color: var(--gear-rarity-text); font-size: 16px; font-weight: 650; line-height: 1.45; letter-spacing: .025em; overflow-wrap: anywhere; }
.equipment-gear-enhancement { margin-left: 6px; color: var(--gear-rarity-text); font-size: 12px; font-weight: 500; white-space: nowrap; }
.equipment-gear-stats { grid-column: 2; grid-row: 3; display: grid; gap: 3px; min-width: 0; padding: 4px 0 2px; color: #acc4d9; font-size: 11px; line-height: 1.45; font-variant-numeric: tabular-nums; }
.equipment-gear-stats > span { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 5px; min-width: 0; }
.equipment-gear-stats b { color: #c8e0f5; font-weight: 500; white-space: nowrap; }
.equipment-gear-skill-preview { grid-column: 3; grid-row: 3; display: grid; align-self: stretch; min-width: 0; border: 1px solid rgb(var(--gear-rarity-rgb) / 38%); border-radius: 3px; background: rgb(4 15 26 / 44%); color: #cfdeea; font-size: 10px; line-height: 1.45; }
.equipment-gear-fixed-name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px 6px; min-width: 0; padding: 4px 6px; border-bottom: 1px solid rgb(var(--gear-rarity-rgb) / 28%); background: linear-gradient(90deg, rgb(var(--gear-rarity-rgb) / 12%), transparent); }
.equipment-gear-fixed-name small { color: var(--gear-rarity-text); font-size: 9px; }
.equipment-gear-fixed-name b { color: #cde8fc; font-size: 10px; font-weight: 500; overflow-wrap: anywhere; }
.equipment-gear-general-preview { display: flex; flex-wrap: wrap; align-content: center; gap: 3px 7px; min-width: 0; padding: 4px 6px; }
.equipment-gear-skill-name { display: inline-flex; align-items: center; gap: 3px; min-width: 0; overflow-wrap: anywhere; }
.equipment-gear-skill-icon { display: block; flex: 0 0 12px; width: 12px; height: 12px; object-fit: contain; filter: grayscale(1) brightness(1.3); opacity: .8; }
.equipment-gear-empty { color: #718a9e; font-size: 9px; }
.equipment-gear-chevron { position: absolute; top: 19px; right: 13px; width: 8px; height: 8px; border-right: 1.5px solid rgb(var(--gear-rarity-rgb)); border-bottom: 1.5px solid rgb(var(--gear-rarity-rgb)); transform: rotate(45deg); }
.equipment-gear-disclosure[open] > .equipment-gear-summary .equipment-gear-chevron { top: 23px; transform: rotate(225deg); }
.equipment-item-card .equipment-card-protection { position: absolute; z-index: 1; top: 0; right: 28px; display: grid; width: 44px; height: 44px; min-height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; color: #6c879b; font-size: 17px; box-shadow: none; text-shadow: none; }
.equipment-item-card .equipment-card-protection.active { color: #e5c780; background: transparent; box-shadow: none; text-shadow: none; }
.equipment-gear-summary > .item-stat-comparison { grid-column: 1 / -1; gap: 4px 10px; margin: 3px 0 0; padding-top: 7px; border-color: #243e53; color: #8ca5b9; font-size: 10px; }
.equipment-gear-summary .item-stat-comparison-label { color: #88a1b6; }
.equipment-gear-summary .item-stat-delta.gain { color: #8cdeb1; }
.equipment-gear-summary .item-stat-delta.loss { color: #ff9b9b; }
.equipment-gear-detail { display: grid; gap: 8px; padding: 2px 12px 12px; }
.equipment-effect-row { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; padding: 10px; border: 1px solid rgb(var(--gear-rarity-rgb) / 45%); border-radius: 3px; background: linear-gradient(100deg, rgb(var(--gear-rarity-rgb) / 8%), transparent), #0c1117; }
.equipment-effect-icon { display: block; width: 28px; height: 28px; object-fit: contain; filter: saturate(.55); }
.equipment-effect-copy { min-width: 0; }
.equipment-effect-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 9px; min-height: 25px; }
.equipment-effect-heading strong { color: #e0edfa; font-size: 13px; font-weight: 600; letter-spacing: .02em; overflow-wrap: anywhere; }
.equipment-effect-heading > span { margin-left: auto; padding: 1px 8px; border: 1px solid #406681; border-radius: 20px; color: #abc7dc; font-size: 9px; white-space: nowrap; }
.equipment-effect-copy p { margin: 5px 0 0; color: #b6cce0; font-size: 11px; line-height: 1.7; overflow-wrap: anywhere; }
.equipment-effect-meta { display: block; margin-top: 5px; color: #7895ad; font-size: 10px; }
.equipment-fixed-effect { grid-template-columns: 34px minmax(0, 1fr); padding: 12px 11px; border-color: rgb(var(--gear-rarity-rgb) / 80%); background: radial-gradient(ellipse at 100% 50%, rgb(var(--gear-rarity-rgb) / 18%), transparent 65%), linear-gradient(110deg, rgb(var(--gear-rarity-rgb) / 12%), transparent), #0c1117; box-shadow: inset 0 0 12px rgb(var(--gear-rarity-rgb) / 9%); }
.equipment-fixed-effect .equipment-effect-icon { width: 34px; height: 34px; filter: saturate(.6) drop-shadow(0 0 5px rgb(59 161 242 / 25%)); }
.equipment-fixed-effect .equipment-effect-heading strong { font-size: 14px; }
.equipment-fixed-label { color: var(--gear-rarity-text); font-size: 10px; white-space: nowrap; }
.equipment-general-heading { display: flex; align-items: center; gap: 8px; padding: 4px 0 3px; font-size: 11px; }
.equipment-general-heading strong { padding-left: 7px; border-left: 2px solid rgb(var(--gear-rarity-rgb)); color: #d4e8f8; font-weight: 500; }
.equipment-general-heading span { color: #85bcdf; }
.equipment-general-heading::after { flex: 1; height: 1px; background: rgb(var(--gear-rarity-rgb) / 40%); content: ""; }
.equipment-general-effects { display: grid; gap: 5px; }
.equipment-empty-note, .equipment-general-empty, .equipment-slot-bonus { margin: 0; color: #829db2; font-size: 10px; line-height: 1.5; }
.equipment-gear-detail .equipment-card-actions { margin-top: 4px; }
.equipment-gear-detail .equipment-equip-button { min-height: 44px; padding: 8px 24px; border: 1px solid #528bb4; border-radius: 3px; background: linear-gradient(#12324a, #0a1c2d); color: #e0effb; font-size: 12px; box-shadow: inset 0 1px rgb(161 215 253 / 9%); }
.equipment-gear-detail .equipment-card-actions > button { flex: 1 1 0; min-width: 0; min-height: 44px; padding: 8px 7px; font-size: 12px; }
.equipment-disposition-button { border: 1px solid #36556a; border-radius: 3px; background: linear-gradient(#102330, #091722); color: #b9d9e8; box-shadow: inset 0 1px rgb(161 215 253 / 7%); }
.equipment-sell-button { border-color: #6a5936; background: linear-gradient(#2b2518, #171910); color: #dcc38f; }
.equipment-disposition-button:disabled { opacity: .4; cursor: default; box-shadow: none; }
.equipment-disposition-note { flex: 1 0 100%; color: var(--muted); font-size: 10px; line-height: 1.5; }
.inventory-single-sale, .inventory-decomposition { width: min(460px, 100%); padding: 18px; border: 1px solid #4c7791; border-radius: 8px; background: linear-gradient(140deg, #11212c, var(--dialog) 70%); }
.inventory-single-sale .sale-heading h2, .inventory-decomposition h2 { margin: 3px 0; font-size: 16px; }
.inventory-single-sale .eyebrow, .inventory-decomposition .eyebrow { margin: 0 0 5px; font-size: 8px; color: #82b3cb; letter-spacing: .15em; }
.inventory-single-sale .sale-close { width: 44px; height: 44px; }
.inventory-disposition-item { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 14px 0; border-bottom: 1px solid rgb(113 173 204 / 18%); }
.inventory-disposition-icon { width: 52px; height: 52px; flex: 0 0 52px; object-fit: contain; }
.inventory-disposition-item > div { display: grid; gap: 6px; min-width: 0; }
.inventory-disposition-item span, .inventory-disposition-item small { color: #8aa3b2; font-size: 10px; line-height: 1.5; }
.inventory-disposition-item strong { color: #e4eef3; font-size: 14px; overflow-wrap: anywhere; }
.inventory-disposition-reward { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 12px; padding: 12px; border: 1px solid rgb(94 181 219 / 25%); border-radius: 5px; background: rgb(12 39 53 / 50%); }
.inventory-disposition-reward > span { color: #abc6d5; font-size: 11px; }
.inventory-disposition-reward strong { color: #88d7f3; font-size: 23px; font-variant-numeric: tabular-nums; }
.inventory-disposition-reward small { font-size: 11px; font-weight: normal; }
.sale-reward { border-color: rgb(211 172 87 / 25%); background: rgb(50 40 20 / 30%); }
.sale-reward strong { color: #e3c278; }
.inventory-disposition-balance { margin: 9px 0 0; color: #90a6b3; font-size: 11px; line-height: 1.6; }
.inventory-disposition-balance b { color: #d3bd8b; font-weight: normal; }
.inventory-disposition-warning { margin: 12px 0; padding-left: 9px; border-left: 2px solid #a06c54; color: #c1ada1; font-size: 11px; line-height: 1.7; }
.inventory-single-sale .sale-actions, .inventory-decomposition .ability-confirm-actions { display: flex; gap: 8px; margin-top: 12px; }
.inventory-single-sale .sale-actions > button, .inventory-decomposition .ability-confirm-actions > button { flex: 1; min-width: 0; min-height: 44px; font-size: 12px; }
@media (max-width: 380px) { .inventory-single-sale, .inventory-decomposition { padding: 14px; } .inventory-disposition-item { gap: 9px; } .inventory-disposition-icon { width: 44px; height: 44px; flex-basis: 44px; } }
@container equipment-gear (min-width: 620px) {
  .equipment-gear-summary { grid-template-columns: 74px minmax(0, 1fr) 120px minmax(150px, .8fr); grid-template-rows: auto auto; gap: 6px 18px; padding: 13px 16px; }
  .equipment-gear-visual { grid-row: 1 / 3; min-height: 86px; }
  .equipment-gear-icon { width: 54px; height: 54px; }
  .equipment-gear-heading { grid-column: 2; padding-right: 0; }
  .equipment-gear-name { grid-column: 2; font-size: 18px; align-self: center; }
  .equipment-gear-stats { grid-column: 3; grid-row: 1 / 3; align-self: center; padding-left: 15px; border-left: 1px solid #29455b; font-size: 12px; }
  .equipment-gear-skill-preview { grid-column: 4; grid-row: 1 / 3; margin-right: 52px; align-self: center; min-height: 58px; }
  .equipment-gear-fixed-name, .equipment-gear-general-preview { padding: 6px 8px; }
  .equipment-gear-skill-name, .equipment-gear-fixed-name b { font-size: 11px; }
  .equipment-gear-detail { padding: 0 16px 14px; }
  .equipment-general-effects .equipment-effect-row { align-items: center; }
  .equipment-general-effects .equipment-effect-copy { display: grid; grid-template-columns: minmax(190px, .4fr) minmax(0, 1fr); gap: 0 16px; }
  .equipment-general-effects .equipment-effect-heading { grid-row: 1 / 3; }
  .equipment-general-effects .equipment-effect-copy p { margin: 0; padding-left: 14px; border-left: 1px solid #29485e; }
  .equipment-general-effects .equipment-effect-meta { grid-column: 2; padding-left: 14px; }
}
@media (max-width: 359px) {
  .equipment-gear-equipped-status { flex-direction: column; gap: 2px; }
  .equipment-gear-summary { grid-template-columns: 52px minmax(0, .85fr) minmax(0, 1.15fr); gap: 5px 8px; padding: 9px; }
  .equipment-gear-icon { width: 41px; height: 41px; }
  .equipment-gear-gems i, .equipment-gear-gems img { width: 13px; height: 13px; }
  .equipment-gear-heading { gap: 3px 5px; padding-right: 46px; }
  .equipment-gear-name { font-size: 14px; }
  .equipment-gear-stats { font-size: 10px; }
  .equipment-gear-fixed-name, .equipment-gear-general-preview { padding: 3px 5px; }
  .equipment-gear-skill-name { font-size: 9px; }
  .equipment-gear-detail { padding-left: 9px; padding-right: 9px; }
}
@media (max-width: 640px) {
  .workshop-header { flex-direction: column; align-items: stretch; padding: 18px 14px; }
  .workshop-wallet { justify-content: space-between; padding-top: 14px; border-top: 1px solid var(--line); }
  .workshop-emblem { width: 68px; height: 68px; flex-basis: 68px; }
  .workshop-title { gap: 12px; }
  .workshop-title h1 { font-size: 23px; }
  .workshop-title .eyebrow { font-size: 8px; letter-spacing: .08em; }
  .workshop-books { padding: 14px; }
  .workshop-book { flex-wrap: wrap; }
  .workshop-book button { margin-left: auto; }
  .workshop-guide { padding: 12px 2px; gap: 8px; }
  .workshop-guide b { font-size: 11px; }
  .workshop-guide small { font-size: 9px; }
  .workshop-slot-meter > small { width: 100%; margin-left: 0; }
  .workshop-screen .ability-draft-bar { gap: 8px; flex-wrap: wrap; }
  .workshop-screen .ability-draft-bar button { min-height: 44px; }
}
.workshop-forge-filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 12px 0; }
.workshop-forge-filters .forge-part-chips { display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 100%; }
.workshop-forge-filters .forge-part-chips button { min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface); color: var(--muted); font: inherit; font-size: 12px; cursor: pointer; }
.workshop-forge-filters .forge-part-chips button.selected { color: var(--gold); border-color: var(--accent-border); background: linear-gradient(140deg, rgba(213, 185, 113, .12), rgba(86, 178, 186, .05)); }
.workshop-forge-filters .forge-part-chips button:focus-visible { outline: 2px solid var(--abyss-crystal); outline-offset: 2px; }
.workshop-forge-filters > small { color: var(--muted); font-size: 11px; }

.departure-skill-warning, .unregistered-skill-removal-warning { min-width: 0; padding: 12px; border: 1px solid rgba(213, 185, 113, .35); border-left: 2px solid var(--gold); border-radius: 6px; background: linear-gradient(120deg, rgba(213, 185, 113, .09), rgba(5, 17, 26, .45)); overflow-wrap: anywhere; }
.departure-skill-warning > strong, .unregistered-skill-removal-warning > strong { display: block; color: var(--gold); font-size: 12px; line-height: 1.6; }
.departure-skill-warning p, .unregistered-skill-removal-warning p { margin: 5px 0; color: var(--muted); font-size: 11px; line-height: 1.7; }
.departure-skill-warning > small { display: block; color: var(--muted); font-size: 10px; line-height: 1.6; }
.departure-skill-warning ul { display: grid; gap: 2px; margin: 5px 0; padding: 0; list-style: none; }
.departure-skill-warning li { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.departure-skill-warning li > span { min-width: 0; }
.departure-skill-warning .text-button { flex: 0 0 auto; min-height: 44px; padding: 8px 4px; color: var(--abyss-crystal); font-size: 11px; }
.unregistered-skill-removal-warning > span { display: block; margin: 4px 0; color: var(--text); font-size: 12px; line-height: 1.6; }

/* Preserve the illustrated equipment's colors in equipment cards. */
.equipment-gear-icon.equipment-item-illustration{filter:drop-shadow(0 3px 4px rgb(0 0 0 / 70%))}

/* Arcane workshop: keep equipment editing above supporting archives. */
.arcane-screen{gap:12px;--arcane-text:#e4edf1;--arcane-muted:#a4b7c0;color:var(--arcane-text);padding-bottom:24px}
.arcane-screen>*,.arcane-loadout,.arcane-extra{min-width:0}
.arcane-screen .forge-home-back{justify-self:start;margin:0;min-height:32px;font-size:12px;color:var(--arcane-muted)}
.arcane-screen .workshop-header{gap:10px;padding:14px;border:1px solid #344d5b;border-radius:10px;background:radial-gradient(ellipse at 0 0,rgb(var(--abyss-crystal-rgb) / 10%),transparent 70%),#10202a}
.arcane-screen .workshop-title{gap:10px}
.arcane-screen .workshop-title .eyebrow:empty{display:none}
.arcane-screen .workshop-emblem{width:48px;height:48px;flex-basis:48px}
.arcane-screen .workshop-title h1{margin:0 0 4px;color:var(--arcane-text);font-size:22px;letter-spacing:.05em}
.arcane-screen .workshop-title p:not(.eyebrow){color:var(--arcane-muted);font-size:12px;line-height:1.5}
.arcane-screen .workshop-wallet{gap:16px}
.arcane-screen .workshop-wallet span{gap:2px}
.arcane-screen .workshop-wallet small{font-size:11px;letter-spacing:0;color:var(--arcane-muted)}
.arcane-screen .workshop-wallet span:first-child small{font-size:0}
.arcane-screen .workshop-wallet span:first-child small::after{content:"金貨";font-size:11px}
.arcane-screen .workshop-wallet b{font-size:17px}
.arcane-screen .workshop-material-icon{width:20px;height:20px;flex-basis:20px}
.arcane-section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:6px 12px;margin-bottom:8px;min-width:0}
.arcane-section-heading h2{margin:0;font-size:15px;color:var(--arcane-text);overflow-wrap:anywhere}
.arcane-section-heading>span{flex-shrink:0;color:var(--arcane-muted);font-size:11px}
.arcane-screen .ability-member-tabs{gap:6px;padding:2px 1px 6px;scroll-padding:4px}
.arcane-screen .ability-member-tabs button{display:grid;justify-items:center;gap:4px;flex:0 0 68px;min-width:0;min-height:76px;padding:5px 4px;border-radius:8px;border-color:#344d5b;background:#12222c;color:var(--arcane-muted)}
.arcane-screen .ability-member-tabs button.selected{border-color:rgb(var(--party-color-rgb,126 195 215) / 85%);background:rgb(var(--party-color-rgb,126 195 215) / 12%);color:var(--arcane-text);box-shadow:inset 0 -2px rgb(var(--party-color-rgb,126 195 215) / 70%)}
.arcane-screen .ability-member-tabs button strong{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.arcane-member-portrait,.arcane-member-portrait .actor-image{display:block;width:52px;height:46px;object-fit:contain}
.arcane-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:start}
.arcane-disclosure{min-width:0;border:1px solid #344d5b;border-radius:8px;background:#11212a;overflow:hidden}
.arcane-disclosure>summary{display:flex;align-items:center;gap:8px;min-height:56px;padding:9px 10px;list-style:none;cursor:pointer;color:var(--arcane-text)}
.arcane-disclosure>summary::-webkit-details-marker,.arcane-fixed-trait>summary::-webkit-details-marker{display:none}
.arcane-disclosure>summary>img{width:30px;height:34px;object-fit:contain}
.arcane-disclosure>summary>span{display:grid;gap:4px;min-width:0;flex:1}
.arcane-disclosure>summary strong{font-size:13px;overflow-wrap:anywhere}
.arcane-disclosure>summary small{font-size:11px;color:var(--arcane-muted);line-height:1.4}
.arcane-books>summary small{display:flex;flex-wrap:wrap;gap:1px 6px}
.arcane-books>summary small>span{white-space:nowrap}
.arcane-disclosure>summary>i{color:var(--arcane-muted);font-style:normal}
.arcane-disclosure[open]>summary>i{transform:rotate(180deg)}
.arcane-tools:has(>.arcane-disclosure[open]){grid-template-columns:1fr}
.arcane-screen .workshop-books{padding:0 12px 12px;border:0;border-radius:0;background:none}
.arcane-screen .workshop-books>header{display:none}
.arcane-screen .workshop-books>p{font-size:12px;color:var(--arcane-muted);line-height:1.6}
.arcane-screen .workshop-book{padding:10px 8px;border-radius:6px;background:#192c37}
.arcane-screen .workshop-book strong{font-size:13px;color:var(--arcane-text)}
.arcane-screen .workshop-book small{font-size:11px;color:var(--arcane-muted)}
.arcane-screen .workshop-book button{font-size:12px}
.arcane-screen .member-command-deck{margin:0;padding:10px;border:0;border-radius:0;background:none}
.arcane-screen .member-command-heading strong{color:var(--arcane-text)}
.arcane-screen .member-command-guide{font-size:12px;color:var(--arcane-muted);line-height:1.6}
.arcane-loadout-guide{margin:0 0 10px;font-size:12px;line-height:1.6;color:var(--arcane-muted)}
.arcane-screen .ability-vessel-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));align-items:start;gap:10px}
.arcane-screen .ability-vessel-card{gap:8px;padding:12px;border:1px solid #38566a;border-radius:9px;background:linear-gradient(130deg,#162b39,#101f29);color:var(--arcane-text)}
.arcane-screen .ability-vessel-card.changed{border-color:var(--gold);box-shadow:inset 3px 0 0 var(--gold)}
.arcane-screen .ability-vessel-title{gap:6px 8px}
.arcane-screen .ability-vessel-title>strong{font-size:15px;color:var(--arcane-text);overflow-wrap:anywhere}
.arcane-screen .ability-vessel-part{font-size:11px;color:var(--arcane-muted)}
.arcane-fixed-trait{border:1px solid #2d4657;border-radius:5px;background:#0d1b24}
.arcane-fixed-trait>summary{display:flex;align-items:center;gap:8px;min-height:44px;padding:6px 9px;cursor:pointer;list-style:none}
.arcane-fixed-trait>summary>small{font-size:11px;color:var(--arcane-muted);flex-shrink:0}
.arcane-fixed-trait>summary>strong{font-size:13px;color:var(--arcane-text);overflow-wrap:anywhere}
.arcane-fixed-trait>summary>.arcane-help-mark{margin-left:auto;flex-shrink:0}
.arcane-help-mark{display:inline-grid;place-items:center;width:19px;height:19px;border:1px solid #6b8796;border-radius:50%;font-size:12px;color:#c8dce6}
.arcane-fixed-trait>p{margin:0;padding:4px 9px 10px;font-size:12px;line-height:1.7;color:var(--arcane-muted)}
.arcane-screen .workshop-slot-meter{gap:5px 7px;padding:2px 0;font-size:12px}
.arcane-screen .workshop-slot-meter>small{font-size:11px;color:var(--arcane-muted)}
.arcane-screen .ability-chip{border-color:#38566a;background:#1b3242}
.arcane-screen .ability-chip-detail strong{color:var(--arcane-text);font-size:13px;line-height:1.5}
.arcane-screen .ability-chip-detail small{font-size:11px;line-height:1.5;color:var(--arcane-muted)}
.arcane-screen .ability-chip-remove{color:var(--arcane-muted)}
.arcane-screen .ability-chip:has(>.ability-chip-accordion){align-items:flex-start}
.arcane-screen .ability-chip-accordion{flex:1;min-width:0}
.arcane-screen .ability-chip-accordion>summary{display:flex;align-items:center;gap:6px;min-height:44px;padding:5px 2px;cursor:pointer;list-style:none}
.arcane-screen .ability-chip-accordion>summary::-webkit-details-marker{display:none}
.arcane-screen .ability-vessel-card .natural-fixed .ability-chip-accordion>summary{min-height:44px}
.arcane-screen .ability-chip-accordion>summary>strong{min-width:0;overflow-wrap:anywhere}
.arcane-screen .ability-chip-accordion>summary>i{margin-left:auto;color:var(--arcane-muted);font-size:15px;font-style:normal;transition:transform .15s}
.arcane-screen .ability-chip-accordion[open]>summary>i{transform:rotate(180deg)}
.arcane-screen .ability-chip-accordion>summary:focus-visible{outline:2px solid #a5deeb;outline-offset:-2px;border-radius:4px}
.arcane-screen .ability-chip:has(>.ability-chip-accordion)>.ability-fixed-label{align-self:flex-start;margin-top:6px}
.arcane-screen .ability-chip-quick-effect{padding:7px 4px 9px 2px;border-top:1px solid #38566a}
.arcane-screen .ability-chip-effect-description{margin:0;color:var(--arcane-text);font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.arcane-screen .ability-chip-quick-effect>small{display:block;margin-top:4px;color:var(--arcane-muted);font-size:11px;line-height:1.5}
.arcane-screen .ability-effect-variable{color:var(--gold-strong);font-weight:700}
.arcane-screen .workshop-empty-slot button{border-color:#47728b;background:#102532;color:#a5deeb;font-size:13px}
.arcane-screen .workshop-warehouse>summary{padding:9px 12px;color:var(--arcane-text)}
.arcane-screen .workshop-warehouse-list{padding:0 12px 12px}
.arcane-screen .workshop-warehouse-list button{font-size:12px;text-align:left;white-space:normal}
.arcane-screen .arcane-rule-help>summary{gap:8px;min-height:44px;font-size:12px}
.arcane-screen .arcane-rule-help>p{font-size:12px;line-height:1.7}
.arcane-screen .ability-draft-bar:not(.active){display:none}
.arcane-screen .ability-draft-bar.active{grid-template-columns:minmax(0,1fr) auto;background:#142633;padding:8px 10px}
.arcane-screen .ability-draft-bar>span{font-size:12px;color:var(--arcane-text)}
.arcane-screen .ability-draft-bar>button{font-size:13px}
.arcane-screen .ability-draft-bar>.primary-button{grid-column:1 / -1;width:100%}
.arcane-screen :is(.ability-member-tabs button,.arcane-disclosure>summary,.arcane-fixed-trait>summary):focus-visible{outline:2px solid #a5deeb;outline-offset:-2px}
@media(max-width:640px){
 .arcane-screen .workshop-header{padding:12px;gap:10px}
 .arcane-screen .workshop-wallet{flex-direction:row;justify-content:space-between;padding-top:8px;border-color:#344d5b}
 .arcane-screen .workshop-wallet span{display:flex;align-items:center;gap:8px}
 .arcane-screen .workshop-slot-meter>small{width:auto;margin-left:auto}
}

/* Searchable archive and forge share the arcane workshop's compact visual rhythm. */
:is(.catalog-layout-screen,.forge-layout-screen){display:grid;gap:12px;min-width:0;--library-text:#e4edf1;--library-muted:#a4b7c0;color:var(--library-text)}
:is(.catalog-layout-screen,.forge-layout-screen)>*{min-width:0}
:is(.catalog-layout-screen,.forge-layout-screen)>.text-button{justify-self:start;min-height:32px;margin:0;color:var(--library-muted);font-size:12px}
.library-heading{display:flex;align-items:center;gap:10px;padding:14px;border:1px solid #344d5b;border-radius:10px;background:linear-gradient(130deg,#18313e,#10202a)}
.library-heading>div{flex:1;min-width:0}
.library-heading h1{margin:0 0 4px;font-size:22px;color:var(--library-text)}
.library-heading p{margin:0;font-size:12px;line-height:1.5;color:var(--library-muted)}
.library-emblem,.library-emblem .abyss-mechanism-mark{width:44px;height:44px;flex:0 0 44px}
.library-registration{display:grid;gap:4px;flex-shrink:0;text-align:right}
.library-registration small{font-size:11px;color:var(--library-muted)}
.library-registration strong{font-size:19px;color:var(--library-text)}
.library-registration em{font-style:normal;font-size:12px;color:var(--library-muted)}
.library-controls{display:grid;gap:10px;min-width:0}
.library-filter-disclosure>.library-controls{padding:0 12px 12px}
.catalog-layout-screen>.library-view-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.catalog-layout-screen>.library-support{grid-template-columns:1fr}
@media(max-width:560px){.catalog-layout-screen>.library-view-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.library-search{display:block;min-width:0}
.library-search input{width:100%;min-width:0;min-height:44px;padding:9px 12px;border:1px solid #3c5b6b;border-radius:7px;background:#0e1d26;color:var(--library-text);font-size:16px}
.library-search input::placeholder{color:var(--library-muted);font-size:12px}
.library-type-tabs{display:flex;gap:6px;min-width:0;overflow-x:auto;padding:2px 0 5px}
.library-type-tabs button{display:flex;align-items:center;justify-content:center;gap:5px;flex:0 0 auto;min-height:44px;padding:7px 12px;border:1px solid #344d5b;border-radius:6px;background:#13242f;color:var(--library-muted);font-size:12px;white-space:nowrap}
.library-type-tabs button small{font-size:10px}
.library-type-tabs button[aria-pressed="true"]{border-color:#76b8cf;background:#244557;color:var(--library-text);box-shadow:inset 0 -2px #76b8cf}
.library-status-filters{display:flex;align-items:center;flex-wrap:wrap;gap:5px}
.library-status-filters button{min-height:44px;padding:6px 9px;border:1px solid #344d5b;border-radius:6px;background:#11212a;color:var(--library-muted);font-size:12px}
.library-status-filters button[aria-pressed="true"]{background:#244557;color:var(--library-text);border-color:#76b8cf}
.library-status-filters>span{margin-left:auto;font-size:11px;color:var(--library-muted)}
.library-support{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:start}
.library-support:has(>.library-disclosure[open]){grid-template-columns:1fr}
.library-disclosure{min-width:0;border:1px solid #344d5b;border-radius:8px;background:#11212a;overflow:hidden}
.library-disclosure>summary{display:flex;align-items:center;gap:8px;min-height:56px;padding:9px 12px;list-style:none;cursor:pointer}
.library-disclosure>summary::-webkit-details-marker,.catalog-entry>summary::-webkit-details-marker{display:none}
.library-disclosure>summary>span{display:grid;gap:4px;min-width:0;flex:1}
.library-disclosure>summary strong{font-size:13px;color:var(--library-text)}
.library-disclosure>summary small{font-size:11px;color:var(--library-muted)}
.library-disclosure>summary>i,.catalog-entry>summary>i{font-style:normal;color:var(--library-muted)}
.library-disclosure[open]>summary>i,.catalog-entry[open]>summary>i{transform:rotate(180deg)}
.catalog-layout-screen .wishlist-panel,.catalog-layout-screen .reaction-codex{margin:0;padding:12px;border:0;border-radius:0;background:none}
.catalog-layout-screen :is(.wishlist-panel-head,.reaction-codex>.catalog-type-heading){display:none}
.catalog-layout-screen :is(.wishlist-lead,.wishlist-empty,.reaction-codex p){font-size:12px;color:var(--library-muted);line-height:1.7}
.catalog-layout-screen .reaction-codex-list li{background:#142a36}
.catalog-results{min-width:0;outline:none}
.library-result-count{margin:0 0 8px;font-size:12px;line-height:1.5;color:var(--library-muted)}
.catalog-layout-screen .catalog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:8px;align-items:start}
.catalog-layout-screen .catalog-entry{margin:0;padding:0;border:1px solid #38566a;border-radius:8px;background:linear-gradient(130deg,#162b39,#101f29);opacity:1;min-width:0}
.catalog-layout-screen .catalog-entry.unknown>*{opacity:1}
.catalog-entry>summary{display:grid;grid-template-columns:30px minmax(0,1fr) 12px;align-items:center;gap:10px;min-height:84px;padding:10px 12px;list-style:none;cursor:pointer}
.catalog-entry-icon,.catalog-entry-icon img{display:block;width:28px;height:28px;object-fit:contain}
.catalog-entry-copy{display:grid;gap:5px;min-width:0}
.catalog-entry-copy strong{font-size:15px;line-height:1.5;overflow-wrap:anywhere;color:var(--library-text)}
.catalog-entry-copy small{display:flex;flex-wrap:wrap;gap:5px 10px;align-items:center;font-size:11px;color:var(--library-muted)}
.catalog-entry-copy small b{font-size:10px;font-weight:400;padding:2px 5px;border:1px solid #405665;border-radius:4px;color:var(--library-muted)}
.catalog-entry-copy small b.registered{color:#a4dfcf;border-color:#447b72}
.catalog-entry-copy em{font-size:11px;font-style:normal;line-height:1.5;color:var(--library-muted);overflow-wrap:anywhere}
.catalog-entry-body{padding:0 12px 12px;border-top:1px solid #2d4657}
.catalog-layout-screen .catalog-skill-description{font-size:13px;line-height:1.7;color:var(--library-text)}
.catalog-layout-screen .catalog-skill-meta{display:flex;flex-wrap:wrap;gap:5px 12px;font-size:11px;color:var(--library-muted)}
.catalog-entry-body :is(.workshop-codex-status p,.workshop-codex-status strong,.skill-book-hunting p,.small){font-size:12px;line-height:1.7}
.catalog-entry-body .wishlist-slot-button{min-height:44px;font-size:12px}
.library-more{width:100%;min-height:44px;margin-top:10px;font-size:13px}
.library-empty{padding:18px 12px;border:1px dashed #38566a;border-radius:7px;font-size:13px;line-height:1.7;color:var(--library-muted)}
/* Forge only. Use the shared heading, with balance and equipment source on separate rows. */
.forge-layout-screen .forge-balance {
  display:flex; flex-wrap:wrap; gap:4px 20px; margin:0; padding:8px 12px;
  border-block:1px solid var(--line); background:var(--surface);
}
.forge-layout-screen .forge-balance > div { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 8px; min-width:0; }
.forge-layout-screen .forge-balance dt { color:var(--muted); font-size:var(--ga-font-note); }
.forge-layout-screen .forge-balance dd { margin:0; color:var(--gold-strong); font-size:var(--ga-font-control); font-weight:650; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.forge-layout-screen .forge-member-section { min-width:0; }
.forge-layout-screen .arcane-section-heading {
  flex-wrap:wrap; gap:4px 8px; margin:0; padding-bottom:6px; border-bottom:1px solid var(--line);
}
.forge-layout-screen .arcane-section-heading h2 { color:var(--text); font-size:var(--ga-font-section); overflow-wrap:anywhere; }
.forge-layout-screen .arcane-section-heading > span { color:var(--muted); font-size:var(--ga-font-note); }
.forge-layout-screen .forge-member-tabs { gap:4px; padding:4px 0; scroll-padding:4px; }
#app > .forge-layout-screen :is(.forge-member-tabs button, .forge-warehouse-tab) {
  border:0; border-bottom:2px solid transparent; border-radius:0; background:transparent; box-shadow:none; color:var(--muted);
}
#app > .forge-layout-screen .forge-member-tabs button {
  display:grid; grid-template-rows:44px auto; justify-items:center; align-content:start; gap:4px;
  flex:0 0 76px; min-width:0; min-height:64px; padding:4px 4px 6px;
}
#app > .forge-layout-screen :is(.forge-member-tabs button, .forge-warehouse-tab)[aria-pressed="true"] {
  border-bottom-color:var(--selected-border); background:var(--surface); color:var(--selected-text);
}
#app > .forge-layout-screen .forge-member-tabs button[aria-pressed="true"] {
  border-bottom-color:rgb(var(--party-color-rgb,var(--accent-rgb)));
}
.forge-layout-screen .forge-member-tabs button strong {
  min-width:0; font-size:var(--ga-font-note); font-weight:600; line-height:1.4; white-space:normal; overflow-wrap:anywhere;
}
.forge-layout-screen .forge-member-tabs :is(.arcane-member-portrait,.actor-image) { height:44px; }
.forge-layout-screen .forge-warehouse-tab { min-height:44px; padding:6px 10px; font-size:var(--ga-font-control); }
.forge-layout-screen :is(.forge-member-tabs button,.forge-warehouse-tab):focus-visible { outline:2px solid var(--gold-strong); outline-offset:-2px; }
.forge-ownership-filter{display:flex;align-items:center;gap:10px}
.forge-ownership-filter button{min-height:44px;font-size:12px;background:#11212a;border-color:#344d5b;color:var(--library-muted)}
.forge-ownership-filter button[aria-pressed="true"]{background:#244557;color:var(--library-text);border-color:#76b8cf}
.forge-ownership-filter>span{font-size:11px;color:var(--library-muted)}
#app > .forge-layout-screen .workshop-forge-card {
  padding:12px; border:0; border-bottom:1px solid rgb(var(--gear-rarity-rgb,var(--accent-rgb)) / 62%);
  border-radius:var(--ga-radius-panel); color:var(--text);
  background:linear-gradient(110deg,rgb(var(--gear-rarity-rgb,var(--accent-rgb)) / 10%),transparent 68%),var(--surface);
}
.forge-layout-screen .workshop-forge-card > header {
  grid-template-columns:44px minmax(0,1fr) auto; align-items:start;
}
.forge-layout-screen .workshop-forge-art { width:44px; height:44px; object-fit:contain; }
.forge-layout-screen .workshop-forge-identity { min-width:0; }
.forge-layout-screen .workshop-forge-meta { display:flex; flex-wrap:wrap; align-items:center; gap:2px 8px; color:var(--muted); font-size:var(--ga-font-note); }
.forge-layout-screen .workshop-forge-heading { margin-top:2px; }
.forge-layout-screen .workshop-forge-card h2 { font-size:var(--ga-font-item-name); }
.forge-layout-screen .workshop-plus { padding:3px 6px; border-radius:var(--ga-radius-control); background:var(--inset); font-size:var(--ga-font-control); }
.forge-layout-screen .workshop-forge-status { padding:0; border:0; color:var(--muted); font-size:var(--ga-font-note); }
.forge-layout-screen .workshop-stat-grid small { font-size:var(--ga-font-note); color:var(--muted); }
.forge-layout-screen .workshop-stat-grid b { font-size:var(--ga-font-body); color:var(--text); }
#app > .forge-layout-screen .workshop-forge-card :is(.implicit-trait-note,.workshop-forge-skills) {
  border:0; border-top:1px solid var(--line); border-radius:0; background:transparent;
}
.forge-layout-screen .workshop-forge-card :is(.implicit-trait-note,.workshop-forge-skills) > summary { padding-inline:0; }
.forge-layout-screen .implicit-trait-note strong { font-size:var(--ga-font-control); color:var(--text); }
.forge-layout-screen .implicit-trait-note p { padding-inline:0; font-size:var(--ga-font-note); color:var(--muted); }
.forge-layout-screen .workshop-forge-skills :is(.workshop-forge-skill-heading,.workshop-forge-skill-heading small,.equipment-gear-skill-name,.workshop-forge-skill-effects),
.forge-layout-screen :is(.workshop-slot-meter,.workshop-forge-slot-bonus) { font-size:var(--ga-font-note); }
.forge-layout-screen .workshop-card-actions { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.forge-layout-screen .workshop-card-actions > button { font-size:var(--ga-font-control); }
.forge-layout-screen .workshop-card-actions > .workshop-enhance-hold { grid-column:1 / -1; min-height:48px; }
.forge-layout-screen .workshop-card-actions > .secondary-button:last-child:nth-child(2) { grid-column:1 / -1; }
.forge-layout-screen .workshop-card-actions .workshop-enhance-copy small { display:block; font-size:var(--ga-font-note); }
.forge-layout-screen .workshop-guide { padding:12px; gap:12px; flex-wrap:wrap; }
.forge-layout-screen .workshop-guide span { flex:1 1 130px; min-width:0; }
.forge-layout-screen .workshop-guide b { font-size:var(--ga-font-control); }
.forge-layout-screen .workshop-guide small { font-size:var(--ga-font-note); }
.forge-layout-screen .workshop-review-name { margin:8px 0; font-size:var(--ga-font-section); overflow-wrap:anywhere; }
.forge-layout-screen .workshop-review .ability-confirm-actions > .primary-button { min-height:48px; }
:is(.catalog-layout-screen,.forge-layout-screen) :is(.library-type-tabs button,.library-status-filters button,.library-disclosure>summary,.catalog-entry>summary):focus-visible{outline:2px solid #a5deeb;outline-offset:-2px}
@media(max-width:640px){
 .library-heading{padding:12px;flex-wrap:wrap}
 .library-registration{margin-left:auto}
}

/* Keep effect colors legible instead of bleaching all skills to the same gray. */
.equipment-gear-skill-icon { filter: none; opacity: 1; }
.equipment-effect-icon { filter: none; }
/* 魔導書店。購入は本の下で長押し、効果は本をタップして確認する。 */
.grimoire-shop { margin: 16px 0; padding: 16px; border: 1px solid rgba(209,174,101,.25); border-radius: 14px; background: rgba(10,18,27,.75); min-width: 0; }
.grimoire-shop-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 12px 0; }
.grimoire-shop-card { min-width: 0; padding: 14px; border: 1px solid rgba(115,170,166,.25); border-radius: 10px; background: rgba(24,35,47,.8); overflow-wrap: anywhere; display: flex; flex-direction: column; gap: 8px; }
.grimoire-shop-card strong, .grimoire-shop-card small { display: block; }
.grimoire-shop-card small, .ability-fixed-label { color: #a9b7c2; font-size: .8rem; }
.grimoire-shop-card p { flex: 1; font-size: .85rem; margin: 0; line-height: 1.6; }
.grimoire-shop-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.grimoire-shop-actions button { flex: 1; min-height: 44px; }
.grimoire-shop-refresh { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 12px 0; }
.grimoire-shop-refresh button { min-height: 44px; }
.ability-fixed-label { align-self: center; padding: 8px; white-space: nowrap; }
.grimoire-store-screen .grimoire-shop { padding: 16px; }
.grimoire-store-screen .workshop-wallet b { display: inline-flex; align-items: center; gap: 4px; }
.grimoire-store-screen .workshop-wallet b img { width: 18px; height: 18px; object-fit: contain; }
.grimoire-store-screen.page-layout .page-heading-meta .workshop-wallet > span { align-items: center; }
.grimoire-store-screen .workshop-wallet .grimoire-wallet-amount { display: inline-flex; align-items: baseline; gap: 3px; line-height: 1; transform: translateY(1px); }
.grimoire-shop-grid { grid-template-columns: repeat(3,minmax(0,1fr)); max-width: 600px; margin: 16px auto; gap: 10px; }
.grimoire-shop-card { align-items: stretch; gap: 9px; padding: 12px 8px; text-align: center; }
.grimoire-book-detail { appearance: none; border: 0; padding: 0; background: transparent; color: inherit; cursor: pointer; min-width: 0; display: flex; align-items: center; flex-direction: column; gap: 6px; }
.grimoire-book-art { position: relative; display: block; width: 84px; max-width: 100%; }
.grimoire-book-art > img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; }
.grimoire-book-hold-timer { position: absolute; z-index: 3; inset: 4px; width: calc(100% - 8px); height: calc(100% - 8px); fill: none; transform: rotate(-90deg); opacity: 0; pointer-events: none; }
.grimoire-book-art.purchase-holding .grimoire-book-hold-timer { opacity: 1; }
.grimoire-book-hold-track { stroke: rgba(255,225,154,.3); stroke-width: 3; }
.grimoire-book-hold-progress { stroke: #ffe6a0; stroke-width: 4; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--grimoire-hold-progress,0)); filter: drop-shadow(0 0 3px #e9b447); }
.grimoire-shop-card .grimoire-hold-fill { display: none; }
.grimoire-book-skill { position: absolute; right: 0; bottom: 0; padding: 4px; border: 1px solid #b5985b; border-radius: 50%; background: #172534; display: grid; place-items: center; }
.grimoire-book-skill :is(img,svg) { width: 22px; height: 22px; margin: 0; }
.grimoire-book-detail strong { width: 100%; font-size: 13px; line-height: 1.45; min-height: 2.9em; overflow-wrap: anywhere; }
.grimoire-book-detail small { font-size: 11px; }
.grimoire-price { display: inline-flex; justify-content: center; align-items: center; gap: 4px; color: #f2dc9d; white-space: nowrap; vertical-align: middle; font-size: 15px; }
.grimoire-price img { width: 22px; height: 22px; object-fit: contain; flex-shrink: 0; }
.grimoire-price small { font-size: 11px; }
.grimoire-purchase-hold { position: relative; isolation: isolate; overflow: hidden; min-height: 52px; width: 100%; padding: 8px 4px; font-size: 13px; color: #fff3c7; border: 1px solid #c7a15a; border-radius: 9px; background: radial-gradient(ellipse at 50% 0,rgba(255,225,147,.23),transparent 75%),linear-gradient(180deg,#937138 0%,#705025 55%,#59401d 100%); box-shadow: inset 0 1px 0 rgba(255,242,187,.5),inset 0 -2px 0 rgba(29,19,7,.45),0 3px 0 #322512,0 5px 12px rgba(0,0,0,.25); text-shadow: 0 1px 2px #392713; touch-action: pan-y; -webkit-touch-callout: none; user-select: none; transition: border-color .15s,box-shadow .15s,background-color .15s; }
.grimoire-purchase-hold::before { content: ""; position: absolute; inset: 3px; border: 1px solid rgba(244,219,153,.25); border-radius: 6px; pointer-events: none; }
.grimoire-purchase-hold > span:last-child { position: relative; z-index: 1; }
.grimoire-buy-copy { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.grimoire-buy-copy strong { font-size: inherit; font-weight: 800; line-height: 1.2; letter-spacing: .025em; }
.grimoire-buy-copy small { font-size: 9px; line-height: 1.2; color: #ead4a7; letter-spacing: .02em; }
.grimoire-hold-fill { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(239,187,78,.35),rgba(255,230,159,.55)); border-right: 2px solid #ffe8a7; box-shadow: 3px 0 12px rgba(255,210,102,.6); transform: scaleX(var(--grimoire-hold-progress,0)); transform-origin: left; pointer-events: none; }
.grimoire-purchase-hold.holding { border-color: #ffe0a0; box-shadow: inset 0 1px 0 #fff0bc,inset 0 -1px 0 #493316,0 1px 0 #322512,0 0 13px rgba(232,183,81,.35); }
.grimoire-purchase-hold:focus-visible { outline: 2px solid #ffe4a0; outline-offset: 3px; }
.grimoire-purchase-hold:disabled { background: linear-gradient(180deg,#494638,#343229); border-color: #64604b; box-shadow: inset 0 1px 0 rgba(255,255,255,.06); color: #b9b4a0; text-shadow: none; }
.grimoire-purchase-hold:disabled .grimoire-buy-copy small { color: #aaa58f; }
@media (hover:hover) { .grimoire-purchase-hold:hover:not(:disabled) { border-color: #edcb83; box-shadow: inset 0 1px 0 #fff0bc,inset 0 -2px 0 rgba(29,19,7,.45),0 3px 0 #322512,0 0 12px rgba(232,183,81,.2); } }
@media (prefers-reduced-motion:reduce) { .grimoire-purchase-hold { transition: none; } }
.grimoire-shop-refresh { flex-direction: column; align-items: center; padding: 6px 0 16px; margin: 0; }
.grimoire-refresh-button { display: flex; align-items: center; justify-content: center; gap: 10px; min-width: 200px; }
.grimoire-free { color: #c7e1c2; }
.grimoire-shop-refresh p { margin: 0; text-align: center; }
.grimoire-facility-link { display: flex; justify-content: flex-end; margin: 12px 0; }
.grimoire-detail-dialog h2 { display: flex; align-items: center; gap: 8px; }
.grimoire-detail-purchase { display: grid; gap: 10px; text-align: center; max-width: 240px; margin: 20px auto 0; }
.grimoire-detail-dialog { max-height: calc(100dvh - 32px); overflow-y: auto; }
.grimoire-book-detail:focus-visible { outline: 2px solid #efd17b; outline-offset: 4px; border-radius: 6px; }
@media (max-width: 680px) { .grimoire-store-screen .grimoire-shop { padding: 10px; } .grimoire-shop .arcane-section-heading { flex-wrap: wrap; gap: 8px; } .grimoire-shop-grid { gap: 6px; } .grimoire-shop-card { padding: 8px 4px; } .grimoire-book-art { width: 68px; } .grimoire-book-skill { padding: 2px; } .grimoire-price { font-size: 13px; gap: 3px; } .grimoire-price img { width: 18px; height: 18px; } .grimoire-purchase-hold { font-size: 12px; } }
.grimoire-shelf-tabs { display: flex; gap: 6px; padding: 4px; max-width: 600px; margin: 16px auto 12px; border: 1px solid #46534d; border-radius: 12px; background: #101b20; }
.grimoire-shelf-tabs button { flex: 1; min-width: 0; min-height: 44px; padding: 10px 6px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #a9bdbd; font-size: 13px; font-weight: 700; }
.grimoire-shelf-tabs button[aria-selected="true"] { border-color: #b69255; color: #ffecc0; background: linear-gradient(180deg,#615230,#423a26); box-shadow: inset 0 1px 0 #9b8354,0 2px 6px #070c10; }
.grimoire-shelf-tabs button:focus-visible { outline: 2px solid #efcc80; outline-offset: 2px; }
.grimoire-basic-note { color: #abc4c6; margin: 12px 0 0; text-align: center; font-size: 12px; line-height: 1.6; }
.grimoire-point-balance { color: #ecd28e; font-size: 12px; line-height: 1.7; margin: 4px 0; text-align: center; }
.grimoire-shop-card .grimoire-point-balance { display: flex; flex-direction: column; align-items: center; }
.grimoire-point-balance > b { white-space: nowrap; }
.grimoire-exchange-button { min-height: 44px; padding: 8px 4px; font-size: 12px; }
.grimoire-exchange-empty { grid-column: 1 / -1; color: #abc4c6; font-size: 13px; line-height: 1.8; }
.decompose-point-rewards { margin: 12px 0; padding: 10px; border: 1px solid #46534d; border-radius: 8px; font-size: 12px; }
.decompose-point-rewards ul { display: flex; flex-wrap: wrap; gap: 6px 12px; margin: 8px 0; padding: 0; list-style: none; max-height: 140px; overflow-y: auto; }
.decompose-point-rewards b { color: #ecd28e; }
.decompose-point-rewards small { display: block; color: #abc4c6; line-height: 1.7; }
.grimoire-rich-button { position: relative; isolation: isolate; display: flex; align-items: center; gap: 12px; min-height: 62px; max-width: 100%; padding: 10px 16px; border: 1px solid #b69758; border-radius: 12px; color: #f5e6bd; background: radial-gradient(ellipse at 30% 0,rgba(255,232,166,.16),transparent 80%),linear-gradient(180deg,#4d4430,#2e2b20); box-shadow: inset 0 1px 0 rgba(244,223,169,.3),inset 0 -2px 0 #191910,0 3px 0 #181910,0 5px 14px rgba(0,0,0,.25); text-align: left; transition: border-color .15s,box-shadow .15s; }
.grimoire-rich-button::before { content: ""; position: absolute; inset: 4px; border: 1px solid rgba(210,183,119,.18); border-radius: 8px; pointer-events: none; }
.grimoire-rich-icon { position: relative; display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border: 1px solid rgba(210,183,119,.3); border-radius: 50%; background: rgba(9,19,24,.55); color: #efcd87; box-shadow: inset 0 1px 4px #070e12; }
.grimoire-rich-icon :is(svg,img) { width: 25px; height: 25px; object-fit: contain; }
.grimoire-rich-copy { position: relative; display: flex; flex: 1; flex-direction: column; gap: 4px; min-width: 0; }
.grimoire-rich-copy strong { font-size: 15px; line-height: 1.2; letter-spacing: .05em; }
.grimoire-rich-copy small { color: #b9bdaa; font-size: 11px; line-height: 1.4; }
.grimoire-refresh-button { min-width: 260px; background: radial-gradient(ellipse at 30% 0,rgba(182,238,222,.13),transparent 80%),linear-gradient(180deg,#28434a,#192e34); }
.grimoire-refresh-button .grimoire-rich-icon { color: #c0e5df; }
.grimoire-refresh-cost { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 52px; padding: 7px 9px; border: 1px solid rgba(171,221,208,.3); border-radius: 8px; background: rgba(5,16,23,.45); font-size: 13px; }
.grimoire-refresh-cost .grimoire-price { gap: 4px; }
.grimoire-update-schedule { margin: 6px 0 0; color: #bbc6bb; text-align: center; font-size: 11px; line-height: 1.7; }
.grimoire-update-schedule span { display: block; color: #829b9a; }
.grimoire-to-workshop { min-width: 250px; }
.grimoire-rich-arrow { position: relative; font-size: 28px; line-height: 1; color: #cfb06a; }
.grimoire-rich-button:active:not(:disabled) { box-shadow: inset 0 1px 0 rgba(244,223,169,.2),inset 0 2px 6px rgba(0,0,0,.3),0 1px 0 #181910; }
.grimoire-rich-button:focus-visible { outline: 2px solid #efd084; outline-offset: 3px; }
.grimoire-rich-button:disabled { filter: saturate(.3); opacity: .55; box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
@media (hover:hover) { .grimoire-rich-button:hover:not(:disabled) { border-color: #e6c482; box-shadow: inset 0 1px 0 rgba(244,223,169,.45),inset 0 -2px 0 #191910,0 3px 0 #181910,0 0 16px rgba(201,175,105,.15); } }
@media (max-width:380px) { .grimoire-rich-button { padding: 10px 12px; gap: 9px; } .grimoire-refresh-button { min-width: 0; width: 100%; } .grimoire-rich-copy small { font-size: 10px; } }
@media (prefers-reduced-motion:reduce) { .grimoire-rich-button { transition: none; } }
.zone-entry-loot-hint { padding: 10px 12px; border: 1px solid #806c43; border-radius: 8px; color: #e9d4a5; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.boss-equipment-tag { color: #e9d4a5; border-color: #806c43; font-size: 10px; }
.expedition-growth-progress { padding: 10px 12px; border-left: 3px solid #d2b26f; background: #ffffff06; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }

/* Rarity stays visible in the forge, regardless of the selected screen theme. */
.workshop-forge-card[class*="gear-rarity-"], .forge-layout-screen .workshop-forge-card[class*="gear-rarity-"] { border-color: rgb(var(--gear-rarity-rgb) / 72%); border-top-color: rgb(var(--gear-rarity-rgb)); background: linear-gradient(115deg, rgb(var(--gear-rarity-rgb) / 12%), transparent 70%), #0c1015; }
.workshop-forge-card[class*="gear-rarity-"] h2, .forge-layout-screen .workshop-forge-card[class*="gear-rarity-"] h2 { color: var(--gear-rarity-text); }
.command-deck-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:6px 10px; margin-left:auto; }
.member-command-heading { flex-wrap:wrap; }
.command-learn-button { min-height:38px; padding:7px 12px; border-color:#8c764b; color:#ead5a5; background:linear-gradient(180deg,#33352d,#20272a); font-size:12px; }
.command-learn-button span { margin-left:6px; }
.arcane-purpose-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:4px 0 16px; }
.arcane-purpose-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:12px 0 6px; color:#b7c7c7; font-size:12px; }
.arcane-purpose-tips { display:grid; flex:0 0 36px; width:36px; height:36px; min-height:36px; padding:0; place-items:center; border:1px solid var(--tips-border); border-radius:50%; background:linear-gradient(145deg,var(--tips-surface),var(--tips-surface-deep)); color:var(--tips-accent); font-size:18px; font-weight:700; box-shadow:inset 0 1px #ffffff10,0 3px 10px #0004; }
.arcane-purpose-tips:focus-visible { outline:2px solid var(--tips-heading); outline-offset:3px; }
.arcane-purpose-help { width:min(500px,100%); gap:12px; padding:20px; border-color:var(--tips-border); background:linear-gradient(145deg,var(--tips-surface),var(--tips-surface-deep)); color:var(--tips-text); }
.arcane-purpose-help > header { display:flex; align-items:center; gap:10px; }
.arcane-purpose-help > header .arcane-help-mark { flex:0 0 30px; width:30px; height:30px; color:var(--tips-accent); border-color:var(--tips-border); font-size:18px; }
.arcane-purpose-help header small { color:var(--tips-accent); font-size:9px; letter-spacing:.1em; }
.arcane-purpose-help h2 { color:var(--tips-heading); line-height:1.5; }
.arcane-purpose-help-card { padding:12px; border:1px solid rgb(114 199 223 / 25%); border-radius:10px; background:rgb(3 16 24 / 28%); }
.arcane-purpose-help-card h3 { display:flex; align-items:center; flex-wrap:wrap; gap:7px; margin:0 0 8px; color:#f3e2bd; font-size:14px; }
.arcane-purpose-help-card h3 img { flex:0 0 32px; object-fit:contain; }
.arcane-purpose-help-card h3 span { margin-left:auto; padding:3px 6px; border:1px solid #8d805850; border-radius:4px; color:#dfce9f; font-size:10px; font-weight:400; }
.arcane-purpose-help-card p, .arcane-purpose-help-summary { margin:6px 0 0; font-size:12px; line-height:1.8; }
.arcane-purpose-help strong { color:var(--tips-heading); }
.arcane-purpose-help-card .arcane-purpose-help-note { margin-top:9px; padding-top:8px; border-top:1px solid rgb(114 199 223 / 18%); font-size:11px; }
.arcane-purpose-help-summary { margin:0; text-align:center; }
.arcane-purpose-help .ability-confirm-actions { grid-template-columns:minmax(120px,180px); justify-content:center; }
.arcane-purpose-help .ability-confirm-actions button { min-width:120px; min-height:42px; }
.arcane-purpose-nav button { display:flex; align-items:center; justify-content:center; gap:8px; min-width:0; min-height:70px; padding:10px; border:1px solid #445456; border-radius:12px; background:linear-gradient(180deg,#1c2a30,#131e24); color:#b4c3c1; text-align:left; box-shadow:inset 0 1px 0 #ffffff09; }
.arcane-purpose-nav button[aria-pressed="true"] { border-color:#c5a469; color:#f6e2b6; background:linear-gradient(160deg,#4a4530,#292d28); box-shadow:inset 0 1px 0 #e8cb8440,0 3px 12px #0003; }
.arcane-purpose-nav img { flex:0 0 36px; object-fit:contain; }
.arcane-purpose-nav span { display:grid; gap:4px; min-width:0; }
.arcane-purpose-nav strong { font-size:14px; }
.arcane-purpose-nav small { color:#b0bab0; font-size:10px; line-height:1.5; }
.arcane-purpose-nav button:focus-visible { outline:2px solid #efcc80; outline-offset:3px; }
.arcane-learning-guide { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:16px; padding:14px 16px; border:1px solid #766b4b; border-radius:12px; background:linear-gradient(120deg,#343326,#1c2b30 75%); }
.arcane-learning-guide > span { display:grid; gap:5px; }
.arcane-learning-guide small { color:#b9a67c; font-size:9px; letter-spacing:.16em; }
.arcane-learning-guide strong { color:#f5e9cc; font-size:15px; }
.arcane-learning-guide button { min-height:40px; font-size:12px; }
.owned-book-heading { display:flex; align-items:center; gap:10px; min-width:0; }
.owned-book-heading > div { display:grid; gap:4px; min-width:0; }
.owned-book-heading strong { color:#eee3c8; }
.owned-book-heading span { color:#aebfbb; font-size:11px; }
.owned-book-skill-icon { flex:0 0 42px; width:42px; height:42px; object-fit:contain; filter:drop-shadow(0 2px 3px #0006); }
.arcane-learning-books.panel { padding:16px; border:1px solid #3f555a; border-radius:14px; background:linear-gradient(160deg,#17272e,#101b21); box-shadow:inset 0 1px 0 #ffffff08; }
.arcane-learning-books .owned-book-card { padding:14px; border-color:#6b6347; border-radius:10px; background:linear-gradient(145deg,#29332f,#17242a); }
.arcane-learning-books .owned-book-card.learned { border-color:#435c59; background:linear-gradient(145deg,#21332e,#16252a); }
.arcane-learning-books .owned-book-card > p { margin-block:2px 6px; line-height:1.7; }
.arcane-learning-books .owned-book-exchange { border-top:1px solid #425453; }
.arcane-learning-books .owned-book-exchange > summary { color:#d7c598; cursor:pointer; font-size:13px; }
@media (max-width:380px) { .arcane-purpose-nav button { gap:6px; padding:9px 6px; } .arcane-purpose-nav img { width:28px; height:28px; flex-basis:28px; } .arcane-purpose-nav strong { font-size:13px; } .arcane-learning-books.panel { padding:12px; } }
.book-command-dialog { width:min(440px,calc(100vw - 24px)); gap:10px; overflow-y:auto; padding:20px; border:1px solid #9a8656; border-radius:16px; box-shadow:0 20px 70px #0009,inset 0 1px 0 #e0c28a20; }
.book-command-dialog > * { flex:0 0 auto; }
.book-review-dialog { width:min(420px,100%); gap:10px; overflow-y:auto; border-color:#9a8656; border-radius:14px; background:linear-gradient(145deg,#25332f,#142127); box-shadow:0 20px 70px #0009,inset 0 1px 0 #e0c28a20; }
.book-review-dialog > * { flex:0 0 auto; }
.book-review-dialog > h2 { margin:0; color:#f2e6cd; font-size:19px; }
.book-review-dialog > p { margin:0; color:#c3cec8; font-size:12px; line-height:1.8; }
.book-review-dialog > button { min-height:42px; }
.book-learning-recipient { display:grid; grid-template-columns:112px minmax(0,1fr); align-items:center; gap:16px; padding:12px; border:1px solid #8e7b505e; border-radius:10px; background:linear-gradient(120deg,#5b4e322b,#152a32); }
.book-learning-recipient-portrait { display:grid; place-items:center; width:112px; height:116px; background:radial-gradient(ellipse at 50% 70%,#a88c4c24,transparent 70%); }
.book-learning-recipient-portrait .actor-image { display:block; width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; transform:none; filter:drop-shadow(0 5px 5px #0008); }
.book-learning-recipient-copy { display:grid; gap:8px; min-width:0; }
.book-learning-recipient-copy small { color:#b8b291; font-size:10px; letter-spacing:.08em; }
.book-learning-recipient-copy strong { color:#f4d99f; font-size:20px; line-height:1.4; overflow-wrap:anywhere; }
@media (max-height:560px) { .book-learning-recipient { grid-template-columns:84px minmax(0,1fr); } .book-learning-recipient-portrait { width:84px; height:84px; } }
.book-command-recipient { grid-template-columns:84px minmax(0,1fr); padding:8px 12px; }
.book-command-recipient .book-learning-recipient-portrait { width:84px; height:84px; }
@media (max-height:560px) { .book-command-recipient { grid-template-columns:64px minmax(0,1fr); } .book-command-recipient .book-learning-recipient-portrait { width:64px; height:64px; } }
.book-command-title { display:flex; align-items:center; gap:11px; }
.book-command-title > div { display:grid; gap:5px; }
.book-command-title small { color:#baa475; font-size:9px; letter-spacing:.13em; }
.book-command-title h2 { margin:0; color:#f2e6cd; font-size:20px; }
.book-command-seal { display:grid; place-items:center; width:36px; height:36px; flex:0 0 36px; border:1px solid #a38c59; border-radius:50%; background:radial-gradient(circle,#76613840,#25372f); color:#edd4a0; font-size:20px; }
.book-command-learned { display:flex; align-items:center; gap:14px; padding:14px; border:1px solid #756b4c; border-radius:10px; background:linear-gradient(120deg,#383729,#1b2b30); }
.book-command-learned .owned-book-skill-icon { width:48px; height:48px; flex-basis:48px; }
.book-command-learned > div { display:grid; gap:4px; min-width:0; }
.book-command-learned small { color:#b4c4bf; font-size:11px; }
.book-command-learned strong { color:#f4d99f; font-size:19px; overflow-wrap:anywhere; }
.book-command-learned span { color:#acbdbb; font-size:11px; }
.book-command-dialog > p { margin:2px 0; color:#adbfbc; font-size:12px; line-height:1.7; }
.book-command-slots { display:grid; gap:8px; }
.book-command-slot { display:flex; align-items:center; gap:10px; width:100%; min-width:0; min-height:68px; padding:10px 12px; border:1px solid #445858; border-radius:9px; background:linear-gradient(125deg,#1e2d31,#142127); color:#e3ece9; text-align:left; }
.book-command-slot[aria-pressed="true"] { border-color:#d0af6c; background:linear-gradient(125deg,#4a422c,#24342e); box-shadow:inset 0 0 0 1px #bb9c4930; }
.book-command-slot:focus-visible { outline:2px solid #efcc80; outline-offset:2px; }
.book-command-number { display:grid; place-items:center; flex:0 0 25px; width:25px; height:25px; border:1px solid #85744f; border-radius:50%; color:#e3c995; font-family:Georgia,serif; font-size:14px; }
.book-command-slot .owned-book-skill-icon,.book-command-empty-icon { width:32px; height:32px; flex:0 0 32px; }
.book-command-empty-icon { display:grid; place-items:center; color:#91aaa3; font-size:22px; }
.book-command-slot-copy { display:grid; flex:1; gap:5px; min-width:0; }
.book-command-slot-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
.book-command-slot-copy small { color:#98b0ac; font-size:10px; }
.book-command-check { width:18px; flex:0 0 18px; color:#e5c274; font-size:18px; }
.book-command-dialog .book-command-preview { padding:8px 10px; border-left:2px solid #b99b5b; background:#c6a85f0c; color:#c9d0bf; overflow-wrap:anywhere; }
.book-command-preview strong { color:#f1d299; }
.book-command-dialog .book-command-error { padding:8px 10px; border:1px solid #a76d61; border-radius:6px; background:#8e47321c; color:#f0bdb0; }
.book-command-actions { display:grid; gap:5px; margin-top:4px; }
.book-command-actions .primary-button { min-height:46px; }
.book-command-actions .text-button { min-height:38px; color:#b7c4bd; }
@media (max-width:380px) { .book-command-dialog { padding:15px; } .book-command-title h2 { font-size:18px; } .book-command-slot { gap:8px; padding:9px; } }

/* Equipment uses the same deliberate hold and upward success sweep as the forge. */
.equipment-card-actions .equipment-enhance-button { display: flex; align-items: center; justify-content: center; gap: 5px; min-height: 44px; border-color: rgb(119 215 161 / 48%); background: linear-gradient(145deg, rgb(73 180 122 / 18%), rgb(73 180 122 / 5%)); color: var(--text); touch-action: pan-y pinch-zoom; -webkit-touch-callout: none; user-select: none; }
.equipment-enhance-button .workshop-enhance-copy { gap: 2px; }
.equipment-enhance-button .workshop-enhance-copy small { font-size: 10px; white-space: nowrap; }
.equipment-enhance-button .workshop-enhance-gauge { flex-basis: 18px; width: 18px; height: 18px; }
.equipment-enhance-button:disabled { opacity: .5; }
.equipment-item-card.enhance-success::before { z-index: 2; }
.equipment-item-card .workshop-enhance-success { z-index: 3; inset: 18% 8px auto; }

/* The filter disclosure is a touch control, including when collapsed. */
.grimoire-store-screen .library-filter-disclosure > summary { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 8px; min-height: 44px; padding: 8px 0; cursor: pointer; }
.grimoire-store-screen .library-filter-disclosure > summary > * { min-width: 0; overflow-wrap: anywhere; }
.grimoire-store-screen .library-filter-disclosure > summary::after { content: "⌄"; flex: none; margin-left: auto; }
.grimoire-store-screen .library-filter-disclosure[open] > summary::after { transform: rotate(180deg); }
#workshop-review-dialog .inheritance-target-select {
  width: 100%; min-width: 0; min-height: 48px; font: inherit; font-size: max(1rem, 16px);
  padding-inline: var(--ga-space-2);
  color-scheme: dark;
  color: var(--text); background-color: var(--surface); background-image: var(--ga-control-bg);
  border: 1px solid var(--ga-control-border); border-radius: var(--ga-radius-choice);
}
#workshop-review-dialog .inheritance-target-select option {
  color: var(--text);
  background-color: var(--surface);
}
.ability-confirm-dialog.inheritance-review {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: var(--ga-space-3);
  padding: clamp(var(--ga-space-3), 4vw, var(--ga-space-4));
  border-radius: var(--ga-radius-panel);
  overflow: hidden;
}
.inheritance-review-heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--ga-space-3);
}
.inheritance-review-heading h2 { margin: 0; font-size: var(--ga-font-page); line-height: 1.35; }
.inheritance-review-heading p { margin: var(--ga-space-1) 0 0; color: var(--muted); font-size: var(--ga-font-note); }
.inheritance-review-mark, .inheritance-stage > label > span, .inheritance-source-summary > b {
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--accent-border);
  border-radius: var(--ga-radius-panel);
  background: var(--surface-2);
  color: var(--gold-strong);
  font-variant-numeric: tabular-nums;
}
.inheritance-review-mark { width: 40px; height: 40px; font-size: var(--ga-font-page); }
.inheritance-review-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: var(--ga-space-1);
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  overflow-wrap: anywhere;
}
.inheritance-stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ga-space-2);
  padding: var(--ga-space-2);
  border: 1px solid var(--line);
  border-radius: var(--ga-radius-panel);
  background: var(--inset);
}
.inheritance-stage > label { display: flex; align-items: center; gap: var(--ga-space-2); font-weight: 700; }
.inheritance-stage > label > span { width: 24px; height: 24px; font-size: var(--ga-font-note); }
.inheritance-source-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--ga-space-2); align-items: center; }
.inheritance-source-summary strong { display: block; font-size: var(--ga-font-item-name); }
.inheritance-source-summary small { display: block; color: var(--muted); font-size: var(--ga-font-note); }
.inheritance-source-summary > b { padding: 0 var(--ga-space-2); font-size: var(--ga-font-section); }
.inheritance-transfer-arrow { display: flex; gap: var(--ga-space-2); align-items: center; color: var(--gold-strong); }
.inheritance-transfer-arrow::before, .inheritance-transfer-arrow::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
.inheritance-stage > p, .inheritance-target-detail :is(h3, header p, .inheritance-target-quality) { margin: 0; }
.inheritance-consumption, .inheritance-replacement {
  padding: var(--ga-space-1) var(--ga-space-2);
  border-inline-start: 2px solid currentColor;
  background: var(--surface);
}
.inheritance-consumption strong { display: block; }
.inheritance-replacement { border-color: var(--accent-border-strong); }
.inheritance-review .ability-confirm-actions {
  grid-template-columns: auto minmax(0, 1fr);
  padding-top: var(--ga-space-2);
  border-top: 1px solid var(--line);
}
.inheritance-review .workshop-enhance-hold {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--ga-space-2);
  min-height: var(--ga-hold-height);
}
.inheritance-review .workshop-enhance-copy {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2px var(--ga-space-2);
}
.inheritance-review .workshop-enhance-copy small { flex-basis: 100%; font-size: var(--ga-font-note); }
.inheritance-target-detail {
  display: grid;
  gap: var(--ga-space-2);
  padding: var(--ga-space-3);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--ga-radius-panel);
}
.inheritance-target-detail h3 { font-size: var(--ga-font-section); }
.inheritance-target-meta, .inheritance-target-quality {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--ga-space-1) var(--ga-space-2);
  color: var(--muted);
  font-size: var(--ga-font-note);
}
.inheritance-target-stats {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  text-align: left;
  font-variant-numeric: tabular-nums;
}
.inheritance-target-stats :is(th, td) { padding: var(--ga-space-1); border-bottom: 1px solid var(--line); }
.inheritance-target-stats thead { color: var(--muted); font-size: var(--ga-font-note); }
.inheritance-target-detail .implicit-trait-note summary { min-height: var(--ga-touch); }
.inheritance-target-detail .implicit-trait-note summary strong { min-width: 0; white-space: normal; }
.workshop-card-actions:has(.workshop-inheritance-entry) { flex-wrap: wrap; }
.workshop-inheritance-entry { min-height: 44px; white-space: normal; }