:root {
  font-family: Arial, Helvetica, sans-serif;
  color: #d1cdbc;
  background: #140e0b;
  color-scheme: dark;
  font-synthesis: none;
  --panel: rgba(41, 29, 22, .9215);
  --panel-deep: rgba(38, 24, 19, .96);
  --border: rgba(162, 143, 112, .18);
  --text: #d1cdbc;
  --muted: #b0ab96;
  --gold: #d8c38a;
  --tan: #bca783;
  --hover: #433728;
  --radius: 12px;
  --shadow: 0 16px 36px rgba(0, 0, 0, .32), 0 4px 8px rgba(0, 0, 0, .22), 0 1px 0 rgba(255, 255, 255, .08);
}
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button { color: inherit; border: 0; background: none; cursor: pointer; }
button, a, select, input { outline-offset: 3px; }
button:focus-visible, a:focus-visible, select:focus-visible, input:focus-visible { outline: 2px solid var(--gold); }
button { transition: background .15s, color .15s, border-color .15s; }
.model-challenge {
  width: min(360px, calc(100% - 28px));
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text);
  background: var(--panel-deep);
}
.model-challenge::backdrop { background: #0009; }
.model-challenge p { margin: 0 0 14px; }
.model-challenge button { margin-top: 12px; padding: 6px 10px; color: var(--gold); }
button:hover { background: rgba(162, 143, 112, .12); }
button:disabled { cursor: default; opacity: .4; }
[hidden] { display: none !important; }
svg { display: block; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
[data-icon] { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
kbd { display: inline-flex; align-items: center; justify-content: center; height: 19px; min-width: 19px; padding: 0 5px; border: 1px solid rgba(162, 143, 112, .18); border-radius: 4px; background: rgba(162, 143, 112, .06); color: var(--tan); font: 10px Arial, sans-serif; }
.inspector { position: absolute; inset: var(--site-header-offset, 0px) 0 0; isolation: isolate; }
.wiki-embed { --site-header-offset: 0px; }
.wiki-embed :is(.site-header, .weapon-pagination, #browse-weapons, #mobile-catalog,
  #mobile-history-button, #control-search-shortcut, #shortcut-search) { display: none; }
.inspector[inert] :is(.top-right, .inspector-footer, .mobile-catalog) { visibility: hidden; }
.scene { position: absolute; inset: 0; z-index: -3; background: radial-gradient(ellipse at 50% 44%, #3c3b36 0%, #2e2d29 45%, #20201e 100%); touch-action: none; isolation: isolate; }
body[data-environment="nightfold"] .scene { background: linear-gradient(#0a0c0e 8%, #263740 30%, #52666f 46%, #30434f 54%, #0a0c0e 85%); }
.scene canvas { position: relative; display: block; width: 100%; height: 100%; outline: none; }
.scene-vignette { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(ellipse at center, transparent 43%, rgba(0, 0, 0, var(--vignette-strength, .13))); }
.viewer-hint { position: absolute; top: 120px; left: 50%; z-index: 2; width: max-content; max-width: calc(100% - 32px); margin: 0; padding: 9px 14px; transform: translateX(-50%); border: 1px solid var(--border); border-radius: 10px; background: #291d16; box-shadow: var(--shadow); color: var(--text); font-size: 13px; line-height: 18px; text-align: center; pointer-events: none; }
body:is(:not([data-ready="true"]), .ui-hidden, .mobile-tools-open, :has(dialog[open])) .viewer-hint,
.inspector[inert] .viewer-hint { display: none; }
.floating { border: 1px solid var(--border); border-radius: var(--radius); background: var(--panel); box-shadow: var(--shadow); }
.brand-mark { display: block; width: 36px; height: 36px; flex: 0 0 36px; object-fit: contain; }
.brand-word > span { color: var(--gold); font-weight: 650; }
.catalog-dialog[data-dismissible="false"] .catalog-search kbd { display: none; }
.top-right { position: absolute; top: 16px; right: 16px; display: flex; align-items: flex-end; flex-direction: column; gap: 8px; }
.mobile-compact-toolbar, .mobile-tools-actions, .mobile-weapon-toggle { display: none; }
.mobile-weapon-content { display: contents; }
.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 3px; width: 290px; height: 44px; padding: 5px; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 32px; height: 32px; padding: 0; border-radius: 8px; color: var(--tan); }
.icon-button svg { width: 18px; height: 18px; }
.icon-button.active { background: var(--gold); color: #291d16; }
.inspect-button { display: flex; align-items: center; justify-content: center; gap: 7px; height: 31px; min-width: 113px; padding: 0 12px; border-radius: 8px; background: var(--gold); color: #261813; font-size: 14px; font-weight: 600; }
.inspect-button:hover { background: #e3d1a6; }
.inspect-button svg { width: 17px; height: 17px; }
.tool-separator { width: 1px; height: 18px; margin: 0 2px; background: rgba(162, 143, 112, .18); }
.view-toolbar { display: flex; align-items: center; gap: 8px; }
.view-pills { display: flex; gap: 4px; height: 39px; padding: 4px; }
.view-pills button { min-width: 70px; padding: 0 11px; border-radius: 7px; color: var(--muted); font-size: 12px; }
.view-pills button.active { background: var(--gold); color: #261813; font-weight: 600; }
.weapon-part-view > [data-icon] { display: none; }
.environment-picker { position: relative; }
.environment-chip { display: flex; align-items: center; justify-content: center; gap: 8px; height: 39px; min-width: 106px; padding: 0 14px; color: var(--tan); font-size: 12px; user-select: none; }
.environment-chip svg { width: 16px; height: 16px; color: #a28f70; }
.environment-chip:hover, .environment-chip[aria-expanded="true"] { background: var(--panel-deep); color: var(--text); }
.environment-chip[aria-expanded="true"] > [data-icon="down"] { transform: rotate(180deg); }
.environment-chip > [data-icon="down"] svg { width: 12px; height: 12px; }
.environment-menu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 3; min-width: 147px; padding: 4px; background: var(--panel-deep); }
.environment-option { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 34px; padding: 6px 8px; border-radius: 8px; color: var(--text); font-size: 12px; text-align: left; }
.environment-option svg { width: 15px; height: 15px; }
.environment-option[aria-pressed="true"] { background: rgba(216, 195, 138, .13); color: var(--gold); }
.environment-option > [data-icon="check"] { margin-left: auto; }
.environment-option[aria-pressed="false"] > [data-icon="check"] { visibility: hidden; }
.text-button { padding: 8px 11px; border: 1px solid var(--border); border-radius: 7px; color: var(--tan); font-size: 12px; }
.settings-dialog { position: fixed; inset: calc(var(--site-header-offset, 0px) + 16px) 16px auto auto; width: 528px; max-width: calc(100% - 32px); height: 432px; max-height: calc(100dvh - var(--site-header-offset, 0px) - 32px); margin: 0; padding: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: #291d16; color: var(--text); box-shadow: var(--shadow); }
.settings-dialog[open] { display: flex; flex-direction: column; }
.settings-dialog::backdrop { background: rgba(15, 10, 7, .48); }
.settings-header { display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; gap: 16px; height: 39px; padding: 3px 8px 3px 16px; border-bottom: 1px solid rgba(162, 143, 112, .12); }
.settings-header h2 { margin: 0; font-size: 14px; font-weight: 600; }
.settings-dialog .settings-header { height: 49px; }
.settings-dialog .settings-header h2 { font-size: 16px; }
.settings-body { display: flex; flex: 1; min-height: 0; }
.settings-nav { display: flex; flex-shrink: 0; flex-direction: column; gap: 4px; width: 148px; padding: 10px; overflow: auto; border-right: 1px solid rgba(162, 143, 112, .12); }
.settings-nav button { display: flex; align-items: center; flex-shrink: 0; gap: 8px; min-height: 42px; padding: 6px 10px; border-radius: 7px; color: var(--muted); font-size: 14px; line-height: 19.5px; text-align: left; }
.settings-nav button.active { background: rgba(216, 195, 138, .13); color: var(--gold); }
.settings-nav svg { width: 16px; height: 16px; }
.settings-content { flex: 1; min-width: 0; min-height: 0; padding: 18px; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(162, 143, 112, .25) transparent; }
.settings-field { display: flex; flex-direction: column; gap: 7px; margin-bottom: 18px; }
.settings-field > span, .settings-field-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--text); font-size: 14px; line-height: 20px; }
.settings-field output { color: var(--tan); font-size: 12px; font-variant-numeric: tabular-nums; }
.settings-field small, .settings-readonly small, .settings-note { color: var(--muted); font-size: 12px; line-height: 17px; }
.settings-field select { width: 100%; min-height: 42px; padding: 0 10px; border: 1px solid var(--border); border-radius: 7px; background: #31271c; color: var(--text); font-size: 14px; cursor: pointer; }
.settings-field option { background: #291d16; color: var(--text); }
.settings-field input[type=range] { width: 100%; height: 28px; margin: 0; appearance: none; background: transparent; cursor: pointer; }
.settings-field input[type=range]:disabled { opacity: .45; cursor: default; }
.settings-field input[type=range]::-webkit-slider-runnable-track { height: 4px; border-radius: 8px; background: #75664c; }
.settings-field input[type=range]::-moz-range-track { height: 4px; border-radius: 8px; background: #75664c; }
.settings-field input[type=range]::-webkit-slider-thumb { width: 16px; height: 16px; margin-top: -6px; appearance: none; border-radius: 50%; background: var(--gold); box-shadow: 0 1px 4px #0006; }
.settings-field input[type=range]::-moz-range-thumb { width: 16px; height: 16px; border: 0; border-radius: 50%; background: var(--gold); }
.settings-readonly { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; margin-bottom: 18px; font-size: 14px; }
.settings-readonly output { color: var(--tan); font-size: 12px; }
.settings-readonly small { width: 100%; }
.settings-toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 42px; margin-bottom: 18px; font-size: 14px; line-height: 20px; cursor: pointer; }
.settings-switch { position: relative; flex-shrink: 0; appearance: none; width: 32px; height: 18px; margin: 0; border-radius: 20px; background: #514b40; cursor: pointer; }
.settings-switch::before { content: ''; position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: 50%; background: #d1cdbc; transition: transform .15s; }
.settings-switch:checked { background: var(--gold); }
.settings-switch:checked::before { background: #291d16; transform: translateX(14px); }
.settings-section .text-button { min-height: 40px; font-size: 13px; }
.settings-field-group { display: grid; justify-items: start; margin-bottom: 18px; }
.settings-field-group .settings-field { width: 100%; margin-bottom: 6px; }
.settings-advanced { margin-top: 16px; border-top: 1px solid var(--border); }
.settings-advanced summary { padding: 12px 4px; border-radius: 4px; color: var(--tan); font-size: 13px; line-height: 18px; cursor: pointer; }
.settings-advanced summary::marker { color: var(--gold); }
.settings-advanced summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.settings-advanced-fields { padding: 6px 0 2px; }
.settings-advanced-fields > :last-child { margin-bottom: 0; }
.settings-note { margin: 10px 0 0; }
.info-menu { position: absolute; top: calc(var(--site-header-height, 0px) + 12px); right: max(12px, env(safe-area-inset-right, 0px)); z-index: 12; width: 224px; max-width: calc(100vw - 24px); overflow: hidden; pointer-events: auto; }
.info-menu-items { padding: 6px; }
.info-menu-item { display: flex; align-items: center; gap: 13px; width: 100%; min-height: 36px; padding: 8px 10px; border-radius: 7px; color: var(--text); font-size: 13px; line-height: 20px; text-align: left; }
.info-menu-item svg { width: 16px; height: 16px; }
.info-menu-footer { display: flex; align-items: flex-start; gap: 9px; padding: 12px 14px 14px; border-top: 1px solid rgba(162, 143, 112, .14); color: var(--muted); }
.info-menu-footer > span { margin-top: 1px; }
.info-menu-footer svg { width: 13px; height: 13px; }
.info-menu-footer p { margin: 0; font-size: 11px; line-height: 15px; }
.terms-dialog {
  position: fixed;
  inset: 0;
  width: min(570px, calc(100% - 24px));
  max-height: calc(100dvh - 24px);
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #291d16;
  color: var(--text);
  box-shadow: var(--shadow);
}
.terms-dialog[open] { display: flex; flex-direction: column; }
.terms-dialog::backdrop { background: rgba(15, 10, 7, .65); }
.terms-content { min-height: 0; overflow: auto; padding: 16px 18px 20px; font-size: 14px; line-height: 1.55; }
.terms-content time { color: var(--muted); font-size: 12px; }
.terms-content section { margin-top: 16px; }
.terms-content h3 { margin: 0 0 5px; color: var(--gold); font-size: 15px; }
.terms-content p { margin: 0; }
.terms-content p + p { margin-top: 6px; }
.terms-content a { color: var(--gold); }
.catalog-top-actions { display: flex; align-items: center; gap: 3px; }
.loading { position: absolute; top: 50%; left: 50%; width: 254px; max-width: calc(100% - 32px); padding: 16px; transform: translate(-50%, -50%); font-size: 12px; }
.loading img { display: block; margin: 0 auto 10px; object-fit: contain; }
.loading progress { display: block; appearance: none; width: 100%; height: 4px; margin-top: 12px; border: 0; border-radius: 8px; overflow: hidden; background: rgba(162, 143, 112, .17); }
.loading progress::-webkit-progress-bar { background: rgba(162, 143, 112, .17); }
.loading progress::-webkit-progress-value { background: var(--gold); border-radius: 8px; }
.loading progress:indeterminate { background: linear-gradient(90deg, rgba(162, 143, 112, .1) 20%, var(--gold), rgba(162, 143, 112, .1) 80%); background-size: 200%; animation: loading 1.4s linear infinite; }
.loading #retry { width: 100%; margin-top: 14px; padding: 9px; border-radius: 7px; background: var(--gold); color: #261813; }
.loading.error { color: #e1b9ac; }
@keyframes loading { to { background-position: -200%; } }
.weapon-panel { position: absolute; right: 16px; bottom: 16px; width: 320px; overflow: hidden; }
.weapon-tabs { display: flex; gap: 4px; height: 39px; padding: 4px; border-bottom: 1px solid rgba(162, 143, 112, .1); }
.weapon-tabs button { flex: 1; padding: 4px; border-radius: 7px; color: var(--muted); font-size: 12px; }
.weapon-tabs button.active { color: #261813; background: var(--gold); font-weight: 600; }
.weapon-tab-panel { padding: 12px; }
.weapon-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.weapon-heading > div { min-width: 0; }
.eyebrow { margin: 0 0 4px; color: #a28f70; font-size: 9px; font-weight: 600; letter-spacing: .8px; text-transform: uppercase; }
.weapon-heading h1 { margin: 0; overflow: hidden; color: var(--text); font-size: 20px; font-weight: 600; line-height: 23px; letter-spacing: -.3px; text-overflow: ellipsis; white-space: nowrap; }
.weapon-heading .icon-button { width: 29px; height: 29px; background: rgba(162, 143, 112, .07); }
.weapon-heading .icon-button svg { width: 16px; height: 16px; }
.weapon-description { max-height: 45px; margin: 9px 0 0; overflow: auto; color: var(--muted); font-size: 11px; line-height: 1.5; }
.equipment-controls { display: grid; gap: 7px; margin-top: 10px; }
.equipment-modes { display: flex; gap: 3px; padding: 3px; border: 1px solid rgba(162, 143, 112, .12); border-radius: 8px; background: rgba(0, 0, 0, .12); }
.equipment-modes button { flex: 1; min-width: 0; min-height: 27px; padding: 4px 8px; border-radius: 5px; color: var(--muted); font-size: 11px; }
.equipment-modes button.active { color: #261813; background: var(--gold); }
.equipment-pact-row, .equipment-animation-row { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 11px; }
.equipment-pact-row > label, .equipment-animation-row > label { flex-shrink: 0; }
.equipment-pact-row select, .equipment-animation-row select { flex: 1; min-width: 0; height: 29px; padding: 3px 7px; border: 1px solid rgba(162, 143, 112, .18); border-radius: 6px; background: #31271c; color: var(--text); font-size: 11px; }
.equipment-pact-row button, .equipment-animation-row button { flex-shrink: 0; min-height: 29px; padding: 4px 7px; border-radius: 6px; color: var(--tan); background: rgba(162, 143, 112, .08); font-size: 11px; }
.equipment-pact-row button.active { color: #261813; background: var(--gold); }
.equipment-animation-row button { display: grid; place-items: center; width: 29px; padding: 5px; }
.equipment-animation-row button svg { width: 15px; height: 15px; }
.equipment-animation-status { margin: 0; color: var(--muted); font-size: 10px; line-height: 14px; }
.equipment-animation-status.error { color: #e1b9ac; }
.equipment-pose { margin: 0; color: var(--muted); font-size: 10px; line-height: 14px; }
.training-target-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 9px; }
.training-target-row button { display: inline-flex; align-items: center; gap: 6px; min-height: 29px; padding: 4px 8px; border-radius: 6px; color: var(--tan); background: rgba(162, 143, 112, .08); font-size: 11px; }
.training-target-row button[aria-pressed=true] { color: #261813; background: var(--gold); }
.training-target-row svg { width: 14px; height: 14px; }
.training-target-status { color: var(--muted); font-size: 11px; line-height: 14px; font-variant-numeric: tabular-nums; }
.training-target-status.error { color: #e1b9ac; }
.training-drill-controls { display: grid; gap: 4px; }
.training-drill-details { margin: 0; color: var(--muted); font-size: 10px; line-height: 14px; font-variant-numeric: tabular-nums; }
.weapon-effects { display: flex; align-items: center; margin-top: 9px; }
.moonsteel-toggle { display: inline-flex; align-items: center; gap: 7px; min-height: 28px; padding: 4px 8px; border-radius: 7px; color: var(--tan); background: rgba(162, 143, 112, .07); font-size: 12px; line-height: 18px; font-weight: 400; }
.moonsteel-icon { flex: none; }
.moonsteel-toggle.active { color: var(--text); background: rgba(216, 195, 138, .13); }
.moonsteel-switch { position: relative; width: 27px; height: 15px; margin-left: 4px; border-radius: 10px; background: #5b5346; }
.moonsteel-switch::after { content: ''; position: absolute; top: 3px; left: 3px; width: 9px; height: 9px; border-radius: 50%; background: #c1bbab; transition: transform .15s, background .15s; }
.moonsteel-toggle.active .moonsteel-switch { background: var(--gold); }
.moonsteel-toggle.active .moonsteel-switch::after { background: #291d16; transform: translateX(12px); }
.moonsteel-toggle[aria-busy=true] .moonsteel-switch::after { animation: moonsteel-pending .7s ease-in-out infinite alternate; }
@keyframes moonsteel-pending { to { opacity: .35; } }
.weapon-pagination { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: 9px; padding-top: 8px; border-top: 1px solid rgba(162, 143, 112, .1); color: var(--muted); font-size: 10px; }
.weapon-pagination button { display: inline-flex; align-items: center; gap: 3px; padding: 4px 2px; border-radius: 5px; color: var(--muted); font-size: 10px; }
.weapon-pagination svg { width: 12px; height: 12px; }
.weapon-pagination > span { color: #a28f70; font-size: 9px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.control-list { display: flex; flex-direction: column; gap: 11px; padding: 14px 12px; font-size: 12px; }
.control-list > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.control-list > div > span:last-child { color: var(--muted); font-size: 10px; }
.control-list > .control-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; }
.control-shortcuts > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 11px; }
.animation-panel { min-height: 112px; }
.animation-select, .animation-speed { height: 30px; min-width: 0; padding: 0 8px; border: 1px solid rgba(162, 143, 112, .18); border-radius: 7px; color: var(--text); background: #31271c; font-size: 11px; cursor: pointer; }
.animation-select { display: block; width: 100%; text-overflow: ellipsis; }
.animation-select option, .animation-speed option { color: var(--text); background: #291d16; }
.animation-transport { display: flex; align-items: center; gap: 9px; margin-top: 11px; }
.animation-play { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 30px; height: 30px; border-radius: 7px; color: var(--gold); background: rgba(162, 143, 112, .1); }
.animation-play svg { width: 16px; height: 16px; }
.animation-timeline { display: flex; flex: 1; flex-direction: column; gap: 5px; min-width: 0; }
.animation-timeline input[type=range] { display: block; appearance: none; width: 100%; height: 4px; margin: 4px 0; border-radius: 5px; background: #75664c; cursor: pointer; }
.animation-timeline input[type=range]::-webkit-slider-thumb { appearance: none; width: 10px; height: 10px; border-radius: 50%; background: var(--gold); }
.animation-timeline input[type=range]::-moz-range-thumb { width: 10px; height: 10px; border: 0; border-radius: 50%; background: var(--gold); }
.animation-timeline output { color: var(--muted); font-size: 9px; line-height: 12px; font-variant-numeric: tabular-nums; text-align: center; white-space: nowrap; }
.animation-speed { flex: 0 0 57px; width: 57px; padding: 0 4px; }
.animation-status { margin: 8px 0 0; color: var(--muted); font-size: 10px; line-height: 15px; }
.animation-status.error { color: #e1b9ac; }
.mobile-catalog { display: none; }
.inspector-footer { display: contents; }
.pact-guide-tabs {
  position: absolute;
  bottom: 16px;
  left: 16px;
  z-index: 5;
  display: flex;
  gap: 3px;
  padding: 3px;
}
.pact-guide-tabs button { min-height: 32px; padding: 4px 10px; border-radius: 7px; color: #d5c7a5; font-size: 13px; white-space: nowrap; }
.pact-guide-tabs button[aria-expanded=true] { background: #4b3823; color: #f0c578; }
.pact-guide {
  position: fixed;
  inset: auto auto var(--pact-guide-offset, 64px) 16px;
  width: min(460px, calc(100vw - 32px));
  max-height: calc(100dvh - var(--site-header-offset, 0px) - var(--pact-guide-offset, 64px) - 12px);
  margin: 0;
  padding: 0;
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid #675130;
  border-radius: 8px;
  background: radial-gradient(ellipse at 50% 46%, #33271b, #211810 80%);
  box-shadow: var(--shadow);
  color: #d5c7a5;
  scrollbar-width: thin;
}
.pact-guide-close { position: absolute; top: 6px; right: 6px; z-index: 3; }
.pact-guide-header { padding: 16px 48px 0 18px; }
.pact-guide-header h2, .pact-guide-header p, .pact-guide-subheading {
  margin: 0;
  color: #efba62;
  font: small-caps 600 20px/1.2 Georgia, Cambria, serif;
  overflow-wrap: anywhere;
}
.pact-guide-header h2 { font-size: 26px; }
.pact-guide-header p { margin-top: 2px; font-size: 16px; }
.pact-guide-content { padding: 0 18px 16px; }
.pact-guide-divider {
  display: block;
  width: 88%;
  max-width: 336px;
  height: 11px;
  margin: 7px auto;
  object-fit: cover;
}
.pact-guide-lore, .pact-guide-description {
  margin: 0;
  color: #e1d0ae;
  font: 16px/1.4 Georgia, Cambria, serif;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.pact-guide-subheading { margin-bottom: 6px; }
.pact-guide-skills { display: grid; gap: 15px; }
.pact-guide-skill-body { display: flex; align-items: flex-start; gap: 12px; }
.pact-guide-skill-icon { flex: none; width: 62px; height: 62px; object-fit: contain; }
.pact-guide-message { margin: 8px 0 0; color: #d5c7a5; font-size: 13px; }

.bottom-actions { position: absolute; bottom: 16px; left: 50%; z-index: 5; display: flex; flex-direction: column; gap: 8px; width: 400px; max-width: calc(100% - 24px); transform: translateX(-50%); }
.shortcut-bar { display: flex; align-items: center; gap: 3px; height: 38px; padding: 4px; }
.shortcut-bar button { display: inline-flex; align-items: center; justify-content: center; flex: 1 1 auto; gap: 6px; min-width: 0; height: 28px; padding: 0 6px; border-radius: 7px; color: var(--muted); font-size: 11px; line-height: 16px; white-space: nowrap; }
.shortcut-bar button[aria-pressed=true] { background: rgba(216, 195, 138, .13); color: var(--gold); }
.shortcut-bar kbd, .restore-ui kbd { height: 17px; min-width: 17px; padding: 0 4px; font-size: 9px; line-height: 15px; }
.inspector-footer:has(#shortcut-reset:not([aria-keyshortcuts])) #control-reset-shortcut { display: none; }
.combat-bar { padding: 4px; user-select: none; }
.combat-bar-row, .combat-actions { display: flex; align-items: stretch; gap: 3px; }
.combat-actions { flex: 1; min-width: 0; padding-left: 4px; border-left: 1px solid var(--border); }
.combat-bar button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 29px; padding: 3px 8px; border-radius: 7px; color: var(--muted); font-size: 11px; line-height: 16px; white-space: nowrap; }
.combat-bar button[aria-pressed=true] { background: rgba(216, 195, 138, .13); color: var(--gold); }
.combat-bar .combat-toggle { flex-shrink: 0; color: var(--tan); font-weight: 600; }
.combat-bar .combat-toggle[aria-pressed=true] { background: var(--gold); color: #261813; }
.combat-toggle svg { width: 15px; height: 15px; }
.combat-action { flex: 1; touch-action: none; }
.combat-action kbd { height: 17px; min-width: 17px; padding: 0 4px; font-size: 9px; }
.combat-status { margin: 3px 8px 2px; color: var(--tan); font-size: 11px; line-height: 16px; text-align: center; }
.combat-status:empty { margin: 0; }
.restore-ui { position: absolute; bottom: 16px; left: 50%; z-index: 6; display: none; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 7px 12px; transform: translateX(-50%); color: var(--text); font-size: 11px; white-space: nowrap; }
.ui-hidden .top-right, .ui-hidden .inspector-footer, .ui-hidden .mobile-catalog { display: none !important; }
.ui-hidden #restore-ui { display: flex; }
.toast { position: absolute; bottom: 68px; left: 50%; z-index: 20; max-width: 440px; padding: 11px 16px; transform: translateX(-50%); color: var(--text); font-size: 12px; text-align: center; }

/* Catalog: utility/search, primary module, type tree and the item grid. */
.catalog-dialog { position: fixed; inset: 0; width: calc(100% - 64px); height: 85dvh; max-width: 1400px; max-height: calc(100dvh - 64px); margin: auto; padding: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--panel); box-shadow: var(--shadow); color: var(--text); }
.catalog-dialog[open] { display: flex; flex-direction: column; }
.catalog-dialog[data-home="true"] { inset-block-start: var(--site-header-offset, 0px); max-height: calc(100dvh - var(--site-header-offset, 0px) - 28px); z-index: 8; }
.catalog-dialog::backdrop { background: rgba(0, 0, 0, .44); }
.catalog-search-content { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.catalog-top { display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; min-height: 46px; padding: 12px 20px 0; }
.catalog-modes { display: flex; align-self: stretch; gap: 3px; }
.catalog-modes button { display: flex; align-items: center; gap: 6px; padding: 6px 12px; border-bottom: 2px solid transparent; color: var(--muted); font-size: 13px; line-height: 19.5px; }
.catalog-modes button svg { width: 14px; height: 14px; }
.catalog-modes button.active { border-bottom-color: var(--gold); color: var(--gold); background: transparent; }
.catalog-search { display: flex; align-items: center; flex-shrink: 0; gap: 12px; height: 48px; padding: 0 20px; }
.catalog-search > span { color: #a28f70; }
.catalog-search input { width: 100%; height: 100%; padding: 0; border: 0; background: none; outline: none; color: var(--text); font-size: 15px; line-height: 22.5px; }
.catalog-search input::placeholder { color: var(--muted); opacity: .7; }
.catalog-search:focus-within > span { color: var(--gold); }
.catalog-primary-tabs { display: flex; align-items: center; flex-shrink: 0; gap: 8px; min-height: 56px; padding: 8px 16px; overflow-x: auto; scrollbar-width: none; background: rgba(20, 14, 11, .12); border-bottom: 1px solid rgba(162, 143, 112, .1); }
.catalog-primary-tabs::-webkit-scrollbar { display: none; }
.catalog-primary-tabs button { flex: 1 0 0; min-width: 96px; height: 38px; padding: 0 15px; border: 1px solid rgba(162, 143, 112, .12); border-radius: 10px; color: var(--text); background: rgba(20, 14, 11, .14); font-size: 13px; white-space: nowrap; }
.catalog-primary-tabs button:hover { border-color: rgba(216, 195, 138, .4); background: rgba(216, 195, 138, .06); }
.catalog-primary-tabs button.active { border-color: rgba(216, 195, 138, .7); background: rgba(216, 195, 138, .17); color: var(--text); font-weight: 600; }
.catalog-primary-tabs button:only-child { flex: 0 0 auto; }
.catalog-body { position: relative; display: flex; flex: 1; min-height: 0; }
.catalog-sidebar { display: flex; flex-direction: column; flex-shrink: 0; width: 200px; min-height: 0; padding: 15px 8px 12px; border-right: 1px solid rgba(162, 143, 112, .1); background: rgba(20, 14, 11, .18); }
.catalog-sidebar-heading { padding: 3px 11px 13px; color: #a28f70; font-size: 11px; font-weight: 500; }
.catalog-categories { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(162, 143, 112, .24) transparent; }
.category-group { margin-bottom: 2px; }
.category-group-row { display: flex; align-items: center; min-height: 35.5px; border-radius: 7px; }
.category-button { display: flex; align-items: center; flex: 1; gap: 8px; width: 100%; min-width: 0; min-height: 35.5px; padding: 8px; border-radius: 7px; color: var(--muted); font-size: 13px; line-height: 19.5px; text-align: left; }
.category-button.active { background: rgba(216, 195, 138, .13); color: var(--gold); }
.category-icon { display: inline-flex; align-items: center; flex-shrink: 0; width: 18px; color: #a28f70; }
.category-icon svg { width: 17px; height: 17px; }
.pact-arms-icon { display: block; width: 100%; aspect-ratio: 1; background: url('/assets/ui/pact-arms.png') center / contain no-repeat; }
.category-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.category-count { margin-left: auto; color: #8b806e; font-size: 10px; font-variant-numeric: tabular-nums; }
.category-expand { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 16px; height: 18px; margin-left: 3px; color: #a28f70; pointer-events: none; }
.category-expand svg { width: 14px; height: 14px; transition: transform .15s; }
.category-button[aria-expanded=true] .category-expand svg { transform: rotate(90deg); }
.category-children { display: flex; flex-direction: column; gap: 1px; margin: 3px 0 5px; padding-left: 26px; }
.category-weapon { display: block; width: 100%; min-height: 30px; padding: 6px 8px; overflow: hidden; border-radius: 6px; color: var(--muted); font-size: 12px; line-height: 18px; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.category-weapon.active { background: rgba(216, 195, 138, .09); color: var(--gold); }
.catalog-categories button:focus-visible { outline-offset: -2px; }
.catalog-results { display: flex; flex: 1; flex-direction: column; min-width: 0; min-height: 0; }
.catalog-meta { display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; gap: 12px; min-height: 52px; padding: 12px 16px 8px; }
.catalog-label { display: flex; align-items: center; flex: 1; gap: 10px; min-width: 0; }
.catalog-label strong { overflow: hidden; color: var(--text); font-size: 14px; line-height: 21px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; }
.catalog-label > span { color: #9b9485; font-size: 11px; white-space: nowrap; }
.catalog-meta select { flex-shrink: 0; width: 177px; height: 32px; padding: 0 10px; border: 1px solid rgba(162, 143, 112, .14); border-radius: 7px; background: rgba(162, 143, 112, .08); color: var(--muted); font-size: 11px; cursor: pointer; }
.catalog-meta option { background: #291d16; color: var(--text); }
.catalog-grid { display: grid; flex: 1; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: 144px; align-content: start; gap: 8px; min-height: 0; padding: 12px 16px 16px; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(162, 143, 112, .25) transparent; }
.weapon-card { position: relative; display: flex; flex-direction: column; isolation: isolate; width: 100%; min-width: 0; min-height: 0; height: 100%; padding: 11px 10px 7px; overflow: hidden; border: 1px solid rgba(162, 143, 112, .24); border-radius: 14px; background: linear-gradient(180deg, rgba(38, 24, 19, .8), rgba(38, 24, 19, .46)); text-align: left; }
.weapon-card:hover { border-color: rgba(216, 195, 138, .58); background: rgba(67, 55, 40, .45); }
.weapon-card.selected { border-color: rgba(216, 195, 138, .85); }
.weapon-card:focus-visible { outline-offset: -3px; }
.weapon-card-choice { padding: 0; }
.weapon-card-open { position: relative; display: flex; flex-direction: column; width: 100%; height: 100%; min-height: 0; padding: 11px 10px 7px; color: inherit; text-align: left; }
.weapon-card-open:hover { background: none; }
.weapon-card-open:focus-visible { outline-offset: -3px; border-radius: inherit; }
.weapon-card-actions { position: absolute; z-index: 2; right: 7px; bottom: 7px; left: 7px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; }
.weapon-card-mode { min-height: 30px; padding: 5px 4px; border-radius: 5px; color: var(--text); background: #392b21; font-size: 10px; line-height: 13px; }
.weapon-card-mode:hover { color: #261813; background: var(--gold); }
.weapon-card.expanded { border-color: var(--gold); }
.weapon-card.expanded img { opacity: .4; }
.weapon-card.expanded.selected::after { display: none; }
.weapon-card.selected::after { content: ''; position: absolute; right: 11px; bottom: 11px; width: 5px; height: 9px; border: solid var(--gold); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); }
.weapon-card-name { position: relative; z-index: 1; display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; flex-shrink: 0; color: var(--text); font-size: 12px; font-weight: 500; line-height: 16px; }
.weapon-card img { display: block; flex: 1; width: 100%; height: 0; min-height: 0; margin: 4px 0 16px; object-fit: contain; filter: drop-shadow(0 8px 5px rgba(0, 0, 0, .25)); pointer-events: none; transition: transform .18s; }
.weapon-card[data-model="items:fipple-flute"] img { rotate: 129deg; }
.weapon-card[data-model="items:wooden-flute-totem"] img { rotate: 90deg; }
.weapon-card:hover img { transform: scale(1.045); }
.weapon-card-type { position: absolute; bottom: 9px; left: 10px; color: #9c8d75; font-size: 9px; line-height: 12px; }
.weapon-card-no-image { display: flex; align-items: center; justify-content: center; flex: 1; color: #a28f70; }
.weapon-card-no-image svg { width: 52px; height: 52px; stroke-width: 1; opacity: .65; }
[data-weapon-group] {
  --weapon-group-gradient: linear-gradient(135deg, var(--weapon-group-start), var(--weapon-group-end));
  --weapon-group-text: #e8e0cf;
}
[data-weapon-group="bow"] { --weapon-group-start: #2e382e; --weapon-group-end: #657b65; --weapon-group-icon: url('/assets/ui/weapon-groups/bow.webp'); }
[data-weapon-group="flyblade"] { --weapon-group-start: #403d2a; --weapon-group-end: #8c855c; --weapon-group-icon: url('/assets/ui/weapon-groups/flyblade.webp'); }
[data-weapon-group="heavy"], [data-weapon-group="polearm"] { --weapon-group-start: #402d2a; --weapon-group-end: #8c625c; }
[data-weapon-group="heavy"] { --weapon-group-icon: url('/assets/ui/weapon-groups/heavy.webp'); }
[data-weapon-group="long-blade"] { --weapon-group-start: #2a3640; --weapon-group-end: #5c778c; --weapon-group-icon: url('/assets/ui/weapon-groups/long-blade.webp'); }
[data-weapon-group="magick"] { --weapon-group-start: #363240; --weapon-group-end: #776e8c; --weapon-group-icon: url('/assets/ui/weapon-groups/magick.webp'); }
[data-weapon-group="polearm"] { --weapon-group-icon: url('/assets/ui/weapon-groups/polearm.webp'); }
[data-weapon-group="shield"] { --weapon-group-start: #40362a; --weapon-group-end: #8c775c; --weapon-group-icon: url('/assets/ui/weapon-groups/shield.webp'); }
[data-weapon-group="short-blade"] { --weapon-group-start: #403238; --weapon-group-end: #8c6e7b; --weapon-group-icon: url('/assets/ui/weapon-groups/short-blade.webp'); }
.category-group[data-weapon-group] .category-button {
  color: var(--weapon-group-text);
  background: linear-gradient(#0005, #0005), var(--weapon-group-gradient);
}
.category-group[data-weapon-group] .category-button:is(:hover, .active) { background: linear-gradient(#0004, #0004), var(--weapon-group-gradient); }
.category-group[data-weapon-group].active .category-button { box-shadow: inset 2px 0 var(--weapon-group-text); font-weight: 600; }
.category-group[data-weapon-group] .category-icon { width: 20px; height: 20px; background: var(--weapon-group-icon) center / contain no-repeat; }
.category-group[data-weapon-group] .category-label { white-space: normal; line-height: 15px; }
.category-group[data-weapon-group] :is(.category-count, .category-expand) { color: var(--weapon-group-text); }
.weapon-card[data-weapon-group] {
  background: linear-gradient(180deg, #181412e0, #18141262), var(--weapon-group-gradient);
  border-color: color-mix(in srgb, var(--weapon-group-end) 75%, transparent);
}
.weapon-card[data-weapon-group]:hover { border-color: var(--weapon-group-end); }
.weapon-card[data-weapon-group]:is(.selected, .expanded) { border-color: var(--gold); }
.weapon-card[data-weapon-group] .weapon-card-type { color: var(--weapon-group-text); }
.catalog-empty { display: flex; align-items: center; justify-content: center; flex: 1; flex-direction: column; padding: 24px; color: var(--text); text-align: center; }
.catalog-empty > span svg { width: 28px; height: 28px; margin-bottom: 16px; color: #a28f70; stroke-width: 1.5; }
.catalog-empty strong { font-size: 15px; font-weight: 500; }
.catalog-empty p { color: var(--muted); font-size: 12px; line-height: 1.5; }
.catalog-empty .text-button { margin-top: 6px; }
.catalog-history-content { display: flex; flex: 1; flex-direction: column; min-height: 0; padding: 12px 20px 20px; }
.history-heading { display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; gap: 16px; min-height: 64px; padding: 0 3px 12px; }
.history-heading > div { display: flex; align-items: center; gap: 10px; }
.history-heading h2 { margin: 0; font-size: 14px; font-weight: 600; }
.history-heading > div > span { color: #9b9485; font-size: 11px; }
.history-heading .text-button { display: inline-flex; align-items: center; gap: 7px; border-color: transparent; font-size: 12px; }
.history-heading .text-button svg { width: 14px; height: 14px; }
.history-list { display: flex; flex: 1; flex-direction: column; gap: 6px; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(162, 143, 112, .25) transparent; }
.history-row { display: flex; align-items: center; flex-shrink: 0; gap: 12px; min-height: 74px; border: 1px solid rgba(162, 143, 112, .12); border-radius: 9px; background: rgba(38, 24, 19, .4); }
.history-row:hover { background: rgba(67, 55, 40, .38); }
.history-item-open { display: flex; align-items: center; flex: 1; align-self: stretch; gap: 16px; min-width: 0; padding: 7px 12px; border-radius: 9px; text-align: left; }
.history-item-open:hover { background: none; }
.history-item-open:focus-visible { outline-offset: -2px; }
.history-thumb { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 84px; height: 58px; color: #a28f70; }
.history-thumb img { width: 100%; height: 100%; object-fit: contain; }
.history-thumb > svg { width: 27px; height: 27px; stroke-width: 1.3; }
.history-item-text { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.history-item-name { overflow: hidden; font-size: 13px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.history-item-meta { color: var(--muted); font-size: 11px; }
.history-remove { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 32px; height: 32px; margin-right: 15px; border-radius: 7px; color: #a28f70; }
.history-remove svg { width: 16px; height: 16px; }
.history-empty { display: flex; align-items: center; justify-content: center; flex: 1; flex-direction: column; gap: 13px; padding: 30px; text-align: center; }
.history-empty > span { color: #a28f70; }
.history-empty svg { width: 30px; height: 30px; stroke-width: 1.5; }
.history-empty strong { font-size: 14px; font-weight: 500; }
.history-empty p { margin: 0; color: var(--muted); font-size: 12px; }
@supports selector(::-webkit-scrollbar) {
  :is(.catalog-grid, .catalog-categories, .history-list) { scrollbar-width: auto; scrollbar-color: auto; }
  :is(.catalog-grid, .catalog-categories, .history-list)::-webkit-scrollbar { width: 6px; height: 6px; }
  :is(.catalog-grid, .catalog-categories, .history-list)::-webkit-scrollbar-thumb { border-radius: 6px; background: rgba(162, 143, 112, .25); }
}
@media (min-width: 1440px) {
  .catalog-grid { grid-auto-rows: 164px; }
}
@media (max-width: 1180px) {
  .catalog-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .weapon-panel { bottom: 64px; }
}
@media (min-width: 641px) and (max-width: 1080px) {
  .inspector-footer:has(.combat-bar:not([hidden])) .weapon-panel { bottom: 126px; }
}
@media (max-width: 980px) {
  .catalog-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .catalog-sidebar { width: 180px; }
  .view-pills button { min-width: 60px; padding: 0 9px; }
  .view-pills .weapon-part-view { display: inline-flex; align-items: center; justify-content: center; width: 32px; min-width: 32px; padding: 0; }
  .weapon-part-view > [data-icon] { display: inline-flex; }
  .weapon-part-view > .view-label { display: none; }
}
@media (max-width: 720px) {
  .toolbar { width: 266px; }
  .toolbar .icon-button { width: 29px; }
  .inspect-button { min-width: 102px; padding: 0 9px; font-size: 13px; }
  .weapon-panel { width: 300px; }
}
@media (min-width: 641px) and (max-width: 980px) {
  .pact-guide-tabs { bottom: 60px; }
  .inspector-footer:has(.combat-bar:not([hidden])) .pact-guide-tabs { bottom: 108px; }
}
@media (max-width: 640px) {
  .viewer-hint { top: 108px; }
  .top-right { top: 12px; left: auto; right: 12px; gap: 0; pointer-events: none; }
  .mobile-compact-toolbar { display: flex; align-items: center; gap: 2px; width: auto; min-width: 114px; height: 40px; padding: 3px; border-radius: 22px; pointer-events: auto; }
  .mobile-compact-toolbar .icon-button { width: 34px; height: 32px; border-radius: 50%; }
  .mobile-compact-toolbar svg { width: 18px; height: 18px; }
  .toolbar, .mobile-tools-actions { display: none; pointer-events: auto; }
  .toolbar { position: fixed; top: calc(var(--site-header-offset, 0px) + 60px); left: 12px; right: 12px; width: calc(100% - 24px); max-width: none; height: 44px; padding: 5px; gap: 2px; }
  .mobile-tools-open .toolbar { display: flex; }
  .toolbar .icon-button { width: 30px; height: 31px; }
  .toolbar .icon-button svg { width: 17px; height: 17px; }
  .inspect-button { min-width: 98px; height: 31px; gap: 5px; padding: 0 8px; font-size: 12px; }
  .inspect-button svg { width: 16px; height: 16px; }
  .tool-separator { margin: 0; }
  .view-toolbar { position: fixed; top: calc(var(--site-header-offset, 0px) + 60px); right: 12px; z-index: 2; gap: 7px; pointer-events: auto; }
  .mobile-tools-open .view-toolbar { top: calc(var(--site-header-offset, 0px) + 112px); }
  .view-pills { display: none; height: 36px; padding: 4px; border-radius: 10px; }
  .mobile-tools-open .view-pills { display: flex; }
  .view-pills button { min-width: 62px; padding: 0 9px; font-size: 11px; }
  .view-pills #head-view, .view-pills .weapon-part-view { display: none; }
  .environment-chip { height: 36px; min-width: 98px; padding: 0 12px; border-radius: 10px; font-size: 11px; }
  .environment-chip svg { width: 15px; height: 15px; }
  .mobile-tools-actions { position: fixed; top: calc(var(--site-header-offset, 0px) + 160px); left: 12px; right: 12px; gap: 4px; padding: 4px; }
  .mobile-tools-open .mobile-tools-actions { display: flex; }
  .mobile-tools-actions button { display: flex; align-items: center; justify-content: center; flex: 1; gap: 7px; min-height: 34px; padding: 5px 8px; border-radius: 7px; color: var(--tan); font-size: 11px; white-space: nowrap; }
  .mobile-tools-actions svg { width: 15px; height: 15px; }
  .inspector-footer { position: absolute; inset: auto 0 0; display: flex; flex-direction: column-reverse; align-items: center; gap: 8px; pointer-events: none; }
  .pact-guide-tabs { position: static; align-self: flex-start; margin: 0 12px; pointer-events: auto; }
  .pact-guide { inset-inline: 12px; width: auto; }
  .pact-guide-tabs button { min-height: 38px; padding: 4px 8px; }
  .weapon-panel { position: relative; inset: auto; display: flex; flex-direction: column; width: 100%; max-height: 55dvh; padding-bottom: env(safe-area-inset-bottom, 0px); border-radius: 16px 16px 0 0; border-bottom: 0; pointer-events: auto; }
  .mobile-weapon-toggle { position: relative; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; gap: 16px; width: 100%; height: 60px; padding: 14px 16px 8px; color: var(--text); text-align: left; }
  .mobile-weapon-handle { position: absolute; top: 6px; left: 50%; width: 28px; height: 3px; transform: translateX(-50%); border-radius: 4px; background: rgba(162, 143, 112, .38); }
  .mobile-weapon-copy { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
  #mobile-weapon-name { overflow: hidden; font-size: 13px; font-weight: 600; line-height: 17px; text-overflow: ellipsis; white-space: nowrap; }
  #mobile-weapon-category { color: var(--muted); font-size: 10px; line-height: 13px; }
  .mobile-weapon-toggle > [data-icon] { color: var(--tan); transition: transform .15s; }
  .mobile-weapon-toggle[aria-expanded=true] > [data-icon] { transform: rotate(180deg); }
  .mobile-weapon-content { display: none; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(162, 143, 112, .25) transparent; }
  .mobile-sheet-open .mobile-weapon-content { display: block; }
  .weapon-tabs { height: 36px; }
  .weapon-tabs button { font-size: 11px; }
  .weapon-tab-panel { padding: 11px 12px; }
  .eyebrow { font-size: 8px; margin-bottom: 4px; }
  .weapon-heading h1 { font-size: 18px; line-height: 22px; }
  .weapon-heading .icon-button { width: 28px; height: 28px; }
  .weapon-description { display: none; }
  .weapon-effects { margin-top: 8px; }
  .moonsteel-toggle { min-height: 27px; font-size: 11px; }
  .weapon-pagination { margin-top: 8px; padding-top: 7px; }
  .weapon-pagination button { font-size: 10px; }
  .control-list { gap: 8px; font-size: 11px; }
  .mobile-catalog { display: none; }
  .shortcut-bar { display: none; }
  .bottom-actions { position: static; transform: none; pointer-events: auto; }
  .bottom-actions:has(.combat-bar[hidden]) { display: none; }
  .combat-bar button { min-height: 42px; padding: 3px 6px; }
  .restore-ui { bottom: 80px; }
  .toast { bottom: 80px; width: max-content; max-width: calc(100% - 24px); padding: 11px 13px; font-size: 11px; }
  .settings-dialog { inset: calc(var(--site-header-offset, 0px) + 12px) 12px auto auto; width: calc(100% - 24px); max-width: none; max-height: calc(100dvh - var(--site-header-offset, 0px) - 24px); }
  .settings-header { padding-left: 15px; }
  .settings-body { flex-direction: column; }
  .settings-nav { flex-direction: row; width: auto; padding: 8px; border-right: 0; border-bottom: 1px solid var(--border); }
  .settings-nav button { flex: 1; justify-content: center; gap: 6px; min-height: 44px; padding: 6px 4px; text-align: center; }
  .settings-nav svg { width: 14px; height: 14px; }
  .settings-content { padding: 16px; }
  .loading { top: 42%; width: 236px; }
  .catalog-dialog { inset: var(--site-header-offset, 0px) 0 0; width: 100%; height: auto; max-width: none; max-height: none; margin: 0; padding-bottom: env(safe-area-inset-bottom, 0px); border: 0; border-radius: 0; background: rgba(41, 29, 22, .98); }
  .catalog-dialog[data-home="true"] { max-height: none; }
  .catalog-top { min-height: 43px; padding: 5px 9px 0; }
  .catalog-modes button { padding: 0 12px; font-size: 12px; }
  .catalog-search { height: 51px; padding: 0 15px; gap: 10px; }
  .catalog-search input { font-size: 16px; }
  .catalog-search > kbd { display: none; }
  .catalog-primary-tabs { min-height: 52px; padding: 7px 10px; gap: 6px; }
  .catalog-primary-tabs button { flex: 1 0 auto; min-width: max-content; height: 36px; padding: 0 12px; font-size: 12px; }
  .catalog-sidebar { width: 120px; padding: 10px 4px; }
  .catalog-sidebar-heading { padding: 4px 7px 12px; font-size: 10px; }
  .category-group-row, .category-button { min-height: 34px; }
  .category-button { gap: 4px; padding: 6px 5px; font-size: 11px; }
  .category-icon { display: none; }
  .category-label { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; line-height: 14px; }
  .category-count { font-size: 9px; }
  .category-expand { width: 12px; height: 14px; margin-left: 1px; }
  .category-expand svg { width: 12px; height: 12px; }
  .category-children { padding-left: 7px; }
  .category-weapon { display: -webkit-box; min-height: 29px; padding: 6px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 10px; line-height: 14px; white-space: normal; }
  .catalog-meta { gap: 6px; min-height: 60px; padding: 10px 8px; }
  .catalog-label { flex-direction: column; align-items: flex-start; gap: 4px; }
  .catalog-label strong { max-width: 100%; font-size: 11px; }
  .catalog-label > span { font-size: 9px; }
  .catalog-meta select { width: 106px; height: 34px; padding: 0 5px; font-size: 11px; }
  .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 108px; gap: 6px; padding: 0 8px 12px; }
  .weapon-card { padding: 8px 7px; border-radius: 12px; }
  .weapon-card-choice { padding: 0; }
  .weapon-card-open { padding: 8px 7px; }
  .weapon-card-actions { right: 4px; bottom: 4px; left: 4px; grid-template-columns: 1fr; gap: 3px; padding: 3px; }
  .weapon-card-mode { min-height: 27px; padding: 4px 2px; font-size: 9px; line-height: 12px; }
  .weapon-card-name { font-size: 11px; line-height: 14px; }
  .weapon-card img { margin: 3px 0 13px; filter: drop-shadow(0 4px 3px #0004); }
  .weapon-card-type { bottom: 7px; left: 7px; max-width: calc(100% - 17px); overflow: hidden; font-size: 8px; white-space: nowrap; text-overflow: ellipsis; }
  .weapon-card.selected::after { right: 8px; bottom: 8px; width: 4px; height: 7px; }
  .catalog-history-content { padding: 9px 12px 15px; }
  .history-heading { min-height: 64px; gap: 10px; }
  .history-heading > div { align-items: flex-start; flex-direction: column; gap: 5px; }
  .history-heading h2 { font-size: 13px; }
  .history-heading > div > span { font-size: 10px; }
  .history-heading .text-button { font-size: 11px; }
  .history-row { gap: 6px; min-height: 71px; }
  .history-item-open { gap: 11px; padding: 7px 9px; }
  .history-thumb { width: 68px; height: 54px; }
  .history-item-name { font-size: 12px; }
  .history-item-meta { font-size: 10px; }
  .history-remove { margin-right: 9px; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .catalog-dialog {
    inset: var(--site-header-offset, 0px) max(12px, env(safe-area-inset-right, 0px)) max(8px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
    width: auto;
    height: auto;
    max-height: none;
    margin: 0;
    padding-bottom: 0;
  }
  .catalog-dialog[data-home="true"] { max-height: none; }
  .catalog-top { min-height: 38px; padding: 0 12px; }
  .catalog-search { height: 40px; padding-inline: 12px; }
  .catalog-primary-tabs { min-height: 42px; padding: 4px 12px; }
  .catalog-primary-tabs button { height: 33px; }
  .catalog-meta { min-height: 40px; padding: 4px 12px; }
  .catalog-label { flex-direction: row; align-items: center; }
  .catalog-grid { grid-auto-rows: clamp(84px, 27dvh, 108px); padding: 4px 12px 10px; }
  .weapon-card-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-height: 500px) and (orientation: landscape) and (pointer: coarse) {
  .catalog-search input { font-size: 16px; }
}
@media (max-width: 420px) {
  .combat-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .combat-bar .combat-action { flex-direction: column; gap: 2px; padding: 3px; }
}
@media (max-width: 640px) and (pointer: coarse) {
  .combat-action kbd { display: none; }
  .training-target-row button { min-height: 42px; }
}
@media (max-width: 370px) {
  .toolbar .icon-button { width: 27px; }
  .inspect-button { min-width: 87px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
