/* Shared component materials, dimensions and states. Screen geometry stays in figma-ui.css. */
@font-face { font-family: "Devil Cinzel"; src: url("../fonts/Figma-cinzel.ttf") format("truetype"); font-weight: 400 900; font-display: swap; }
@font-face { font-family: "Devil Inter"; src: url("../fonts/Figma-inter.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
body.ui-figma {
  --f-unit: min(.0520833333dvw, .0925925926dvh);
  --f-hit-min: 44px;
  --f-control-size: max(var(--f-hit-min),calc(96 * var(--f-unit)));
  --f-action-padding: 10px 20px;
  --f-state-duration: 120ms;
  --f-hover-brightness: 1.2;
  --f-press-offset: 1px;
  --f-disabled-opacity: .48;
  --f-selected-outline: 1px solid var(--f-ivory);
  --f-selected-offset: 0px;
  --f-black: #080808; --f-leather: #101111; --f-inset: #171818;
  --f-iron: #3d3e3d; --f-ivory: #ddd8cd; --f-icon: #bcb8ad;
  --f-muted: #aaa397; --f-red: #991a1f; --f-blood: #58080c; --f-focus: #eee8d9;
  --f-panel: url("../img/figma-ui/leather-panel.webp");
  --f-primary: url("../img/figma-ui/button-primary.webp");
  --f-secondary: url("../img/figma-ui/button-secondary.webp");
  --f-control: url("../img/figma-ui/icon-button.webp");
  --f-control-stone: url("../img/figma-ui/control-stone.webp");
  --f-control-active: url("../img/figma-ui/control-active.webp");
  --f-primary-pressed: url("../img/figma-ui/button-primary-pressed.webp");
  --f-secondary-pressed: url("../img/figma-ui/button-secondary-pressed.webp");
  --f-panel-surface: var(--f-panel) center/100% 100% no-repeat;
  --f-window-surface: linear-gradient(#080808d9,#080808df),url("../img/figma-ui/cathedral.webp") center/cover no-repeat;
  --font-ui: "Devil Inter", "Alegreya Sans", sans-serif;
  --font-display: "Devil Cinzel", "Cormorant SC", Georgia, serif;
  --bg: var(--f-black); --text: var(--f-ivory); --text-dim: var(--f-muted);
  --gold: var(--f-icon); --gold-bright: var(--f-focus); --gold-dim: var(--f-iron);
  --g2-gold: var(--f-icon); --g2-gold-hi: var(--f-focus); --g2-ember: var(--f-red);
  color: var(--f-ivory); background: var(--f-black); font-family: var(--font-ui);
}
body.ui-figma button, body.ui-figma input, body.ui-figma select, body.ui-figma textarea { font-family: var(--font-ui); }
body.ui-figma .f-art { display: inline-block; width: 1em; height: 1em; object-fit: contain; vertical-align: middle; pointer-events: none; }
/* One authored material and one state set serve every action. Labels stay live and localized. */
body.ui-figma :is(.u-btn-primary,.u-btn-secondary,.dev-btn,.brief__start,.si-btn,.set-btn,.boss-card__btn,.defeat-btn,.victory-btn,.gameover-btn,.f-button) {
  --f-button-image: var(--f-secondary);
  --f-button-pressed: var(--f-secondary-pressed);
  --f-button-focus: url("../img/figma-ui/button-secondary-focus.webp");
  --f-button-disabled: url("../img/figma-ui/button-secondary-disabled.webp");
  position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: center;
  gap: 8px; min-height: var(--f-hit-min); border: 0; border-radius: 0; padding: var(--f-action-padding);
  background: var(--f-button-image) center/100% 100% no-repeat; color: var(--f-ivory);
  font-family: var(--font-display); font-weight: 700; line-height: 1.1; text-align: center;
  text-shadow: 0 2px 3px #000; box-shadow: none; clip-path: none;
  transition: filter var(--f-state-duration), transform var(--f-state-duration); cursor: pointer;
}
body.ui-figma :is(.u-btn-primary,.dev-btn,.brief__start,.si-btn--get,.si-btn--activate,.set-btn.primary,.f-button--primary) { --f-button-image: var(--f-primary); --f-button-pressed: var(--f-primary-pressed); --f-button-focus: url("../img/figma-ui/button-primary-focus.webp"); --f-button-disabled: url("../img/figma-ui/button-primary-disabled.webp"); }
body.ui-figma :is(.u-btn-primary,.u-btn-secondary,.dev-btn,.brief__start,.si-btn,.set-btn,.boss-card__btn,.defeat-btn,.victory-btn,.gameover-btn,.f-button)::before,
body.ui-figma :is(.u-btn-primary,.u-btn-secondary,.dev-btn,.brief__start,.si-btn,.set-btn,.boss-card__btn,.defeat-btn,.victory-btn,.gameover-btn,.f-button)::after { content: none; }
body.ui-figma :is(.u-btn-primary,.u-btn-secondary,.dev-btn,.brief__start,.si-btn,.set-btn,.boss-card__btn,.defeat-btn,.victory-btn,.gameover-btn,.f-button,.f-main-button):not(:disabled):not([aria-disabled="true"]):hover { filter: brightness(var(--f-hover-brightness)); }
body.ui-figma :is(button,[role="button"],[role="option"],input,select,textarea):focus-visible { outline: 2px solid var(--f-focus); outline-offset: 3px; }
body.ui-figma :is(.u-btn-primary,.u-btn-secondary,.dev-btn,.brief__start,.si-btn,.set-btn,.boss-card__btn,.defeat-btn,.victory-btn,.gameover-btn,.f-button,.f-main-button):is(:disabled,[aria-disabled="true"]) { cursor: default; opacity: var(--f-disabled-opacity); filter: saturate(.25); }
body.ui-figma :is(.side-x,.set-hdr__close,.shop__close,.menu__back,.map__zoom,.map-tools__toggle,.nm-nav,.wm-x,.np-x,.info-x) {
  min-width: var(--f-hit-min); min-height: var(--f-hit-min); border: 0; border-radius: 0; color: var(--f-icon);
  background: var(--f-control) center/234.375% 234.375% no-repeat; box-shadow: none; text-shadow: none;
}
body.ui-figma :is(.side-x,.menu__back,.nm-nav)::before, body.ui-figma :is(.side-x,.menu__back,.nm-nav)::after { content: none; }
body.ui-figma :is(.menu,.set-ov,.shop,.book-ov,.node-modal,.world-modal,.prof-ov,.bst-modal,.param-pop,.defeat-ov,.victory-ov) {
  background: var(--f-window-surface);
}
body.ui-figma :is(.u-btn-primary,.u-btn-secondary,.dev-btn,.brief__start,.si-btn,.set-btn,.boss-card__btn,.defeat-btn,.victory-btn,.gameover-btn,.f-button,.f-main-button):not(:disabled):not([aria-disabled="true"]):active { --f-button-image: var(--f-button-pressed); transform: translateY(var(--f-press-offset)); }

body.ui-figma .f-icon-button { width: var(--f-control-size); height: var(--f-control-size); display: flex; align-items: center; justify-content: center; border: 0; border-radius: 0; background: var(--f-control) center/234.375% 234.375%; color: var(--f-icon); }
/* Icon controls keep positional transforms owned by their screen (for example centered arrows). */
body.ui-figma :is(.f-icon-button,.side-x,.set-hdr__close,.shop__close,.menu__back,.map__zoom,.map-tools__toggle,.nm-nav,.wm-x,.np-x,.info-x,.speed-btn,.map-tools__items .gear-btn) { transition: filter var(--f-state-duration); }
body.ui-figma :is(.f-icon-button,.side-x,.set-hdr__close,.shop__close,.menu__back,.map__zoom,.map-tools__toggle,.nm-nav,.wm-x,.np-x,.info-x,.speed-btn,.map-tools__items .gear-btn):not(:disabled):not([aria-disabled="true"]):is(:hover,:active) { filter: brightness(var(--f-hover-brightness)); }
body.ui-figma :is(.f-icon-button,.side-x,.set-hdr__close,.shop__close,.menu__back,.map__zoom,.map-tools__toggle,.nm-nav,.wm-x,.np-x,.info-x,.speed-btn,.map-tools__items .gear-btn):is(:disabled,[aria-disabled="true"]) { opacity: var(--f-disabled-opacity); filter: saturate(.25); cursor: default; }

/* Page 2 state art uses the same owner as the normal action. */
body.ui-figma :is(.u-btn-primary,.u-btn-secondary,.dev-btn,.brief__start,.si-btn,.set-btn,.boss-card__btn,.defeat-btn,.victory-btn,.gameover-btn,.f-button):focus-visible:not(:disabled):not([aria-disabled="true"]) { background-image: var(--f-button-focus); }
body.ui-figma :is(.u-btn-primary,.u-btn-secondary,.dev-btn,.brief__start,.si-btn,.set-btn,.boss-card__btn,.defeat-btn,.victory-btn,.gameover-btn,.f-button):active:not(:disabled):not([aria-disabled="true"]) { background-image: var(--f-button-pressed); }
body.ui-figma :is(.u-btn-primary,.u-btn-secondary,.dev-btn,.brief__start,.si-btn,.set-btn,.boss-card__btn,.defeat-btn,.victory-btn,.gameover-btn,.f-button):is(:disabled,[aria-disabled="true"]) { background-image: var(--f-button-disabled); }

/* Shared release notes reuse the menu action material in their own row. */
body.ui-figma .gamefirst-updates .f-main-button { padding: 0 12px; display: flex; align-items: center; justify-content: center; min-width: 0; }