/* Dynamic extensions only. Macro geometry and responsive surface ownership
   come from the canonical ../static-match/static-match.css contract. */
#sigilfront-play-vs-ai[data-ready="true"] > .sf-review-loading { display: none; }

.sf-authoritative-match-screen .sf-squad-card[role="button"] { cursor: pointer; }
.sf-authoritative-match-screen .sf-squad-card[role="button"]:focus-visible,
.sf-authoritative-match-screen .sf-tile[role="button"]:focus-visible,
.sf-authoritative-match-screen button:focus-visible { outline: 2px solid rgba(112, 189, 210, .76); outline-offset: -2px; }
.sf-authoritative-match-screen .sf-squad-card.is-defeated { filter: grayscale(.82) brightness(.48); }
.sf-authoritative-match-screen .sf-squad-card.is-defeated::after { border-bottom-color: #4b5152; }

.sf-authoritative-match-screen .sf-tile[data-legal-target="true"] { cursor: pointer; }
.sf-authoritative-match-screen .sf-tile.is-occupied-player,
.sf-authoritative-match-screen .sf-tile.is-occupied-ai { cursor: pointer; }
.sf-authoritative-match-screen .sf-command-footer { pointer-events: auto; }
.sf-authoritative-match-screen .sf-action:not(:disabled),
.sf-authoritative-match-screen .sf-turn-control:not(:disabled) { cursor: pointer; }
.sf-authoritative-match-screen .sf-turn-control:not(.is-unavailable) {
  color: #d8edf3;
  border-color: #537d8d;
  background: linear-gradient(180deg, #142b34, #081216);
  box-shadow: inset 0 1px rgba(224, 248, 255, .12), inset 2px 0 #4d9bb2, 0 3px 8px rgba(0, 0, 0, .58);
}
.sf-authoritative-match-screen .sf-turn-control-primary.is-unavailable {
  color: #596168;
  border-color: #171c21;
  background: linear-gradient(180deg, #0a0d10, #050709);
  box-shadow: inset 0 1px rgba(255, 255, 255, .025), 0 2px 6px rgba(0, 0, 0, .56);
}
.sf-authoritative-match-screen .sf-turn-control-quiet:not(.is-unavailable) {
  color: #b8d5de;
  border-color: #406675;
}
.sf-authoritative-match-screen .sf-action,
.sf-authoritative-match-screen .sf-action * {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
.sf-authoritative-match-screen .sf-message-current {
  /* One-step type increase only: the frozen strip remains single-line,
     overflow-clipped, and retains its original grid geometry. */
  font-size: clamp(.36rem, 1.43cqw, .78rem);
}
.sf-authoritative-match-screen .sf-action.is-unavailable { opacity: .44; filter: saturate(.6); }
.sf-authoritative-match-screen .sf-action.is-active { border-color: #6b8790; box-shadow: inset 0 0 0 1px rgba(112, 189, 210, .25), 0 0 7px rgba(71, 143, 162, .18); }
.sf-authoritative-match-screen.is-authority-busy .sf-board { cursor: progress; }

.sf-authoritative-match-screen .sf-unit::before { display: none; }
.sf-authoritative-match-screen .sf-unit > .sf-unit-art-stage {
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: visible;
  contain: layout style;
  isolation: isolate;
  transform: translate3d(0, 0, 0);
  transform-origin: center bottom;
  backface-visibility: hidden;
  transition: opacity 150ms ease, filter 150ms ease;
}
.sf-authoritative-match-screen .sf-unit.is-spent > .sf-unit-art-stage {
  opacity: .52;
  filter: grayscale(1) saturate(.18) brightness(.68) contrast(.9);
}
.sf-authoritative-match-screen .sf-unit > .sf-unit-art-stage::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 23%;
  right: 23%;
  bottom: 5%;
  height: 17%;
  border-radius: 50%;
  background: rgba(0, 0, 0, .52);
  filter: blur(3px);
}
.sf-authoritative-match-screen .sf-unit-art:not(.is-active) {
  visibility: hidden;
  opacity: 0 !important;
  pointer-events: none;
}
.sf-authoritative-match-screen .sf-unit.is-inspected .sf-unit-art.is-active {
  filter: drop-shadow(0 4px 3px rgba(0, 0, 0, .7)) drop-shadow(0 0 5px rgba(221, 91, 96, .52));
}
.sf-authoritative-match-screen.is-inspection-only .sf-action { opacity: .5; cursor: default; }
.sf-authoritative-match-screen.is-inspection-only .sf-action-info { opacity: 1; cursor: pointer; }

.sf-authoritative-unit-guard {
  position: absolute;
  z-index: 23;
  right: 12%;
  top: 18%;
  padding: 1px 3px;
  border: 1px solid rgba(91, 201, 255, .5);
  border-radius: 2px;
  color: #83cfe8;
  background: rgba(4, 16, 22, .84);
  font-size: clamp(.26rem, .72cqw, .48rem);
  line-height: 1;
  pointer-events: none;
}
.sf-authoritative-focus-statuses { position: absolute; z-index: 6; left: 4%; bottom: 5%; display: grid; gap: 2px; max-width: 92%; }
.sf-authoritative-status { overflow: hidden; padding: 1px 3px; border: 1px solid #34444a; color: #9bb0b5; background: rgba(4, 10, 13, .86); font-size: clamp(.24rem, .66cqw, .46rem); letter-spacing: .04em; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.sf-authoritative-status-guard { border-color: rgba(91, 201, 255, .45); color: #83cfe8; }
.sf-authoritative-status-warning { border-color: rgba(238, 114, 94, .45); color: #cf8174; }
.sf-authoritative-status-ultimate { border-color: rgba(216, 184, 109, .48); color: #cdb67c; }

.sf-authoritative-mine {
  position: absolute;
  z-index: 9;
  left: 50%;
  top: 50%;
  width: 24%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%) rotate(45deg);
  border: 1px solid rgba(206, 158, 91, .72);
  background: radial-gradient(circle, #b76f3e 0 18%, #38261b 20% 48%, #111 50%);
  box-shadow: 0 0 6px rgba(176, 94, 48, .3);
  pointer-events: none;
}
.sf-authoritative-mine::after { content: ""; position: absolute; inset: 26%; border: 1px solid rgba(255, 206, 123, .66); border-radius: 50%; }
.sf-mine-ai { filter: hue-rotate(325deg); }

.sf-authoritative-zone {
  position: absolute;
  z-index: 8;
  inset: 9%;
  border: 1px dashed rgba(213, 108, 81, .76);
  border-radius: 4px;
  background: repeating-linear-gradient(135deg, rgba(165, 59, 45, .16) 0 4px, rgba(165, 59, 45, .03) 4px 8px);
  box-shadow: inset 0 0 8px rgba(192, 71, 46, .2);
  pointer-events: none;
}

.sf-authoritative-result {
  --sf-result-color: #54d7ff;
  --sf-result-rgb: 84,215,255;
  position: absolute;
  z-index: 500;
  inset: 0;
  display: grid;
  place-items: center;
  padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
  overflow: auto;
  background:
    linear-gradient(90deg, transparent calc(50% - 1px), rgba(var(--sf-result-rgb), .09) 50%, transparent calc(50% + 1px)),
    linear-gradient(rgba(2, 9, 13, .91), rgba(1, 6, 9, .96)),
    radial-gradient(circle at 50% 42%, rgba(var(--sf-result-rgb), .14), transparent 48%);
  backdrop-filter: blur(5px);
  text-align: center;
}
.sf-authoritative-result:not([data-winner="player"]) { --sf-result-color: #ff5871; --sf-result-rgb: 255,88,113; }
.sf-result-panel {
  position: relative;
  width: min(92cqw, 1280px);
  padding: clamp(24px, 5cqw, 45px) clamp(20px, 5cqw, 42px) clamp(22px, 4cqw, 36px);
  border: 1px solid var(--sf-result-color);
  clip-path: polygon(32px 0, calc(100% - 32px) 0, 100% 32px, 100% calc(100% - 32px), calc(100% - 32px) 100%, 32px 100%, 0 calc(100% - 32px), 0 32px);
  background: radial-gradient(ellipse 75% 45% at 50% 0, rgba(var(--sf-result-rgb), .12), transparent 72%), linear-gradient(165deg, rgba(7, 25, 34, .98), rgba(2, 9, 13, .99));
  box-shadow: inset 0 1px rgba(255,255,255,.14), 0 0 46px rgba(var(--sf-result-rgb), .16), 0 26px 70px #000d;
}
.sf-result-panel::before,.sf-result-panel::after { content:""; position:absolute; left:32px; right:32px; height:2px; background:linear-gradient(90deg,transparent,var(--sf-result-color),transparent); box-shadow:0 0 11px rgba(var(--sf-result-rgb),.48); }
.sf-result-panel::before { top:0; }.sf-result-panel::after { bottom:0; }
.sf-result-emblem { position:relative; display:grid; place-items:center; width:72px; height:72px; margin:0 auto 14px; transform:rotate(45deg); border:3px solid var(--sf-result-color); box-shadow:0 0 18px rgba(var(--sf-result-rgb),.55),inset 0 0 18px rgba(var(--sf-result-rgb),.18); }
.sf-result-emblem i:first-child { position:absolute; inset:12px; border:1px solid color-mix(in srgb,var(--sf-result-color) 70%,white); }
.sf-result-emblem i:nth-child(2) { width:34px; height:34px; border-radius:50%; background:rgba(var(--sf-result-rgb),.28); box-shadow:0 0 14px rgba(var(--sf-result-rgb),.42); }
.sf-result-emblem b { position:absolute; width:15px; height:15px; border-radius:50%; background:var(--sf-result-color); box-shadow:0 0 12px var(--sf-result-color); }
.sf-result-title { display:block; color:var(--sf-result-color); font:700 clamp(2.45rem, 9cqw, 4.75rem)/1 "SigilFront Display",sans-serif; letter-spacing:.13em; text-indent:.13em; text-shadow:0 0 22px rgba(var(--sf-result-rgb),.28); }
.sf-result-reason { display:block; margin:20px 0 0; color:#dbe8ed; font:700 clamp(.85rem,2.5cqw,1.18rem)/1.35 system-ui,sans-serif; }
.sf-result-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:28px 0 0; }
.sf-result-stat { min-height:72px; display:grid; place-content:center; gap:7px; padding:9px; border:1px solid rgba(var(--sf-result-rgb),.52); background:#020a0f99; }
.sf-result-stat small { color:#7f9aa5; font:800 .62rem/1 system-ui,sans-serif; letter-spacing:.12em; }
.sf-result-stat b { color:#aeeaff; font:700 clamp(.72rem,2.2cqw,.98rem)/1.2 system-ui,sans-serif; }
.sf-result-actions { display:grid; grid-template-columns:minmax(160px,1fr); gap:12px; margin-top:30px; }
.sf-result-restart { min-height:62px; padding:12px 18px; border:1px solid var(--sf-result-color); clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px); color:#dff7ff; background:linear-gradient(180deg,rgba(var(--sf-result-rgb),.25),rgba(var(--sf-result-rgb),.09)); box-shadow:inset 0 1px #fff3,0 0 18px rgba(var(--sf-result-rgb),.15); font:700 clamp(.9rem,3cqw,1.25rem)/1 "SigilFront Display",sans-serif; letter-spacing:.12em; cursor:pointer; }
.sf-result-restart:hover { filter:brightness(1.18); }
.is-match-complete .sf-squad-region,.is-match-complete .sf-battlefield-region,.is-match-complete .sf-command-region { pointer-events:none; }

/* Phase-2C dynamic presentation.  These selectors are intentionally scoped
   to the functional review and do not alter the byte-frozen Phase-1 fixture. */
.sf-authoritative-match-screen .sf-battlefield-region,
.sf-authoritative-match-screen .sf-battlefield-frame,
.sf-authoritative-match-screen .sf-board-camera,
.sf-authoritative-match-screen .sf-board { overflow: visible; }
.sf-authoritative-match-screen .sf-board {
  /* Phase 2F: raise only the arena material by a few RGB steps.  Repeating
     the frozen material layers avoids filtering units, markers, or effects. */
  background:
    radial-gradient(72% 48% at 50% 8%, rgba(168, 159, 123, .064), transparent 70%),
    radial-gradient(60% 42% at 52% 108%, rgba(4, 8, 7, .46), transparent 72%),
    linear-gradient(118deg, transparent 0 37%, rgba(171, 162, 118, .022) 38%, transparent 39% 67%, rgba(0, 0, 0, .058) 68%, transparent 69%),
    linear-gradient(145deg, #37403b 0%, #2f3732 48%, #272f2b 100%);
}
.sf-authoritative-match-screen .sf-tile { z-index: auto; }
.sf-authoritative-match-screen .sf-wall { z-index: 32; }
.sf-authoritative-match-screen .sf-unit { z-index: 33; }
.sf-authoritative-match-screen .sf-unit-overhead { z-index: 44; }
.sf-vfx-layer {
  position: absolute;
  inset: 0;
  z-index: 35;
  overflow: visible;
  pointer-events: none;
}
.sf-authoritative-match-screen .sf-health {
  height: clamp(3px, .72cqw, 6px);
  border-color: rgba(143, 184, 145, .31);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .75);
}
.sf-authoritative-match-screen .sf-unit[data-hero="Bulwark"] .sf-unit-overhead { top: 6.4%; }
.sf-authoritative-match-screen .sf-unit[data-hero="Kaiza"] .sf-unit-overhead { top: 10.8%; }
.sf-authoritative-match-screen .sf-unit[data-hero="Scout"] .sf-unit-overhead { top: 11%; }
.sf-authoritative-match-screen .sf-unit-veil,
.sf-authoritative-match-screen .sf-authoritative-unit-guard { display: none; }

.sf-board-status-row {
  position: absolute;
  z-index: 60;
  left: 50%;
  bottom: calc(100% + 3px);
  display: flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  height: clamp(12px, 2.8cqw, 22px);
  gap: calc(3px * var(--sf-status-scale, 1));
  transform: translateX(-50%);
  transform-origin: center bottom;
  pointer-events: none;
}
.sf-board-status {
  position: relative;
  display: grid;
  flex: none;
  place-items: center;
  width: clamp(10px, 2.5cqw, 17px);
  height: clamp(10px, 2.5cqw, 17px);
  scale: var(--sf-status-scale, 1);
  color: #9fd9e9;
  font: 800 clamp(.3rem, .9cqw, .55rem)/1 system-ui, sans-serif;
  filter: drop-shadow(0 1px 2px #000) drop-shadow(0 0 2px rgba(54, 150, 181, .35));
}
.sf-board-status-guard {
  width: clamp(18px, 4.25cqw, 29px);
  height: clamp(20px, 4.65cqw, 33px);
  clip-path: polygon(50% 0, 94% 17%, 86% 67%, 50% 100%, 14% 67%, 6% 17%);
  background: linear-gradient(145deg, #a8e8ff, #54b9e8 48%, #216b96);
  color: #061017;
  text-shadow: 0 1px rgba(255, 255, 255, .42);
  transform: translateY(-4px);
}
.sf-board-status-guard b {
  font: 950 clamp(.65rem, 2.5cqw, 1.15rem)/1 system-ui, sans-serif;
  letter-spacing: -.055em;
  transform: translateY(-1px);
}
.sf-board-status-cooldown {
  width: clamp(12px, 2.75cqw, 19px);
  height: clamp(12px, 2.75cqw, 19px);
  border: 2px solid rgba(160, 101, 189, .82);
  border-radius: 50%;
  color: #efc7ff;
  background: rgba(18, 27, 30, .86);
  box-shadow: inset 0 0 3px rgba(221, 167, 244, .18), 0 1px 3px rgba(0, 0, 0, .78);
  transform: translateY(-7px);
}
.sf-board-status-cooldown b {
  font: 900 clamp(.44rem, 1.55cqw, .82rem)/1 system-ui, sans-serif;
  letter-spacing: -.035em;
}
.sf-board-status-disrupt {
  width: clamp(13px, 3.2cqw, 20px);
  height: clamp(13px, 3.2cqw, 20px);
  border: clamp(1px, .22cqw, 2px) solid #b86fda;
  border-radius: 1px;
  background: #1a0c20e8;
  box-shadow: 0 0 4px #9f47c36b;
  transform: translateY(-7px);
}
.sf-disrupt-status-mark { position: absolute; inset: 18%; display: block; }
.sf-disrupt-status-mark::before,
.sf-disrupt-status-mark::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 48%;
  height: clamp(1px, .25cqw, 2px);
  border-radius: 1px;
  background: #e6b4f5;
  box-shadow: 0 0 1px #f7dfff66;
}
.sf-disrupt-status-mark::before { left: 0; transform: translateY(-70%) rotate(-24deg); transform-origin: right center; }
.sf-disrupt-status-mark::after { right: 0; transform: translateY(-30%) rotate(24deg); transform-origin: left center; }
.sf-board-status-final-order { width:clamp(22px,5.4cqw,38px); height:clamp(22px,5.4cqw,38px); margin-inline:2px; transform:translateY(-5px); }
.sf-board-status-umbra { width:20px; height:19px; flex:0 0 20px; transform:translateY(-6px); color:#d99cff; }
.sf-umbra-knives-indicator { position:relative; width:20px; height:19px; display:block; flex:0 0 20px; filter:drop-shadow(0 1px 1px #000); }
.sf-umbra-knives-indicator::before,
.sf-umbra-knives-indicator::after {
  content:"";
  position:absolute;
  left:7px;
  top:-1px;
  width:6px;
  height:21px;
  clip-path:polygon(50% 0,78% 47%,64% 53%,100% 56%,100% 64%,62% 63%,61% 85%,76% 94%,50% 100%,24% 94%,39% 85%,38% 63%,0 64%,0 56%,36% 53%,22% 47%);
  background:linear-gradient(to bottom,#fff8ff 0%,#e9b8ff 35%,#cf72ff 52%,#742e9e 61%,#e49bff 67%,#702796 86%,#eec1ff 100%);
  transform:rotate(45deg);
  transform-origin:50% 56%;
}
.sf-umbra-knives-indicator::after { transform:rotate(-45deg); }
.sf-final-order-mark { position:relative; display:block; width:72%; height:72%; margin:14%; border:clamp(2px,.44cqw,3px) solid #ff626a; border-radius:50%; background:#1a090ba8; box-shadow:0 0 0 1px #170609,0 0 9px #ef344d,0 0 15px #ef344d6b; }
.sf-final-order-mark::before,.sf-final-order-mark::after { content:""; position:absolute; left:50%; top:50%; background:#ffd2d2; box-shadow:0 0 3px #fff7; transform:translate(-50%,-50%); }
.sf-final-order-mark::before { width:142%; height:clamp(1px,.2cqw,2px); }
.sf-final-order-mark::after { width:clamp(1px,.2cqw,2px); height:142%; }

.sf-overwatch-zone {
  position:absolute;
  z-index:9;
  left:50%; top:50%;
  width:112%; height:112%;
  transform:translate(-50%,-50%) scale(.94);
  pointer-events:none;
  opacity:.76;
  mix-blend-mode:screen;
  filter:brightness(1.38) saturate(.78) drop-shadow(0 0 5px rgba(245,27,40,.46));
  animation:sfOverwatchTripwirePulse 1.35s ease-in-out infinite;
}
.sf-overwatch-crosshair { display:block; width:100%; height:100%; object-fit:contain; }
@keyframes sfOverwatchTripwirePulse { 0%,100%{opacity:.7;transform:translate(-50%,-50%) scale(.94)} 50%{opacity:1;transform:translate(-50%,-50%) scale(1.02)} }

.sf-target-area,
.sf-authoritative-zone {
  position: absolute;
  z-index: 5;
  inset: 3%;
  border: 2px solid rgba(224, 139, 58, .9);
  border-radius: 0;
  background: repeating-linear-gradient(135deg, rgba(205, 117, 46, .2) 0 5px, rgba(70, 38, 24, .055) 5px 10px);
  box-shadow: inset 0 0 8px rgba(215, 126, 50, .25), 0 0 6px rgba(205, 114, 44, .2);
  pointer-events: none;
  animation: sfMortarTargetPulse 1.65s ease-in-out infinite;
  will-change: opacity, filter;
}
.sf-target-area {
  z-index: 5;
  inset: 3%;
  border: 2px solid rgba(224, 139, 58, .9);
  border-radius: 0;
  background: repeating-linear-gradient(135deg, rgba(205, 117, 46, .2) 0 5px, rgba(70, 38, 24, .055) 5px 10px);
  box-shadow: inset 0 0 8px rgba(215, 126, 50, .25), 0 0 6px rgba(205, 114, 44, .2);
}
.sf-target-area.is-center,
.sf-authoritative-zone.is-center { border-width: 2px; box-shadow: inset 0 0 8px rgba(215, 126, 50, .25), 0 0 6px rgba(205, 114, 44, .2); }
.sf-target-area-bombard.is-invalid {
  border-color: rgba(255, 74, 74, .96);
  background: repeating-linear-gradient(135deg, rgba(202, 42, 42, .25) 0 5px, rgba(68, 16, 16, .08) 5px 10px);
  box-shadow: inset 0 0 8px rgba(255, 55, 55, .32), 0 0 7px rgba(231, 43, 43, .32);
}
.sf-authoritative-zone.is-center::after {
  content: attr(data-responses-remaining);
  position: absolute;
  right: 4%;
  top: 4%;
  min-width: 1.35em;
  height: 1.35em;
  padding: 0 .14em;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 211, 143, .92);
  border-radius: 2px;
  background: rgba(36, 19, 13, .9);
  color: #ffe1b1;
  font: 900 clamp(.42rem, 1.45cqw, .76rem)/1 system-ui, sans-serif;
  text-shadow: 0 1px 1px #000;
  box-shadow: 0 0 5px rgba(224, 139, 58, .5);
}
.sf-target-area-saturation,
.sf-zone-saturation {
  border-color: rgba(177, 98, 229, .94);
  background: repeating-linear-gradient(135deg, rgba(150, 73, 204, .23) 0 5px, rgba(55, 28, 78, .065) 5px 10px);
  box-shadow: inset 0 0 8px rgba(174, 91, 225, .3), 0 0 7px rgba(159, 76, 213, .26);
}
@keyframes sfMortarTargetPulse {
  0%, 100% { opacity: .46; filter: brightness(.9); }
  50% { opacity: 1; filter: brightness(1.32); }
}

.sf-authoritative-match-screen .sf-unit.is-legal-target-pulse .sf-unit-art.is-active {
  animation: sfLegalEnemyTargetPulse 1.55s ease-in-out infinite;
  will-change: opacity, filter;
}
@keyframes sfLegalEnemyTargetPulse {
  0%, 100% { opacity: 1; filter: none; }
  50% { opacity: .58; filter: brightness(1.18) contrast(1.035) saturate(1.06) drop-shadow(0 0 4px rgba(51, 226, 239, .72)) drop-shadow(0 0 8px rgba(28, 160, 178, .42)); }
}

.sf-authoritative-match-screen .sf-tile.is-occupied::after {
  border-radius: 6px;
  filter: blur(.2px);
}
.sf-authoritative-match-screen .sf-tile.is-occupied-player::after {
  border-color: rgba(64, 145, 174, .62);
  box-shadow: inset 0 0 8px rgba(50, 127, 152, .11), 0 0 3px rgba(50, 127, 152, .22), 0 0 7px rgba(50, 127, 152, .1);
}
.sf-authoritative-match-screen .sf-tile.is-occupied-ai::after {
  border-color: rgba(181, 80, 90, .61);
  box-shadow: inset 0 0 8px rgba(169, 79, 88, .105), 0 0 3px rgba(169, 79, 88, .21), 0 0 7px rgba(169, 79, 88, .1);
}
.sf-authoritative-match-screen .sf-tile.is-move-target .sf-move-marker { z-index: 22; }
.sf-authoritative-match-screen .sf-tile.is-dash-target .sf-move-marker.sf-dash-target-marker {
  width: 24%;
  border: 1px solid rgba(221, 168, 255, .9);
  border-radius: 2px;
  background: linear-gradient(145deg, rgba(183, 101, 232, .94), rgba(104, 49, 151, .94));
  box-shadow: inset 0 0 4px rgba(250, 222, 255, .28), 0 0 7px rgba(170, 79, 222, .48);
  transform: translate(-50%, -50%) rotate(45deg);
}
.sf-unit.is-last-bastion-ally-preview .sf-unit-art-stage { filter:drop-shadow(0 0 7px rgba(91,201,255,.82)); }
.sf-unit.is-last-bastion-enemy-preview .sf-unit-art-stage { filter:drop-shadow(0 0 7px rgba(232,151,80,.8)); }
.sf-unit.is-last-bastion-blocked-preview .sf-unit-art-stage { filter:drop-shadow(0 0 7px rgba(229,77,77,.9)); }
.sf-last-bastion-push-preview {
  position:absolute;
  z-index:23;
  left:50%;
  top:50%;
  width:34%;
  aspect-ratio:1;
  transform:translate(-50%,-50%) rotate(45deg);
  border:clamp(1px,.26cqw,2px) solid #d8bd7d;
  background:rgba(111,82,42,.42);
  box-shadow:0 0 7px rgba(217,177,91,.58);
  pointer-events:none;
}
.sf-last-bastion-push-preview i { position:absolute; inset:28%; border-top:2px solid #ffe0a0; border-right:2px solid #ffe0a0; }
.sf-last-bastion-push-preview.is-blocked { border-color:#e77272; background:rgba(112,34,34,.45); box-shadow:0 0 7px rgba(230,75,75,.68); }
.sf-last-bastion-push-preview.is-blocked i { inset:20%; border:0; transform:rotate(-45deg); }
.sf-last-bastion-push-preview.is-blocked i::before,
.sf-last-bastion-push-preview.is-blocked i::after { content:""; position:absolute; left:50%; top:50%; width:130%; height:2px; background:#ffd0d0; transform:translate(-50%,-50%) rotate(45deg); }
.sf-last-bastion-push-preview.is-blocked i::after { transform:translate(-50%,-50%) rotate(-45deg); }
.sf-authoritative-match-screen .sf-wall-attack-marker {
  background: rgba(202, 82, 78, .88);
  box-shadow: 0 0 7px rgba(185, 68, 64, .55);
}
.sf-authoritative-match-screen .sf-tile.is-mine-target .sf-move-marker.sf-mine-target-marker {
  z-index: 5;
  inset: 5%;
  width: auto;
  height: auto;
  aspect-ratio: auto;
  transform: none;
  border: 2px solid rgba(224, 139, 58, .9);
  border-radius: 0;
  background: repeating-linear-gradient(135deg, rgba(205, 117, 46, .2) 0 5px, rgba(70, 38, 24, .055) 5px 10px);
  box-shadow: inset 0 0 8px rgba(215, 126, 50, .25), 0 0 6px rgba(205, 114, 44, .2);
}
.sf-authoritative-match-screen .sf-tile.is-mine-target .sf-move-marker.sf-mine-target-marker::before,
.sf-authoritative-match-screen .sf-tile.is-mine-target .sf-move-marker.sf-mine-target-marker::after { content: none; }

.sf-authoritative-mine {
  position: absolute;
  z-index: 5;
  inset: 4%;
  display: grid;
  place-items: center;
  width: auto;
  aspect-ratio: auto;
  transform: none;
  border: 2px solid rgba(225, 142, 70, .76);
  border-radius: 5px;
  background: repeating-linear-gradient(135deg, rgba(183, 90, 40, .2) 0 5px, rgba(71, 35, 24, .05) 5px 10px);
  box-shadow: inset 0 0 9px rgba(194, 98, 42, .25), 0 0 6px rgba(176, 94, 48, .18);
  pointer-events: none;
}
.sf-authoritative-mine::after { content: none; }
.sf-authoritative-mine.is-oldest-replacement {
  border-color: rgba(232, 91, 72, .94);
  box-shadow: inset 0 0 10px rgba(224, 73, 57, .32), 0 0 9px rgba(224, 73, 57, .48);
  animation: sfMineReplacementPulse .8s ease-in-out infinite alternate;
}
@keyframes sfMineReplacementPulse { to { filter: brightness(1.28); } }
.sf-authoritative-mine-glyph {
  display: grid;
  place-items: center;
  width: 40%;
  aspect-ratio: 1;
  border: 1px solid #d79a58;
  border-radius: 50%;
  color: #e0a65d;
  background: radial-gradient(circle, #472719 0 33%, #17110d 37% 67%, #050504 70%);
  font: 800 clamp(.45rem, 1.8cqw, .95rem)/1 system-ui;
  box-shadow: 0 0 7px rgba(209, 112, 45, .45);
}
.sf-mine-ai { filter: hue-rotate(325deg) saturate(.8); }

.sf-authoritative-match-screen .sf-well.is-empty,
.sf-authoritative-match-screen .sf-well.is-recharging { --well-fill: #737872; opacity: .82; filter: saturate(.25) brightness(.78); }
.sf-well-recharge-count {
  position: absolute;
  z-index: 12;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: #202628;
  font: 900 clamp(.46rem, 1.8cqw, .9rem)/1 system-ui, sans-serif;
  letter-spacing: -.06em;
  pointer-events: none;
}
.sf-terrain-info-button {
  position: absolute;
  z-index: 75;
  right: 3px;
  top: 3px;
  display: grid;
  place-items: center;
  width: clamp(11px, 2.35cqw, 17px);
  height: clamp(11px, 2.35cqw, 17px);
  padding: 0;
  border: 1px solid rgba(107, 151, 164, .34);
  border-radius: 50%;
  color: rgba(163, 199, 207, .68);
  background: rgba(5, 12, 15, .72);
  font: 700 clamp(.34rem, .9cqw, .54rem)/1 system-ui;
  cursor: help;
}
.sf-wall > .sf-terrain-info-button { right: 1px; top: 50%; width: 10px; height: 10px; transform: translateY(-50%); opacity: .08; }
.sf-wall:hover > .sf-terrain-info-button,
.sf-wall > .sf-terrain-info-button:focus-visible { opacity: .82; }

/* Top-row art may cross the board's paint boundary so the frozen squad banner
   cannot crop a back-row hero.  Geometry and hit cells remain unchanged. */
.sf-authoritative-match-screen .sf-top-row-unit-safe .sf-unit-art { top: 4.6875%; }
.sf-authoritative-match-screen .sf-top-row-unit-safe .sf-unit-overhead { top: 8.5%; }
.sf-authoritative-match-screen .sf-top-row-unit-safe .sf-unit[data-hero="Bulwark"] .sf-unit-overhead { top: 6.4%; }
.sf-authoritative-match-screen .sf-top-row-unit-safe .sf-unit[data-hero="Kaiza"] .sf-unit-overhead { top: 10.8%; }
.sf-authoritative-match-screen .sf-top-row-unit-safe .sf-unit[data-hero="Scout"] .sf-unit-overhead { top: 11%; }

.sf-unit.is-authoritative-moving > .sf-unit-art-stage {
  animation: sfAuthoritativeTraverse var(--sf-move-duration, 320ms) cubic-bezier(.22, .76, .25, 1) both;
  will-change: transform;
}
@keyframes sfAuthoritativeTraverse {
  from { transform: translate(var(--sf-move-x, 0), var(--sf-move-y, 0)); }
  to { transform: translate(0, 0); }
}

.sf-damage-number {
  position: absolute;
  z-index: 82;
  left: 50%;
  top: -32%;
  color: #fff1e7;
  font: 900 clamp(.62rem, 2.8cqw, 1.4rem)/1 "SigilFront Display", system-ui, sans-serif;
  letter-spacing: -.035em;
  text-shadow: 0 1px 2px #170302, 0 0 5px rgba(255, 55, 45, .9);
  pointer-events: none;
  will-change: transform, opacity;
  animation: sfDamageNumber 560ms cubic-bezier(.16, .72, .28, 1) both;
}
@keyframes sfDamageNumber {
  0% { opacity: 0; transform: translate(-50%, 5px) scale(.78); }
  16% { opacity: 1; transform: translate(-50%, 0) scale(1.08); }
  62% { opacity: 1; transform: translate(-50%, -9px) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -17px) scale(.96); }
}
@media (prefers-reduced-motion: reduce) {
  .sf-damage-number { animation-duration: 320ms; }
}

.sf-dash-vfx {
  position: absolute;
  z-index: 36;
  inset: 0;
  overflow: visible;
  pointer-events: none;
}
.sf-dash-line {
  position: absolute;
  left: var(--sf-dash-left);
  top: var(--sf-dash-top);
  width: var(--sf-dash-length);
  height: clamp(3px, 1.75cqw, 13px);
  transform: translateY(-50%) rotate(var(--sf-dash-angle)) scaleX(.15);
  transform-origin: left center;
  background: linear-gradient(180deg, transparent, rgba(238, 203, 255, .92) 42%, #ae57ec 54%, rgba(93, 24, 137, .16) 100%);
  box-shadow: 0 0 6px #b457f0, 0 0 12px rgba(142, 55, 201, .72);
  animation: sfDashLine 520ms cubic-bezier(.2, .8, .3, 1) both;
}
.sf-dash-mote {
  position: absolute;
  width: clamp(5px, 1.9cqw, 14px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, #fff 0 12%, #d89bff 15% 35%, rgba(147, 53, 205, .3) 38% 67%, transparent 70%);
  box-shadow: 0 0 7px #b75cf0;
  animation: sfDashMote 620ms var(--sf-dash-delay) ease-out both;
}
@keyframes sfDashLine {
  0% { opacity: 0; transform: translateY(-50%) rotate(var(--sf-dash-angle)) scaleX(.15); }
  22% { opacity: 1; transform: translateY(-50%) rotate(var(--sf-dash-angle)) scaleX(1); }
  100% { opacity: 0; transform: translateY(-50%) rotate(var(--sf-dash-angle)) scaleX(1); }
}
@keyframes sfDashMote {
  from { opacity: .95; transform: translate(-50%, -50%) scale(.45); }
  to { opacity: 0; transform: translate(-50%, -120%) scale(1.2); }
}

/* Effective-final Bulwark Shieldquake presentation: three ground rings plus
   eight short shock lances, driven only by an accepted authoritative cue. */
.sf-shieldquake-vfx {
  position: absolute;
  z-index: 42;
  inset: 0;
  overflow: visible;
  pointer-events: none;
}
.sf-shieldquake-ring {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(.12);
  opacity: 0;
}
.sf-shieldquake-dust {
  background: radial-gradient(circle, transparent 0 52%, rgba(216, 191, 153, .34) 68%, transparent 84%);
  animation: sfShieldquakeDust 760ms cubic-bezier(.12, .75, .3, 1) both;
}
.sf-shieldquake-shock {
  border: clamp(2px, .72cqw, 5px) solid #ffd9a8;
  box-shadow: 0 0 8px rgba(255, 179, 92, .67), inset 0 0 7px rgba(255, 157, 68, .4);
  animation: sfShieldquakeShock 600ms cubic-bezier(.12, .75, .3, 1) both;
}
.sf-shieldquake-guard {
  border: clamp(1px, .48cqw, 3px) solid #8fdcff;
  box-shadow: 0 0 8px rgba(108, 201, 255, .6), inset 0 0 6px rgba(108, 201, 255, .27);
  animation: sfShieldquakeGuard 620ms 130ms cubic-bezier(.12, .75, .3, 1) both;
}
.sf-shieldquake-lance {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 115%;
  height: clamp(2px, 1.1cqw, 8px);
  border-radius: 2px;
  transform: translateY(-50%) rotate(var(--sf-quake-angle)) scaleX(.1);
  transform-origin: 0 50%;
  background: linear-gradient(90deg, rgba(255, 217, 168, .8), rgba(255, 171, 89, .4) 60%, transparent);
  box-shadow: 0 0 5px rgba(255, 180, 92, .46);
  animation: sfShieldquakeLance 480ms cubic-bezier(.1, .8, .3, 1) both;
}
@keyframes sfShieldquakeDust {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.2); }
  25% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.55); }
}
@keyframes sfShieldquakeShock {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.15); }
  25% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.35); }
}
@keyframes sfShieldquakeGuard {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.1); }
  25% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.15); }
}
@keyframes sfShieldquakeLance {
  0% { opacity: 0; transform: translateY(-50%) rotate(var(--sf-quake-angle)) scaleX(.1); }
  30% { opacity: .9; transform: translateY(-50%) rotate(var(--sf-quake-angle)) scaleX(.6); }
  100% { opacity: 0; transform: translateY(-50%) rotate(var(--sf-quake-angle)) scaleX(1); }
}

.sf-ultimate-cast {
  --sf-ult-color: #fff;
  --sf-ult-rgb: 255,255,255;
  position: absolute;
  z-index: 160;
  left: 50%;
  top: 50%;
  width: 405%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  border-radius: 50%;
  pointer-events: none;
  animation: sfUltimateCast .92s ease-out both;
}
.sf-ultimate-cast[data-hero="kaiza"] { --sf-ult-color: #ae64ff; --sf-ult-rgb: 174,100,255; }
.sf-ultimate-cast[data-hero="mortar"] { --sf-ult-color: #66d875; --sf-ult-rgb: 102,216,117; }
.sf-ultimate-cast[data-hero="bulwark"] { --sf-ult-color: #f4c14f; --sf-ult-rgb: 244,193,79; }
.sf-ultimate-cast[data-hero="deadeye"] { --sf-ult-color: #ff5a5e; --sf-ult-rgb: 255,90,94; }
.sf-ultimate-surge { position: absolute; inset: 16%; border: 2px solid var(--sf-ult-color); border-radius: 50%; box-shadow: 0 0 14px rgba(var(--sf-ult-rgb), .7), inset 0 0 18px rgba(var(--sf-ult-rgb), .28); animation: sfUltimateSurge .85s ease-out both; }
.sf-ultimate-signature { position: absolute; inset: 27%; border: 2px solid var(--sf-ult-color); border-radius: 50%; box-shadow: 0 0 10px var(--sf-ult-color); animation: sfUltimateSignature .78s ease-out both; }
.sf-ultimate-cast > strong { position: absolute; top: 80%; color: #f4f5f1; font: 700 clamp(.35rem, 1cqw, .62rem)/1 "SigilFront Display", sans-serif; letter-spacing: .1em; text-shadow: 0 1px 4px #000, 0 0 6px var(--sf-ult-color); white-space: nowrap; }
.sf-ultimate-cast[data-hero="kaiza"] .sf-ultimate-signature { border: 0; }
.sf-ultimate-cast[data-hero="kaiza"] .sf-ultimate-signature i { position: absolute; left: 50%; top: 0; width: 3px; height: 100%; background: linear-gradient(#fff, var(--sf-ult-color), transparent); box-shadow: 0 0 7px var(--sf-ult-color); transform: rotate(-31deg); }
.sf-ultimate-cast[data-hero="kaiza"] .sf-ultimate-signature i:nth-child(2) { transform: rotate(0); }
.sf-ultimate-cast[data-hero="kaiza"] .sf-ultimate-signature i:nth-child(3) { transform: rotate(31deg); }
.sf-ultimate-cast[data-hero="mortar"] .sf-ultimate-signature { border-radius: 2px; background: repeating-linear-gradient(0deg, transparent 0 24%, rgba(var(--sf-ult-rgb), .4) 25% 27%, transparent 28% 49%), repeating-linear-gradient(90deg, transparent 0 24%, rgba(var(--sf-ult-rgb), .4) 25% 27%, transparent 28% 49%); }
.sf-ultimate-cast[data-hero="bulwark"] .sf-ultimate-signature { border-radius: 0; background: rgba(var(--sf-ult-rgb), .38); clip-path: polygon(50% 0, 91% 18%, 86% 68%, 50% 100%, 14% 68%, 9% 18%); }
.sf-ultimate-cast[data-hero="deadeye"] .sf-ultimate-signature { border:0; box-shadow:none; }
.sf-deadeye-ultimate-crosshair { display:block; width:100%; height:100%; object-fit:contain; filter:brightness(1.5) saturate(.8) drop-shadow(0 0 10px var(--sf-ult-color)); animation:sfDeadeyeLockFlash .5s steps(2,end) 2; }
@keyframes sfDeadeyeLockFlash { 0%,100%{opacity:.5;transform:scale(.82)} 50%{opacity:1;transform:scale(1.08)} }
.sf-unit.is-ultimate-casting > .sf-unit-art-stage { animation: sfUltimateCasterPulse .38s ease-out both; }
@keyframes sfUltimateCasterPulse {
  0%,100% { transform: scale(1); filter: none; }
  35% { transform: scale(1.14); filter: brightness(1.3) drop-shadow(0 0 6px #ffe49a); }
}
.sf-saturation-ultimate-impact,
.sf-umbra-ultimate-impact {
  position: absolute;
  z-index: 175;
  left: 50%;
  top: 50%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.sf-saturation-ultimate-impact { width: 505%; }
.sf-saturation-ultimate-impact > i { position: absolute; inset: 0; }
.sf-saturation-impact-grid {
  border: 1px solid rgba(144, 255, 157, .8);
  background:
    repeating-linear-gradient(0deg, transparent 0 19%, rgba(119, 244, 135, .38) 20% 21%, transparent 22% 39%),
    repeating-linear-gradient(90deg, transparent 0 19%, rgba(119, 244, 135, .38) 20% 21%, transparent 22% 39%);
  box-shadow: inset 0 0 28px rgba(92, 220, 112, .28), 0 0 18px rgba(102, 216, 117, .42);
  animation: sfSaturationGrid .94s ease-out both;
}
.sf-saturation-impact-ring {
  inset: 12% !important;
  border: 4px solid #d9ff9d;
  border-radius: 50%;
  box-shadow: 0 0 18px #83e66e, inset 0 0 24px rgba(131, 230, 110, .6);
  animation: sfSaturationRing .78s ease-out both;
}
.sf-saturation-impact-flash {
  inset: 25% !important;
  border-radius: 50%;
  background: radial-gradient(circle, #fff8cf 0 8%, #b7ef6e 16%, rgba(93, 210, 105, .38) 42%, transparent 72%);
  animation: sfSaturationFlash .72s ease-out both;
}
@keyframes sfSaturationGrid { 0%{opacity:0;transform:scale(.72)} 18%,62%{opacity:1} 100%{opacity:0;transform:scale(1.03)} }
@keyframes sfSaturationRing { 0%{opacity:0;transform:scale(.1)} 22%{opacity:1} 100%{opacity:0;transform:scale(1.35)} }
@keyframes sfSaturationFlash { 0%{opacity:0;transform:scale(.2)} 16%{opacity:1} 100%{opacity:0;transform:scale(1.6)} }
.sf-umbra-ultimate-impact { width: 245%; }
.sf-umbra-ultimate-impact::before {
  content: "";
  position: absolute;
  inset: 18%;
  border: 2px solid #c58aff;
  border-radius: 50%;
  box-shadow: 0 0 20px #9c4cff, inset 0 0 18px rgba(156, 76, 255, .5);
  animation: sfUmbraImpactRing .72s ease-out both;
}
.sf-umbra-ultimate-impact > i {
  position: absolute;
  left: 50%;
  top: 2%;
  width: 6px;
  height: 96%;
  border-radius: 99px;
  background: linear-gradient(transparent, #fff 18%, #b064ff 48%, #fff 82%, transparent);
  box-shadow: 0 0 10px #a95cff;
  transform-origin: center;
  animation: sfUmbraImpactSlash .68s ease-out both;
}
.sf-umbra-ultimate-impact > i:first-child { transform: rotate(42deg); }
.sf-umbra-ultimate-impact > i:last-child { transform: rotate(-42deg); animation-delay: 70ms; }
@keyframes sfUmbraImpactRing { 0%{opacity:0;transform:scale(1.5)} 24%,58%{opacity:1} 100%{opacity:0;transform:scale(.45)} }
@keyframes sfUmbraImpactSlash { 0%{opacity:0;scale:1 0} 24%,68%{opacity:1;scale:1 1} 100%{opacity:0;scale:1.3 1.12} }
.sf-final-order-ultimate-shot {
  position: absolute;
  z-index: 180;
  left: var(--sf-shot-left);
  top: var(--sf-shot-top);
  width: var(--sf-shot-length);
  height: 3px;
  transform: translateY(-50%) rotate(var(--sf-shot-angle));
  transform-origin: 0 50%;
  border-radius: 99px;
  background: linear-gradient(90deg, #fff, #ff394d 18%, #ff172d 82%, #fff);
  box-shadow: 0 0 7px #ff2438, 0 0 15px rgba(255, 36, 56, .7);
  pointer-events: none;
  animation: sfFinalOrderShot .78s ease-out both;
}
.sf-final-order-ultimate-shot::after {
  content: "";
  position: absolute;
  right: -7px;
  top: 50%;
  width: 15px;
  height: 15px;
  transform: translateY(-50%);
  border: 2px solid #ff5363;
  border-radius: 50%;
  box-shadow: 0 0 12px #ff263c;
}
@keyframes sfFinalOrderShot { 0%{opacity:0;scale:0 1} 14%,64%{opacity:1;scale:1 1} 100%{opacity:0;scale:1 1} }
.sf-ultimate-vignette { position: absolute; z-index: 145; inset: 0; border: 1px solid rgba(255, 255, 255, .22); box-shadow: inset 0 0 80px rgba(255, 255, 255, .09); pointer-events: none; animation: sfUltimateVignette .78s ease-out both; }
@keyframes sfUltimateCast { 0% { opacity: 0; transform: translate(-50%, -50%) scale(.48); } 12%, 68% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, -50%) scale(1.12); } }
@keyframes sfUltimateSurge { from { opacity: 0; transform: scale(.24); } 32% { opacity: 1; } to { opacity: 0; transform: scale(1.24); } }
@keyframes sfUltimateSignature { from { opacity: 0; transform: scale(1.5) rotate(-12deg); } 36%, 70% { opacity: 1; } to { opacity: 0; transform: scale(1.1); } }
@keyframes sfUltimateVignette { from { opacity: 0; } 18% { opacity: 1; } to { opacity: 0; } }

@container sigilfront-surface (max-width:520px) {
  .sf-authoritative-result { padding:10px; }
  .sf-result-panel { width:min(96cqw,440px); padding:22px 14px 18px; clip-path:polygon(20px 0,calc(100% - 20px) 0,100% 20px,100% calc(100% - 20px),calc(100% - 20px) 100%,20px 100%,0 calc(100% - 20px),0 20px); }
  .sf-result-emblem { width:54px; height:54px; margin-bottom:10px; }
  .sf-result-reason { margin-top:12px; }
  .sf-result-stats { gap:5px; margin-top:18px; }
  .sf-result-stat { min-height:61px; padding:5px; }
  .sf-result-stat small { font-size:.48rem; }
  .sf-result-actions { margin-top:18px; }
  .sf-result-restart { min-height:50px; }
}

.sf-presentation-dialog {
  position: absolute;
  z-index: 300;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(2, 5, 6, .82);
  backdrop-filter: blur(5px);
  pointer-events: none;
}
.sf-presentation-dialog-card {
  position: relative;
  width: min(92%, 410px);
  padding: 20px 18px 17px;
  clip-path: polygon(14px 0, calc(100% - 14px) 0, 100% 14px, 100% calc(100% - 14px), calc(100% - 14px) 100%, 14px 100%, 0 calc(100% - 14px), 0 14px);
  border: 1px solid #40616d;
  background: radial-gradient(circle at 50% 0, rgba(91, 183, 220, .1), transparent 50%), linear-gradient(160deg, #15222a, #080d12 68%, #100c09);
  box-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 22px 60px #000, 0 0 24px rgba(75, 162, 193, .13);
  color: #eaf4f5;
  text-align: center;
  pointer-events: auto;
}
.sf-presentation-dialog h2 { margin: .35rem 0 .45rem; color: #e9f4f4; font: 650 1.05rem/1.05 "SigilFront Display", sans-serif; letter-spacing: .11em; text-transform: uppercase; }
.sf-dialog-meta { display: block; margin-bottom: .65rem; color: #a2bcc5; font-size: .63rem; letter-spacing: .05em; text-transform: uppercase; }
.sf-presentation-dialog p { margin: 0 auto 1rem; max-width: 32em; color: #bdd0d5; font-size: .75rem; line-height: 1.45; }
.sf-dialog-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 8px; }
.sf-dialog-actions button { min-height: 40px; border: 1px solid #38505a; color: #a9c2cb; background: #101b21; font: 650 .62rem/1 "SigilFront Display", sans-serif; letter-spacing: .1em; }
@property --sf-ultimate-confirm { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
.sf-ultimate-confirm-ring {
  --sf-ultimate-confirm: 0deg;
  position: absolute;
  z-index: 7;
  inset: 2px;
  padding: 2px;
  border-radius: 5px;
  opacity: 0;
  pointer-events: none;
  background: conic-gradient(from -90deg, #e4a8ff var(--sf-ultimate-confirm), transparent 0);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.sf-action-ultimate.holding .sf-ultimate-confirm-ring {
  opacity: 1;
  animation: sfUltimateHoldFill 720ms linear forwards;
}
@keyframes sfUltimateHoldFill { to { --sf-ultimate-confirm: 360deg; } }

/* Effective-final explanation language recovered from the local client and
   matched to the supplied Basic / Ability / Ultimate close references. */
.sf-explanation-card {
  position: relative;
  border: 1px solid #746453;
  border-radius: 4px;
  background: linear-gradient(145deg, rgba(23, 29, 32, .97), rgba(9, 13, 16, .97));
  box-shadow: inset 0 1px rgba(255, 255, 255, .05), 0 12px 28px rgba(0, 0, 0, .82);
  color: #e8e8e4;
  text-align: left;
}
.sf-explanation-card h2 {
  margin: 0 0 .48em;
  color: #f0e9d8;
  font: 650 clamp(.72rem, 2.45cqw, 1.35rem)/1.05 var(--sf-command-font);
  letter-spacing: .07em;
  text-transform: uppercase;
}
.sf-explanation-card .sf-dialog-meta {
  margin: 0 0 .7em;
  color: #ae95bc;
  font: 600 clamp(.48rem, 1.45cqw, .82rem)/1.2 var(--sf-command-font);
  letter-spacing: .055em;
  text-transform: none;
}
.sf-explanation-card p {
  margin: 0;
  max-width: none;
  color: #c8cdcc;
  white-space: pre-line;
  font: 520 clamp(.54rem, 1.62cqw, .92rem)/1.42 var(--sf-command-font);
  letter-spacing: .005em;
}
.sf-action-explanation {
  position: absolute;
  z-index: 310;
  left: 50%;
  top: 3.5%;
  width: min(92%, 760px);
  padding: clamp(12px, 3cqw, 26px);
  transform: translateX(-50%);
  pointer-events: none;
}
.sf-action-explanation[hidden] { display: none; }
.sf-action-explanation-basic,
.sf-popup-tone-basic { border-color: #74504b; }
.sf-action-explanation-basic .sf-dialog-meta,
.sf-popup-tone-basic .sf-dialog-meta { color: #d5968e; }
.sf-action-explanation-ultimate,
.sf-popup-tone-ultimate { border-color: #8c5bac; background: linear-gradient(145deg, rgba(26, 17, 34, .97), rgba(11, 10, 16, .98)); }
.sf-action-explanation-terrain,
.sf-popup-tone-terrain { border-color: #586f70; }

.sf-dialog-action-info,
.sf-dialog-action-info {
  inset: calc(var(--squad-height) + var(--board-side)) 0 0;
  align-items: flex-start;
  padding: 2.4% 3%;
  background: rgba(2, 5, 6, .18);
  backdrop-filter: none;
}
.sf-dialog-action-info .sf-presentation-dialog-card,
.sf-dialog-action-info .sf-presentation-dialog-card {
  width: min(94%, 760px);
  padding: clamp(14px, 3.3cqw, 28px);
  clip-path: none;
}
.sf-dialog-action-info .sf-dialog-actions,
.sf-dialog-terrain-info .sf-dialog-actions { position: absolute; right: 7px; top: 7px; display: block; }
.sf-dialog-terrain-info {
  inset: var(--squad-height) 0 auto;
  width: 100%;
  height: var(--board-side);
  padding: clamp(14px, 4cqw, 30px);
  place-items: center;
  background: rgba(2, 5, 6, .56);
  backdrop-filter: none;
}
.sf-dialog-terrain-info .sf-presentation-dialog-card {
  width: fit-content;
  min-width: min(62%, 240px);
  max-width: min(86%, 520px);
  height: auto;
  max-height: calc(100% - 28px);
  padding: clamp(16px, 4cqw, 30px);
  clip-path: none;
  overflow: auto;
  box-sizing: border-box;
  display: block;
}
.sf-dialog-action-info .sf-dialog-close,
.sf-dialog-terrain-info .sf-dialog-close {
  display: grid;
  place-items: center;
  width: 24px;
  min-height: 24px;
  padding: 0;
  border: 1px solid rgba(185, 178, 169, .3);
  border-radius: 50%;
  color: #bfc2bd;
  background: rgba(6, 9, 11, .7);
  font: 500 1rem/1 system-ui, sans-serif;
}

@container sigilfront-surface (max-width: 520px) {
  .sf-dialog-terrain-info { padding: clamp(10px, 3cqw, 18px); }
  .sf-dialog-terrain-info .sf-presentation-dialog-card {
    min-width: min(68%, 220px);
    max-width: 92%;
    max-height: calc(100% - 20px);
    padding: 18px 16px 16px;
  }
}
.sf-overdrive-actions { display: grid; gap: 7px; margin-top: .8rem; }
.sf-overdrive-actions strong { color: #c994eb; font-size: .58rem; letter-spacing: .1em; }
.sf-overdrive-actions button { min-height: 38px; border: 1px solid #795097; color: #e2bdf5; background: linear-gradient(180deg, #271731, #140c1b); font: 650 .58rem/1 "SigilFront Display", sans-serif; letter-spacing: .08em; }
.sf-overdrive-actions button:disabled { border-color: #354047; color: #6d777a; background: #101619; }

@media (prefers-reduced-motion: reduce) {
  .sf-unit.is-authoritative-moving > .sf-unit-art-stage,
  .sf-unit.is-ultimate-casting > .sf-unit-art-stage,
  .sf-ultimate-cast,
  .sf-ultimate-cast *,
  .sf-ultimate-vignette,
  .sf-saturation-ultimate-impact *,
  .sf-umbra-ultimate-impact,
  .sf-umbra-ultimate-impact *,
  .sf-final-order-ultimate-shot,
  .sf-action-ultimate.holding .sf-ultimate-confirm-ring,
  .sf-dash-vfx *,
  .sf-shieldquake-vfx * { animation-duration: 1ms !important; animation-iteration-count: 1 !important; }
}