/* Reader terminal visual system v7.
 * Architecture follows madeinmagius-site: one fixed CRT screen, one bounded
 * signal viewport, static physical glass geometry, and all UI inside the tube.
 * User-facing effect switches intentionally match MagiReader's smaller model.
 */
@font-face{
  font-family:'MagiCallPixelSC';
  src:url('./reader-fonts/fusion-pixel-12px-monospaced-zh_hans.woff2') format('woff2');
  font-style:normal;font-weight:400;font-display:swap;
}
@font-face{
  font-family:'MagiCallPixelJP';
  src:url('./reader-fonts/fusion-pixel-12px-monospaced-ja.woff2') format('woff2');
  font-style:normal;font-weight:400;font-display:swap;
}

:root{
  color-scheme:light;
  --call-bg:#d8d4c6;
  --call-field:#d8d4c6;
  --call-surface:#f3f4f4;
  --call-surface-soft:#e1e4e4;
  --call-surface-raised:#fbfcfc;
  --call-text:#283033;
  --call-muted:#667277;
  --call-border:#6d797c78;
  --call-border-strong:#58666a;
  --call-accent:#5c696c;
  --call-accent-strong:#354044;
  --call-accent-ink:#f7fbfb;
  --call-danger:#844b60;
  --call-focus:#2d7185;
  --call-card-bg:#f8f9f9;
  --call-card-text:#252b2d;
  --call-network-bg:#080c0d;
  --call-panel-shadow:inset 0 1px rgba(255,255,255,.55),0 3px 10px rgba(28,34,36,.11);
  --call-widget-shadow:0 5px 18px rgba(18,23,25,.24),inset 0 1px rgba(255,255,255,.3);
  --call-selected-shadow:0 0 5px rgba(80,105,110,.26);
  --call-sized-lead:rgba(255,252,225,.50);
  --call-sized-trail:rgba(69,154,244,.55);
  --call-ambient-glow:rgba(86,99,102,.08);
  --call-scan-opacity:.045;
  --call-day-grain-opacity:.18;
  --call-pixel-font:'MagiCallPixelSC','MagiCallPixelJP','MS Gothic',monospace;
  --call-pixel-font-jp:'MagiCallPixelJP','MagiCallPixelSC','MS Gothic',monospace;

  --magi-pink:var(--call-accent);
  --magi-pink-dark:var(--call-accent-strong);
  --magi-pale:var(--call-surface-soft);
  --magi-border:var(--call-border);
  --call-pink:var(--call-accent);
  --call-pale:var(--call-surface-soft);
  --suite-pink:var(--call-accent);
  --suite-pink-soft:var(--call-surface-soft);
  --suite-pink-dark:var(--call-accent-strong);
  --suite-border:var(--call-border);
  --suite-text:var(--call-text);
  --suite-muted:var(--call-muted);
  --v8-pink:var(--call-accent);
  --v8-pink-dark:var(--call-accent-strong);
  --v8-soft:var(--call-surface-soft);
  --v8-border:var(--call-border);
  --background-navbar:var(--call-surface-raised);
}
:root[data-call-theme="paper"]{
  --call-bg:#f3eacb;
  --call-field:
    radial-gradient(ellipse at 50% 12%,rgba(255,251,224,.46),transparent 63%),
    linear-gradient(rgba(92,70,37,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(92,70,37,.025) 1px,transparent 1px),
    #f3eacb;
  --call-surface:#f5ecd0;
  --call-surface-soft:#e7dab8;
  --call-surface-raised:#fff7de;
  --call-text:#3a3023;
  --call-muted:#736650;
  --call-border:#806e4b70;
  --call-border-strong:#715e3e;
  --call-accent:#755f3e;
  --call-accent-strong:#4f402b;
  --call-accent-ink:#fff7df;
  --call-focus:#765f38;
  --call-card-bg:#fff6da;
  --call-card-text:#342b20;
  --call-panel-shadow:inset 0 1px rgba(255,252,236,.7),0 4px 12px rgba(55,42,24,.1);
  --call-widget-shadow:0 5px 18px rgba(55,42,24,.20),inset 0 1px rgba(255,252,236,.65);
  --call-selected-shadow:0 0 7px rgba(126,99,52,.24);
  --call-day-grain-opacity:.20;
}
:root[data-call-theme="green"]{
  --call-bg:#d6e9c4;
  --call-field:
    radial-gradient(circle at 18% 14%,rgba(109,162,126,.12),transparent 29%),
    radial-gradient(circle at 82% 76%,rgba(73,133,103,.09),transparent 31%),
    #d6e9c4;
  --call-surface:#edf5e8;
  --call-surface-soft:#d1e3cf;
  --call-surface-raised:#f8fcf5;
  --call-text:#19382c;
  --call-muted:#547164;
  --call-border:#456d5980;
  --call-border-strong:#527d67;
  --call-accent:#40785d;
  --call-accent-strong:#285641;
  --call-accent-ink:#f5fff9;
  --call-focus:#23684f;
  --call-card-bg:#f4faef;
  --call-card-text:#18382b;
  --call-panel-shadow:inset 0 1px rgba(255,255,255,.52),0 4px 12px rgba(25,66,51,.1);
  --call-widget-shadow:0 5px 18px rgba(25,66,51,.20),inset 0 1px rgba(255,255,255,.42);
  --call-selected-shadow:0 0 8px rgba(63,118,91,.26);
  --call-day-grain-opacity:.18;
}

/* MagiReader night green. */
:root[data-call-theme="dark"]{
  color-scheme:dark;
  --call-bg:#000;
  --call-field:radial-gradient(ellipse 60vw 62vh at 51vw 46vh,#293922 0%,#1c2a17 40%,#10190c 72%,#030702 100%);
  --call-surface:#091006;
  --call-surface-soft:#12200e;
  --call-surface-raised:#0b1308;
  --call-text:#a7ff54;
  --call-muted:#8fbd70;
  --call-border:#879d6599;
  --call-border-strong:#b1dc83;
  --call-accent:#a7ff54;
  --call-accent-strong:#d3ff9f;
  --call-accent-ink:#091006;
  --call-focus:#d4ff9c;
  --call-danger:#8d5368;
  --call-card-bg:#091006;
  --call-card-text:#c2ff83;
  --call-network-bg:#020501;
  --call-panel-shadow:inset 0 1px rgba(209,255,164,.07),inset 0 -1px rgba(0,0,0,.60);
  --call-widget-shadow:0 0 0 1px #879d654f,0 0 10px #a7ff5414,inset 0 1px rgba(209,255,164,.07);
  --call-sized-lead:rgba(255,252,225,.50);
  --call-sized-trail:rgba(153,235,213,.48);
  --call-ambient-glow:rgba(166,247,82,.24);
  --call-selected-shadow:
    -1.15px 0 0 rgba(255,232,82,.58),
    1.35px 0 .35px rgba(52,249,22,.54),
    0 0 7px rgba(166,247,82,.62),
    0 0 16px rgba(105,235,76,.28);
  --call-scan-opacity:.28;
}
:root[data-call-theme="dark"][data-call-phosphor="amber"]{
  --call-field:radial-gradient(ellipse 60vw 62vh at 51vw 46vh,#433337 0%,#2c2024 40%,#190f13 72%,#070305 100%);
  --call-surface:#100a0d;
  --call-surface-soft:#21191b;
  --call-surface-raised:#150d10;
  --call-text:#fff077;
  --call-muted:#cab165;
  --call-border:#b9a05b99;
  --call-border-strong:#f1d36f;
  --call-accent:#fff077;
  --call-accent-strong:#fff6ad;
  --call-accent-ink:#100a0d;
  --call-focus:#fff6a2;
  --call-card-bg:#100a0d;
  --call-card-text:#ffe58c;
  --call-network-bg:#050203;
  --call-sized-lead:rgba(255,252,225,.50);
  --call-sized-trail:rgba(246,94,40,.52);
  --call-ambient-glow:rgba(255,166,55,.26);
  --call-selected-shadow:
    -1.15px 0 0 rgba(255,72,34,.68),
    1.35px 0 .35px rgba(255,250,198,.62),
    0 0 7px rgba(255,182,65,.66),
    0 0 16px rgba(255,104,45,.30);
  --call-scan-opacity:.42;
}

/* MagiReader cold film. Dirt/glass/wear belong to the theme itself. */
:root[data-call-theme="frost"]{
  color-scheme:dark;
  --call-bg:#00070c;
  --call-field:
    radial-gradient(ellipse 28vw 23vh at 76vw 35vh,rgba(12,107,109,.42),transparent 78%),
    radial-gradient(ellipse 23vw 38vh at 50vw 72vh,rgba(0,61,68,.35),transparent 76%),
    radial-gradient(ellipse 24vw 30vh at 40vw 24vh,rgba(0,5,14,.64),transparent 84%),
    linear-gradient(106deg,#010910 0%,#01101a 19%,#012029 45%,#012e34 74%,#001018 100%);
  --call-surface:#061a20;
  --call-surface-soft:#0b262c;
  --call-surface-raised:#071e25;
  --call-text:#c3d8cd;
  --call-muted:#91b1aa;
  --call-border:#698c8280;
  --call-border-strong:#a0c9b9;
  --call-accent:#9adccc;
  --call-accent-strong:#d7fff3;
  --call-accent-ink:#08231f;
  --call-focus:#d5fff3;
  --call-danger:#865a6c;
  --call-card-bg:#081d23;
  --call-card-text:#d9fff4;
  --call-network-bg:#01070a;
  --call-panel-shadow:inset 0 0 9px rgba(78,183,177,.12),inset 0 1px rgba(234,255,250,.18);
  --call-widget-shadow:0 0 0 1px #698c823b,0 0 12px #78d8c921,inset 0 1px rgba(178,215,198,.08);
  --call-sized-lead:rgba(214,255,245,.40);
  --call-sized-trail:rgba(83,211,205,.44);
  --call-ambient-glow:rgba(120,216,201,.25);
  --call-selected-shadow:
    inset 0 0 11px rgba(78,183,177,.22),
    inset 0 1px rgba(234,255,250,.36),
    0 0 1px rgba(238,255,249,.96),
    0 0 7px rgba(93,232,215,.56),
    0 0 17px rgba(64,200,192,.34),
    0 0 28px rgba(29,127,137,.18);
  --call-scan-opacity:.18;
}

/* One CRT viewport. Black overscan is small and identical whenever curvature is on. */
html,body{width:100%;height:100%;margin:0}
body.call-screen-host-v7{overflow:hidden!important;background:#000!important}
.call-display-root-v7{
  position:fixed;inset:0;overflow:hidden;isolation:isolate;
  background:var(--call-field);color:var(--call-text);
  box-shadow:none;
  transform:translateZ(0);
}
:root[data-call-fx-curvature="true"] .call-display-root-v7{
  inset:8px;
  border-radius:clamp(24px,3.2vw,54px)/clamp(20px,2.7vh,40px);
  clip-path:inset(0 round clamp(24px,3.2vw,54px)/clamp(20px,2.7vh,40px));
  box-shadow:
    0 0 0 3px #111,
    0 0 40px #000,
    inset 0 0 28px rgba(0,0,0,.72),
    inset 0 0 9px color-mix(in srgb,var(--call-accent) 8%,transparent);
}
:root[data-call-optics-active="true"] .call-display-root-v7{
  filter:var(--call-active-tube-filter, none);
}
.call-display-scroll-v7{
  position:absolute;inset:0;overflow:auto;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  box-sizing:border-box;
  background:transparent;color:var(--call-text);
  scrollbar-width:none;
}
.call-display-scroll-v7::-webkit-scrollbar{width:0;height:0}
:root[data-call-theme-bar-mode="top"] .call-display-scroll-v7{padding-top:48px}
:root[data-call-theme-bar-mode="floating"] .call-display-scroll-v7{padding-top:0}

/* Edge curves are static geometry, like madeinmagius-site. */
:root[data-call-fx-curvature="true"] .call-display-root-v7::before,
:root[data-call-fx-curvature="true"] .call-display-root-v7::after{
  content:"";position:absolute;z-index:4900;left:5.5%;right:5.5%;height:20px;pointer-events:none;
  border-color:color-mix(in srgb,var(--call-accent) 18%,transparent);
}
:root[data-call-fx-curvature="true"] .call-display-root-v7::before{
  top:5px;border-top:1px solid;border-radius:50% 50% 0 0/100% 100% 0 0;
}
:root[data-call-fx-curvature="true"] .call-display-root-v7::after{
  bottom:5px;border-bottom:1px solid;border-radius:0 0 50% 50%/0 0 100% 100%;
}

/* Physical screen material */
.call-reader-screen-v7{
  position:absolute;inset:0;z-index:5000;pointer-events:none;user-select:none;
  overflow:hidden;border-radius:inherit;contain:strict;
}
.call-reader-screen-v7>span{position:absolute;inset:0;pointer-events:none;display:none}

/* Soft focus is bundled with NOISE, not exposed as a separate setting. */
:root[data-call-fx-noise="true"]:not([data-call-mobile="true"]) .call-fx-film-focus-v7{
  display:block;
  backdrop-filter:blur(.18px) saturate(.98) contrast(.995);
  -webkit-backdrop-filter:blur(.18px) saturate(.98) contrast(.995);
}
:root[data-call-theme="dark"][data-call-fx-noise="true"]:not([data-call-mobile="true"]) .call-fx-film-focus-v7,
:root[data-call-theme="frost"]:not([data-call-mobile="true"]) .call-fx-film-focus-v7{
  backdrop-filter:blur(.32px) saturate(.96) contrast(.99);
  -webkit-backdrop-filter:blur(.32px) saturate(.96) contrast(.99);
}

/* Day/paper/green noise now uses the Reader grain assets and is visibly real. */
:root:not([data-call-theme="dark"]):not([data-call-theme="frost"])[data-call-fx-noise="true"] .call-fx-day-grain-v7{
  display:block;
  opacity:var(--call-day-grain-opacity);
  background:
    url('./reader-textures/magi-lofi-grain.png') 17px 13px/384px 384px repeat,
    url('./reader-textures/NoiseAndGrain.png') 0 0/128px 64px repeat;
  background-blend-mode:soft-light,multiply;
  mix-blend-mode:multiply;
}

/* Exact Reader night raster/grain. Static textures avoid the previous mobile perf hit. */
:root[data-call-theme="dark"][data-call-fx-noise="true"] .call-fx-night-phosphor-v7{
  display:block;
  background:
    repeating-linear-gradient(0deg,rgba(5,0,2,.52) 0 .6px,transparent .6px 2px),
    url('./reader-textures/NoiseAndGrain.png') 0 0/128px 64px repeat,
    url('./reader-textures/PixelOverlay_RGB_16.png') 0 0/4px 4px repeat;
  background-blend-mode:multiply,soft-light,normal;
  mix-blend-mode:soft-light;
  opacity:var(--call-scan-opacity);
}
:root[data-call-theme="dark"][data-call-fx-noise="true"] .call-fx-night-grain-v7{
  display:block;
  background:
    url('./reader-textures/magi-lofi-grain.png') 7px 13px/384px 384px repeat,
    url('./reader-textures/magi-lofi-grain.png') 211px 97px/384px 384px repeat;
  background-blend-mode:screen;
  mix-blend-mode:screen;
  opacity:.495;
  filter:sepia(.2) hue-rotate(42deg) saturate(.72);
}
:root[data-call-theme="dark"][data-call-phosphor="amber"] .call-fx-night-grain-v7{
  opacity:.66;filter:sepia(.65);
}

/* Frost's global dirty-film material is always part of frost, matching Reader. */
:root[data-call-theme="frost"] .call-fx-frost-grain-v7{
  display:block;opacity:.95;mix-blend-mode:screen;
  background:
    url('./reader-textures/magi-lofi-grain.png') 19px 17px/384px 384px repeat,
    url('./reader-textures/magi-lofi-grain.png') 173px 91px/384px 384px repeat,
    url('./reader-textures/magi-lofi-grain.png') 47px 221px/384px 384px repeat,
    url('./reader-textures/magi-lofi-grain.png') 263px 149px/384px 384px repeat;
  background-blend-mode:screen;
  mask-image:
    radial-gradient(ellipse 19% 13% at 78% 34%,#000 12%,transparent 90%),
    radial-gradient(ellipse 14% 26% at 94% 68%,rgba(0,0,0,.86),transparent 93%),
    radial-gradient(ellipse 17% 19% at 54% 77%,rgba(0,0,0,.7),transparent 92%),
    radial-gradient(ellipse 11% 12% at 44% 17%,rgba(0,0,0,.62),transparent 94%),
    linear-gradient(90deg,rgba(0,0,0,.38),rgba(0,0,0,.45) 20%,rgba(0,0,0,.76) 38%,rgba(0,0,0,.84) 70%,rgba(0,0,0,.68));
}
:root[data-call-theme="frost"] .call-fx-frost-smudges-v7{
  display:block;opacity:.24;mix-blend-mode:screen;
  background:url('./reader-textures/DirtHighContrast.png') center/cover no-repeat;
  filter:grayscale(1);
  mask-image:radial-gradient(ellipse at 48% 43%,rgba(0,0,0,.22) 15%,#000 82%);
}
:root[data-call-theme="frost"] .call-fx-frost-glass-v7{
  display:block;opacity:.86;mix-blend-mode:screen;
  background:url('./reader-textures/2k_BG_Texture.png?v=ui-r10-reader-loader') center/100% 100% no-repeat;
  filter:grayscale(1);
}
:root[data-call-theme="frost"] .call-fx-frost-wear-v7{
  display:block;opacity:.78;mix-blend-mode:screen;
  background:url('./reader-textures/frost-glass-scratches.png') center/100% 100% no-repeat;
  filter:drop-shadow(.42px 0 rgba(255,255,255,.42))
    drop-shadow(-.34px 0 rgba(104,228,215,.24)) blur(.16px);
}

/* Scanlines: dark already gets them through night phosphor, others use this layer. */
:root:not([data-call-theme="dark"])[data-call-fx-scanlines="true"] .call-fx-scanlines-v7{
  display:block;opacity:var(--call-scan-opacity);
  background:repeating-linear-gradient(0deg,rgba(5,0,2,.38) 0 .6px,transparent .6px 2px);
  mix-blend-mode:multiply;
}

/* Static glass vignette and bezel. No giant spotlight layer. */
:root[data-call-fx-curvature="true"] .call-fx-vignette-v7{
  display:block;
  background:radial-gradient(ellipse at 50% 47%,transparent 37%,rgba(0,0,0,.025) 64%,rgba(0,0,0,.16) 92%,rgba(0,0,0,.34) 100%);
  box-shadow:inset 0 0 3px rgba(218,233,213,.18),inset 0 0 17px rgba(0,0,0,.55);
}
:root[data-call-fx-curvature="true"] .call-fx-bezel-v7{
  display:block;border-radius:inherit;
  box-shadow:
    inset 0 0 0 5px rgba(0,0,0,.36),
    inset 0 0 12px 7px rgba(0,0,0,.45),
    inset 0 0 28px 9px rgba(0,0,0,.24);
}

/* Very low-frequency signal instability is bundled with noise, desktop only. */
@media(min-width:761px){
  :root[data-call-fx-noise="true"] .call-display-scroll-v7{
    animation:none;
    will-change:transform;
  }
}

@media(prefers-reduced-motion:reduce){
  .call-display-scroll-v7{animation:none!important}
}

/* Theme all normal surfaces. */
:root[data-call-theme] :where(
  #wrapper,main,section,article,aside,details,fieldset,
  .suite-shell,.suite-panel,.suite-results,.suite-result-group,
  .call-panel-v8,.call-panel-body-v8,.call-result-details-v8,.call-table-details-v10,
  .call-help-details-v10,#callResultSection,#at_result,
  .suite-attribute-v7,.story-row-v7,.story-route-variant-v1,
  .runes-mask-controls-v9,.runes-image-card-v9,.runes-reference-details-v9,
  .story-title-hero-v1,.story-title-kpi-v1,.story-title-card-v1,.story-title-table-wrap-v2
){
  color:var(--call-text)!important;border-color:var(--call-border)!important;
}
:root[data-call-theme] :where(
  .suite-panel,.suite-results,.suite-result-group,
  .call-panel-v8,.suite-panel-details-v8,.character-grid-details-v8,
  .call-panel-body-v8,.call-result-details-v8,.call-table-details-v10,.call-help-details-v10,
  #callResultSection,#at_result,fieldset,details,
  .suite-attribute-v7,.story-row-v7,.story-route-variant-v1,
  .runes-mask-controls-v9,.runes-image-card-v9,.story-title-kpi-v1,.story-title-card-v1,.story-title-table-wrap-v2
){
  background:var(--call-surface)!important;background-color:var(--call-surface)!important;box-shadow:var(--call-panel-shadow)!important;
}
:root[data-call-theme] :where(
  .suite-panel-details-v8>summary,.call-panel-v8>summary,.character-grid-details-v8>summary,
  .call-help-details-v10>summary,.call-table-details-v10>summary,details>summary,
  .suite-result-group>h3,.runes-reference-details-v9>summary
){
  color:var(--call-text)!important;background:var(--call-surface-soft)!important;border-color:var(--call-border)!important;
}
:root[data-call-theme] body :is(
  .suite-panel-details-v8>summary::after,.call-panel-v8>summary::after,
  .character-grid-details-v8>summary::after,.call-details-state-v10::before,
  .runes-reference-details-v9>summary::after
){
  -webkit-appearance:none!important;appearance:none!important;
  color:var(--call-text)!important;-webkit-text-fill-color:currentColor!important;
  background:var(--call-surface-raised)!important;border:1px solid var(--call-border)!important;
  border-radius:1px!important;box-shadow:none!important;
}
:root[data-call-theme] :where(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,legend,summary,strong,b,span,small){color:inherit}
:root[data-call-theme] :where(.suite-muted,.muted,.hint,.help,.description,.suite-field small){color:var(--call-muted)!important}

/* Legacy/native forms are fully theme-controlled. */
:root[data-call-theme] body :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,textarea,button,
  .ndownword,.searchbtn,.resetbtn,.ndownReset,.mgreset,#at_reset,
  .suite-input,.suite-select,.suite-textarea,.suite-button,.call-help-toggle-v10,
  #canvasImgLink,#saveHeightChartBtn,.story-title-display-input-v2
){
  -webkit-appearance:none!important;appearance:none!important;
  color:var(--call-text)!important;-webkit-text-fill-color:currentColor!important;
  background:var(--call-surface-raised)!important;background-color:var(--call-surface-raised)!important;
  border:1px solid var(--call-border)!important;border-radius:1px!important;
  box-shadow:none!important;
}
:root[data-call-theme] body :is(
  button,input[type="button"],input[type="submit"],input[type="reset"]
):hover,
:root[data-call-theme] body :is(
  button,input[type="button"],input[type="submit"],input[type="reset"]
):focus-visible{
  color:var(--call-accent-strong)!important;background:var(--call-surface-soft)!important;border-color:var(--call-border-strong)!important;
}
:root[data-call-theme] body :is(.suite-button.primary,.searchbtn):hover,
:root[data-call-theme] body :is(.suite-button.primary,.searchbtn):focus-visible{
  color:var(--call-accent-ink)!important;background:var(--call-accent)!important;
  border-color:var(--call-accent)!important;box-shadow:var(--call-selected-shadow)!important;
}
:root[data-call-theme] :where(input::placeholder,textarea::placeholder){
  color:var(--call-muted)!important;-webkit-text-fill-color:currentColor!important;opacity:1!important;
}
:root[data-call-theme] :where(input[type="checkbox"],input[type="radio"],input[type="range"]){accent-color:var(--call-accent)!important}
:root[data-call-theme] input[type="file"]::file-selector-button{
  -webkit-appearance:none!important;appearance:none!important;
  color:var(--call-text)!important;background:var(--call-surface-soft)!important;border:1px solid var(--call-border)!important;
}
:root[data-call-theme] body input[type="range"]{
  -webkit-appearance:none!important;appearance:none!important;background:transparent!important;height:22px;
}
:root[data-call-theme] body input[type="range"]::-webkit-slider-runnable-track{
  height:4px;background:var(--call-surface-soft);border:1px solid var(--call-border);
}
:root[data-call-theme] body input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none;width:14px;height:18px;margin-top:-8px;border:1px solid var(--call-border-strong);border-radius:0;
  background:var(--call-accent);box-shadow:0 0 6px color-mix(in srgb,var(--call-accent) 44%,transparent);
}

/* Choice plates, tables, charts */
:root[data-call-theme] body :is(
  .suite-checks label,.suite-attribute-toolbar-v7 label,.suite-attribute-options-v7 label,
  .runes-mask-enable-v9,.runes-mask-brush-v9
){
  color:var(--call-text)!important;background:var(--call-surface-raised)!important;border-color:var(--call-border)!important;
}
:root[data-call-theme] body :is(.suite-checks label:has(input:checked),.suite-attribute-options-v7 label:has(input:checked)){
  background:var(--call-surface-soft)!important;border-color:var(--call-border-strong)!important;box-shadow:inset 3px 0 var(--call-accent)!important;
}
:root[data-call-theme] :where(table,th,td,tr){color:var(--call-text)!important;border-color:var(--call-border)!important}
:root[data-call-theme] :where(th,.suite-result-table th,#girltable thead th){background:var(--call-surface-soft)!important}
:root[data-call-theme] #girltable tbody tr,
:root[data-call-theme] #girltable tbody tr:nth-child(odd),
:root[data-call-theme] #girltable tbody tr:nth-child(even),
:root[data-call-theme] #girltable tbody tr>:first-child,
:root[data-call-theme] td.gachaTblBak,
:root[data-call-theme] td.gachaNormal{
  background:var(--call-surface)!important;color:var(--call-text)!important;
}
:root[data-call-theme] body :is(
  .relationship-table-controls,.relationship-table-viewport,
  .height-chart-controls,.height-zoom-controls,.height-zoom-controls-v2,
  .height-chart-viewport,.height-chart-viewport-v2,.height-chart-surface,.height-chart-surface-v2,
  .height-y-axis,.height-y-axis-v2,.height-x-axis,.height-x-axis-v2,.height-x-axis-spacer,.height-x-axis-spacer-v2,
  .height-chart-message,.height-bar-label,.height-bar-label-v2,.height-selection-summary-v11,
  .suite-status,.suite-notice,.suite-chip,.suite-cast span,.attendance-row,.attendance-track,
  .runes-guidance-v10,.runes-drop,.runes-preview,.runes-reference,.runes-mask-status-v9,
  #runesMaskStatus,#runesDiagnostics,.runes-diagnostics-v6,.story-title-preview-v1
){
  color:var(--call-text)!important;-webkit-text-fill-color:currentColor!important;
  background:var(--call-surface-raised)!important;background-color:var(--call-surface-raised)!important;
  border-color:var(--call-border)!important;box-shadow:var(--call-panel-shadow)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
:root[data-call-theme] body :is(.height-plot,.height-plot-v2){
  background-color:var(--call-surface)!important;
  background-image:repeating-linear-gradient(to top,color-mix(in srgb,var(--call-accent) 11%,transparent) 0 1px,transparent 1px 12px)!important;
}

/* Navigation */
:root[data-call-theme] body .suite-nav{
  color:var(--call-text)!important;background:var(--call-surface)!important;border-color:var(--call-border)!important;
  box-shadow:var(--call-panel-shadow)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
:root[data-call-theme] body .suite-nav a{
  color:var(--call-text)!important;-webkit-text-fill-color:currentColor!important;
  background:var(--call-surface-raised)!important;border-color:var(--call-border)!important;box-shadow:none!important;border-radius:1px!important;
}
:root[data-call-theme] body .suite-nav :is(a.active,a[aria-current="page"],a[data-active="true"]){
  color:var(--call-accent-ink)!important;-webkit-text-fill-color:currentColor!important;
  background:var(--call-accent)!important;border-color:var(--call-accent)!important;box-shadow:var(--call-selected-shadow)!important;
}

/* Reader registration fallback for mobile, and readable ink echo behind desktop scene pass. */
:root[data-call-fx-registration="true"] .call-display-root-v7 :is(
  button,input,textarea,select,a,span,p,h1,h2,h3,h4,h5,h6,label,legend,summary,strong,b,small,li,td,th
){
  text-shadow:
    clamp(-1px,calc(1.7px - .17em),0px) 0 .008em var(--call-sized-lead),
    clamp(0px,calc(.2em - 2px),1.4px) 0 .008em var(--call-sized-trail),
    0 0 .11em var(--call-ambient-glow)!important;
}
:root[data-call-theme="dark"][data-call-fx-registration="true"] .call-display-root-v7 svg{
  filter:drop-shadow(.65px 0 .14px var(--call-sized-trail)) drop-shadow(-.35px 0 .12px var(--call-sized-lead));
}

/* Pixel font now covers the whole display scope, including menus and controls. */
:root[data-call-fx-pixel-font="true"] .call-display-root-v7,
:root[data-call-fx-pixel-font="true"] .call-display-root-v7 :is(
  button,input,textarea,select,a,span,p,h1,h2,h3,h4,h5,h6,label,legend,summary,strong,b,small,li,td,th
){
  font-family:var(--call-pixel-font)!important;font-weight:400!important;font-synthesis:none!important;
}
:root[data-call-fx-pixel-font="true"] .call-display-root-v7 :is([lang="ja"],[lang="ja"] *){
  font-family:var(--call-pixel-font-jp)!important;
}

/* Night/frost terminal geometry */
:root:is([data-call-theme="dark"],[data-call-theme="frost"]) .call-display-root-v7 :is(
  .suite-nav,.suite-nav a,.suite-panel,.suite-panel-details-v8,.character-grid-details-v8,
  .call-panel-v8,.call-table-details-v10,.call-help-details-v10,.suite-result-group,
  .suite-checks label,input,select,textarea,button,fieldset,details
){border-radius:0!important}
:root:is([data-call-theme="dark"],[data-call-theme="frost"]) .call-display-root-v7 :is(
  button,input,textarea,select,a,span,p,h1,h2,h3,h4,h5,h6,label,legend,summary,strong,b,small,li,td,th
){color:var(--call-text)!important;-webkit-text-fill-color:currentColor!important}
:root[data-call-theme="frost"] .call-display-root-v7 :is(
  .suite-panel,.call-panel-v8,.suite-result-group,.runes-image-card-v9,.runes-mask-controls-v9,.call-floating-widget-v7
){
  background:linear-gradient(145deg,rgba(24,58,62,.92),rgba(8,29,35,.96))!important;
  border-color:rgba(137,224,214,.65)!important;
  outline:1px solid rgba(205,255,245,.12);outline-offset:-2px;
}

/* Character cards */
:root:is([data-call-theme="dark"],[data-call-theme="frost"]) :is(label.girlbox,.suite-character-card){
  color:var(--call-card-text)!important;background:var(--call-card-bg)!important;border-color:var(--call-border)!important;
  box-shadow:inset 0 -3px 0 var(--call-card-accent,var(--call-accent))!important;
}
:root:is([data-call-theme="dark"],[data-call-theme="frost"]) label.girlbox::after{
  color:var(--call-text)!important;background:var(--call-surface-soft)!important;border:1px solid var(--call-border)!important;
}
:is(label.girlbox,.suite-character-card).umeColor{--call-card-accent:#d7c65b}
:is(label.girlbox,.suite-character-card).hisColor{--call-card-accent:#e08bd3}
:is(label.girlbox,.suite-character-card).umeOtherColor{--call-card-accent:#9c9be5}
:is(label.girlbox,.suite-character-card).PMHQColor{--call-card-accent:#df88ad}
:is(label.girlbox,.suite-character-card).PMHQotherColor{--call-card-accent:#82a9d8}
:is(label.girlbox,.suite-character-card).otherColor{--call-card-accent:#8fc8a6}
:is(label.girlbox,.suite-character-card).otherColor2{--call-card-accent:#88b7ce}
:is(label.girlbox,.suite-character-card).otherotherColor{--call-card-accent:#c49b79}
:is(label.girlbox,.suite-character-card).gaidenColor{--call-card-accent:#8fc8a6}
:is(label.girlbox,.suite-character-card).collaboColor{--call-card-accent:#d7a65b}
:is(label.girlbox,.suite-character-card).mobColor{--call-card-accent:#9aa5a8}
:is(label.girlbox,.suite-character-card).unimpColor{--call-card-accent:#7d878a}
:is(label.girlbox,.suite-character-card).unionColor{--call-card-accent:#d48fa8}
:is(label.girlbox,.suite-character-card).tokimeColor{--call-card-accent:#84b89c}
:is(label.girlbox,.suite-character-card).misdColor{--call-card-accent:#c77979}

/* Top theme toolbar by default. Floating mode is opt-in in Settings. */
.call-floating-widget-v7{
  position:absolute;z-index:2320;color:var(--call-text);
  border:1px solid var(--call-border);background:var(--call-surface-raised);box-shadow:var(--call-widget-shadow);
  contain:layout paint;
}
.call-floating-grip-v7{
  display:grid!important;place-items:center!important;width:29px!important;min-width:29px!important;min-height:38px!important;
  padding:0!important;border:1px solid var(--call-border)!important;border-radius:0!important;
  color:var(--call-muted)!important;background:var(--call-surface-soft)!important;cursor:grab;touch-action:none;user-select:none;
}
.call-theme-widget-v7{
  display:flex;align-items:stretch;gap:3px;padding:3px;flex-wrap:nowrap!important;white-space:nowrap;
}
:root[data-call-theme-bar-mode="top"] .call-theme-widget-v7{
  position:absolute;top:5px;left:50%;right:auto;bottom:auto;transform:translateX(-50%);
  z-index:2450;
}
:root[data-call-theme-bar-mode="top"] .call-theme-grip-v7{display:none!important}
:root[data-call-theme-bar-mode="floating"] .call-theme-widget-v7:not(.is-positioned){
  left:50%;right:auto;bottom:15px;top:auto;transform:translateX(-50%);
}
.call-theme-options-v7{display:flex;flex-direction:row!important;gap:3px;flex-wrap:nowrap!important}
.call-theme-option-v7,.call-floating-utility-v7{
  display:grid!important;place-items:center!important;width:39px!important;min-width:39px!important;height:38px!important;
  margin:0!important;padding:0!important;border:1px solid var(--call-border)!important;border-radius:0!important;
  color:var(--call-text)!important;-webkit-text-fill-color:currentColor!important;background:transparent!important;box-shadow:none!important;cursor:pointer;
}
.call-theme-option-v7 svg,.call-floating-utility-v7 svg{
  width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:square;stroke-linejoin:miter;overflow:visible;
}
.call-theme-option-v7:hover,.call-theme-option-v7:focus-visible,.call-floating-utility-v7:hover,.call-floating-utility-v7:focus-visible{
  color:var(--call-accent-strong)!important;background:var(--call-surface-soft)!important;border-color:var(--call-border-strong)!important;
}
.call-theme-option-v7[aria-pressed="true"]{
  color:var(--call-accent-ink)!important;background:var(--call-accent)!important;border-color:var(--call-accent)!important;
  box-shadow:var(--call-selected-shadow)!important;
}
:root[data-call-fx-curvature="true"] .call-theme-option-v7[aria-pressed="true"] svg{
  filter:drop-shadow(0 0 4px color-mix(in srgb,var(--call-accent) 64%,transparent));
}

/* Right jump rail. Strong selectors intentionally beat old pink V7/V10 CSS. */
.call-jump-widget-v7{
  right:17px;top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;gap:3px;padding:3px;z-index:2440;
}
.call-jump-widget-v7.is-positioned{transform:none}
.call-jump-actions-v7{display:flex;flex-direction:column!important;gap:3px}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7){
  position:static!important;inset:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  z-index:auto!important;display:flex!important;flex-direction:column!important;gap:3px!important;
  margin:0!important;padding:0!important;transform:none!important;pointer-events:auto!important;
  border:0!important;background:transparent!important;box-shadow:none!important;visibility:visible!important;opacity:1!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button,
.call-jump-collapse-v7{
  display:grid!important;place-items:center!important;width:47px!important;min-width:47px!important;height:36px!important;min-height:36px!important;
  margin:0!important;padding:.2rem!important;
  border:1px solid var(--call-border)!important;border-radius:0!important;
  color:var(--call-text)!important;-webkit-text-fill-color:currentColor!important;
  background:var(--call-surface-raised)!important;background-color:var(--call-surface-raised)!important;
  box-shadow:none!important;outline:none!important;
  font:800 .72rem/1.05 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  opacity:1!important;cursor:pointer;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:hover,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:focus-visible,
.call-jump-collapse-v7:hover,.call-jump-collapse-v7:focus-visible{
  color:var(--call-accent-ink)!important;background:var(--call-accent)!important;border-color:var(--call-accent)!important;
  box-shadow:var(--call-selected-shadow)!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button[data-action="cancel"]{
  color:var(--call-text)!important;background:var(--call-surface-soft)!important;border-color:var(--call-border-strong)!important;
}
.call-jump-widget-v7.is-collapsed .call-jump-actions-v7{display:none!important}

/* Floating hamburger: it no longer consumes a blank row in document flow. */
.call-menu-float-v7{
  position:absolute!important;z-index:2460!important;left:10px!important;top:53px!important;
  width:44px!important;height:44px!important;background:transparent!important;
}
.call-menu-float-v7 .menu-icon{
  width:44px!important;height:44px!important;
  border:1px solid var(--call-border)!important;border-radius:0!important;
  background:var(--call-surface-raised)!important;box-shadow:var(--call-widget-shadow)!important;
}
.call-menu-float-v7 :is(.navicon,.navicon::before,.navicon::after){
  width:24px!important;height:3px!important;background:var(--call-text)!important;
  box-shadow:0 0 4px color-mix(in srgb,var(--call-accent) 30%,transparent)!important;
}
.call-menu-float-v7 .menu{
  top:48px!important;left:0!important;width:min(330px,calc(100vw - 26px))!important;max-width:min(330px,calc(100vw - 26px))!important;
  max-height:calc(100dvh - 118px)!important;
  padding:6px 0 8px!important;
  border:1px solid var(--call-border)!important;border-radius:0!important;
  background:var(--call-surface-raised)!important;box-shadow:var(--call-widget-shadow)!important;
}
.call-menu-float-v7 .menu li{padding:3px 11px!important;line-height:1.38!important}
.call-menu-float-v7 .menu a,.call-menu-float-v7 .menu li,.call-menu-float-v7 .menulabel{
  color:var(--call-text)!important;-webkit-text-fill-color:currentColor!important;background:transparent!important;
  font-size:14px!important;line-height:1.4!important;white-space:normal!important;overflow-wrap:anywhere!important;
}
.call-menu-float-v7 .menu .menulabel{font-size:15px!important;letter-spacing:.08em!important}
.call-menu-float-v7 .menu .thismenu{
  color:var(--call-accent-ink)!important;background:var(--call-accent)!important;box-shadow:var(--call-selected-shadow)!important;
}

/* Compact Reader-like settings: only Reader's public effect choices + toolbar placement. */
.call-fx-window-v7{
  right:74px;top:54px;width:min(410px,calc(100% - 92px));max-height:calc(100% - 70px);overflow:hidden;z-index:2470;
}
.call-fx-window-v7[hidden]{display:none!important}
.call-fx-titlebar-v7{
  display:grid;grid-template-columns:30px minmax(0,1fr) 38px;gap:6px;min-height:50px;padding:4px;
  border-bottom:1px solid var(--call-border);background:var(--call-surface-soft);
}
.call-fx-grip-v7{width:30px!important;min-width:30px!important}
.call-fx-title-copy-v7{display:flex;min-width:0;flex-direction:column;justify-content:center;line-height:1.1}
.call-fx-title-copy-v7 small{color:var(--call-muted)!important;font:700 .65rem/1.1 var(--call-pixel-font);letter-spacing:.10em}
.call-fx-title-copy-v7 strong{font-size:1rem}
.call-fx-close-v7{width:38px!important;min-width:38px!important;min-height:38px!important;padding:0!important;font-size:1.2rem!important}
.call-fx-body-v7{max-height:calc(100dvh - 134px);overflow:auto;padding:9px;overscroll-behavior:contain}
.call-fx-intro-v7{margin:0 0 7px;color:var(--call-muted)!important;font-size:.78rem;line-height:1.42}
.call-fx-window-v7 fieldset{margin:7px 0;padding:8px 9px;border:1px solid var(--call-border)!important;background:var(--call-surface)!important;box-shadow:none!important}
.call-fx-window-v7 legend{padding:0 4px;font-weight:800;color:var(--call-text)!important}
.call-fx-toggle-row-v7{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:38px;padding:4px 2px;border-bottom:1px solid color-mix(in srgb,var(--call-border) 40%,transparent)}
.call-fx-toggle-row-v7:last-child{border-bottom:0}
.call-fx-toggle-row-v7 input{width:19px;height:19px;margin:0;accent-color:var(--call-accent)}
.call-fx-toggle-row-v7.is-fixed{opacity:.7}
.call-fx-segment-v7{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.call-fx-segment-v7 button{min-height:36px!important}
.call-fx-segment-v7 button[aria-pressed="true"]{
  color:var(--call-accent-ink)!important;background:var(--call-accent)!important;border-color:var(--call-accent)!important;box-shadow:var(--call-selected-shadow)!important;
}
.call-fx-footer-v7{display:flex;gap:6px;margin-top:7px}
.call-fx-footer-v7 button{flex:1 1 0;min-height:36px!important}

/* In-screen themed scrollbar. */
.call-optical-scroll-v7{
  position:absolute;z-index:4800;right:6px;top:14px;bottom:14px;width:12px;cursor:pointer;touch-action:none;outline:none;
}
.call-optical-scroll-track-v7{
  position:absolute;left:5px;top:0;bottom:0;width:2px;background:color-mix(in srgb,var(--call-border) 44%,transparent);
}
.call-optical-scroll-thumb-v7{
  position:absolute;left:-2px;top:0;width:6px;min-height:40px;
  background:var(--call-accent);border:1px solid var(--call-border-strong);
  box-shadow:0 0 6px color-mix(in srgb,var(--call-accent) 44%,transparent);
  will-change:transform;
}

/* Hide obsolete controls/anchors that could duplicate v7. */
.call-display-scroll-v7 :is(#pagetop,#pagemdl,#pagebtm),
.call-display-root-v7 :is(
  .call-theme-dock-v2,.call-theme-toggle-v1,.call-floating-controller-v3,
  .call-theme-widget-v4,.call-theme-widget-v5,.call-theme-widget-v6,
  .call-jump-widget-v4,.call-jump-widget-v5,.call-jump-widget-v6
){display:none!important}
.call-sr-only-v7{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* Mobile/performance: static CRT shape + static material. Full SVG scene filter is disabled. */
@media(max-width:760px){
  :root[data-call-fx-curvature="true"] .call-display-root-v7{
    inset:4px;
    border-radius:clamp(25px,8vw,44px)/clamp(18px,3.6vh,34px);
    clip-path:inset(0 round clamp(25px,8vw,44px)/clamp(18px,3.6vh,34px));
    filter:none!important;
  }
  :root[data-call-theme-bar-mode="top"] .call-display-scroll-v7{padding-top:46px}
  :root[data-call-theme-bar-mode="top"] .call-theme-widget-v7{
    top:4px;max-width:calc(100% - 18px);
  }
  .call-theme-option-v7,.call-floating-utility-v7{
    width:37px!important;min-width:37px!important;height:36px!important;
  }
  :root[data-call-theme-bar-mode="floating"] .call-theme-widget-v7:not(.is-positioned){
    bottom:10px;max-width:calc(100% - 78px);
  }
  .call-jump-widget-v7{right:10px}
  .call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button,.call-jump-collapse-v7{
    width:43px!important;min-width:43px!important;height:36px!important;min-height:36px!important;font-size:.68rem!important;
  }
  .call-menu-float-v7{left:7px!important;top:49px!important}
  .call-fx-window-v7{right:58px;top:51px;width:calc(100% - 68px);max-height:calc(100% - 62px)}
  .call-fx-body-v7{max-height:calc(100dvh - 125px)}
  .call-optical-scroll-v7{right:3px;top:11px;bottom:11px}
  .call-reader-screen-v7{animation:none!important}
  .call-fx-film-focus-v7{display:none!important}
  .call-fx-day-grain-v7{opacity:calc(var(--call-day-grain-opacity) * .82)}
  .call-fx-night-grain-v7{opacity:.34!important}
  .call-fx-frost-grain-v7{opacity:.62}
  .call-fx-frost-smudges-v7{opacity:.18}
  .call-fx-frost-glass-v7{opacity:.52}
  .call-fx-frost-wear-v7{opacity:.58}
}

/* iOS/WebKit: same visual identity, no viewport filter/backdrop filter/animation. */
:root[data-call-ios="true"] .call-display-root-v7{filter:none!important}
:root[data-call-ios="true"] .call-fx-film-focus-v7{display:none!important}
:root[data-call-ios="true"] .call-display-scroll-v7{animation:none!important}


/* Top toolbar owns the first row; sticky tool navigation sits immediately below it. */
:root[data-call-theme-bar-mode="top"] .call-display-scroll-v7 .suite-nav{
  top:48px!important;
}
:root[data-call-theme-bar-mode="floating"] .call-display-scroll-v7 .suite-nav{
  top:0!important;
}

/* The floating hamburger follows the measured navigation height instead of
   leaving or occupying a fake header row. */
:root[data-call-theme-bar-mode="top"] .call-menu-float-v7{
  top:calc(48px + var(--suite-nav-height-v7, 0px) + 5px)!important;
}
:root[data-call-theme-bar-mode="floating"] .call-menu-float-v7{
  top:calc(var(--suite-nav-height-v7, 0px) + 8px)!important;
}


/* ===== v7.3 geometry/control correction =====
 * The default theme row is document content and scrolls away. The right rail
 * is a grouped Reader-style instrument, not a stack of legacy pink cards.
 */

/* Remove the decorative top/bottom arcs that read as fake "curvature". */
:root[data-call-fx-curvature="true"] .call-display-root-v7::before,
:root[data-call-fx-curvature="true"] .call-display-root-v7::after{
  display:none!important;
}

/* Physical CRT edge: black overscan around the entire bounded viewport. */
:root[data-call-fx-curvature="true"] .call-display-root-v7{
  inset:10px!important;
  border:1px solid color-mix(in srgb,var(--call-accent) 20%,#111)!important;
  border-radius:clamp(26px,3.3vw,56px)/clamp(21px,2.9vh,42px)!important;
  clip-path:inset(0 round clamp(26px,3.3vw,56px)/clamp(21px,2.9vh,42px))!important;
  box-shadow:
    0 0 0 8px #000,
    0 0 46px 12px #000,
    inset 0 0 5px rgba(255,255,255,.025),
    inset 0 0 24px rgba(0,0,0,.58)!important;
}
:root[data-call-fx-curvature="true"] .call-fx-vignette-v7{
  background:
    radial-gradient(ellipse at 50% 47%,
      transparent 0 52%,
      rgba(0,0,0,.09) 69%,
      rgba(0,0,0,.34) 88%,
      rgba(0,0,0,.72) 100%),
    linear-gradient(90deg,rgba(0,0,0,.34),transparent 7% 93%,rgba(0,0,0,.37))!important;
  box-shadow:
    inset 0 0 3px rgba(218,233,213,.16),
    inset 0 0 22px rgba(0,0,0,.64)!important;
}
:root[data-call-fx-curvature="true"] .call-fx-bezel-v7{
  box-shadow:
    inset 0 0 0 5px rgba(0,0,0,.54),
    inset 0 0 11px 7px rgba(0,0,0,.62),
    inset 0 0 34px 10px rgba(0,0,0,.34)!important;
}

/* DEFAULT: a normal first row in the document. It is not sticky and not an
   overlay; when the user scrolls down it disappears with the page. */
:root[data-call-theme-bar-mode="top"] .call-theme-widget-v7{
  position:relative!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:min(430px,calc(100% - 24px))!important;
  margin:7px auto 5px!important;
  box-sizing:border-box;
  justify-content:center;
  z-index:20!important;
}
:root[data-call-theme-bar-mode="top"] .call-display-scroll-v7{
  padding-top:0!important;
}
:root[data-call-theme-bar-mode="top"] .call-display-scroll-v7 .suite-nav{
  top:0!important;
}
:root[data-call-theme-bar-mode="floating"] .call-display-scroll-v7 .suite-nav{
  top:0!important;
}

/* Floating mode stays opt-in from Settings. */
:root[data-call-theme-bar-mode="floating"] .call-theme-widget-v7:not(.is-positioned){
  position:absolute!important;
  left:50%!important;
  right:auto!important;
  bottom:16px!important;
  top:auto!important;
  transform:translateX(-50%)!important;
  width:max-content!important;
  margin:0!important;
}
.call-theme-widget-v7{
  flex-wrap:nowrap!important;
  background:color-mix(in srgb,var(--call-surface-raised) 96%,transparent)!important;
}
.call-theme-options-v7{
  flex-wrap:nowrap!important;
}
.call-theme-option-v7,
.call-floating-utility-v7{
  flex:0 0 39px!important;
}
.call-floating-grip-v7{
  display:none!important;
}

/* Tune/sliders icon: clearly not the moon/night icon. */
.call-floating-utility-v7 svg{
  width:20px!important;
  height:20px!important;
}

/* Reader-like grouped jump instrument. The frame is the drag surface; buttons
   are separated by hairlines instead of being ten independent chunky cards. */
.call-jump-widget-v7{
  right:15px!important;
  top:50%!important;
  width:49px!important;
  padding:3px!important;
  gap:0!important;
  transform:translateY(-50%)!important;
  border:1px solid var(--call-border)!important;
  background:color-mix(in srgb,var(--call-surface-raised) 91%,transparent)!important;
  box-shadow:
    0 0 0 1px color-mix(in srgb,var(--call-accent) 10%,transparent),
    0 5px 18px rgba(0,0,0,.30),
    inset 0 0 8px color-mix(in srgb,var(--call-accent) 5%,transparent)!important;
}
.call-jump-widget-v7.is-positioned{
  transform:none!important;
}
.call-jump-actions-v7{
  gap:0!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7){
  gap:0!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button,
.call-jump-collapse-v7{
  width:41px!important;
  min-width:41px!important;
  height:34px!important;
  min-height:34px!important;
  margin:0!important;
  padding:.16rem .08rem!important;
  border:0!important;
  border-bottom:1px solid color-mix(in srgb,var(--call-border) 72%,transparent)!important;
  border-radius:0!important;
  background:transparent!important;
  background-color:transparent!important;
  color:var(--call-text)!important;
  -webkit-text-fill-color:currentColor!important;
  box-shadow:none!important;
  outline:none!important;
  font:800 .68rem/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:first-child,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:last-child{
  font-size:1.05rem!important;
  font-family:var(--call-pixel-font)!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:hover,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:focus-visible,
.call-jump-collapse-v7:hover,
.call-jump-collapse-v7:focus-visible{
  color:var(--call-accent-strong)!important;
  -webkit-text-fill-color:currentColor!important;
  background:color-mix(in srgb,var(--call-accent) 11%,var(--call-surface-raised))!important;
  box-shadow:
    inset 2px 0 var(--call-accent),
    0 0 8px color-mix(in srgb,var(--call-accent) 22%,transparent)!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button[data-action="cancel"]{
  color:var(--call-muted)!important;
  background:transparent!important;
}
.call-jump-collapse-v7{
  height:25px!important;
  min-height:25px!important;
  border-bottom:0!important;
  color:var(--call-muted)!important;
}

/* The floating hamburger is a screen instrument and never owns page height. */
:root[data-call-theme-bar-mode="top"] .call-menu-float-v7,
:root[data-call-theme-bar-mode="floating"] .call-menu-float-v7{
  top:calc(var(--suite-nav-height-v7, 48px) + 11px)!important;
  left:10px!important;
}

/* Settings title bar itself is draggable; no separate "⋮" key. */
.call-fx-titlebar-v7{
  grid-template-columns:minmax(0,1fr) 38px!important;
  cursor:move;
}
.call-fx-titlebar-v7 .call-fx-close-v7{
  cursor:pointer;
}

/* Android/Chromium mobile may use the bounded single-screen Reader filter.
   iOS remains on the static low-cost glass path. */
@media(max-width:760px){
  :root[data-call-ios="false"][data-call-optics-active="true"] .call-display-root-v7{
    filter:var(--call-active-tube-filter, none)!important;
  }
  :root[data-call-fx-curvature="true"] .call-display-root-v7{
    inset:7px!important;
    border-radius:clamp(24px,7.2vw,42px)/clamp(18px,3.4vh,32px)!important;
    clip-path:inset(0 round clamp(24px,7.2vw,42px)/clamp(18px,3.4vh,32px))!important;
    box-shadow:
      0 0 0 6px #000,
      0 0 34px 9px #000,
      inset 0 0 22px rgba(0,0,0,.50)!important;
  }
  :root[data-call-theme-bar-mode="top"] .call-theme-widget-v7{
    width:min(390px,calc(100% - 22px))!important;
    margin:6px auto 4px!important;
  }
  .call-theme-option-v7,
  .call-floating-utility-v7{
    width:38px!important;
    min-width:38px!important;
    flex-basis:38px!important;
  }
  .call-jump-widget-v7{
    right:8px!important;
    width:47px!important;
  }
  .call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button,
  .call-jump-collapse-v7{
    width:39px!important;
    min-width:39px!important;
  }
}


/* ===== v7.4 boot / global menu / material consistency ===== */

/* Prevent legacy pink/white first paint. The Magius Link boot screen appears
   before any page DOM is visible and is removed by theme-mode-v1.js. */
html[data-call-preboot="true"] body{
  opacity:0!important;
}
html[data-call-preboot="true"]::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:2147483646;
  pointer-events:none;
  background-image:
    url('./magius-mark.svg?v=ui-r9-reader-edge'),
    url('./magius-link-wordmark.svg'),
    repeating-linear-gradient(0deg,rgba(0,0,0,.52) 0 .7px,transparent .7px 2px),
    url('./reader-textures/magi-lofi-grain.png'),
    radial-gradient(ellipse at 50% 48%,rgba(29,91,67,.42),rgba(5,31,23,.88) 48%,#020b08 100%);
  background-repeat:no-repeat,no-repeat,repeat,repeat,no-repeat;
  background-position:
    center calc(50% - 105px),
    center calc(50% + 6px),
    0 0,
    17px 11px,
    center;
  background-size:
    98px auto,
    min(58vw,360px) auto,
    auto,
    256px 256px,
    cover;
  filter:
    drop-shadow(-1px 0 .14px rgba(65,204,255,.62))
    drop-shadow(1.1px 0 .14px rgba(255,57,89,.56))
    drop-shadow(0 0 15px rgba(82,255,135,.22));
}
html[data-call-preboot="true"]::after{
  content:"LOADING  ▌  数据加载中";
  position:fixed;
  z-index:2147483647;
  left:50%;
  top:calc(50% + 105px);
  transform:translateX(-50%);
  width:max-content;
  max-width:82vw;
  color:#d9fff5;
  font:400 clamp(12px,2.2vw,18px)/1.2 var(--call-pixel-font);
  letter-spacing:.1em;
  text-shadow:
    -1px 0 .15px rgba(65,204,255,.72),
    1.1px 0 .15px rgba(255,57,89,.66),
    0 0 7px rgba(177,255,202,.56);
  pointer-events:none;
}
html[data-call-preboot="false"] body{
  opacity:1;
  transition:opacity .12s linear;
}
html[data-call-preboot="false"]::before,
html[data-call-preboot="false"]::after{
  content:none!important;
}

/* Legacy hamburger is hidden; v8 creates one consistent floating control on
   every interface instead of inheriting per-page menu bugs. */
.call-legacy-menu-hidden-v8{
  display:none!important;
}
.call-global-menu-v8{
  position:absolute;
  z-index:2480;
  left:12px;
  top:58px;
  width:44px;
  height:44px;
}
.call-global-menu-button-v8{
  display:grid!important;
  place-items:center!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid var(--call-border)!important;
  border-radius:1px!important;
  color:var(--call-text)!important;
  -webkit-text-fill-color:currentColor!important;
  background:color-mix(in srgb,var(--call-surface-raised) 96%,transparent)!important;
  box-shadow:
    0 0 0 1px color-mix(in srgb,var(--call-accent) 7%,transparent),
    var(--call-widget-shadow)!important;
}
.call-menu-glyph{
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:square;
  stroke-linejoin:miter;
}
.call-menu-glyph-close{display:none}
.call-global-menu-button-v8[aria-expanded="true"] .call-menu-glyph-open{display:none}
.call-global-menu-button-v8[aria-expanded="true"] .call-menu-glyph-close{display:block}
.call-global-menu-panel-v8{
  display:none;
  position:absolute;
  left:0;
  top:49px;
  width:min(330px,calc(100vw - 28px));
  max-height:calc(100dvh - 120px);
  overflow:auto;
  overscroll-behavior:contain;
  padding:7px;
  border:1px solid var(--call-border);
  background:color-mix(in srgb,var(--call-surface-raised) 97%,transparent);
  box-shadow:
    0 12px 32px rgba(0,0,0,.42),
    inset 0 0 0 1px color-mix(in srgb,var(--call-accent) 7%,transparent);
}
.call-global-menu-v8[data-open="true"] .call-global-menu-panel-v8{display:grid}
.call-global-menu-label-v8{
  padding:8px 9px 5px;
  color:var(--call-accent-strong);
  font-weight:800;
  letter-spacing:.04em;
  border-bottom:1px solid color-mix(in srgb,var(--call-border) 55%,transparent);
}
.call-global-menu-panel-v8 a{
  display:block;
  padding:8px 10px;
  color:var(--call-text)!important;
  -webkit-text-fill-color:currentColor!important;
  text-decoration:none!important;
  border:1px solid transparent;
  line-height:1.35;
}
.call-global-menu-panel-v8 a:hover,
.call-global-menu-panel-v8 a:focus-visible{
  background:var(--call-surface-soft)!important;
  border-color:var(--call-border)!important;
}
.call-global-menu-panel-v8 a[aria-current="page"]{
  color:var(--call-accent-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  background:var(--call-accent)!important;
  border-color:var(--call-accent)!important;
  box-shadow:var(--call-selected-shadow)!important;
}

/* Right utility controller: one Reader-like instrument with a shared frame.
   Drag from frame/gaps; there is no separate handle or mystery +/- key. */
.call-jump-widget-v7{
  right:17px!important;
  top:50%!important;
  width:46px!important;
  padding:4px 3px!important;
  gap:0!important;
  transform:translateY(-50%)!important;
  border:1px solid color-mix(in srgb,var(--call-border) 92%,transparent)!important;
  background:
    linear-gradient(180deg,
      color-mix(in srgb,var(--call-surface-raised) 94%,transparent),
      color-mix(in srgb,var(--call-surface-soft) 90%,transparent))!important;
  box-shadow:
    0 0 0 1px color-mix(in srgb,var(--call-accent) 9%,transparent),
    0 7px 24px rgba(0,0,0,.28),
    inset 0 1px color-mix(in srgb,var(--call-accent) 8%,transparent),
    inset 0 -1px rgba(0,0,0,.28)!important;
  cursor:grab;
  touch-action:none;
}
.call-jump-widget-v7.is-dragging{cursor:grabbing}
.call-jump-widget-v7.is-positioned{transform:none!important}
.call-jump-actions-v7,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7){
  width:100%!important;
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  width:38px!important;
  min-width:38px!important;
  height:35px!important;
  min-height:35px!important;
  margin:0 auto!important;
  padding:0 .05rem!important;
  border:0!important;
  border-bottom:1px solid color-mix(in srgb,var(--call-border) 65%,transparent)!important;
  border-radius:0!important;
  color:var(--call-text)!important;
  -webkit-text-fill-color:currentColor!important;
  background:transparent!important;
  background-color:transparent!important;
  box-shadow:none!important;
  outline:0!important;
  opacity:1!important;
  font:750 .67rem/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  cursor:pointer;
  touch-action:manipulation;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:last-child{
  border-bottom:0!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button[data-action="top"],
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button[data-action="bottom"]{
  font:400 1.05rem/1 var(--call-pixel-font)!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:hover,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:focus-visible{
  color:var(--call-accent-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  background:var(--call-accent)!important;
  box-shadow:
    inset 2px 0 color-mix(in srgb,var(--call-accent-ink) 52%,transparent),
    0 0 8px color-mix(in srgb,var(--call-accent) 28%,transparent)!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button[data-action="cancel"]{
  color:var(--call-muted)!important;
}
.call-jump-collapse-v7{display:none!important}

/* Theme-aware open/close state chips. Lit chips always use dark ink. */
:root[data-call-theme] body :is(
  .suite-panel-details-v8>summary::after,
  .call-panel-v8>summary::after,
  .character-grid-details-v8>summary::after,
  .call-details-state-v10::before,
  .runes-reference-details-v9>summary::after
){
  border-radius:1px!important;
  color:var(--call-text)!important;
  -webkit-text-fill-color:currentColor!important;
  background:var(--call-surface-raised)!important;
  border:1px solid var(--call-border)!important;
  box-shadow:none!important;
}
:root[data-call-theme] body :is(
  .suite-panel-details-v8[open]>summary::after,
  .call-panel-v8[open]>summary::after,
  .character-grid-details-v8[open]>summary::after,
  .call-help-details-v10[open] .call-details-state-v10::before,
  .call-table-details-v10[open] .call-details-state-v10::before,
  .runes-reference-details-v9[open]>summary::after
){
  color:var(--call-accent-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  background:var(--call-accent)!important;
  border-color:var(--call-accent)!important;
  text-shadow:none!important;
}

/* All directory/grid gutters inherit theme material; no white strips between
   dark/frost character cards and no un-themed day-mode empty blocks. */
:root[data-call-theme] body :is(
  .suite-character-grid,#storyCharacterGrid,#attendanceGrid,
  div.magicalgirl,.character-grid-details-v8>.suite-character-grid
){
  background:var(--call-surface)!important;
  background-color:var(--call-surface)!important;
  border-color:var(--call-border)!important;
}
:root[data-call-theme] body :is(.suite-character-card,label.girlbox)[aria-pressed="true"],
:root[data-call-theme] body label.girlbox:has(input.MagicalChk:checked),
:root[data-call-theme] body label.girlbox.is-selected-v11{
  outline:2px solid var(--call-accent)!important;
  outline-offset:-2px!important;
  box-shadow:
    inset 0 -3px 0 var(--call-card-accent,var(--call-accent)),
    0 0 8px color-mix(in srgb,var(--call-accent) 24%,transparent)!important;
}
:root:is([data-call-theme="dark"],[data-call-theme="frost"]) body :is(
  .suite-character-card,label.girlbox,label.girlbox.leftm
){
  background:var(--call-card-bg)!important;
  background-color:var(--call-card-bg)!important;
  color:var(--call-card-text)!important;
}

/* Frost: stronger Reader cold-film glow and low-fi softness. */
:root[data-call-theme="frost"] .call-display-root-v7 :is(
  h1,h2,h3,h4,h5,h6,a,button,label,summary,strong,b,.suite-character-card strong,label.girlbox
){
  text-shadow:
    -.035em 0 .045em rgba(80,187,175,.42),
    .035em .012em .024em rgba(112,214,212,.32),
    0 0 .11em rgba(120,216,201,.42),
    0 0 .28em rgba(78,224,197,.20)!important;
}
:root[data-call-theme="frost"] .call-display-root-v7 :is(
  .suite-nav a[aria-current="page"],
  .call-theme-option-v7[aria-pressed="true"],
  .call-global-menu-panel-v8 a[aria-current="page"],
  .suite-character-card[aria-pressed="true"],
  label.girlbox:has(input.MagicalChk:checked)
){
  filter:
    drop-shadow(0 0 3px rgba(220,255,246,.38))
    drop-shadow(0 0 10px rgba(93,232,215,.34))!important;
}
:root[data-call-theme="frost"][data-call-ios="false"] .call-display-scroll-v7{
  filter:blur(.11px) saturate(.95) contrast(.99);
}

/* Selected/lit controls across every theme use the correct ink contrast. */
:root[data-call-theme] .call-display-root-v7 :is(
  .suite-nav a[aria-current="page"],
  .call-theme-option-v7[aria-pressed="true"],
  .call-fx-segment-v7 button[aria-pressed="true"],
  .call-global-menu-panel-v8 a[aria-current="page"],
  .menu .thismenu,
  .runes-mask-toolbar-v9 [data-mask-mode].is-active
){
  color:var(--call-accent-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  text-shadow:none!important;
}

/* Settings title bar is the drag surface; there is no independent drag key. */
.call-fx-titlebar-v7{
  grid-template-columns:minmax(0,1fr) 38px!important;
  cursor:grab;
  touch-action:none;
}
.call-fx-window-v7.is-dragging .call-fx-titlebar-v7{cursor:grabbing}
.call-fx-grip-v7{display:none!important}

/* iOS stays on static materials; Android may keep the bounded lens. */
:root[data-call-ios="true"] .call-display-scroll-v7{
  filter:none!important;
}

/* Mobile placement leaves the global hamburger and right instrument inside the
   physical CRT glass and below the material overlay. */
@media(max-width:760px){
  .call-global-menu-v8{
    left:8px;
    top:54px;
  }
  .call-global-menu-panel-v8{
    width:min(310px,calc(100vw - 24px));
  }
  .call-jump-widget-v7{
    right:8px!important;
    width:44px!important;
  }
  .call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button{
    width:36px!important;
    min-width:36px!important;
    height:35px!important;
  }
  :root[data-call-theme="frost"][data-call-ios="false"] .call-display-scroll-v7{
    filter:blur(.08px) saturate(.95) contrast(.99);
  }
}


/* ===== v7.4 mobile stability / frost emphasis ===== */
/* Mobile keeps one physical curved tube, but avoids the expensive full-scene
   SVG displacement that produced compositor seams and scroll jank. The whole
   screen, including the right rail, shares the same safe lens transform. */
@media(max-width:760px){
  :root[data-call-fx-curvature="true"] .call-display-root-v7{
    filter:none!important;
    -webkit-filter:none!important;
    transform:perspective(1200px) scale(.994,.988)!important;
    -webkit-transform:perspective(1200px) scale(.994,.988)!important;
    transform-origin:center center!important;
    -webkit-transform-origin:center center!important;
  }
  :root[data-call-fx-curvature="true"] .call-reader-screen-v7{
    border-radius:inherit!important;
  }
}

/* Frost carries its own cold emission and exposed-film softness even when the
   expensive desktop optics pass is unavailable. */
:root[data-call-theme="frost"] .call-display-root-v7 :is(
  .suite-panel,.call-panel-v8,.character-grid-details-v8,.suite-result-group,
  .call-global-menu-panel-v8,.call-jump-widget-v7
){
  box-shadow:
    inset 0 0 12px rgba(78,183,177,.16),
    inset 0 1px rgba(234,255,250,.19),
    0 0 8px rgba(93,232,215,.08)!important;
}
:root[data-call-theme="frost"] .call-display-root-v7 :is(
  .suite-nav a[aria-current="page"],
  .call-theme-option-v7[aria-pressed="true"],
  .call-global-menu-panel-v8 a[aria-current="page"],
  .suite-checks label:has(input:checked)
){
  color:var(--call-accent-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  background:var(--call-accent)!important;
  text-shadow:none!important;
  box-shadow:
    inset 0 0 10px rgba(215,255,243,.26),
    0 0 5px rgba(215,255,243,.58),
    0 0 15px rgba(93,232,215,.38),
    0 0 28px rgba(64,200,192,.20)!important;
}
:root[data-call-theme="frost"][data-call-ios="false"] .call-display-root-v7 img{
  filter:saturate(.93) contrast(.98);
}


/* Integrated drag affordance: part of the Reader-style frame, never a separate button. */
.call-jump-widget-v7::before{
  content:"";
  display:block;
  width:28px;
  height:7px;
  margin:0 auto 2px;
  pointer-events:none;
  opacity:.58;
  background:
    radial-gradient(circle,currentColor 0 1px,transparent 1.2px) 0 0/7px 7px repeat-x;
  color:var(--call-muted);
}
:root[data-call-theme-bar-mode="floating"] .call-theme-widget-v7::before{
  content:"";
  flex:0 0 8px;
  width:8px;
  align-self:stretch;
  pointer-events:none;
  opacity:.48;
  background:
    radial-gradient(circle,currentColor 0 1px,transparent 1.2px) center 2px/6px 6px repeat-y;
  color:var(--call-muted);
}


/* ===== v7.5 Reader fidelity restoration =====
 * Keep the v7.4 structure, but restore the optical intensity and the exact
 * explicit drag-handle interaction used by MagiReader.
 */
:root[data-call-theme="dark"]{
  --call-reader-text-echo:
    clamp(-1.8px,calc(.91px - .124em),-.08px) 0 .016em rgba(255,232,82,.88),
    clamp(.1px,calc(.16em - 1.17px),2.3px) 0 .018em rgba(52,249,22,.82),
    0 0 .12em rgba(166,247,82,.24);
  --call-reader-inverse-echo:
    clamp(.08px,calc(.14em - 1.03px),1.7px) 0 .007em #fffef1,
    clamp(.12px,calc(.21em - 1.52px),2.6px) .006em .015em #ffffd980;
}
:root[data-call-theme="dark"][data-call-phosphor="amber"]{
  --call-reader-text-echo:
    clamp(.05px,calc(.12em - .89px),1.65px) 0 0 #140a0c,
    clamp(.08px,calc(.27em - 2px),3.6px) .007em .007em #ff410de8,
    -.012em 0 .007em #fffad355,
    0 0 .16em #ffa72d35;
  --call-reader-inverse-echo:
    0 0 .035em rgba(189,43,19,.96),
    clamp(.08px,calc(.14em - 1.03px),1.7px) 0 .007em #fffef1,
    clamp(.12px,calc(.21em - 1.52px),2.6px) .006em .015em #ffffd980;
}
:root[data-call-theme="frost"]{
  --call-reader-text-echo:
    clamp(-1.4px,calc(.75px - .13em),-.08px) .025em .055em #50bbaf70,
    .04em .015em .025em #70d6d44d,
    0 0 .11em #78d8c966,
    0 0 3px rgba(159,243,223,.55),
    0 0 8px rgba(78,224,197,.32);
}

/* Restore Reader's stronger phosphor ink instead of the restrained v7.4 echo. */
:root[data-call-theme="dark"] .call-display-root-v7 :is(
  button,input,textarea,select,a,span,p,h1,h2,h3,h4,h5,h6,label,legend,summary,strong,b,small,li,td,th
){
  text-shadow:var(--call-reader-text-echo)!important;
}
:root[data-call-theme="frost"] .call-display-root-v7 :is(
  button,input,textarea,select,a,span,p,h1,h2,h3,h4,h5,h6,label,legend,summary,strong,b,small,li,td,th
){
  text-shadow:var(--call-reader-text-echo)!important;
}
:root[data-call-theme="dark"] .call-display-root-v7 :is(
  .suite-nav a[aria-current="page"],
  .call-theme-option-v7[aria-pressed="true"],
  .call-global-menu-panel-v8 a[aria-current="page"]
){
  text-shadow:var(--call-reader-inverse-echo)!important;
}

/* Legacy raster intensity; r11 below owns the final static material recipe. */
:root[data-call-theme="dark"] .call-fx-night-phosphor-v7{
  opacity:.38!important;
}
:root[data-call-theme="dark"] .call-fx-night-grain-v7{
  inset:-12px!important;
  opacity:.23!important;
  will-change:transform;
  animation:none;
}
:root[data-call-theme="dark"][data-call-phosphor="amber"] .call-fx-night-grain-v7{
  opacity:.25!important;
}


/* Bundled low-fi film focus: visible on Android/desktop, off only on iOS. */
:root[data-call-fx-noise="true"][data-call-ios="false"] .call-fx-film-focus-v7{
  display:block!important;
  backdrop-filter:blur(.18px) saturate(.98) contrast(.995)!important;
  -webkit-backdrop-filter:blur(.18px) saturate(.98) contrast(.995)!important;
}
:root[data-call-theme="dark"][data-call-fx-noise="true"][data-call-ios="false"] .call-fx-film-focus-v7{
  backdrop-filter:blur(.30px) saturate(.97) contrast(1.01)!important;
  -webkit-backdrop-filter:blur(.30px) saturate(.97) contrast(1.01)!important;
}
:root[data-call-theme="frost"][data-call-ios="false"] .call-fx-film-focus-v7{
  display:block!important;
  backdrop-filter:blur(.26px) saturate(.95) contrast(.99)!important;
  -webkit-backdrop-filter:blur(.26px) saturate(.95) contrast(.99)!important;
}

/* Slow roll + occasional tracking sweep, bundled with night noise. */
:root[data-call-theme="dark"][data-call-fx-noise="true"] .call-fx-rolling-band-v7{
  display:block;
  left:-3%;
  right:-3%;
  height:16%;
  inset-inline:-3%;
  top:-18%;
  opacity:.34;
  background:linear-gradient(
    180deg,
    transparent 0,
    rgba(145,255,181,.035) 30%,
    rgba(213,255,229,.13) 47%,
    rgba(255,255,255,.08) 50%,
    rgba(0,0,0,.24) 54%,
    transparent 100%
  );
  filter:blur(.58px);
  -webkit-filter:blur(.58px);
  animation:none;
}

.call-fx-tracking-v7{
  left:-3%!important;
  right:-3%!important;
  inset-inline:-3%!important;
  top:-18%;
  height:13%;
  opacity:0;
  background:
    linear-gradient(180deg,
      transparent 0,
      rgba(216,255,229,.07) 22%,
      rgba(255,255,255,.20) 48%,
      rgba(0,0,0,.28) 59%,
      transparent 100%),
    repeating-linear-gradient(90deg,
      rgba(65,204,255,.12) 0 2px,
      rgba(255,57,89,.12) 2px 4px,
      transparent 4px 12px);
  box-shadow:
    -2px 0 0 rgba(65,204,255,.42),
    2px 0 0 rgba(255,57,89,.40),
    0 2px 9px rgba(128,255,159,.12);
  backdrop-filter:blur(.34px) brightness(1.08);
  -webkit-backdrop-filter:blur(.34px) brightness(1.08);
}
:root[data-call-tracking="true"] .call-fx-tracking-v7{
  display:block;
  opacity:.74;
  animation:none;
}


/* The actual Reader drag handle: explicit, reliable pointer capture, and part
   of the instrument frame rather than a mystery free-floating box. */
.call-floating-grip-v7{
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  margin:0!important;
  color:var(--call-muted)!important;
  -webkit-text-fill-color:currentColor!important;
  background:color-mix(in srgb,var(--call-surface-soft) 88%,transparent)!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  font:700 .72rem/1 var(--call-pixel-font)!important;
  letter-spacing:-.16em;
  cursor:grab!important;
  touch-action:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}
.call-floating-widget-v7.is-dragging .call-floating-grip-v7{
  cursor:grabbing!important;
  background:color-mix(in srgb,var(--call-accent) 14%,var(--call-surface-soft))!important;
}
.call-jump-widget-v7{
  display:grid!important;
  grid-template-rows:18px minmax(0,1fr)!important;
  width:48px!important;
  padding:3px!important;
}
.call-jump-grip-v7{
  width:40px!important;
  min-width:40px!important;
  height:17px!important;
  min-height:17px!important;
  border-bottom:1px solid color-mix(in srgb,var(--call-border) 60%,transparent)!important;
}
.call-jump-widget-v7::before{display:none!important}
.call-jump-actions-v7{
  min-height:0!important;
}
.call-theme-grip-v7{
  width:18px!important;
  min-width:18px!important;
  height:38px!important;
  min-height:38px!important;
  border-right:1px solid color-mix(in srgb,var(--call-border) 62%,transparent)!important;
}
:root[data-call-theme-bar-mode="top"] .call-theme-grip-v7{
  display:none!important;
}
:root[data-call-theme-bar-mode="floating"] .call-theme-grip-v7{
  display:grid!important;
}
:root[data-call-theme-bar-mode="floating"] .call-theme-widget-v7::before{
  display:none!important;
}

/* Right rail should read like a Reader utility instrument, not stacked cards. */
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button{
  width:40px!important;
  min-width:40px!important;
  height:32px!important;
  min-height:32px!important;
  border:0!important;
  border-bottom:1px solid color-mix(in srgb,var(--call-border) 58%,transparent)!important;
  background:transparent!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:hover,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:focus-visible{
  color:var(--call-accent-ink)!important;
  background:var(--call-accent)!important;
  box-shadow:var(--call-selected-shadow)!important;
}

/* Physical tube: the same bounded signal and bezel on all platforms. Android
   gets the full lens; iOS uses the Reader-safe perspective fallback. */
:root[data-call-fx-curvature="true"] .call-display-root-v7{
  inset:10px!important;
  border-radius:18px/13px!important;
  clip-path:none!important;
  box-shadow:
    0 0 0 1px rgba(40,55,44,.50),
    0 0 34px rgba(0,0,0,.92),
    inset 0 0 3px rgba(218,233,213,.18),
    inset 0 0 17px rgba(0,0,0,.68)!important;
}
:root[data-call-fx-curvature="true"] .call-fx-vignette-v7{
  background:
    radial-gradient(ellipse at 50% 47%,
      transparent 34%,
      rgba(0,0,0,.02) 57%,
      rgba(0,0,0,.12) 76%,
      rgba(0,0,0,.31) 91%,
      rgba(0,0,0,.66) 100%),
    linear-gradient(90deg,rgba(0,0,0,.28),transparent 8% 92%,rgba(0,0,0,.30))!important;
  box-shadow:
    inset 0 0 3px rgba(218,233,213,.19),
    inset 0 0 20px rgba(0,0,0,.66),
    inset 0 0 56px rgba(0,0,0,.25)!important;
}
:root[data-call-ios="true"][data-call-fx-curvature="true"] .call-display-root-v7{
  filter:none!important;
  -webkit-filter:none!important;
  transform:perspective(1200px) scale(.992,.986)!important;
  -webkit-transform:perspective(1200px) scale(.992,.986)!important;
  transform-origin:center center!important;
}

/* Preserve raster quality on mobile; only the expensive continuous layers are
   reduced. This mirrors MadeInMagius rather than deleting the visual language. */
@media(max-width:760px){
  :root[data-call-ios="false"][data-call-optics-active="true"] .call-display-root-v7{
    filter:var(--call-active-tube-filter, none)!important;
    -webkit-filter:var(--call-active-tube-filter, none)!important;
  }
  :root[data-call-theme="dark"] .call-fx-night-phosphor-v7{opacity:.36!important}
  :root[data-call-theme="dark"] .call-fx-night-grain-v7{opacity:.21!important}
  :root[data-call-theme="dark"] .call-fx-rolling-band-v7{opacity:.29!important}
  .call-jump-widget-v7{width:46px!important}
  .call-jump-grip-v7{width:38px!important;min-width:38px!important}
}
:root[data-call-ios="true"] .call-fx-rolling-band-v7,
:root[data-call-ios="true"] .call-fx-tracking-v7{
  animation:none!important;
  display:none!important;
}
@media(prefers-reduced-motion:reduce){
  .call-fx-night-grain-v7,
  .call-fx-rolling-band-v7,
  .call-fx-tracking-v7{
    animation:none!important;
  }
}


/* ===== v7.6 fail-open + MAGIUS background + Reader CRT refinement ===== */

/* The boot card is a cover, never a visibility gate. If JS dies, the page is
   already rendered underneath and these pseudo-elements self-dismiss. */
html[data-call-preboot="true"] body{
  opacity:1!important;
  visibility:visible!important;
}
@keyframes call-preboot-failopen-v76{
  0%,82%{opacity:1;visibility:visible}
  99%{opacity:.01;visibility:visible}
  100%{opacity:0;visibility:hidden}
}
html[data-call-preboot="true"]::before,
html[data-call-preboot="true"]::after{
  animation:call-preboot-failopen-v76 3.6s linear forwards!important;
}

/* MAGIUS is a fixed phosphor watermark behind the application, not a giant
   foreground heading. The actual page typography keeps its normal hierarchy. */
.call-brand-watermark-v8{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  user-select:none;
  display:grid;
  grid-template-rows:auto auto;
  align-content:center;
  justify-items:center;
  justify-content:center;
  transform:translate3d(0,-2.5vh,0);
  opacity:.055;
  overflow:hidden;
  mix-blend-mode:screen;
}
.call-brand-watermark-v8 img{
  display:block;
  max-width:none;
  height:auto;
  color:var(--call-accent);
  filter:
    drop-shadow(-.7px 0 .12px rgba(63,197,255,.34))
    drop-shadow(.8px 0 .12px rgba(255,54,88,.31))
    drop-shadow(0 0 9px color-mix(in srgb,var(--call-accent) 22%,transparent));
}
.call-brand-emblem-v8{
  width:min(33vw,520px);
  max-height:44vh;
}
.call-brand-wordmark-v8{
  width:min(62vw,980px);
  margin-top:clamp(-18px,-1vw,-7px);
  opacity:.82;
}
:root[data-call-theme="dark"] .call-brand-watermark-v8{opacity:.095}
:root[data-call-theme="frost"] .call-brand-watermark-v8{opacity:.07}
:root[data-call-theme="green"] .call-brand-watermark-v8{opacity:.052}
.call-display-scroll-v7{
  z-index:1;
}

/* Reader-equivalent bounded glass: shallow black overscan, curved signal edge,
   and dark falloff rather than a thick rounded phone-like frame. */
:root[data-call-fx-curvature="true"] .call-display-root-v7{
  inset:5px!important;
  border:0!important;
  border-radius:clamp(22px,2.2vw,42px)/clamp(20px,3vh,34px)!important;
  clip-path:inset(0 round clamp(22px,2.2vw,42px)/clamp(20px,3vh,34px))!important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.92),
    0 0 24px 4px rgba(0,0,0,.92),
    inset 0 0 2px 1px rgba(0,0,0,.88),
    inset 0 0 10px 3px rgba(0,0,0,.56),
    inset 0 0 28px 5px rgba(0,0,0,.28)!important;
}
:root[data-call-fx-curvature="true"] .call-fx-vignette-v7{
  display:block!important;
  background:
    radial-gradient(ellipse at 50% 48%,
      transparent 0 53%,
      rgba(0,0,0,.04) 67%,
      rgba(0,0,0,.22) 84%,
      rgba(0,0,0,.56) 96%,
      rgba(0,0,0,.82) 100%),
    linear-gradient(90deg,rgba(0,0,0,.28),transparent 7% 93%,rgba(0,0,0,.30))!important;
  box-shadow:
    inset 0 0 3px rgba(218,233,213,.15),
    inset 0 0 22px rgba(0,0,0,.64),
    inset 0 0 52px rgba(0,0,0,.22)!important;
}
:root[data-call-fx-curvature="true"] .call-fx-bezel-v7{
  display:block!important;
  border-radius:inherit!important;
  box-shadow:
    inset 0 0 2px 1px rgba(0,0,0,.90),
    inset 0 0 9px 3px rgba(0,0,0,.58),
    inset 0 0 24px 4px rgba(0,0,0,.25)!important;
}

/* Night raster follows MagiReader's phosphor recipe: fine scan structure,
   real texture grain, tiny focus loss, and restrained bloom around the signal. */
:root[data-call-theme="dark"][data-call-fx-noise="true"] .call-fx-night-phosphor-v7{
  display:block!important;
  opacity:.44!important;
  background:
    repeating-linear-gradient(0deg,rgba(5,0,2,.52) 0 .6px,transparent .6px 2px),
    url('./reader-textures/NoiseAndGrain.png') 0 0/128px 64px repeat,
    url('./reader-textures/PixelOverlay_RGB_16.png') 0 0/4px 4px repeat!important;
  background-blend-mode:multiply,soft-light,normal!important;
  mix-blend-mode:soft-light!important;
}
:root[data-call-theme="dark"][data-call-fx-noise="true"] .call-fx-night-grain-v7{
  opacity:.22!important;
  mix-blend-mode:screen!important;
}
:root[data-call-theme="dark"][data-call-fx-noise="true"][data-call-ios="false"] .call-fx-film-focus-v7{
  display:block!important;
  backdrop-filter:blur(.34px) saturate(.965) contrast(1.008)!important;
  -webkit-backdrop-filter:blur(.34px) saturate(.965) contrast(1.008)!important;
}

/* A faint secondary line field prevents the screen from looking like a perfect
   repeating CSS ruler. It moves by fractions of a pixel, independently of the
   larger vertical-sync events below. */
:root[data-call-theme="dark"][data-call-fx-scanlines="true"] .call-fx-scanlines-v7{
  display:block!important;
  opacity:.13!important;
  mix-blend-mode:multiply!important;
  background:
    repeating-linear-gradient(0deg,
      transparent 0 11px,
      rgba(1,0,1,.25) 11px 11.45px,
      transparent 11.45px 27px),
    repeating-linear-gradient(0deg,
      rgba(4,0,2,.24) 0 .34px,
      transparent .34px 2.35px)!important;
  animation:none;
}


/* Continuous sub-pixel timebase instability. This moves the page signal, not
   the physical CRT shell, so curvature itself remains stationary. */
:root[data-call-theme="dark"][data-call-fx-noise="true"] .call-display-scroll-v7{
  will-change:transform,opacity;
  animation:none;
}


/* Cyan-left / red-right channel registration from the MadeInMagius CRT pass. */
:root[data-call-theme="dark"][data-call-fx-registration="true"] .call-display-scroll-v7 :is(
  h1,h2,h3,h4,legend,label,button,a,input,textarea,select,option,small,strong,b,
  .suite-nav,.suite-nav *,[role="button"],[role="tab"],[role="menuitem"]
){
  text-shadow:
    -1.0px 0 .14px rgba(63,197,255,.60),
    1.1px 0 .14px rgba(255,54,88,.57),
    0 0 2.6px rgba(187,255,203,.15)!important;
}

/* Irregular sync faults: most travel down, some upward, and some arrive from
   both edges toward the centre. */
:root[data-call-tracking="true"][data-call-tracking-mode="down"] .call-fx-tracking-v7{
  display:block!important;
  top:-18%!important;
  bottom:auto!important;
  height:12%!important;
  opacity:.80!important;
  animation:none;
}
:root[data-call-tracking="true"][data-call-tracking-mode="up"] .call-fx-tracking-v7{
  display:block!important;
  top:auto!important;
  bottom:-18%!important;
  height:12%!important;
  opacity:.80!important;
  animation:none;
}


:root[data-call-tracking="true"][data-call-tracking-mode="converge"] .call-fx-tracking-v7{
  display:block!important;
  inset:0!important;
  width:auto!important;
  height:auto!important;
  opacity:1!important;
  background:none!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  animation:none!important;
}
:root[data-call-tracking-mode="converge"] .call-fx-tracking-v7::before,
:root[data-call-tracking-mode="converge"] .call-fx-tracking-v7::after{
  content:"";
  position:absolute;
  left:-3%;
  right:-3%;
  height:10.5%;
  opacity:.80;
  background:
    linear-gradient(180deg,
      transparent 0,
      rgba(216,255,229,.07) 22%,
      rgba(255,255,255,.20) 48%,
      rgba(0,0,0,.28) 59%,
      transparent 100%),
    repeating-linear-gradient(90deg,
      rgba(63,197,255,.12) 0 2px,
      rgba(255,54,88,.12) 2px 4px,
      transparent 4px 12px);
  box-shadow:
    -1.5px 0 0 rgba(63,197,255,.38),
    1.6px 0 0 rgba(255,54,88,.37),
    0 2px 8px rgba(128,255,159,.11);
  filter:blur(.22px);
}
:root[data-call-tracking="true"][data-call-tracking-mode="converge"] .call-fx-tracking-v7::before{
  top:-13%;
  animation:none;
}
:root[data-call-tracking="true"][data-call-tracking-mode="converge"] .call-fx-tracking-v7::after{
  bottom:-13%;
  animation:none;
}



@media(max-width:760px){
  .call-brand-watermark-v8{
    transform:translate3d(0,-1.5vh,0);
  }
  .call-brand-emblem-v8{
    width:min(58vw,310px);
    max-height:34vh;
  }
  .call-brand-wordmark-v8{
    width:min(82vw,440px);
    margin-top:-6px;
  }
  :root[data-call-theme="dark"] .call-brand-watermark-v8{opacity:.09}

  :root[data-call-fx-curvature="true"] .call-display-root-v7{
    inset:4px!important;
    border-radius:clamp(25px,8vw,44px)/clamp(18px,3.6vh,34px)!important;
    clip-path:inset(0 round clamp(25px,8vw,44px)/clamp(18px,3.6vh,34px))!important;
    box-shadow:
      0 0 0 1px #000,
      0 0 16px 3px #000,
      inset 0 0 2px 1px rgba(0,0,0,.9),
      inset 0 0 9px 3px rgba(0,0,0,.58),
      inset 0 0 24px 4px rgba(0,0,0,.25)!important;
  }

  :root[data-call-theme="dark"] .call-fx-night-phosphor-v7{opacity:.40!important}
  :root[data-call-theme="dark"] .call-fx-night-grain-v7{opacity:.19!important}
  :root[data-call-theme="dark"] .call-fx-scanlines-v7{opacity:.105!important}
  :root[data-call-theme="dark"] .call-display-scroll-v7{
    animation-duration:.22s!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .call-display-scroll-v7,
  .call-fx-scanlines-v7{
    animation:none!important;
  }
}


/* ===== v7.7 Reader control fidelity / frost emission ===== */

/* The right controller is a single Reader instrument: one header, one drag
   strip, one collapse key, then a continuous action stack. */
.call-jump-widget-v7{
  width:50px!important;
  min-width:50px!important;
  padding:2px!important;
  display:grid!important;
  grid-template-rows:23px minmax(0,1fr)!important;
  gap:0!important;
  border:1px solid color-mix(in srgb,var(--call-border) 88%,transparent)!important;
  background:
    linear-gradient(180deg,
      color-mix(in srgb,var(--call-surface-raised) 96%,transparent),
      color-mix(in srgb,var(--call-surface-soft) 91%,transparent))!important;
  box-shadow:
    0 8px 24px rgba(0,0,0,.25),
    inset 0 1px color-mix(in srgb,var(--call-accent) 9%,transparent),
    inset 0 -1px rgba(0,0,0,.32)!important;
  transition:width .14s ease,min-width .14s ease,opacity .14s ease!important;
}
.call-jump-head-v7{
  width:100%;
  height:23px;
  min-height:23px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 18px;
  align-items:stretch;
  border-bottom:1px solid color-mix(in srgb,var(--call-border) 62%,transparent);
  background:
    linear-gradient(90deg,
      color-mix(in srgb,var(--call-accent) 7%,transparent),
      transparent 52%);
  cursor:grab;
  touch-action:none;
}
.call-jump-widget-v7.is-dragging .call-jump-head-v7{cursor:grabbing}
.call-jump-grip-v7{
  width:auto!important;
  min-width:0!important;
  height:22px!important;
  min-height:22px!important;
  border:0!important;
  border-right:1px solid color-mix(in srgb,var(--call-border) 52%,transparent)!important;
  background:transparent!important;
  letter-spacing:-.14em!important;
}
.call-jump-grip-v7>span{
  transform:rotate(90deg);
  opacity:.78;
}
.call-jump-collapse-v7{
  display:grid!important;
  place-items:center!important;
  width:18px!important;
  min-width:18px!important;
  height:22px!important;
  min-height:22px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  color:var(--call-muted)!important;
  -webkit-text-fill-color:currentColor!important;
  background:transparent!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
.call-jump-collapse-v7 svg{
  width:12px;
  height:12px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:square;
  stroke-linejoin:miter;
  transition:transform .14s ease;
}
.call-jump-collapse-v7:hover,
.call-jump-collapse-v7:focus-visible{
  color:var(--call-accent-strong)!important;
  background:color-mix(in srgb,var(--call-accent) 10%,transparent)!important;
}
.call-jump-widget-v7.is-collapsed{
  width:27px!important;
  min-width:27px!important;
  padding:2px!important;
  grid-template-rows:23px!important;
}
.call-jump-widget-v7.is-collapsed .call-jump-head-v7{
  grid-template-columns:1fr!important;
  border-bottom:0!important;
}
.call-jump-widget-v7.is-collapsed .call-jump-grip-v7{
  display:none!important;
}
.call-jump-widget-v7.is-collapsed .call-jump-collapse-v7{
  width:21px!important;
  min-width:21px!important;
}
.call-jump-widget-v7.is-collapsed .call-jump-collapse-v7 svg{
  transform:rotate(180deg);
}
.call-jump-widget-v7.is-collapsed .call-jump-actions-v7{
  display:none!important;
}

/* Continuous stack; labels stay short and the frame carries the grouping. */
.call-jump-actions-v7{
  padding:0 2px 1px!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7){
  gap:0!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button{
  width:42px!important;
  min-width:42px!important;
  height:33px!important;
  min-height:33px!important;
  margin:0!important;
  border:0!important;
  border-bottom:1px solid color-mix(in srgb,var(--call-border) 53%,transparent)!important;
  background:transparent!important;
  font-family:var(--call-pixel-font)!important;
  font-size:.65rem!important;
  font-weight:700!important;
  letter-spacing:.01em!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:last-child{
  border-bottom:0!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:hover,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:focus-visible{
  color:var(--call-accent-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  background:var(--call-accent)!important;
  text-shadow:none!important;
  box-shadow:
    inset 2px 0 color-mix(in srgb,var(--call-accent-ink) 55%,transparent),
    0 0 6px color-mix(in srgb,var(--call-accent) 22%,transparent)!important;
}

/* Floating theme mode gets a real grip with a usable hit target. */
:root[data-call-theme-bar-mode="floating"] .call-theme-widget-v7{
  padding:2px!important;
  gap:0!important;
  border-color:color-mix(in srgb,var(--call-border) 90%,transparent)!important;
}
:root[data-call-theme-bar-mode="floating"] .call-theme-grip-v7{
  width:25px!important;
  min-width:25px!important;
  height:40px!important;
  min-height:40px!important;
  border-right:1px solid color-mix(in srgb,var(--call-border) 58%,transparent)!important;
  background:
    radial-gradient(circle,currentColor 0 1px,transparent 1.2px) center 7px/6px 6px repeat-y!important;
  color:var(--call-muted)!important;
}
:root[data-call-theme-bar-mode="floating"] .call-theme-grip-v7>span{
  opacity:0;
}
.call-theme-widget-v7.is-dragging{
  box-shadow:
    0 8px 26px rgba(0,0,0,.30),
    0 0 9px color-mix(in srgb,var(--call-accent) 22%,transparent)!important;
}

/* Frost must read as cold illuminated glass, not merely teal dark mode. */
:root[data-call-theme="frost"]{
  --call-reader-frost-halo:
    0 0 1px rgba(235,255,250,.96),
    0 0 5px rgba(137,255,230,.58),
    0 0 13px rgba(71,222,207,.34),
    0 0 27px rgba(28,140,153,.18);
}
:root[data-call-theme="frost"] .call-display-root-v7 :is(
  h1,h2,h3,h4,h5,h6,
  .suite-nav a,
  .call-theme-option-v7,
  .call-floating-utility-v7,
  .call-jump-widget-v7 button,
  .call-global-menu-panel-v8 a,
  .call-fx-title-copy-v7 strong
){
  text-shadow:
    -.45px 0 .5px rgba(112,216,209,.40),
    .45px .12px .35px rgba(220,255,249,.40),
    0 0 2px rgba(218,255,247,.72),
    0 0 7px rgba(93,232,215,.46),
    0 0 16px rgba(64,200,192,.22)!important;
}
:root[data-call-theme="frost"] .call-display-root-v7 :is(
  .suite-nav a[aria-current="page"],
  .call-theme-option-v7[aria-pressed="true"],
  .call-global-menu-panel-v8 a[aria-current="page"],
  .call-jump-widget-v7 button:hover,
  .call-jump-widget-v7 button:focus-visible
){
  box-shadow:
    inset 0 0 9px rgba(230,255,250,.24),
    0 0 3px rgba(230,255,250,.72),
    0 0 11px rgba(93,232,215,.48),
    0 0 24px rgba(46,184,184,.24)!important;
}
:root[data-call-theme="frost"] .call-jump-widget-v7,
:root[data-call-theme="frost"] .call-theme-widget-v7,
:root[data-call-theme="frost"] .call-fx-window-v7{
  background:
    linear-gradient(180deg,rgba(3,31,34,.90),rgba(1,17,22,.94))!important;
  border-color:rgba(122,236,220,.42)!important;
  box-shadow:
    inset 0 0 14px rgba(78,183,177,.17),
    inset 0 1px rgba(234,255,250,.24),
    0 0 9px rgba(93,232,215,.13),
    0 8px 28px rgba(0,0,0,.30)!important;
}

/* Avoid accidentally dragging the signal while a floating UI is being moved. */
:root[data-call-dragging="true"] .call-display-scroll-v7{
  animation-play-state:paused!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}

@media(max-width:760px){
  .call-jump-widget-v7{
    right:7px!important;
    width:46px!important;
    min-width:46px!important;
  }
  .call-jump-widget-v7.is-collapsed{
    width:26px!important;
    min-width:26px!important;
  }
  .call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button{
    width:38px!important;
    min-width:38px!important;
    height:32px!important;
    min-height:32px!important;
    font-size:.61rem!important;
  }
  :root[data-call-theme-bar-mode="floating"] .call-theme-grip-v7{
    width:27px!important;
    min-width:27px!important;
    height:40px!important;
  }
}


/* ===== v7.7b branding hierarchy / boot glass ===== */

/* The emblem is the dominant background object; the wordmark is supporting
   copy. This follows the MadeInMagius hierarchy instead of turning the text
   into the largest foreground object. */
.call-brand-emblem-v8{
  width:min(42vw,680px)!important;
  max-height:49vh!important;
}
.call-brand-wordmark-v8{
  width:min(40vw,620px)!important;
  margin-top:clamp(-22px,-1.4vw,-9px)!important;
  opacity:.66!important;
}
.call-brand-watermark-v8{
  transform:translate3d(0,-1.5vh,0)!important;
}
:root[data-call-theme="dark"] .call-brand-watermark-v8{opacity:.088!important}
:root[data-call-theme="frost"] .call-brand-watermark-v8{opacity:.066!important}

/* Boot follows the same glass geometry and logo/text hierarchy as the page. */
html[data-call-preboot="true"]{
  background:#000!important;
}
html[data-call-preboot="true"]::before{
  inset:5px!important;
  border-radius:clamp(22px,2.2vw,42px)/clamp(20px,3vh,34px)!important;
  background-position:
    center calc(50% - 92px),
    center calc(50% + 35px),
    0 0,
    17px 11px,
    center!important;
  background-size:
    min(23vw,220px) auto,
    min(38vw,330px) auto,
    auto,
    256px 256px,
    cover!important;
  box-shadow:
    0 0 0 1px #000,
    0 0 28px 5px #000,
    inset 0 0 4px rgba(220,255,230,.06),
    inset 0 0 26px rgba(0,0,0,.70),
    inset 0 0 58px rgba(0,0,0,.28)!important;
  filter:
    blur(.10px)
    drop-shadow(-.8px 0 .14px rgba(65,204,255,.55))
    drop-shadow(.9px 0 .14px rgba(255,57,89,.52))
    drop-shadow(0 0 11px rgba(82,255,135,.18))!important;
}
html[data-call-preboot="true"]::after{
  top:calc(50% + 132px)!important;
  font-size:clamp(11px,1.25vw,16px)!important;
  letter-spacing:.075em!important;
  text-shadow:
    -.85px 0 .12px rgba(65,204,255,.66),
    .95px 0 .12px rgba(255,57,89,.62),
    0 0 5px rgba(177,255,202,.46)!important;
}

@media(max-width:760px){
  .call-brand-emblem-v8{
    width:min(70vw,380px)!important;
    max-height:39vh!important;
  }
  .call-brand-wordmark-v8{
    width:min(68vw,350px)!important;
    margin-top:-8px!important;
  }
  html[data-call-preboot="true"]::before{
    inset:4px!important;
    background-position:
      center calc(50% - 78px),
      center calc(50% + 28px),
      0 0,
      17px 11px,
      center!important;
    background-size:
      min(34vw,150px) auto,
      min(66vw,285px) auto,
      auto,
      256px 256px,
      cover!important;
  }
  html[data-call-preboot="true"]::after{
    top:calc(50% + 116px)!important;
    font-size:12px!important;
  }
}


/* ===== v7.7c scene-registration balance ===== */
/* Desktop/Android already receive scene-wide channel separation through the
   SVG lens. Keep only a fine glyph echo there; iOS retains the stronger CSS
   fallback because WebKit uses the safe non-SVG curvature path. */
:root[data-call-crt-engine="svg-lens"][data-call-theme="dark"][data-call-fx-registration="true"]
.call-display-scroll-v7 :is(
  h1,h2,h3,h4,legend,label,button,a,input,textarea,select,option,small,strong,b,
  .suite-nav,.suite-nav *,[role="button"],[role="tab"],[role="menuitem"]
){
  text-shadow:
    -.34px 0 .10px rgba(63,197,255,.44),
    .38px 0 .10px rgba(255,54,88,.42),
    0 0 2.4px rgba(187,255,203,.15)!important;
}
:root[data-call-crt-engine="ios-safe"][data-call-theme="dark"][data-call-fx-registration="true"]
.call-display-scroll-v7 :is(
  h1,h2,h3,h4,legend,label,button,a,input,textarea,select,option,small,strong,b,
  .suite-nav,.suite-nav *,[role="button"],[role="tab"],[role="menuitem"]
){
  text-shadow:
    -1.0px 0 .14px rgba(63,197,255,.60),
    1.1px 0 .14px rgba(255,54,88,.57),
    0 0 2.6px rgba(187,255,203,.15)!important;
}


/* ===== v7.7d watermark-through-glass surfaces ===== */
/* Let the large MAGIUS phosphor mark remain perceptible through the interface.
   Controls stay denser than document panels so readability is preserved. */
:root[data-call-theme="dark"]{
  --call-surface:rgba(9,16,6,.82);
  --call-surface-soft:rgba(18,32,14,.90);
  --call-surface-raised:rgba(11,19,8,.93);
  --call-card-bg:rgba(9,16,6,.86);
}
:root[data-call-theme="dark"][data-call-phosphor="amber"]{
  --call-surface:rgba(16,10,13,.83);
  --call-surface-soft:rgba(33,25,27,.91);
  --call-surface-raised:rgba(21,13,16,.94);
  --call-card-bg:rgba(16,10,13,.87);
}
:root[data-call-theme="frost"]{
  --call-surface:rgba(6,26,32,.78);
  --call-surface-soft:rgba(11,38,44,.88);
  --call-surface-raised:rgba(7,30,37,.92);
  --call-card-bg:rgba(8,29,35,.82);
}


/* ===== v7.8 static Reader glass / symbolic rail / transparent results ===== */

/* User-facing motion is now intentionally static. Keep phosphor texture,
   blur, registration and curvature; remove whole-scene jitter and moving scans. */
.call-display-scroll-v7,
.call-fx-scanlines-v7,
.call-fx-rolling-band-v7,
.call-fx-tracking-v7{
  animation:none!important;
}
.call-fx-rolling-band-v7,
.call-fx-tracking-v7{
  display:none!important;
}
:root[data-call-theme="dark"][data-call-fx-scanlines="true"] .call-fx-scanlines-v7{
  display:none!important;
}

/* Match Reader night material more closely: one phosphor raster + film grain,
   not stacked extra line fields. */
:root[data-call-theme="dark"]{
  --call-field:
    radial-gradient(ellipse 76vw 82vh at 51% 46%,
      #172013 0%,
      #0d130a 42%,
      #070a05 68%,
      #020302 100%);
  --call-network-bg:rgba(2,5,1,.54);
}
:root[data-call-theme="dark"][data-call-phosphor="amber"]{
  --call-network-bg:rgba(5,2,3,.56);
}
:root[data-call-theme="frost"]{
  --call-network-bg:rgba(1,7,10,.50);
}
:root[data-call-theme="dark"][data-call-fx-noise="true"] .call-fx-night-phosphor-v7{
  opacity:.28!important;
}
:root[data-call-theme="dark"][data-call-fx-noise="true"] .call-fx-night-grain-v7{
  opacity:.39!important;
  animation:none!important;
}
:root[data-call-theme="dark"][data-call-fx-noise="true"][data-call-ios="false"] .call-fx-film-focus-v7{
  backdrop-filter:blur(.32px) saturate(.96) contrast(.99)!important;
  -webkit-backdrop-filter:blur(.32px) saturate(.96) contrast(.99)!important;
}

/* The relationship canvas must not punch an opaque black rectangle through
   the MAGIUS background watermark. */
:root[data-call-theme="dark"] body :is(#callResultSection,#canvasflame,#mynetwork),
:root[data-call-theme="frost"] body :is(#callResultSection,#canvasflame,#mynetwork){
  background:transparent!important;
  background-color:transparent!important;
}
:root[data-call-theme="dark"] body #mynetwork{
  background:var(--call-network-bg)!important;
}
:root[data-call-theme="frost"] body #mynetwork{
  background:var(--call-network-bg)!important;
}
:root[data-call-theme="dark"] body #canvasflame,
:root[data-call-theme="frost"] body #canvasflame{
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb,var(--call-border) 52%,transparent),
    inset 0 0 28px rgba(0,0,0,.20)!important;
}

/* Fix the old dock rules overriding inline drag coordinates. Once positioned,
   both axes belong to the drag state. */
.call-jump-widget-v7.is-positioned,
.call-theme-widget-v7.is-positioned,
.call-fx-window-v7.is-positioned{
  right:auto!important;
  bottom:auto!important;
  transform:none!important;
}

/* Compact rail. Explicit one-character navigation labels accompany the search icon. */
.call-jump-widget-v7{
  width:42px!important;
  min-width:42px!important;
  padding:2px!important;
  grid-template-rows:20px minmax(0,1fr)!important;
  z-index:2380!important;
  background:color-mix(in srgb,var(--call-surface-raised) 84%,transparent)!important;
  border-color:color-mix(in srgb,var(--call-border) 72%,transparent)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.025),
    inset 0 -1px rgba(0,0,0,.32),
    0 5px 18px rgba(0,0,0,.22)!important;
}
.call-jump-head-v7{
  height:20px!important;
  min-height:20px!important;
  grid-template-columns:minmax(0,1fr) 16px!important;
}
.call-jump-grip-v7{
  height:19px!important;
  min-height:19px!important;
  width:auto!important;
  min-width:0!important;
}
.call-jump-collapse-v7{
  width:16px!important;
  min-width:16px!important;
  height:19px!important;
  min-height:19px!important;
}
.call-jump-collapse-v7 svg{
  width:10px!important;
  height:10px!important;
}
.call-collapse-collapsed-icon{display:none}
.call-jump-widget-v7.is-collapsed .call-collapse-expanded-icon{display:none}
.call-jump-widget-v7.is-collapsed .call-collapse-collapsed-icon{display:block}
.call-jump-widget-v7.is-collapsed{
  width:28px!important;
  min-width:28px!important;
  grid-template-rows:28px!important;
  padding:1px!important;
}
.call-jump-widget-v7.is-collapsed .call-jump-head-v7{
  height:26px!important;
  min-height:26px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
}
.call-jump-widget-v7.is-collapsed .call-jump-collapse-v7{
  width:26px!important;
  min-width:26px!important;
  height:26px!important;
  min-height:26px!important;
}
.call-jump-widget-v7.is-collapsed .call-jump-collapse-v7 svg{
  width:15px!important;
  height:15px!important;
  transform:none!important;
}

.call-jump-actions-v7{
  padding:0!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button{
  width:36px!important;
  min-width:36px!important;
  height:31px!important;
  min-height:31px!important;
  margin:0!important;
  padding:0!important;
  color:var(--call-text)!important;
  background:transparent!important;
  border:0!important;
  border-bottom:1px solid color-mix(in srgb,var(--call-border) 45%,transparent)!important;
  font-size:0!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button svg{
  width:16px!important;
  height:16px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.45!important;
  stroke-linecap:square!important;
  stroke-linejoin:miter!important;
  overflow:visible;
  filter:
    drop-shadow(-.30px 0 .06px rgba(63,197,255,.30))
    drop-shadow(.34px 0 .06px rgba(255,54,88,.28));
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button[data-action="top"] svg,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button[data-action="bottom"] svg{
  width:18px!important;
  height:18px!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:hover,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:focus-visible{
  color:var(--call-accent-ink)!important;
  background:var(--call-accent)!important;
  box-shadow:
    inset 2px 0 color-mix(in srgb,var(--call-accent-ink) 52%,transparent),
    0 0 6px color-mix(in srgb,var(--call-accent) 22%,transparent)!important;
}
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:hover svg,
.call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button:focus-visible svg{
  filter:none!important;
}

/* Make the floating rail itself look like part of the same phosphor signal. */
:root[data-call-theme="dark"] .call-jump-widget-v7,
:root[data-call-theme="frost"] .call-jump-widget-v7{
  filter:blur(.08px) saturate(.97) contrast(1.01);
}

/* Keep the MAGIUS mark visible through the large result region. */
:root[data-call-theme="dark"] .call-brand-watermark-v8{
  opacity:.11!important;
}
:root[data-call-theme="frost"] .call-brand-watermark-v8{
  opacity:.078!important;
}

@media(max-width:760px){
  .call-jump-widget-v7{
    width:40px!important;
    min-width:40px!important;
    right:6px!important;
  }
  .call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button{
    width:34px!important;
    min-width:34px!important;
    height:30px!important;
    min-height:30px!important;
  }
}


/* ===== v7.8b Reader night palette ===== */
/* Use MagiReader's dark terminal palette: muted olive phosphor over #101c14,
   while keeping the selected state distinctly brighter. */
:root[data-call-theme="dark"]:not([data-call-phosphor="amber"]){
  --call-field:
    radial-gradient(ellipse at 47% 38%,rgba(174,218,139,.065),transparent 75%),
    #101c14;
  --call-surface:rgba(16,28,20,.64);
  --call-surface-soft:rgba(22,38,27,.76);
  --call-surface-raised:rgba(13,24,17,.84);
  --call-text:#b6d995;
  --call-muted:#8fae7b;
  --call-border:rgba(174,218,139,.32);
  --call-border-strong:rgba(190,232,154,.56);
  --call-accent:#b5f65f;
  --call-accent-strong:#d3f0b4;
  --call-accent-ink:#0b120d;
  --call-card-bg:rgba(16,28,20,.68);
  --call-card-text:#c6e5a7;
  --call-network-bg:rgba(11,19,13,.42);
}


/* ===== v7.8c literal rail arrows ===== */
.call-jump-actions-v7 .call-rail-arrow{
  display:block;
  font:400 1.08rem/1 var(--call-pixel-font);
  line-height:1;
  color:currentColor;
  transform:translateY(-.5px);
  text-shadow:
    -.28px 0 .05px rgba(63,197,255,.26),
    .32px 0 .05px rgba(255,54,88,.24);
}


/* Local review: a single static screen and a single functional dock. */
html:root[data-call-theme] body .call-display-scroll-v7 {
  animation:none!important; transform:none!important; filter:none!important; will-change:auto;
}
html:root[data-call-theme] body .call-reader-screen-v7 > span { animation:none!important; }
html:root[data-call-theme] body .call-fx-film-focus-v7 { display:none!important; }
html:root[data-call-theme] body .call-fx-rolling-band-v7,
html:root[data-call-theme] body .call-fx-tracking-v7 { display:none!important; }

/* Deep green black, bright phosphor ink. Grain should not lift the black floor. */
html:root[data-call-theme="dark"]:not([data-call-phosphor="amber"]) {
  --call-bg:#040905;
  --call-field:radial-gradient(ellipse at 48% 42%,#132414 0%,#09140b 57%,#020603 100%);
  --call-text:#b7ff68; --call-muted:#86bf60;
  --call-accent:#adff4f; --call-accent-strong:#dbffaf; --call-accent-ink:#102108;
  --call-border:rgba(174,255,101,.40); --call-border-strong:rgba(197,255,144,.78);
  --call-surface:rgba(6,16,7,.24); --call-surface-soft:rgba(13,31,12,.55);
  --call-surface-raised:rgba(8,20,9,.94); --call-card-bg:rgba(7,18,8,.5);
  --call-card-text:#c8ff92;
}
html:root[data-call-theme="dark"][data-call-fx-registration="true"] body .call-display-root-v7 :is(
  h1,h2,h3,h4,legend,label,button,a,input,textarea,select,small,strong,b,.suite-nav
) {
  text-shadow:-.25px 0 .08px rgba(175,255,228,.5),.3px 0 .08px rgba(255,233,137,.4),0 0 3px rgba(166,255,79,.44)!important;
}

/* All document panels share the same uninterrupted watermark plane.
   No nested opaque slabs or per-panel backdrop refraction. */
html:root[data-call-theme] body :is(
  #wrapper,.call-panel-v8,.call-panel-body-v8,.call-result-details-v8,
  #callResultSection,#canvasflame,#mynetwork,.vis-network,
  .suite-panel,.suite-panel-details-v8,.suite-results,.suite-result-group,.character-grid-details-v8
) {
  background:transparent!important; background-color:transparent!important;
  backdrop-filter:none!important; -webkit-backdrop-filter:none!important;
  filter:none!important;
}
html:root[data-call-theme] body :is(.call-panel-v8,.suite-panel-details-v8,.character-grid-details-v8) {
  box-shadow:inset 0 1px color-mix(in srgb,var(--call-text) 7%,transparent)!important;
}
html:root[data-call-theme] body :is(.call-panel-v8,.suite-panel-details-v8,.character-grid-details-v8) > summary {
  background:color-mix(in srgb,var(--call-surface-soft) 38%,transparent)!important;
  backdrop-filter:none!important; -webkit-backdrop-filter:none!important;
}
html:root[data-call-theme] body :is(.call-panel-v8,.suite-panel-details-v8,.character-grid-details-v8) > summary::after,
html:root[data-call-theme] body .call-details-state-v10::before {
  color:var(--call-text)!important; -webkit-text-fill-color:currentColor!important;
  background:var(--call-surface-soft)!important; border:1px solid var(--call-border)!important;
  border-radius:2px!important; box-shadow:none!important; font-size:12px!important;
  padding:4px 9px!important;
}
html:root[data-call-theme] body .call-brand-watermark-v8 { mix-blend-mode:normal; }
html:root[data-call-theme="dark"] body .call-brand-watermark-v8 { opacity:.16!important; }
html:root[data-call-theme="frost"] body .call-brand-watermark-v8 { opacity:.13!important; }
html:root[data-call-theme="light"] body .call-brand-watermark-v8,
html:root[data-call-theme="paper"] body .call-brand-watermark-v8,
html:root[data-call-theme="green"] body .call-brand-watermark-v8 { opacity:.07!important; }
html:root[data-call-theme="light"] body .call-brand-watermark-v8 img,
html:root[data-call-theme="paper"] body .call-brand-watermark-v8 img,
html:root[data-call-theme="green"] body .call-brand-watermark-v8 img { filter:brightness(0) sepia(.4)!important; }
html:root[data-call-theme="light"] body.call-screen-host-v7,
html:root[data-call-theme="paper"] body.call-screen-host-v7,
html:root[data-call-theme="green"] body.call-screen-host-v7 { background:var(--call-bg)!important; }

/* The real action rail is inside this dock (and therefore inside the lens).
   Collapsing leaves useful up / search / down shortcuts, not an empty handle. */
html:root[data-call-theme] body .call-jump-widget-v7 {
  width:48px!important; min-width:48px!important; padding:3px!important;
  max-height:calc(100% - 32px)!important; overflow:auto!important;
  right:18px!important; top:50%; bottom:auto!important;
  background:var(--call-surface-raised)!important; border:1px solid var(--call-border-strong)!important;
  border-radius:3px!important; filter:none!important;
  box-shadow:0 0 10px color-mix(in srgb,var(--call-accent) 12%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--call-text) 7%,transparent)!important;
}
html:root[data-call-theme] body .call-jump-widget-v7.is-positioned { right:auto!important; }
html:root[data-call-theme] body .call-jump-head-v7 {
  display:grid!important; grid-template-columns:1fr 1fr!important; gap:0!important;
  width:100%!important; height:28px!important; min-height:28px!important;
  border-bottom:1px solid var(--call-border)!important; margin-bottom:3px!important;
}
html:root[data-call-theme] body .call-jump-head-v7 :is(.call-jump-grip-v7,.call-jump-collapse-v7) {
  display:grid!important; width:100%!important; min-width:0!important; height:27px!important; min-height:27px!important;
  padding:0!important; border:0!important; background:transparent!important;
}
html:root[data-call-theme] body .call-jump-head-v7 .call-jump-grip-v7 { cursor:grab!important; }
html:root[data-call-theme] body .call-jump-widget-v7 .call-jump-actions-v7 { display:flex!important; }
html:root[data-call-theme] body .call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button {
  width:40px!important; min-width:40px!important; height:38px!important; min-height:38px!important;
  margin:0!important; padding:0!important; background:transparent!important;
  border:0!important; border-bottom:1px solid color-mix(in srgb,var(--call-border) 40%,transparent)!important;
}
html:root[data-call-theme] body .call-jump-widget-v7.is-collapsed .call-jump-actions-v7 button:not([data-action="top"]):not([data-action="search"]):not([data-action="bottom"]) { display:none!important; }
html:root[data-call-theme] body .call-jump-actions-v7 button:is(:hover,:focus-visible) {
  color:var(--call-accent-ink)!important; background:var(--call-accent)!important;
}
html:root[data-call-theme] body .call-jump-actions-v7 button svg { width:20px!important; height:20px!important; }
html:root[data-call-theme] body .call-fx-titlebar-v7 { grid-template-columns:minmax(0,1fr) 38px; cursor:grab; }
html:root[data-call-theme] body .call-fx-window-v7 { background:var(--call-surface-raised)!important; }
html:root[data-call-theme] body .call-fx-window-v7 [hidden] { display:none!important; }
@media(max-width:760px) {
  html:root[data-call-theme] body .call-display-root-v7 { filter:none!important; }
  html:root[data-call-theme] body .call-display-root-v7 :is(.call-floating-widget-v7,.call-panel-v8,.call-panel-body-v8) { backdrop-filter:none!important; -webkit-backdrop-filter:none!important; }
  html:root[data-call-theme] body .call-jump-widget-v7 { width:52px!important; min-width:52px!important; right:12px!important; }
  html:root[data-call-theme] body .call-jump-actions-v7 :is(.call-quick-rail-v10,.suite-quick-rail-v7) button { width:44px!important; min-width:44px!important; height:42px!important; min-height:42px!important; }
  html:root[data-call-theme] body .call-fx-window-v7 { left:10px; right:10px; top:54px; width:auto; max-height:calc(100% - 68px); }
  html:root[data-call-theme] body .call-fx-body-v7 { max-height:calc(100dvh - 152px); }
}

html:root[data-call-theme] body .call-suite-nav-spacer-v12[hidden]{display:none!important}

/* Local phosphor bloom: never rasterize several blurred full-screen copies. */
html:root[data-call-crt-engine][data-call-theme="dark"][data-call-fx-registration="true"] body .call-display-root-v7 :is(
  h1,h2,h3,h4,legend,label,button,a,input,textarea,select,option,small,strong,b,summary,.suite-nav,[role="button"]
) {
  text-shadow:-.3px 0 rgba(120,255,229,.5),.35px 0 rgba(255,219,111,.45),0 0 4px color-mix(in srgb,var(--call-accent) 54%,transparent)!important;
}
html:root[data-call-theme] body .call-reader-screen-v7 > span { will-change:auto!important; }
html:root[data-call-theme] body .call-fx-titlebar-v7 { touch-action:none; }
html:root[data-call-ios="true"] body .call-display-root-v7 { filter:none!important; -webkit-filter:none!important; }

/* Keep the CRT edge, without dimming the content at the viewport perimeter. */
html:root[data-call-fx-curvature="true"] body .call-fx-vignette-v7 {
  background:radial-gradient(ellipse at 50% 48%,transparent 62%,rgba(0,0,0,.10) 86%,rgba(0,0,0,.38) 100%)!important;
  box-shadow:inset 0 0 14px rgba(0,0,0,.30)!important;
}
html:root[data-call-fx-curvature="true"] body .call-fx-bezel-v7 {
  box-shadow:inset 0 0 2px 1px rgba(0,0,0,.7),inset 0 0 8px rgba(0,0,0,.3)!important;
}
html:root[data-call-theme="dark"][data-call-fx-scanlines="true"] body .call-fx-scanlines-v7 {
  display:block!important;
  background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(0,0,0,.45) 2px 3px)!important;
  opacity:.15!important;
}
html:root[data-call-theme="dark"] body .suite-nav :is(a.active,a[aria-current="page"],a[data-active="true"]),
html:root[data-call-theme="dark"] body .call-theme-option-v7[aria-pressed="true"] {
  color:var(--call-accent-ink)!important; background:var(--call-accent)!important;
  box-shadow:0 0 10px color-mix(in srgb,var(--call-accent) 40%,transparent),inset 0 0 6px rgba(236,255,195,.30)!important;
  text-shadow:none!important;
}

/* Reader-like soft ink and luminous selected surfaces, without a screen blur. */
html:root[data-call-crt-engine][data-call-theme="dark"][data-call-fx-registration="true"] body .call-display-root-v7 :is(
  h1,h2,h3,h4,legend,label,button,a,input,textarea,select,option,small,strong,b,summary,.suite-nav,[role="button"]
) {
  text-shadow:0 0 .8px currentColor,-.45px 0 .3px rgba(120,255,229,.58),.55px .1px .4px rgba(255,224,122,.48),0 0 5px color-mix(in srgb,var(--call-accent) 56%,transparent)!important;
}
html:root:is([data-call-theme="dark"],[data-call-theme="frost"]) body {
  --call-selected-shadow:0 0 2px var(--call-accent-strong),0 0 9px color-mix(in srgb,var(--call-accent) 72%,transparent),0 0 20px color-mix(in srgb,var(--call-accent) 32%,transparent),inset 0 0 7px color-mix(in srgb,var(--call-accent) 27%,transparent);
}
html:root:is([data-call-theme="dark"],[data-call-theme="frost"]) body :is(
  label.girlbox.is-selected-v11,label.girlbox:has(input.MagicalChk:checked),
  .suite-character-card[aria-pressed="true"],.call-theme-option-v7[aria-pressed="true"],
  .call-fx-segment-v7 button[aria-pressed="true"],.suite-nav a[aria-current="page"],
  .suite-nav a.active,.suite-checks label:has(input:checked),.suite-attribute-options-v7 label:has(input:checked)
) {
  position:relative; z-index:1;
  border-color:var(--call-accent-strong)!important;
  outline-color:var(--call-accent)!important;
  box-shadow:var(--call-selected-shadow)!important;
}
html:root:is([data-call-theme="dark"],[data-call-theme="frost"]) body :is(
  .call-theme-option-v7[aria-pressed="true"],.call-fx-segment-v7 button[aria-pressed="true"]
) {
  background:var(--call-accent)!important; color:var(--call-accent-ink)!important;
  -webkit-text-fill-color:currentColor!important;
}
html:root:is([data-call-theme="dark"],[data-call-theme="frost"]) body .call-fx-toggle-row-v7:has(input:checked) {
  border-color:var(--call-accent)!important;
  background:color-mix(in srgb,var(--call-accent) 8%,transparent)!important;
  box-shadow:inset 2px 0 var(--call-accent),0 0 5px color-mix(in srgb,var(--call-accent) 15%,transparent)!important;
}
html:root:is([data-call-theme="dark"],[data-call-theme="frost"]) body input:is([type="checkbox"],[type="radio"]):checked {
  box-shadow:0 0 7px color-mix(in srgb,var(--call-accent) 68%,transparent)!important;
}

/* Actual static lens on phones too; rounded borders alone are not curvature. */
html:root[data-call-crt-engine="static-svg"][data-call-optics-active="true"] body .call-display-root-v7 {
  filter:var(--call-active-tube-filter, none)!important;
  -webkit-filter:var(--call-active-tube-filter, none)!important;
  transform:none!important; -webkit-transform:none!important;
}
html:root[data-call-ios="true"] body .call-display-root-v7 *,
html:root[data-call-ios="true"] body .call-display-root-v7 *::before,
html:root[data-call-ios="true"] body .call-display-root-v7 *::after {
  will-change:auto!important; animation:none!important; transition:none!important;
}
html:root[data-call-ios="true"] body :is(.call-reader-screen-v7,.call-floating-widget-v7,.call-display-scroll-v7) { contain:none!important; }
html:root[data-call-ios="true"] body .call-brand-watermark-v8 { transform:translateY(-1.5vh)!important; }
html:root[data-call-theme] body .call-display-root-v7 .call-theme-widget-v7 .call-theme-option-v7[aria-pressed="true"],
html:root[data-call-theme] body .call-display-root-v7 .call-fx-window-v7 .call-fx-segment-v7 button[aria-pressed="true"] {
  background:var(--call-accent)!important; background-color:var(--call-accent)!important;
  color:var(--call-accent-ink)!important; -webkit-text-fill-color:currentColor!important;
  box-shadow:var(--call-selected-shadow)!important; text-shadow:none!important;
}
html:root[data-call-theme] body .call-fx-window-v7 .call-fx-body-v7 > fieldset {
  display:block!important; float:none!important; clear:both;
  width:auto!important; min-width:0!important; max-width:none!important;
}

/* r8: the actual site menu shares the theme, not the retired floating-menu class. */
html:root[data-call-theme] body .header { width:44px; height:44px; margin:10px 0 12px; isolation:auto; }
html:root[data-call-theme] body .header .menu-icon {
  width:44px; height:44px; border:1px solid var(--call-border-strong); border-radius:3px;
  background:var(--call-surface-raised); color:var(--call-text); box-shadow:none;
}
html:root[data-call-theme] body .header .navicon,
html:root[data-call-theme] body .header .navicon::before,
html:root[data-call-theme] body .header .navicon::after {
  width:22px; height:2px; background:var(--call-text); border-radius:0; transition:none;
}
html:root[data-call-theme] body .header .navicon::before { top:-7px; }
html:root[data-call-theme] body .header .navicon::after { bottom:-7px; }
html:root[data-call-theme] body .header .menu-btn:checked ~ .menu-icon .navicon { background:transparent; }
html:root[data-call-theme] body .header .menu-btn:checked ~ .menu-icon .navicon::before { top:0; }
html:root[data-call-theme] body .header .menu-btn:checked ~ .menu-icon .navicon::after { bottom:0; }
html:root[data-call-theme] body .header .menu {
  top:48px; background:var(--call-surface-raised); border:1px solid var(--call-border-strong);
  color:var(--call-text); border-radius:3px; transform:none; transition:none;
  max-width:calc(100vw - 48px); box-shadow:0 4px 12px #0003;
}
html:root[data-call-theme] body .header .menu :is(li,a,.menulabel,.thismenu) { color:var(--call-text)!important; }
html:root[data-call-theme] body .header .menu .thismenu { font-weight:700; border-left:2px solid var(--call-accent); }
html:root[data-call-theme] body .header .menu-icon:focus-visible { outline:2px solid var(--call-accent); outline-offset:3px; }

/* Keep all lower-page actions inside the same optical signal, away from its edge. */
html:root[data-call-theme] body .call-display-scroll-v7 { padding-inline:12px; padding-bottom:24px; }
html:root[data-call-theme] body .call-name-filter-tools { margin:14px 0; min-width:0; }
html:root[data-call-theme] body .call-name-filter-actions { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }
html:root[data-call-theme] body .call-name-filter-actions input { margin:0!important; max-width:100%; white-space:normal; }
html:root[data-call-theme] body input.ndownword { box-sizing:border-box; width:min(100%,42rem); min-height:36px; padding:6px 9px; font-size:16px; }
html:root[data-call-theme] body .call-name-filter-help { width:min(100%,42rem); white-space:normal; overflow-wrap:anywhere; font-size:14px; line-height:1.6; margin:6px 0 12px; color:var(--call-text); }

/* An optical viewport is not another scrolling ancestor of focused controls. */
@supports (overflow:clip) { html:root[data-call-theme] body .call-display-root-v7 { overflow:clip; } }

/* Same release route as Reader: iOS flat, native scroll, static material intact.
   Explicit final override defeats every older mobile perspective/URL-filter rule. */
html:root[data-call-ios-flat="true"] { --call-ios-flat-filter:none; }
html:root[data-call-ios-flat="true"][data-call-fx-registration="true"] { --call-ios-flat-filter:blur(var(--call-focus-radius)); }
html:root[data-call-ios-flat="true"][data-call-theme="frost"] { --call-ios-flat-filter:blur(var(--call-focus-radius)); }
html:root[data-call-ios-flat="true"][data-call-theme="dark"] { --call-ios-flat-filter:blur(var(--call-focus-radius)); }
html:root[data-call-ios-flat="true"][data-call-theme] body .call-display-root-v7 {
  inset:0!important; border-radius:0!important; clip-path:none!important; box-shadow:none!important;
  transform:none!important; -webkit-transform:none!important;
  filter:var(--call-ios-flat-filter)!important; -webkit-filter:var(--call-ios-flat-filter)!important;
}
html:root[data-call-ios-flat="true"] body :is(.call-fx-bezel-v7,.call-fx-vignette-v7) { display:none!important; }
html:root[data-call-ios-flat="true"] body .call-fx-toggle-row-v7[data-platform-disabled="true"] { opacity:.65; cursor:not-allowed; }
html:root[data-call-theme] body .call-platform-note { font-size:14px; line-height:1.6; white-space:normal; }

/* r9 / Reader accepted candidate 4192: one dark surround and one recessed edge.
   The surround is OUTSIDE the signal. Never paint the light page color behind
   the lens or filter an extra outer shadow into a second raised frame. */
html:root[data-call-theme="light"] { --call-screen-surround:#080b0c; --call-bezel-reflection:166,189,193; }
html:root[data-call-theme="paper"] { --call-screen-surround:#0d0b07; --call-bezel-reflection:204,180,119; }
html:root[data-call-theme="green"] { --call-screen-surround:#060d09; --call-bezel-reflection:132,196,159; }
html:root[data-call-theme="dark"] { --call-screen-surround:#000; --call-bezel-reflection:132,192,92; }
html:root[data-call-theme="frost"] { --call-screen-surround:#000; --call-bezel-reflection:105,188,177; }
html:root[data-call-theme][data-call-fx-curvature="true"],
html:root[data-call-theme][data-call-fx-curvature="true"] body.call-screen-host-v7 {
  background:var(--call-screen-surround)!important;
}
html:root[data-call-theme] body .call-display-root-v7 { box-shadow:none!important; }
html:root[data-call-theme][data-call-fx-curvature="true"] body .call-display-root-v7 {
  inset:0!important; border:0!important;
  border-radius:clamp(22px,2.2vw,42px)/clamp(20px,3vh,34px)!important;
  clip-path:inset(0 round clamp(22px,2.2vw,42px)/clamp(20px,3vh,34px))!important;
}
html:root[data-call-theme] body .call-display-root-v7::before,
html:root[data-call-theme] body .call-display-root-v7::after { content:none!important; }
html:root[data-call-theme] body .call-fx-vignette-v7 { display:none!important; }
html:root[data-call-theme][data-call-fx-curvature="true"] body .call-fx-bezel-v7 {
  display:block!important; background:none!important; border:0!important;
  border-radius:inherit!important;
  box-shadow:inset 0 0 2px 1px rgba(0,0,0,.9),
    inset 0 0 9px 3px rgba(0,0,0,.58),
    inset 0 0 24px 4px rgba(0,0,0,.25),
    inset 0 2px 3px rgba(var(--call-bezel-reflection),.1)!important;
}

/* Tight 548:624 artwork from Reader's MagiusEmblem, with supporting wordmark.
   A single width governs both assets, so max-height cannot squash the emblem. */
html:root[data-call-theme] { --call-brand-width:min(70vw,54dvh,600px); --call-wordmark-ratio:.6; }
html:root:is([data-call-theme="dark"],[data-call-theme="frost"]) { --call-wordmark-ratio:.4; }
html:root[data-call-theme] body .call-brand-watermark-v8 {
  display:flex!important; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; transform:none!important;
}
html:root[data-call-theme] body .call-brand-emblem-v8 {
  width:var(--call-brand-width)!important; height:auto!important; max-height:none!important;
  aspect-ratio:548 / 624; object-fit:contain; flex:none;
}
html:root[data-call-theme] body .call-brand-wordmark-v8 {
  width:calc(var(--call-brand-width) * var(--call-wordmark-ratio))!important;
  height:auto!important; max-height:none!important; aspect-ratio:341.927 / 156.45;
  object-fit:contain; flex:none; margin:0!important;
}

/* Use the same hierarchy during startup rather than flashing the old huge text. */
html:root[data-call-theme] { --call-boot-brand-width:min(56vw,32dvh,310px); }
html:root:is([data-call-theme="dark"],[data-call-theme="frost"]) { --call-boot-brand-width:min(78vw,54dvh,500px); }
html:root[data-call-theme][data-call-preboot="true"]::before {
  background-position:
    center calc(50% - var(--call-boot-brand-width) * var(--call-wordmark-ratio) * .22878 - 1px),
    center calc(50% + var(--call-boot-brand-width) * .56934 + 1px),0 0,17px 11px,center!important;
  background-size:var(--call-boot-brand-width) auto,
    calc(var(--call-boot-brand-width) * var(--call-wordmark-ratio)) auto,auto,256px 256px,cover!important;
  box-shadow:none!important;
}
html:root[data-call-theme][data-call-preboot="true"]::after {
  top:calc(50% + var(--call-boot-brand-width) * (.56934 + var(--call-wordmark-ratio) * .22878) + 24px)!important;
}

/* Shared Reader film group must screen against the signal, not an isolated black tile.
   The bezel stays outside this blend group so its recessed black edge survives. */
html:root[data-call-theme="frost"] .call-reader-screen-v7 { mix-blend-mode:screen; }
.call-display-root-v7>.call-fx-bezel-v7 { position:absolute; inset:0; z-index:5001; pointer-events:none; display:none; border-radius:inherit; }

/* r11: semantic chart colors, shared by the live DOM and Canvas exporter.
   Theme switches recolor existing data without rebuilding 186 character points. */
html:root[data-call-theme] {
  --call-chart-bg:var(--call-surface);
  --call-chart-backdrop:var(--call-bg);
  --call-chart-panel:var(--call-surface-raised);
  --call-chart-ink:var(--call-text);
  --call-chart-grid:var(--call-border);
  --call-chart-major:var(--call-border-strong);
  --call-chart-accent:var(--call-accent);
  --call-chart-bar-start:var(--call-surface-soft);
  --call-chart-bar-end:var(--call-accent);
  --call-focus-radius:.18px;
}
html:root[data-call-theme="dark"] { --call-focus-radius:.39px; }
html:root[data-call-theme="frost"] { --call-focus-radius:.32px; }
html:root[data-call-ios-flat="true"][data-call-theme="frost"] { --call-focus-radius:.22px; }
html:root[data-call-fx-noise="false"] { --call-focus-radius:0px; }
html:root[data-call-fx-noise="false"][data-call-fx-registration="true"] { --call-focus-radius:.13px; }
html:root[data-call-theme][data-call-optics-active="false"] body .call-display-root-v7 {
  filter:blur(var(--call-focus-radius))!important; -webkit-filter:blur(var(--call-focus-radius))!important;
}
html:root[data-call-theme] body :is(label.girlbox,.suite-character-card) {
  --call-card-accent:var(--call-accent);
  border-color:var(--call-border)!important;
}
html:root[data-call-theme] body :is(label.girlbox,.suite-character-card):not(.is-selected-v11):not([aria-pressed="true"]):not(:has(input:checked)) {
  box-shadow:inset 0 -3px 0 var(--call-accent)!important;
}
html:root[data-call-theme] body #heightChartContainer { background:transparent!important; border-color:var(--call-border)!important; }
html:root[data-call-theme] body :is(.height-chart-surface-v2,.height-plot-v2) {
  color:var(--call-chart-ink)!important; background-color:var(--call-chart-bg)!important;
}
html:root[data-call-theme] body .height-plot-v2 {
  background-image:repeating-linear-gradient(to top,color-mix(in srgb,var(--call-chart-grid) 35%,transparent) 0 1px,transparent 1px 12px)!important;
}
html:root[data-call-theme] body .height-major-line-v2 { background:var(--call-chart-major)!important; opacity:.65; }
html:root[data-call-theme] body :is(.height-category-column-v2,.height-x-label-v2,.height-y-axis-v2,.height-x-axis-v2,.height-x-axis-spacer-v2,.height-x-axis-spacer-right-v3) {
  border-color:var(--call-chart-grid)!important; color:var(--call-chart-ink)!important;
}
html:root[data-call-theme] body :is(.height-y-axis-v2,.height-x-axis-v2,.height-x-axis-spacer-v2,.height-x-axis-spacer-right-v3,.height-guide-mode-v4,.height-chart-tooltip-v2,.height-active-guide-label-v3,.height-active-y-label-v3) {
  background:var(--call-chart-panel)!important; color:var(--call-chart-ink)!important;
  -webkit-text-fill-color:currentColor!important; border-color:var(--call-chart-major)!important; box-shadow:none!important;
}
html:root[data-call-theme] body :is(.height-guide-status-v4,.height-guide-help-v4,.height-export-status-v10) { color:var(--call-muted)!important; }
html:root[data-call-theme] body :is(.height-point-guide-v2,.height-active-guide-v3) {
  color:var(--call-chart-accent)!important; border-top-color:var(--call-chart-accent)!important; filter:none!important;
}
html:root[data-call-theme] body .height-point-guide-v2::before {
  background:var(--call-chart-accent)!important; border-color:var(--call-chart-panel)!important; box-shadow:none!important;
}
html:root[data-call-theme] body .height-point-v2 {
  background:var(--call-chart-panel)!important; border-color:var(--call-chart-accent)!important;
  box-shadow:0 0 0 1px var(--call-chart-bg)!important;
}
html:root[data-call-theme] body .height-point-v2:is(:hover,:focus-visible,.is-active) {
  border-color:var(--call-accent-strong)!important;
  box-shadow:0 0 0 2px var(--call-chart-panel),0 0 0 4px var(--call-chart-accent),var(--call-selected-shadow)!important;
}
html:root[data-call-theme] body .height-bar-v2 {
  border-color:var(--call-chart-accent)!important;
  background:linear-gradient(to bottom,var(--call-chart-bar-start),var(--call-chart-bar-end))!important;
}

/* Reader's phosphor and day grain blend directly against the signal, not a
   transparent isolated parent. Frost retains its own screen-blended film group.
   All textures are static, viewport-bounded and non-interactive. */
.call-display-root-v7 > .call-material-direct-v11 {
  position:absolute; inset:0!important; z-index:5000; pointer-events:none;
  display:none; border-radius:inherit; animation:none!important; will-change:auto!important;
}
html:root[data-call-theme="dark"][data-call-fx-noise="true"] body .call-fx-night-phosphor-v7 {
  display:block!important; opacity:var(--call-scan-opacity)!important;
  background:var(--call-raster-lines,linear-gradient(transparent,transparent)),
    url('./reader-textures/NoiseAndGrain.png') 0 0/128px 64px repeat,
    url('./reader-textures/PixelOverlay_RGB_16.png') 0 0/4px 4px repeat!important;
  background-blend-mode:multiply,soft-light,normal!important; mix-blend-mode:soft-light!important;
}
html:root[data-call-theme="dark"][data-call-fx-scanlines="true"] {
  --call-raster-lines:repeating-linear-gradient(0deg,rgba(5,0,2,.52) 0 .6px,transparent .6px 2px);
}
/* The scan is already in the Reader phosphor recipe: do not double-stack it. */
html:root[data-call-theme="dark"][data-call-fx-noise="true"] body .call-fx-scanlines-v7 { display:none!important; }
html:root[data-call-theme="dark"][data-call-fx-noise="true"] body .call-fx-night-grain-v7 {
  display:block!important; opacity:.495!important; mix-blend-mode:screen!important;
  filter:sepia(.2) hue-rotate(42deg) saturate(.72)!important;
  background:url('./reader-textures/magi-lofi-grain.png') 7px 13px/384px 384px repeat,
    url('./reader-textures/magi-lofi-grain.png') 7px 13px/384px 384px repeat!important;
  background-blend-mode:screen!important;
}
html:root[data-call-theme="dark"][data-call-phosphor="amber"][data-call-fx-noise="true"] body .call-fx-night-grain-v7 {
  display:block!important; opacity:.66!important; mix-blend-mode:screen!important; filter:sepia(.65)!important;
  background:url('./reader-textures/magi-lofi-grain.png') 7px 13px/384px 384px repeat,
    url('./reader-textures/magi-lofi-grain.png') 7px 13px/384px 384px repeat!important;
  background-blend-mode:screen!important;
}

/* The legacy entry uses native anchors/inputs and label.at rather than suite
   controls. Include that real DOM in the theme, including keyboard focus. */
html:root[data-call-theme] body a:not(.suite-nav a) { color:var(--call-accent-strong); }
html:root[data-call-theme] body a:visited { color:var(--call-accent-strong); }
html:root[data-call-theme] body p.top > span[style] { color:var(--call-accent-strong)!important; }
html:root[data-call-theme] body :is(input,textarea,select,button,a,summary,[tabindex]):focus-visible {
  outline:2px solid var(--call-accent)!important; outline-offset:2px!important;
}
html:root[data-call-theme] ::selection {
  color:var(--call-accent-ink); background:var(--call-accent); text-shadow:none;
}
html:root[data-call-theme] body :is(input[type="button"],input[type="submit"],input[type="reset"],button.searchbtn) {
  min-height:32px; padding:5px 10px!important; border-width:1px!important;
  box-shadow:inset 0 1px color-mix(in srgb,var(--call-accent-ink) 14%,transparent)!important;
}
html:root[data-call-theme] body #at_form { display:flex; flex-wrap:wrap; gap:6px; background:transparent!important; padding:8px 0; }
html:root[data-call-theme] body #at_form > br { display:none; }
html:root[data-call-theme] body #at_form label.at {
  display:inline-flex; align-items:center; gap:5px; min-height:30px; padding:3px 8px; margin:0;
  border:1px solid var(--call-border); border-radius:3px;
  color:var(--call-text); background:color-mix(in srgb,var(--call-surface) 65%,transparent);
}
html:root[data-call-theme] body #at_form label.at:has(input:checked) {
  color:var(--call-accent-ink)!important; -webkit-text-fill-color:currentColor!important;
  background:var(--call-accent)!important; border-color:var(--call-accent-strong); box-shadow:var(--call-selected-shadow);
}
html:root[data-call-theme] body #at_form label.at:has(input:focus-visible) { outline:2px solid var(--call-accent); outline-offset:2px; }
html:root[data-call-theme] body #at_form input:is([type="checkbox"],[type="radio"]) { flex:none; margin:0; }

html:root[data-call-theme] body .call-attribute-fieldset-v8 { background:transparent!important; border:0!important; }

/* r23: restore readable semantic labels inside legacy font-size:0 buttons.
   Inherit the current palette, typography and shared CRT treatment. */
html:root[data-call-theme] body .call-jump-actions-v7 .call-rail-letter {
  display:block; font-family:inherit; font-size:1rem!important;
  font-weight:600; line-height:1; letter-spacing:0;
  color:inherit; text-shadow:inherit; pointer-events:none;
}