.header-tools{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:flex-end;gap:12px}.display-picker{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:5px 6px 5px 11px;border:1px solid var(--line,#2d3947);border-radius:11px;background:color-mix(in srgb,var(--panel,#101923) 88%,transparent);box-shadow:0 8px 24px #0002}.display-picker label{color:var(--muted,#aeb9c6);font-size:11px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.display-picker select{min-width:132px;padding:7px 28px 7px 10px;border:1px solid color-mix(in srgb,var(--line,#2d3947) 78%,var(--text,#fff));border-radius:8px;outline:none;background:var(--bg,#081018);color:var(--text,#f6f8fb);font:inherit;font-size:13px;font-weight:800;cursor:pointer}.display-picker select:hover{border-color:var(--accent,#38bdf8)}.display-picker select:focus-visible,:focus-visible{outline:2px solid var(--accent,#38bdf8);outline-offset:3px}.topbar>.display-picker{flex:0 0 auto}

html[data-display-style]:not([data-display-style="standard"]){color-scheme:dark}
html[data-display-style]:not([data-display-style="standard"]) body{min-height:100vh;color:var(--text);background-color:var(--bg);background-attachment:fixed}
html[data-display-style]:not([data-display-style="standard"]) .sidebar,
html[data-display-style]:not([data-display-style="standard"]) .topbar{border-color:var(--line);background:var(--display-nav);box-shadow:var(--display-nav-shadow)}
html[data-display-style]:not([data-display-style="standard"]) .hero,
html[data-display-style]:not([data-display-style="standard"]) .panel,
html[data-display-style]:not([data-display-style="standard"]) .policy,
html[data-display-style]:not([data-display-style="standard"]) .summary-grid article,
html[data-display-style]:not([data-display-style="standard"]) .vin-card,
html[data-display-style]:not([data-display-style="standard"]) .card,
html[data-display-style]:not([data-display-style="standard"]) .result-card,
html[data-display-style]:not([data-display-style="standard"]) .spec,
html[data-display-style]:not([data-display-style="standard"]) .resource-grid a,
html[data-display-style]:not([data-display-style="standard"]) .vehicle-profile,
html[data-display-style]:not([data-display-style="standard"]) .research-panel,
html[data-display-style]:not([data-display-style="standard"]) .vin-preview-head,
html[data-display-style]:not([data-display-style="standard"]) .vin-next,
html[data-display-style]:not([data-display-style="standard"]) .vin-trail,
html[data-display-style]:not([data-display-style="standard"]) .make-card{border-color:var(--line);background-color:var(--display-surface);background-image:var(--display-surface-image);box-shadow:var(--display-panel-shadow)}
html[data-display-style]:not([data-display-style="standard"]) .fact,
html[data-display-style]:not([data-display-style="standard"]) .vin-cell,
html[data-display-style]:not([data-display-style="standard"]) .decoded-structure{border-color:var(--display-soft-line);background:var(--display-soft)}
html[data-display-style]:not([data-display-style="standard"]) .quick input,
html[data-display-style]:not([data-display-style="standard"]) .search-box input,
html[data-display-style]:not([data-display-style="standard"]) .fallback-controls select,
html[data-display-style]:not([data-display-style="standard"]) .vin-row code,
html[data-display-style]:not([data-display-style="standard"]) .display-picker select{border-color:var(--display-field-line);background:var(--display-field);color:var(--text)}
html[data-display-style]:not([data-display-style="standard"]) .quick input::placeholder,
html[data-display-style]:not([data-display-style="standard"]) .search-box input::placeholder{color:color-mix(in srgb,var(--muted) 74%,transparent)}
html[data-display-style]:not([data-display-style="standard"]) nav button:hover,
html[data-display-style]:not([data-display-style="standard"]) nav button.active,
html[data-display-style]:not([data-display-style="standard"]) nav a:hover,
html[data-display-style]:not([data-display-style="standard"]) .topbar nav a:hover,
html[data-display-style]:not([data-display-style="standard"]) .topbar nav a.active{border-color:var(--accent);background:var(--display-hover);color:var(--text)}
html[data-display-style]:not([data-display-style="standard"]) .query-chips button,
html[data-display-style]:not([data-display-style="standard"]) .code-browser button,
html[data-display-style]:not([data-display-style="standard"]) .filters button,
html[data-display-style]:not([data-display-style="standard"]) .secondary-action,
html[data-display-style]:not([data-display-style="standard"]) .secondary-link,
html[data-display-style]:not([data-display-style="standard"]) .vin-row button,
html[data-display-style]:not([data-display-style="standard"]) .fallback-controls button,
html[data-display-style]:not([data-display-style="standard"]) .card-actions button,
html[data-display-style]:not([data-display-style="standard"]) .card-actions a,
html[data-display-style]:not([data-display-style="standard"]) .research-link,
html[data-display-style]:not([data-display-style="standard"]) .mini-action{border-color:var(--display-action-line)!important;background:var(--display-action)!important;color:var(--display-action-text)!important}
html[data-display-style]:not([data-display-style="standard"]) .quick button:not(.secondary-action),
html[data-display-style]:not([data-display-style="standard"]) #clearSearch,
html[data-display-style]:not([data-display-style="standard"]) .action,
html[data-display-style]:not([data-display-style="standard"]) .primary-link{background:var(--accent);color:var(--display-accent-ink)}
html[data-display-style]:not([data-display-style="standard"]) .privacy-note{border-color:var(--display-note-line);background:var(--display-note);color:var(--display-note-text)}
html[data-display-style]:not([data-display-style="standard"]) .notice,
html[data-display-style]:not([data-display-style="standard"]) .epc-note{border-color:var(--warn);background:var(--display-warn);color:var(--display-warn-text)}
html[data-display-style]:not([data-display-style="standard"]) .badge,
html[data-display-style]:not([data-display-style="standard"]) .tag{background:var(--display-chip);color:var(--display-chip-text)}
html[data-display-style]:not([data-display-style="standard"]) .tag.confidence{background:var(--display-ok-chip);color:var(--display-ok-text)}
html[data-display-style]:not([data-display-style="standard"]) .display-picker{border-color:var(--display-field-line);background:var(--display-picker);box-shadow:var(--display-control-shadow)}


/* High-contrast content rules shared by every alternate display. */
html[data-display-style]:not([data-display-style="standard"]) .display-picker label,
html[data-display-style]:not([data-display-style="standard"]) .search-box span,
html[data-display-style]:not([data-display-style="standard"]) .research-link small{color:var(--display-label-text)}
html[data-display-style]:not([data-display-style="standard"]) .hero p,
html[data-display-style]:not([data-display-style="standard"]) .muted,
html[data-display-style]:not([data-display-style="standard"]) .version,
html[data-display-style]:not([data-display-style="standard"]) .status,
html[data-display-style]:not([data-display-style="standard"]) .summary-grid span,
html[data-display-style]:not([data-display-style="standard"]) .fact small,
html[data-display-style]:not([data-display-style="standard"]) .spec small,
html[data-display-style]:not([data-display-style="standard"]) .policy p,
html[data-display-style]:not([data-display-style="standard"]) nav button,
html[data-display-style]:not([data-display-style="standard"]) nav a,
html[data-display-style]:not([data-display-style="standard"]) .legacy{color:var(--muted)}
html[data-display-style]:not([data-display-style="standard"]) .quick input::placeholder,
html[data-display-style]:not([data-display-style="standard"]) .search-box input::placeholder{color:var(--display-placeholder-text);opacity:1}
html[data-display-style]:not([data-display-style="standard"]) .display-picker select option,
html[data-display-style]:not([data-display-style="standard"]) .fallback-controls select option{background:var(--display-field);color:var(--text)}
html[data-display-style]:not([data-display-style="standard"]) .filters button.active,
html[data-display-style]:not([data-display-style="standard"]) .resource-grid a,
html[data-display-style]:not([data-display-style="standard"]) .vin-cell.filled{color:var(--text)}
html[data-display-style]:not([data-display-style="standard"]) .research-link small{color:var(--display-label-text)}
html[data-display-style]:not([data-display-style="standard"]) .review-note{color:var(--display-warn-text)}
html[data-display-style]:not([data-display-style="standard"]) .warning-badge{border-color:var(--warn);background:var(--display-warn);color:var(--display-warn-text)}
html[data-display-style]:not([data-display-style="standard"]) .empty{border-color:var(--display-soft-line);color:var(--muted)}
html[data-display-style]:not([data-display-style="standard"]) .notice.ok{border-color:var(--ok);background:var(--display-ok-chip);color:var(--display-ok-text)}
html[data-display-style]:not([data-display-style="standard"]) .hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
html[data-display-style]:not([data-display-style="standard"]) .hero-actions button,
html[data-display-style]:not([data-display-style="standard"]) .hero-actions a{padding:11px 14px;border:1px solid var(--display-action-line);border-radius:10px;background:var(--display-action);color:var(--display-action-text);font:inherit;font-weight:900;text-decoration:none;cursor:pointer}

html[data-display-style="neon-grid"]{
  --bg:#05070a;--panel:#0b1015;--line:#71818c;--text:#f8fbfc;--muted:#cbd5da;--accent:#ffd51c;--accent2:#00e5ff;--ok:#70f7bb;--warn:#ffb454;--danger:#ff768c;
  --display-nav:#070a0df7;--display-nav-shadow:0 0 30px #00e5ff0d;--display-surface:#0b1015fa;--display-surface-image:linear-gradient(135deg,#ffd51c08,transparent 28%,#00e5ff07 100%);--display-panel-shadow:inset 3px 0 #ffd51c,0 20px 54px #0009;--display-soft:#070c10;--display-soft-line:#536875;--display-field:#030609;--display-field-line:#82939f;--display-hover:#172027;--display-action:#111c23;--display-action-line:#00dff7;--display-action-text:#f4fdff;--display-accent-ink:#151200;--display-label-text:#eefcff;--display-placeholder-text:#b8c4ca;--display-note:#071d25;--display-note-line:#00d9ef;--display-note-text:#e3fbff;--display-warn:#2b1b07;--display-warn-text:#ffedc6;--display-chip:#172630;--display-chip-text:#e3faff;--display-ok-chip:#0a3525;--display-ok-text:#d1ffe8;--display-picker:#070c10f7;--display-control-shadow:0 0 20px #00e5ff18;
}
html[data-display-style="neon-grid"] body{background-image:radial-gradient(circle at 84% 8%,#00e5ff14,transparent 30%),radial-gradient(circle at 12% 92%,#ffd51c0d,transparent 34%),linear-gradient(145deg,#05070a 0,#071017 55%,#05070a 100%);background-size:auto;font-family:Bahnschrift,"Arial Narrow","Segoe UI",Arial,sans-serif}
html[data-display-style="neon-grid"] .logo,
html[data-display-style="neon-grid"] .brand,
html[data-display-style="neon-grid"] h1,
html[data-display-style="neon-grid"] h2,
html[data-display-style="neon-grid"] h3{letter-spacing:.025em}
html[data-display-style="neon-grid"] h1,
html[data-display-style="neon-grid"] .hero h2{text-shadow:3px 0 #00e5ff22,-2px 0 #ffd51c1f}
html[data-display-style="neon-grid"] .hero,
html[data-display-style="neon-grid"] .panel,
html[data-display-style="neon-grid"] .policy{border-radius:2px 20px 2px 20px}
html[data-display-style="neon-grid"] .vin-card,
html[data-display-style="neon-grid"] .summary-grid article,
html[data-display-style="neon-grid"] .result-card,
html[data-display-style="neon-grid"] .make-card{border-radius:2px 14px 2px 14px}
html[data-display-style="neon-grid"] .eyebrow{color:var(--accent2)}
html[data-display-style="neon-grid"] .vin-meter span{background:linear-gradient(90deg,var(--accent),var(--accent2),var(--ok))}
html[data-display-style="neon-grid"] .display-picker,
html[data-display-style="neon-grid"] .display-picker select{border-radius:2px 9px 2px 9px}

html[data-display-style="ember-silver"]{
  --bg:#0d0a09;--panel:#17120f;--line:#9d8267;--text:#fffaf2;--muted:#e2d3bd;--accent:#ff8a86;--accent2:#f3e3c7;--ok:#a8dca3;--warn:#f4c66b;--danger:#ff9292;
  --display-nav:#120e0cf8;--display-nav-shadow:0 12px 34px #0009;--display-surface:#1a1411fa;--display-surface-image:linear-gradient(115deg,#ff8a8605,transparent 42%);--display-panel-shadow:inset 0 0 0 1px #f3e3c71f,0 20px 50px #0009;--display-soft:#110d0b;--display-soft-line:#806952;--display-field:#090706;--display-field-line:#b79a79;--display-hover:#34221e;--display-action:#2d211c;--display-action-line:#c5a27f;--display-action-text:#fffaf2;--display-accent-ink:#260708;--display-label-text:#fff0d6;--display-placeholder-text:#cfbea7;--display-note:#2b1d17;--display-note-line:#c99d6f;--display-note-text:#ffe9cf;--display-warn:#34240f;--display-warn-text:#ffedc2;--display-chip:#3a2b23;--display-chip-text:#fff1df;--display-ok-chip:#203824;--display-ok-text:#e1f5de;--display-picker:#17110ef8;--display-control-shadow:0 10px 24px #0008;
}
html[data-display-style="ember-silver"] body{background-image:radial-gradient(circle at 82% 3%,#7e20272e,transparent 35%),radial-gradient(circle at 8% 96%,#a66d2d17,transparent 38%),linear-gradient(145deg,#0d0a09 0,#17100e 55%,#0d0a09 100%);font-family:"Segoe UI",Arial,sans-serif}
html[data-display-style="ember-silver"] .logo,
html[data-display-style="ember-silver"] .brand,
html[data-display-style="ember-silver"] h1,
html[data-display-style="ember-silver"] h2,
html[data-display-style="ember-silver"] h3{font-family:Georgia,"Palatino Linotype",serif;letter-spacing:.018em}
html[data-display-style="ember-silver"] .hero,
html[data-display-style="ember-silver"] .panel,
html[data-display-style="ember-silver"] .policy{border-radius:4px;box-shadow:inset 0 0 0 3px #120f0d,0 20px 50px #0008}
html[data-display-style="ember-silver"] .vin-card,
html[data-display-style="ember-silver"] .summary-grid article,
html[data-display-style="ember-silver"] .result-card,
html[data-display-style="ember-silver"] .make-card{border-radius:4px;border-left:3px solid var(--accent2)}
html[data-display-style="ember-silver"] .eyebrow,
html[data-display-style="ember-silver"] .summary-grid strong{color:var(--accent2)}
html[data-display-style="ember-silver"] .quick button:not(.secondary-action),
html[data-display-style="ember-silver"] #clearSearch,
html[data-display-style="ember-silver"] .action,
html[data-display-style="ember-silver"] .primary-link{color:#fff7ee}
html[data-display-style="ember-silver"] .display-picker,
html[data-display-style="ember-silver"] .display-picker select,
html[data-display-style="ember-silver"] button,
html[data-display-style="ember-silver"] input{border-radius:4px}

html[data-display-style="frost-rune"]{
  --bg:#090d10;--panel:#141b21;--line:#91a4b0;--text:#f9fdff;--muted:#d6e3e9;--accent:#b9e9ff;--accent2:#eaf8ff;--ok:#a9dfc7;--warn:#f0cb83;--danger:#f49aa0;
  --display-nav:#10171cf8;--display-nav-shadow:0 10px 34px #0009;--display-surface:#151d23fa;--display-surface-image:linear-gradient(145deg,#fff0 0,#d8edf503 45%,#07101812 100%);--display-panel-shadow:inset 0 1px #d7ebf440,inset 0 -2px #070b0eb3,0 18px 46px #0009;--display-soft:#0f151a;--display-soft-line:#71838e;--display-field:#070b0e;--display-field-line:#a2b5c0;--display-hover:#26343d;--display-action:#22333d;--display-action-line:#9ed7ef;--display-action-text:#f7fdff;--display-accent-ink:#07151c;--display-label-text:#eaf8ff;--display-placeholder-text:#c3d2da;--display-note:#142a34;--display-note-line:#93cee7;--display-note-text:#e6f8ff;--display-warn:#342a17;--display-warn-text:#fff0ca;--display-chip:#2b3c46;--display-chip-text:#eefaff;--display-ok-chip:#1d3a31;--display-ok-text:#e4f8ef;--display-picker:#111a20f8;--display-control-shadow:0 10px 24px #0008;
}
html[data-display-style="frost-rune"] body{background-image:radial-gradient(circle at 76% 0,#9edcf218,transparent 34%),linear-gradient(128deg,#0d1115 0,#1a2229 52%,#0b0f13 100%);font-family:"Trebuchet MS","Segoe UI",Arial,sans-serif}
html[data-display-style="frost-rune"] .logo,
html[data-display-style="frost-rune"] .brand,
html[data-display-style="frost-rune"] h1,
html[data-display-style="frost-rune"] h2,
html[data-display-style="frost-rune"] h3{font-family:"Palatino Linotype",Georgia,serif;letter-spacing:.035em;text-shadow:0 2px #000}
html[data-display-style="frost-rune"] .hero,
html[data-display-style="frost-rune"] .panel,
html[data-display-style="frost-rune"] .policy{border-radius:0 16px 0 16px;border-width:1px 1px 3px}
html[data-display-style="frost-rune"] .vin-card,
html[data-display-style="frost-rune"] .summary-grid article,
html[data-display-style="frost-rune"] .result-card,
html[data-display-style="frost-rune"] .make-card{border-radius:0 10px 0 10px;border-top-color:#cfe8f2}
html[data-display-style="frost-rune"] .eyebrow,
html[data-display-style="frost-rune"] .summary-grid strong{color:var(--accent)}
html[data-display-style="frost-rune"] .display-picker,
html[data-display-style="frost-rune"] .display-picker select{border-radius:0 8px 0 8px}

@media(max-width:900px){.header-tools{justify-content:flex-start}.topbar>.display-picker{margin-top:12px}}
@media(max-width:560px){.display-picker{width:100%;justify-content:space-between}.display-picker select{min-width:0;flex:1}.header-tools{display:grid;justify-content:stretch}}

/* Distinct interaction and motion layer. Decorative effects stay off the page background. */
html[data-display-style] body,
html[data-display-style] .sidebar,
html[data-display-style] .topbar,
html[data-display-style] .hero,
html[data-display-style] .panel,
html[data-display-style] .policy,
html[data-display-style] .summary-grid article,
html[data-display-style] .vin-card,
html[data-display-style] .card,
html[data-display-style] .result-card,
html[data-display-style] .spec,
html[data-display-style] .make-card,
html[data-display-style] input,
html[data-display-style] select,
html[data-display-style] button,
html[data-display-style] a{
  transition:background-color .32s ease,border-color .32s ease,color .22s ease,box-shadow .32s ease,transform .24s ease,filter .24s ease;
}
html[data-display-style]:not([data-display-style="standard"]) :is(.hero,.panel,.policy){
  position:relative;
  isolation:isolate;
}
html[data-display-style]:not([data-display-style="standard"]) :is(.hero,.panel,.policy)>*{
  position:relative;
  z-index:1;
}
html[data-display-style]:not([data-display-style="standard"]) :is(.vin-card,.card,.result-card,.make-card,.summary-grid article){
  animation-duration:.44s;
  animation-timing-function:cubic-bezier(.2,.75,.25,1);
  animation-fill-mode:both;
}
html.display-style-switching[data-display-style="standard"] main{animation:displayStandardIn .32s ease both}
html.display-style-switching[data-display-style="neon-grid"] main{animation:displayNeonIn .42s cubic-bezier(.16,.84,.32,1) both}
html.display-style-switching[data-display-style="ember-silver"] main{animation:displayEmberIn .48s cubic-bezier(.2,.78,.28,1) both}
html.display-style-switching[data-display-style="frost-rune"] main{animation:displayFrostIn .48s cubic-bezier(.18,.76,.26,1) both}

@keyframes displayStandardIn{from{opacity:.72}to{opacity:1}}
@keyframes displayNeonIn{0%{opacity:.55;transform:translateX(10px);filter:saturate(.65)}100%{opacity:1;transform:none;filter:none}}
@keyframes displayEmberIn{0%{opacity:.58;transform:translateY(9px) scale(.994);filter:sepia(.24)}100%{opacity:1;transform:none;filter:none}}
@keyframes displayFrostIn{0%{opacity:.52;transform:translateY(-7px);filter:blur(2px)}100%{opacity:1;transform:none;filter:none}}

/* Neon Grid: offset tech geometry, signal sweeps and decisive feedback. */
html[data-display-style="neon-grid"] :is(.hero,.panel,.policy)::before{
  content:"";
  position:absolute;
  z-index:0;
  top:-1px;
  left:0;
  width:22%;
  min-width:72px;
  max-width:190px;
  height:3px;
  border-radius:0 4px 4px 0;
  background:linear-gradient(90deg,var(--accent),var(--accent2),transparent);
  box-shadow:0 0 15px #00e5ff55;
  animation:neonSignal 4.8s ease-in-out infinite;
  pointer-events:none;
}
html[data-display-style="neon-grid"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article){
  animation-name:neonCardIn;
  border-left-width:3px;
}
html[data-display-style="neon-grid"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link){
  border:1px solid #ffe45f;
  background:linear-gradient(110deg,#ffe11f,#ffc400);
  box-shadow:4px 4px 0 #00dff733;
  clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px));
}
html[data-display-style="neon-grid"] :is(.secondary-action,.secondary-link,.card-actions button,.card-actions a,.query-chips button,.code-browser button){
  clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,7px 100%,0 calc(100% - 7px));
}
html[data-display-style="neon-grid"] :is(input,select):focus{
  box-shadow:0 0 0 1px #00e5ff,0 0 22px #00e5ff24;
}
html[data-display-style="neon-grid"] .eyebrow::before{
  content:"";
  display:inline-block;
  width:7px;
  height:7px;
  margin-right:8px;
  background:var(--accent2);
  box-shadow:0 0 9px var(--accent2);
  animation:neonBeacon 1.8s steps(2,end) infinite;
}
html[data-display-style="neon-grid"] .vin-meter span{
  background-size:200% 100%;
  animation:neonMeter 3.2s linear infinite;
}
@keyframes neonSignal{0%,100%{opacity:.55;transform:translateX(0)}50%{opacity:1;transform:translateX(34px)}}
@keyframes neonBeacon{50%{opacity:.35}}
@keyframes neonMeter{to{background-position:-200% 0}}
@keyframes neonCardIn{from{opacity:0;transform:translateX(-12px);filter:saturate(.4)}to{opacity:1;transform:none;filter:none}}

/* Ember & Silver: framed manuscript panels, warm metal and measured weight. */
html[data-display-style="ember-silver"] :is(.hero,.panel,.policy)::before{
  content:"";
  position:absolute;
  z-index:0;
  top:13px;
  left:13px;
  width:10px;
  height:10px;
  border:1px solid #f3e3c7aa;
  background:#7c302e;
  box-shadow:0 0 0 3px #17120f,0 0 14px #ff8a8630;
  transform:rotate(45deg);
  pointer-events:none;
}
html[data-display-style="ember-silver"] :is(.hero,.panel,.policy)::after{
  content:"";
  position:absolute;
  z-index:0;
  right:14px;
  bottom:14px;
  width:34px;
  height:34px;
  border-right:1px solid #f3e3c766;
  border-bottom:1px solid #f3e3c766;
  pointer-events:none;
}
html[data-display-style="ember-silver"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article){
  animation-name:emberCardIn;
  box-shadow:inset 0 0 0 1px #f3e3c70d,0 12px 28px #0005;
}
html[data-display-style="ember-silver"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link){
  border:1px solid #e3c8aa;
  background:linear-gradient(145deg,#923f3c,#652725);
  color:#fffaf2;
  box-shadow:inset 0 1px #fff3,0 6px 18px #0005;
  text-shadow:0 1px #260708;
}
html[data-display-style="ember-silver"] :is(.secondary-action,.secondary-link,.card-actions button,.card-actions a,.query-chips button,.code-browser button){
  box-shadow:inset 0 1px #fff1,0 5px 14px #0003;
}
html[data-display-style="ember-silver"] :is(input,select):focus{
  box-shadow:0 0 0 1px #f3e3c7,0 8px 22px #0007;
}
html[data-display-style="ember-silver"] .eyebrow::before{
  content:"◆";
  margin-right:8px;
  color:#f3e3c7;
  font-size:.72em;
  text-shadow:0 0 8px #ff8a8655;
}
html[data-display-style="ember-silver"] .summary-grid article::after{
  content:"";
  position:absolute;
  right:12px;
  bottom:10px;
  width:22px;
  height:2px;
  background:linear-gradient(90deg,transparent,#ff8a86);
}
@keyframes emberCardIn{from{opacity:0;transform:translateY(11px) scale(.985);filter:sepia(.3)}to{opacity:1;transform:none;filter:none}}

/* Frost Rune: carved silhouettes, crystalline accents and glacial reveals. */
html[data-display-style="frost-rune"] :is(.hero,.panel,.policy)::before{
  content:"✦";
  position:absolute;
  z-index:0;
  top:10px;
  right:16px;
  color:#b9e9ff;
  font-size:24px;
  line-height:1;
  opacity:.52;
  text-shadow:0 0 14px #9edcf288;
  animation:frostGlyph 6s ease-in-out infinite;
  pointer-events:none;
}
html[data-display-style="frost-rune"] :is(.hero,.panel,.policy)::after{
  content:"";
  position:absolute;
  z-index:0;
  left:18px;
  bottom:-1px;
  width:84px;
  height:3px;
  background:linear-gradient(90deg,#eaf8ff,#7fcbe9,transparent);
  box-shadow:0 0 12px #9edcf244;
  pointer-events:none;
}
html[data-display-style="frost-rune"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article){
  animation-name:frostCardIn;
  clip-path:polygon(0 9px,9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%);
}
html[data-display-style="frost-rune"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link){
  border:1px solid #eaf8ff;
  background:linear-gradient(145deg,#d9f3ff,#8fcde5);
  color:#07151c;
  box-shadow:inset 0 1px #fff,0 0 18px #9edcf229;
  clip-path:polygon(0 8px,8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%);
}
html[data-display-style="frost-rune"] :is(.secondary-action,.secondary-link,.card-actions button,.card-actions a,.query-chips button,.code-browser button){
  clip-path:polygon(0 7px,7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%);
}
html[data-display-style="frost-rune"] :is(input,select):focus{
  box-shadow:0 0 0 1px #eaf8ff,0 0 20px #9edcf23b;
}
html[data-display-style="frost-rune"] .eyebrow::before{
  content:"✦";
  margin-right:8px;
  color:var(--accent);
  text-shadow:0 0 8px #9edcf277;
}
html[data-display-style="frost-rune"] h2{
  font-variant-caps:small-caps;
}
@keyframes frostGlyph{0%,100%{opacity:.35;transform:scale(.92) rotate(0)}50%{opacity:.7;transform:scale(1.08) rotate(45deg)}}
@keyframes frostCardIn{from{opacity:0;transform:translateY(-9px) scale(.99);filter:blur(2px)}to{opacity:1;transform:none;filter:none}}

@media(hover:hover){
  html[data-display-style="neon-grid"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article):hover{
    transform:translate(-2px,-3px);
    border-color:var(--accent2);
    box-shadow:inset 3px 0 var(--accent),0 15px 34px #00e5ff20;
  }
  html[data-display-style="neon-grid"] :is(button,.action,.primary-link,.secondary-link,.card-actions a):hover{
    transform:translate(-1px,-2px);
    filter:brightness(1.08);
  }
  html[data-display-style="ember-silver"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article):hover{
    transform:translateY(-3px);
    border-color:#e4c6a5;
    box-shadow:inset 3px 0 #ff8a86,0 16px 34px #0008;
  }
  html[data-display-style="ember-silver"] :is(button,.action,.primary-link,.secondary-link,.card-actions a):hover{
    transform:translateY(-2px);
    filter:brightness(1.12);
  }
  html[data-display-style="frost-rune"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article):hover{
    transform:translateY(-3px);
    border-color:#d9f3ff;
    box-shadow:inset 0 2px #eaf8ff,0 16px 34px #8bd8f11c;
  }
  html[data-display-style="frost-rune"] :is(button,.action,.primary-link,.secondary-link,.card-actions a):hover{
    transform:translateY(-2px);
    filter:brightness(1.09);
  }
}
@media(prefers-reduced-motion:reduce){
  html[data-display-style] *,
  html[data-display-style] *::before,
  html[data-display-style] *::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.001ms!important;
  }
}



/* Menu identity layer v1.4.0 */
html[data-display-style]:not([data-display-style="standard"]) body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.62;
}
html[data-display-style]:not([data-display-style="standard"]) :is(.app,.shell){
  position:relative;
  z-index:1;
}
html[data-display-style]:not([data-display-style="standard"]) :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a,.query-chips button,.code-browser button){
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
html[data-display-style]:not([data-display-style="standard"]) .display-picker::before{
  display:inline-grid;
  place-items:center;
  min-width:36px;
  color:var(--accent);
  font-size:9px;
  font-weight:950;
  letter-spacing:.14em;
}

/* Neon Grid: sharp system menu, signal cursor and fast scan transition. */
html[data-display-style="neon-grid"] body::before{
  background:
    radial-gradient(circle at 88% 12%,#00e5ff18,transparent 24%),
    radial-gradient(circle at 10% 88%,#ffd51c10,transparent 28%);
  animation:neonEdgePulse 6s ease-in-out infinite;
}
html[data-display-style="neon-grid"] .display-picker::before{content:"SYS"}
html[data-display-style="neon-grid"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::before{
  content:"▸";
  position:absolute;
  left:10px;
  color:var(--accent);
  opacity:0;
  transform:translateX(-7px);
  transition:opacity .16s ease,transform .2s ease;
}
html[data-display-style="neon-grid"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::after{
  content:"";
  position:absolute;
  left:10px;
  right:100%;
  bottom:2px;
  height:2px;
  background:linear-gradient(90deg,var(--accent),var(--accent2));
  box-shadow:0 0 9px #00e5ffaa;
  transition:right .22s ease;
}
html[data-display-style="neon-grid"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active){
  padding-left:30px;
  letter-spacing:.035em;
}
html[data-display-style="neon-grid"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::before{
  opacity:1;
  transform:none;
}
html[data-display-style="neon-grid"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::after{right:10px}
html[data-display-style="neon-grid"] :is(.sidebar nav>button,.topbar nav a).active::before{animation:neonCursor .85s steps(2,end) infinite}
html[data-display-style="neon-grid"] :is(h1,.hero h2){animation:neonTitleBoot .48s cubic-bezier(.16,.84,.32,1) both}
html.display-style-switching[data-display-style="neon-grid"] body::after{
  content:"";
  position:fixed;
  inset:-10%;
  z-index:9999;
  pointer-events:none;
  background:linear-gradient(90deg,transparent 0,#00e5ff22 47%,#ffd51c38 50%,transparent 54%);
  transform:translateX(-110%);
  animation:neonInterfaceWipe .58s cubic-bezier(.2,.75,.3,1) both;
}
@keyframes neonEdgePulse{0%,100%{opacity:.4;filter:saturate(.9)}50%{opacity:.72;filter:saturate(1.18)}}
@keyframes neonCursor{50%{opacity:.3}}
@keyframes neonTitleBoot{0%{opacity:0;transform:translateX(-16px);letter-spacing:.11em;filter:blur(2px)}70%{opacity:1;filter:none}100%{transform:none;letter-spacing:.025em}}
@keyframes neonInterfaceWipe{to{transform:translateX(110%)}}

/* Ember & Silver: framed story menu, sigil cursor and warm reveal. */
html[data-display-style="ember-silver"] body::before{
  background:
    radial-gradient(circle at 82% 6%,#9b242b24,transparent 27%),
    radial-gradient(circle at 12% 92%,#ba74301a,transparent 30%);
  animation:emberEdgeBreathe 8s ease-in-out infinite alternate;
}
html[data-display-style="ember-silver"] .display-picker::before{content:"SIGIL"}
html[data-display-style="ember-silver"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::before{
  content:"◆";
  position:absolute;
  left:10px;
  color:var(--accent2);
  font-size:8px;
  opacity:0;
  transform:rotate(-45deg) scale(.5);
  transition:opacity .22s ease,transform .28s ease;
}
html[data-display-style="ember-silver"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::after{
  content:"";
  position:absolute;
  left:11px;
  right:11px;
  bottom:3px;
  height:1px;
  background:linear-gradient(90deg,transparent,#d7ba99,transparent);
  opacity:0;
  transform:scaleX(.25);
  transition:opacity .25s ease,transform .32s ease;
}
html[data-display-style="ember-silver"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active){
  padding-left:30px;
  color:#fffaf2;
  text-shadow:0 1px 10px #ff8a863d;
}
html[data-display-style="ember-silver"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::before{
  opacity:1;
  transform:rotate(0) scale(1);
}
html[data-display-style="ember-silver"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::after{
  opacity:.72;
  transform:scaleX(1);
}
html[data-display-style="ember-silver"] :is(h1,.hero h2){animation:emberTitleReveal .58s cubic-bezier(.2,.78,.28,1) both}
html[data-display-style="ember-silver"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link){
  position:relative;
  overflow:hidden;
}
html[data-display-style="ember-silver"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link)::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,#fff5dc24 49%,transparent 68%);
  transform:translateX(-130%);
}
html[data-display-style="ember-silver"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link):hover::after{
  animation:emberButtonGlint .62s ease-out;
}
html.display-style-switching[data-display-style="ember-silver"] body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:9999;
  pointer-events:none;
  background:radial-gradient(circle at 50% 45%,transparent 0 18%,#8f25272b 38%,#080504b8 76%);
  animation:emberInterfaceReveal .58s ease-out both;
}
@keyframes emberEdgeBreathe{from{opacity:.4;filter:saturate(.85)}to{opacity:.72;filter:saturate(1.12)}}
@keyframes emberTitleReveal{from{opacity:0;transform:translateY(10px);letter-spacing:.08em;text-shadow:0 0 18px #ff8a8655}to{opacity:1;transform:none;letter-spacing:.018em;text-shadow:none}}
@keyframes emberButtonGlint{to{transform:translateX(130%)}}
@keyframes emberInterfaceReveal{from{opacity:1;transform:scale(1.08)}to{opacity:0;transform:scale(1)}}

/* Frost Rune: sparse carved menu, rune cursor and drifting cold mist. */
html[data-display-style="frost-rune"] body::before{
  inset:-5%;
  background:
    radial-gradient(ellipse at 22% 8%,#d9f5ff18,transparent 28%),
    radial-gradient(ellipse at 78% 92%,#76bbd716,transparent 31%);
  animation:frostMistDrift 12s ease-in-out infinite alternate;
}
html[data-display-style="frost-rune"] .display-picker::before{content:"RUNE"}
html[data-display-style="frost-rune"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::before{
  content:"ᛉ";
  position:absolute;
  left:10px;
  color:var(--accent);
  opacity:0;
  transform:translateY(5px) scale(.72);
  text-shadow:0 0 10px #b9e9ff88;
  transition:opacity .24s ease,transform .3s ease;
}
html[data-display-style="frost-rune"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:2px;
  height:1px;
  background:linear-gradient(90deg,transparent,#eaf8ff,transparent);
  opacity:0;
  transform:scaleX(.2);
  transition:opacity .26s ease,transform .34s ease;
}
html[data-display-style="frost-rune"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active){
  padding-left:31px;
  letter-spacing:.045em;
  color:#fff;
  text-shadow:0 0 12px #b9e9ff4a;
}
html[data-display-style="frost-rune"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::before{
  opacity:1;
  transform:none;
}
html[data-display-style="frost-rune"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::after{
  opacity:.78;
  transform:scaleX(1);
}
html[data-display-style="frost-rune"] :is(h1,.hero h2){animation:frostTitleCarve .64s cubic-bezier(.18,.76,.26,1) both}
html.display-style-switching[data-display-style="frost-rune"] body::after{
  content:"";
  position:fixed;
  left:0;
  right:0;
  top:-35%;
  height:48%;
  z-index:9999;
  pointer-events:none;
  background:linear-gradient(180deg,transparent,#dff7ff30 52%,transparent);
  filter:blur(10px);
  animation:frostInterfaceWash .6s ease-out both;
}
@keyframes frostMistDrift{from{transform:translate3d(-1.5%,-1%,0);opacity:.38}to{transform:translate3d(1.5%,1%,0);opacity:.68}}
@keyframes frostTitleCarve{from{opacity:0;transform:translateY(-9px);letter-spacing:.12em;filter:blur(3px)}to{opacity:1;transform:none;letter-spacing:.035em;filter:none}}
@keyframes frostInterfaceWash{to{top:105%;opacity:0}}

@media(max-width:560px){
  html[data-display-style]:not([data-display-style="standard"]) .display-picker::before{display:none}
}

/* Additional menu identities v1.5.0. Calm reading surfaces; motion stays on controls and edges. */

/* Classic Quest: parchment, carved timber and deliberate page turns. */
html[data-display-style="classic-quest"]{
  color-scheme:dark;
  --bg:#17110b;--panel:#2b2015;--line:#b4935c;--text:#fff4d2;--muted:#ddcda7;--accent:#f2c85b;--accent2:#d8aa58;--ok:#9dd47a;--warn:#f2bb62;--danger:#ef8f77;
  --display-nav:#21170ff8;--display-nav-shadow:0 12px 34px #0009;--display-surface:#2b2015fc;--display-surface-image:linear-gradient(135deg,#f5d88908,transparent 38%,#6f43290d);--display-panel-shadow:inset 0 0 0 2px #171009,inset 0 1px #f4d38436,0 18px 42px #0008;--display-soft:#21170f;--display-soft-line:#92754d;--display-field:#120d09;--display-field-line:#c3a56e;--display-hover:#49351e;--display-action:#3b2b19;--display-action-line:#d4b26c;--display-action-text:#fff1c6;--display-accent-ink:#241804;--display-label-text:#fff2c8;--display-placeholder-text:#c9b991;--display-note:#322718;--display-note-line:#c9a45e;--display-note-text:#ffedc1;--display-warn:#3d2a12;--display-warn-text:#ffe8b8;--display-chip:#4a3822;--display-chip-text:#fff0c4;--display-ok-chip:#2a4123;--display-ok-text:#e8ffd9;--display-picker:#21170ff8;--display-control-shadow:0 8px 20px #0008;
}
html[data-display-style="classic-quest"] body{
  background-image:radial-gradient(circle at 86% 8%,#c79c5124,transparent 29%),radial-gradient(circle at 8% 92%,#70452721,transparent 31%),linear-gradient(145deg,#17110b,#251a10 55%,#15100b);
  font-family:Georgia,"Palatino Linotype",serif;
}
html[data-display-style="classic-quest"] :is(.logo,.brand,h1,h2,h3){font-family:Georgia,"Palatino Linotype",serif;letter-spacing:.025em;text-shadow:0 2px #000}
html[data-display-style="classic-quest"] :is(.hero,.panel,.policy){border-width:2px;border-radius:3px;box-shadow:inset 0 0 0 3px #171009,inset 0 1px #ffe7a34a,0 18px 42px #0008}
html[data-display-style="classic-quest"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article){border-radius:2px;border-left:4px solid var(--accent2);animation-name:classicQuestCardIn}
html[data-display-style="classic-quest"] :is(.hero,.panel,.policy)::before{
  content:"✦";position:absolute;right:14px;top:10px;color:#f2c85b;font-size:18px;opacity:.44;text-shadow:0 0 10px #f2c85b44;pointer-events:none;animation:classicQuestSeal 5s ease-in-out infinite;
}
html[data-display-style="classic-quest"] .display-picker::before{content:"QUEST"}
html[data-display-style="classic-quest"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::before{
  content:"➤";position:absolute;left:9px;color:var(--accent);opacity:0;transform:translateX(-7px);transition:opacity .2s ease,transform .24s ease;
}
html[data-display-style="classic-quest"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::after{
  content:"";position:absolute;left:11px;right:11px;bottom:3px;height:2px;background:linear-gradient(90deg,transparent,#f2c85b,transparent);opacity:0;transform:scaleX(.3);transition:opacity .24s ease,transform .3s ease;
}
html[data-display-style="classic-quest"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active){padding-left:31px;color:#fff4d2;text-shadow:0 1px #000}
html[data-display-style="classic-quest"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::before{opacity:1;transform:none}
html[data-display-style="classic-quest"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::after{opacity:.82;transform:scaleX(1)}
html[data-display-style="classic-quest"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link){
  border:1px solid #ffe49b;border-radius:3px;background:linear-gradient(#f5d77d,#c9963e);color:#241804;box-shadow:inset 0 1px #fff4c4,inset 0 -2px #76501e,0 5px 12px #0006;
}
html[data-display-style="classic-quest"] :is(.secondary-action,.secondary-link,.card-actions button,.card-actions a,.query-chips button,.code-browser button){border-radius:3px;box-shadow:inset 0 1px #fff2,inset 0 -2px #0005}
html[data-display-style="classic-quest"] :is(input,select):focus{box-shadow:0 0 0 1px #ffe49b,0 0 18px #f2c85b2e}
html[data-display-style="classic-quest"] :is(h1,.hero h2){animation:classicQuestTitleIn .55s cubic-bezier(.2,.78,.25,1) both}
html[data-display-style="classic-quest"] body::before{
  background:radial-gradient(circle at 92% 8%,#f2c85b1f,transparent 23%),radial-gradient(circle at 7% 90%,#9a60361c,transparent 26%);
  animation:classicQuestGlow 8s ease-in-out infinite alternate;
}
html.display-style-switching[data-display-style="classic-quest"] main{animation:classicQuestMainIn .52s cubic-bezier(.2,.78,.25,1) both}
html.display-style-switching[data-display-style="classic-quest"] body::after{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;background:linear-gradient(90deg,#3b2917,#d2ad68 48%,#302014);transform-origin:left center;animation:classicQuestPageTurn .62s cubic-bezier(.45,0,.2,1) both;
}
@keyframes classicQuestCardIn{from{opacity:0;transform:translateY(10px);filter:sepia(.45)}to{opacity:1;transform:none;filter:none}}
@keyframes classicQuestSeal{50%{opacity:.72;transform:rotate(15deg) scale(1.08)}}
@keyframes classicQuestGlow{from{opacity:.36}to{opacity:.66}}
@keyframes classicQuestTitleIn{from{opacity:0;transform:translateY(8px);letter-spacing:.08em}to{opacity:1;transform:none;letter-spacing:.025em}}
@keyframes classicQuestMainIn{from{opacity:.25;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes classicQuestPageTurn{0%{transform:scaleX(1);opacity:1}55%{transform:scaleX(.07);opacity:.82}100%{transform:scaleX(0);opacity:0}}

/* Life Mode: bright neighbourhood cards, diamond selection and buoyant motion. */
html[data-display-style="life-mode"]{
  color-scheme:light;
  --bg:#dff4fb;--panel:#ffffff;--line:#70b9cf;--text:#12384d;--muted:#496b7a;--accent:#41cf73;--accent2:#159fc7;--ok:#2fae5e;--warn:#a86100;--danger:#b93d45;
  --display-nav:#087aa4f7;--display-nav-shadow:0 10px 30px #06668938;--display-surface:#fffffffa;--display-surface-image:linear-gradient(145deg,#ffffff,#eaf9fd 78%);--display-panel-shadow:0 14px 34px #287b9630;--display-soft:#e9f7fb;--display-soft-line:#8bc8d9;--display-field:#ffffff;--display-field-line:#5ea8be;--display-hover:#d9f6ff;--display-action:#e7f8fd;--display-action-line:#159fc7;--display-action-text:#12384d;--display-accent-ink:#07381a;--display-label-text:#16495e;--display-placeholder-text:#648391;--display-note:#e5f8ef;--display-note-line:#4dbd78;--display-note-text:#164c2a;--display-warn:#fff2d7;--display-warn-text:#6b3f00;--display-chip:#daf4fb;--display-chip-text:#174c61;--display-ok-chip:#ddf7e6;--display-ok-text:#174e2b;--display-picker:#ffffffed;--display-control-shadow:0 8px 20px #287b9630;
}
html[data-display-style="life-mode"] body{
  background-image:radial-gradient(circle at 86% 5%,#66d7ff45,transparent 28%),radial-gradient(circle at 8% 94%,#54db8040,transparent 30%),linear-gradient(145deg,#dff4fb,#eefbff 55%,#d9f2fa);
  font-family:"Trebuchet MS","Segoe UI",Arial,sans-serif;
}
html[data-display-style="life-mode"] :is(.sidebar,.topbar) :is(nav button,nav a,.legacy){color:#effcff}
html[data-display-style="life-mode"] :is(.logo,.brand,h1,h2,h3){font-family:"Trebuchet MS","Segoe UI",Arial,sans-serif;letter-spacing:.005em}
html[data-display-style="life-mode"] :is(.hero,.panel,.policy){border-radius:24px;border-width:1px;box-shadow:0 14px 34px #287b9630}
html[data-display-style="life-mode"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article){border-radius:18px;animation-name:lifeModeCardIn}
html[data-display-style="life-mode"] :is(.hero,.panel,.policy)::before{
  content:"";position:absolute;right:20px;top:14px;width:13px;height:20px;background:linear-gradient(145deg,#8df6a7,#23b758);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);filter:drop-shadow(0 4px 5px #14944355);pointer-events:none;animation:lifeModeDiamondFloat 2.8s ease-in-out infinite;
}
html[data-display-style="life-mode"] .display-picker::before{content:"LIFE";color:#159fc7}
html[data-display-style="life-mode"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::before{
  content:"◆";position:absolute;left:10px;color:#64ed8e;opacity:0;transform:translateY(6px) rotate(45deg) scale(.55);filter:drop-shadow(0 2px 3px #063);transition:opacity .2s ease,transform .3s cubic-bezier(.2,.8,.2,1);
}
html[data-display-style="life-mode"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active){padding-left:32px;color:#fff;background:#0d90bd}
html[data-display-style="life-mode"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::before{opacity:1;transform:translateY(0) rotate(45deg) scale(.78)}
html[data-display-style="life-mode"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link){
  border:1px solid #21a755;border-radius:999px;background:linear-gradient(#6be394,#36c86b);color:#07381a;box-shadow:inset 0 1px #dffff0,0 7px 15px #2a9a5230;
}
html[data-display-style="life-mode"] :is(.secondary-action,.secondary-link,.card-actions button,.card-actions a,.query-chips button,.code-browser button){border-radius:999px}
html[data-display-style="life-mode"] :is(input,select){border-radius:14px}
html[data-display-style="life-mode"] :is(input,select):focus{box-shadow:0 0 0 3px #58d9ff55,0 8px 20px #287b962e}
html[data-display-style="life-mode"] :is(h1,.hero h2){animation:lifeModeTitleIn .55s cubic-bezier(.16,.84,.32,1) both}
html[data-display-style="life-mode"] body::before{
  background:radial-gradient(circle at 92% 10%,#54d77d30,transparent 22%),radial-gradient(circle at 6% 88%,#39bce32e,transparent 25%);
  animation:lifeModeSkyDrift 9s ease-in-out infinite alternate;
}
html.display-style-switching[data-display-style="life-mode"] main{animation:lifeModeMainIn .56s cubic-bezier(.16,.84,.32,1) both}
html.display-style-switching[data-display-style="life-mode"] body::after{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;background:radial-gradient(circle at 82% 12%,#eafff1 0,#65dc8c 18%,#4bc4e1 46%,transparent 68%);animation:lifeModeBloom .62s ease-out both;
}
@keyframes lifeModeCardIn{from{opacity:0;transform:translateY(14px) scale(.975)}to{opacity:1;transform:none}}
@keyframes lifeModeDiamondFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(8deg)}}
@keyframes lifeModeSkyDrift{from{transform:translate3d(-1%,0,0);opacity:.42}to{transform:translate3d(1%,1%,0);opacity:.68}}
@keyframes lifeModeTitleIn{from{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes lifeModeMainIn{from{opacity:.2;transform:translateY(12px) scale(.99)}to{opacity:1;transform:none}}
@keyframes lifeModeBloom{from{opacity:1;clip-path:circle(120% at 82% 12%)}to{opacity:0;clip-path:circle(0 at 82% 12%)}}

/* Vault 108: retro-future terminals, Vault blue and irradiated Pip-Boy green. */
html[data-display-style="vault-108"]{
  color-scheme:dark;
  --bg:#07100d;--panel:#101b17;--line:#6d8d76;--text:#effbe9;--muted:#bdd0c1;--accent:#f4d43f;--accent2:#54f28d;--ok:#68f09b;--warn:#f5b958;--danger:#ff8074;
  --display-nav:#0a1511f8;--display-nav-shadow:0 0 30px #54f28d13;--display-surface:#111d18fc;--display-surface-image:linear-gradient(135deg,#f4d43f09,transparent 34%,#54f28d07);--display-panel-shadow:inset 3px 0 #f4d43f,0 18px 46px #0009;--display-soft:#0a1410;--display-soft-line:#587462;--display-field:#050b08;--display-field-line:#84a78d;--display-hover:#213429;--display-action:#17271f;--display-action-line:#69d994;--display-action-text:#effbe9;--display-accent-ink:#191500;--display-label-text:#e8f8e9;--display-placeholder-text:#a9c0af;--display-note:#12291d;--display-note-line:#56d887;--display-note-text:#ddf8e5;--display-warn:#35260d;--display-warn-text:#ffedbd;--display-chip:#20382a;--display-chip-text:#e4f8e8;--display-ok-chip:#133824;--display-ok-text:#dcffe7;--display-picker:#0b1712f8;--display-control-shadow:0 0 20px #54f28d1d;
}
html[data-display-style="vault-108"] body{background-image:radial-gradient(circle at 84% 7%,#54f28d17,transparent 29%),radial-gradient(circle at 9% 92%,#f4d43f0f,transparent 34%),linear-gradient(145deg,#07100d,#0d1914 56%,#060c09);font-family:"Trebuchet MS","Segoe UI",Arial,sans-serif}
html[data-display-style="vault-108"] :is(.logo,.brand,h1,h2,h3){font-family:Consolas,"Lucida Console",monospace;letter-spacing:.035em;text-shadow:0 0 10px #54f28d18}
html[data-display-style="vault-108"] :is(.hero,.panel,.policy){border-radius:3px;border-width:1px 1px 2px;box-shadow:inset 3px 0 #f4d43f,0 18px 46px #0009}
html[data-display-style="vault-108"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article){border-radius:2px;border-left:3px solid var(--accent);animation-name:vaultCardIn}
html[data-display-style="vault-108"] :is(.hero,.panel,.policy)::before{content:"VAULT 108";position:absolute;right:13px;top:10px;padding:3px 6px;border:1px solid #54f28d55;color:#54f28d;font:800 9px/1 Consolas,monospace;letter-spacing:.12em;opacity:.72;pointer-events:none;animation:vaultTerminalPulse 2.6s steps(2,end) infinite}
html[data-display-style="vault-108"] .display-picker::before{content:"PIP-BOY";color:#54f28d}
html[data-display-style="vault-108"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::before{content:">";position:absolute;left:9px;color:#54f28d;opacity:0;transform:translateX(-6px);transition:opacity .16s ease,transform .2s ease}
html[data-display-style="vault-108"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active){padding-left:28px;color:#fff7b6}
html[data-display-style="vault-108"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::before{opacity:1;transform:none}
html[data-display-style="vault-108"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link){border:1px solid #fff076;border-radius:3px;background:linear-gradient(#f7df56,#d4ae21);color:#191500;box-shadow:inset 0 1px #fff8bd,0 0 14px #f4d43f22}
html[data-display-style="vault-108"] :is(.secondary-action,.secondary-link,.card-actions button,.card-actions a,.query-chips button,.code-browser button){border-radius:3px}
html[data-display-style="vault-108"] :is(input,select){border-radius:2px}
html[data-display-style="vault-108"] :is(input,select):focus{box-shadow:inset 3px 0 #54f28d,0 0 16px #54f28d2d}
html[data-display-style="vault-108"] body::before{background:radial-gradient(circle at 91% 9%,#54f28d20,transparent 22%),radial-gradient(circle at 6% 90%,#f4d43f13,transparent 25%);animation:vaultAmbient 6s steps(3,end) infinite}
html.display-style-switching[data-display-style="vault-108"] main{animation:vaultMainIn .5s cubic-bezier(.16,.84,.32,1) both}
html.display-style-switching[data-display-style="vault-108"] body::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;background:repeating-linear-gradient(0deg,#54f28d00 0 5px,#54f28d2b 6px,#07100de8 7px 10px);animation:vaultBoot .62s steps(7,end) both}
@keyframes vaultCardIn{from{opacity:0;transform:translateY(8px);filter:sepia(.35) hue-rotate(65deg)}to{opacity:1;transform:none;filter:none}}
@keyframes vaultTerminalPulse{50%{opacity:.35;filter:brightness(1.5)}}
@keyframes vaultAmbient{50%{opacity:.4}}
@keyframes vaultMainIn{from{opacity:.18;transform:scale(.992)}to{opacity:1;transform:none}}
@keyframes vaultBoot{from{opacity:1;clip-path:inset(0)}to{opacity:0;clip-path:inset(50% 0)}}

/* Covert Ops: tactical black, orange segmentation and fast system motion. */
html[data-display-style="covert-ops"]{
  color-scheme:dark;
  --bg:#060708;--panel:#111315;--line:#6f7376;--text:#f5f6f4;--muted:#c5c8c9;--accent:#ff7a1a;--accent2:#f4a145;--ok:#8ed49e;--warn:#ffc066;--danger:#ff7b6f;
  --display-nav:#090a0bf8;--display-nav-shadow:0 0 28px #ff7a1a18;--display-surface:#111315fc;--display-surface-image:linear-gradient(135deg,#ff7a1a0a,transparent 30%,#ffffff03);--display-panel-shadow:inset 4px 0 #ff7a1a,0 18px 46px #000a;--display-soft:#0b0d0e;--display-soft-line:#5d6265;--display-field:#050607;--display-field-line:#81878a;--display-hover:#25282a;--display-action:#1b1e20;--display-action-line:#f08a3f;--display-action-text:#f7f7f5;--display-accent-ink:#1c0b00;--display-label-text:#ffe7d4;--display-placeholder-text:#aeb3b5;--display-note:#1d211f;--display-note-line:#dd853f;--display-note-text:#f7eadf;--display-warn:#34200d;--display-warn-text:#ffe1b5;--display-chip:#2a211c;--display-chip-text:#ffe7d3;--display-ok-chip:#173522;--display-ok-text:#daf7e2;--display-picker:#0b0d0ef8;--display-control-shadow:0 0 18px #ff7a1a20;
}
html[data-display-style="covert-ops"] body{
  background-image:radial-gradient(circle at 88% 8%,#ff7a1a1c,transparent 28%),radial-gradient(circle at 9% 92%,#a9431515,transparent 31%),linear-gradient(145deg,#060708,#0d0f10 55%,#050606);
  font-family:Bahnschrift,"Arial Narrow","Segoe UI",Arial,sans-serif;
}
html[data-display-style="covert-ops"] :is(.logo,.brand,h1,h2,h3){font-family:Bahnschrift,"Arial Narrow","Segoe UI",Arial,sans-serif;letter-spacing:.055em;text-transform:uppercase}
html[data-display-style="covert-ops"] :is(.hero,.panel,.policy){border-radius:0;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px))}
html[data-display-style="covert-ops"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article){border-radius:0;border-left:4px solid var(--accent);animation-name:covertOpsCardIn;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
html[data-display-style="covert-ops"] :is(.hero,.panel,.policy)::before{
  content:"";position:absolute;right:13px;top:10px;width:38px;height:4px;background:linear-gradient(90deg,#ff7a1a 0 28%,transparent 28% 36%,#ff7a1a 36% 64%,transparent 64% 72%,#ff7a1a 72%);opacity:.7;box-shadow:0 0 8px #ff7a1a55;pointer-events:none;animation:covertOpsSegments 2.4s steps(3,end) infinite;
}
html[data-display-style="covert-ops"] .display-picker::before{content:"OPS"}
html[data-display-style="covert-ops"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::before{
  content:"[";position:absolute;left:9px;color:var(--accent);opacity:0;transform:translateX(-6px);transition:opacity .15s ease,transform .18s ease;
}
html[data-display-style="covert-ops"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a)::after{
  content:"";position:absolute;left:12px;bottom:2px;width:0;height:2px;background:var(--accent);box-shadow:0 0 9px #ff7a1a88;transition:width .2s ease;
}
html[data-display-style="covert-ops"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active){padding-left:28px;color:#fff;letter-spacing:.06em}
html[data-display-style="covert-ops"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::before{opacity:1;transform:none}
html[data-display-style="covert-ops"] :is(.sidebar nav>button,.sidebar nav>a,.topbar nav a):is(:hover,.active)::after{width:calc(100% - 24px)}
html[data-display-style="covert-ops"] :is(.quick button:not(.secondary-action),#clearSearch,.action,.primary-link){
  border:1px solid #ff9a50;border-radius:0;background:linear-gradient(135deg,#ff8a34,#d75d0a);color:#1c0b00;box-shadow:inset 0 1px #ffc190,0 0 16px #ff7a1a2c;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px));
}
html[data-display-style="covert-ops"] :is(.secondary-action,.secondary-link,.card-actions button,.card-actions a,.query-chips button,.code-browser button){border-radius:0;clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%)}
html[data-display-style="covert-ops"] :is(input,select){border-radius:0}
html[data-display-style="covert-ops"] :is(input,select):focus{box-shadow:inset 3px 0 #ff7a1a,0 0 18px #ff7a1a35}
html[data-display-style="covert-ops"] :is(h1,.hero h2){animation:covertOpsTitleIn .42s cubic-bezier(.16,.84,.32,1) both}
html[data-display-style="covert-ops"] body::before{
  background:radial-gradient(circle at 94% 8%,#ff7a1a20,transparent 22%),radial-gradient(circle at 5% 90%,#ff7a1a10,transparent 24%);
  animation:covertOpsEdgePulse 4s steps(2,end) infinite;
}
html.display-style-switching[data-display-style="covert-ops"] main{animation:covertOpsMainIn .42s cubic-bezier(.16,.84,.32,1) both}
html.display-style-switching[data-display-style="covert-ops"] body::after{
  content:"";position:fixed;inset:-12%;z-index:9999;pointer-events:none;background:linear-gradient(105deg,transparent 0 38%,#ff7a1a22 42%,#ff8f3a78 48%,#0b0c0ddd 52%,transparent 61%);transform:translateX(-115%);animation:covertOpsWipe .58s cubic-bezier(.2,.75,.3,1) both;
}
@keyframes covertOpsCardIn{from{opacity:0;transform:translateX(-11px);filter:contrast(1.25)}to{opacity:1;transform:none;filter:none}}
@keyframes covertOpsSegments{50%{opacity:.34;filter:brightness(1.35)}}
@keyframes covertOpsEdgePulse{50%{opacity:.38}}
@keyframes covertOpsTitleIn{from{opacity:0;transform:translateX(-14px);letter-spacing:.12em;filter:blur(1px)}to{opacity:1;transform:none;letter-spacing:.055em;filter:none}}
@keyframes covertOpsMainIn{from{opacity:.18;transform:translateX(8px)}to{opacity:1;transform:none}}
@keyframes covertOpsWipe{to{transform:translateX(115%)}}

@media(hover:hover){
  html[data-display-style="classic-quest"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article):hover{transform:translateY(-3px);border-color:#f2c85b;box-shadow:inset 4px 0 #f2c85b,0 15px 32px #0008}
  html[data-display-style="classic-quest"] :is(button,.action,.primary-link,.secondary-link,.card-actions a):hover{transform:translateY(-2px);filter:brightness(1.08)}
  html[data-display-style="life-mode"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article):hover{transform:translateY(-5px) scale(1.008);border-color:#41cf73;box-shadow:0 17px 35px #287b9638}
  html[data-display-style="life-mode"] :is(button,.action,.primary-link,.secondary-link,.card-actions a):hover{transform:translateY(-3px) scale(1.02);filter:saturate(1.08)}
  html[data-display-style="vault-108"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article):hover{transform:translateX(3px);border-color:#54f28d;box-shadow:inset 4px 0 #f4d43f,0 14px 32px #0009}
  html[data-display-style="vault-108"] :is(button,.action,.primary-link,.secondary-link,.card-actions a):hover{transform:translateY(-2px);filter:brightness(1.1)}
  html[data-display-style="covert-ops"] :is(.vin-card,.card,.result-card,.make-card,.summary-grid article):hover{transform:translateX(3px);border-color:#ff9a50;box-shadow:inset 5px 0 #ff7a1a,0 14px 32px #000a}
  html[data-display-style="covert-ops"] :is(button,.action,.primary-link,.secondary-link,.card-actions a):hover{transform:translateX(2px);filter:brightness(1.12)}
}

/* Interactive interface companions v2.0.0 */
.interface-companion{--companion-bg:color-mix(in srgb,var(--panel,#101923) 94%,transparent);--companion-line:var(--line,#2d3947);--companion-glow:color-mix(in srgb,var(--accent,#38bdf8) 28%,transparent);position:relative;display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;min-height:92px;margin:0 0 16px;padding:8px 18px 8px 9px;overflow:hidden;border:1px solid var(--companion-line);border-radius:14px;background:var(--companion-bg);box-shadow:0 12px 30px #0003;isolation:isolate}
.interface-companion::before{content:"";position:absolute;inset:auto -8% -70% 28%;height:130%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,var(--companion-glow),transparent 67%);opacity:.7}
.companion-stage{position:relative!important;display:grid!important;place-items:center!important;width:82px!important;height:76px!important;margin:0!important;padding:0!important;overflow:visible!important;border:0!important;border-radius:10px!important;outline-offset:3px!important;background:transparent!important;box-shadow:none!important;clip-path:none!important;color:inherit!important;cursor:pointer!important;appearance:none!important}
.companion-stage:focus-visible{outline:2px solid var(--accent,#38bdf8)!important}.companion-stage:hover .companion-avatar{filter:brightness(1.12);transform:translateY(-3px) scale(1.025)}.companion-stage:hover::before{opacity:1;transform:scale(1.045)}.companion-stage:active .companion-avatar{filter:brightness(1.18);transform:translateY(1px) scale(.96)}.companion-stage:active::before{transform:scale(.94)}
.companion-sprites{position:relative;z-index:1;display:grid;width:70px;height:74px;place-items:end center}.companion-avatar{display:none;width:var(--avatar-width,54px);height:72px;overflow:visible;shape-rendering:crispEdges;image-rendering:pixelated;filter:drop-shadow(0 6px 3px #0005);transform-origin:center bottom;transition:transform .18s ease,filter .18s ease}
html[data-display-style="standard"] [data-companion-avatar="standard"],html[data-display-style="neon-grid"] [data-companion-avatar="neon-grid"],html[data-display-style="ember-silver"] [data-companion-avatar="ember-silver"],html[data-display-style="frost-rune"] [data-companion-avatar="frost-rune"],html[data-display-style="classic-quest"] [data-companion-avatar="classic-quest"],html[data-display-style="life-mode"] [data-companion-avatar="life-mode"],html[data-display-style="vault-108"] [data-companion-avatar="vault-108"],html[data-display-style="covert-ops"] [data-companion-avatar="covert-ops"]{display:block;animation:companionIdle 2.8s steps(2,end) infinite}
[data-companion-avatar="standard"]{--sprite-skin:#e7aa7d;--sprite-hair:#26384a;--sprite-cloth:#264c68;--sprite-dark:#101a24;--sprite-metal:#a9bac7;--sprite-light:#d9f6ff;--sprite-accent:#38bdf8}[data-companion-avatar="neon-grid"]{--sprite-skin:#d99a82;--sprite-hair:#181822;--sprite-cloth:#2b2638;--sprite-dark:#070a10;--sprite-metal:#818b99;--sprite-light:#b7fbff;--sprite-accent:#ff3f63}[data-companion-avatar="ember-silver"]{--sprite-skin:#d2a17f;--sprite-hair:#e2e4e5;--sprite-cloth:#2b2927;--sprite-dark:#121212;--sprite-metal:#aeb5ba;--sprite-light:#f1f4f4;--sprite-accent:#b9433c}[data-companion-avatar="frost-rune"]{--sprite-skin:#b88f73;--sprite-hair:#6d5949;--sprite-cloth:#3a3028;--sprite-dark:#111419;--sprite-metal:#858c91;--sprite-light:#dbe4e9;--sprite-accent:#8bd8f1}[data-companion-avatar="classic-quest"]{--sprite-skin:#d9a066;--sprite-hair:#6e4a27;--sprite-cloth:#3b7440;--sprite-dark:#24180e;--sprite-metal:#b9bdaf;--sprite-light:#f6e0a2;--sprite-accent:#d5a533}[data-companion-avatar="life-mode"]{--sprite-skin:#c98f6a;--sprite-hair:#563725;--sprite-cloth:#249dc4;--sprite-dark:#16445c;--sprite-metal:#8cb8c7;--sprite-light:#e9fbff;--sprite-accent:#41cf73}[data-companion-avatar="vault-108"]{--sprite-skin:#d6a078;--sprite-hair:#33271f;--sprite-cloth:#155f9f;--sprite-dark:#111a16;--sprite-metal:#737d72;--sprite-light:#eef7dc;--sprite-accent:#f4d43f}[data-companion-avatar="covert-ops"]{--sprite-skin:#8c6555;--sprite-hair:#151719;--sprite-cloth:#171b1f;--sprite-dark:#050607;--sprite-metal:#59626a;--sprite-light:#ffe5d2;--sprite-accent:#ff7a1a}
.sprite-skin{fill:var(--sprite-skin)}.sprite-hair{fill:var(--sprite-hair)}.sprite-cloth{fill:var(--sprite-cloth)}.sprite-dark,.sprite-shadow{fill:var(--sprite-dark)}.sprite-shadow{opacity:.52}.sprite-metal{fill:var(--sprite-metal)}.sprite-light{fill:var(--sprite-light)}.sprite-accent,.sprite-diamond{fill:var(--sprite-accent)}.sprite-effect-stroke{fill:none;stroke:var(--sprite-accent);stroke-width:2}.sprite-effect{opacity:0;transform-origin:center}.sprite-arm,.sprite-weapons,.sprite-diamond,.sprite-prop,.sprite-helmet,.sprite-fur,.sprite-ponytail,.sprite-medallion,.sprite-optics{transform-box:fill-box}.sprite-weapons,.sprite-diamond,.sprite-prop,.sprite-helmet,.sprite-fur,.sprite-ponytail,.sprite-medallion,.sprite-optics{transform-origin:center bottom}.sprite-arm{transform-origin:50% 12%}
[data-companion-avatar="vault-108"] .vault-blue{fill:#155f9f}[data-companion-avatar="vault-108"] .vault-blue-shade{fill:#0d467b}[data-companion-avatar="vault-108"] .vault-yellow{fill:#f4d43f}[data-companion-avatar="vault-108"] .vault-terminal{fill:#34483b}[data-companion-avatar="vault-108"] .vault-glow{fill:#54f28d}[data-companion-avatar="vault-108"] .vault-dog-fur{fill:#a96f3e}[data-companion-avatar="vault-108"] .vault-dog-dark{fill:#4c3327}[data-companion-avatar="vault-108"] .vault-armour-metal{fill:#717b70}[data-companion-avatar="vault-108"] .vault-armour-shade{fill:#4e584f}[data-companion-avatar="vault-108"] .vault-armour-dark{fill:#252d27}[data-companion-avatar="vault-108"] .vault-visor{fill:#18231c}[data-companion-avatar="vault-108"] .vault-number{fill:#f4d43f;font:900 8px/1 Consolas,monospace;letter-spacing:.02em}
.vault-dog-tail,.vault-dog-head,.vault-dog-leg,.vault-dog-paw,.vault-pipboy,.vault-core,.vault-visor,.vault-armour-effect{transform-box:fill-box;transform-origin:center}
.vault-form{opacity:0;pointer-events:none;transition:opacity .24s ease;transform-box:fill-box;transform-origin:center bottom}.interface-companion[data-vault-form="dweller"] .vault-dweller,.interface-companion[data-vault-form="dogmeat"] :is(.vault-dweller,.vault-dogmeat),.interface-companion[data-vault-form="power-armour"] .vault-power-armour{opacity:1}.interface-companion[data-vault-form="dweller"] .vault-dweller{transform:translateX(7px)}.interface-companion[data-vault-form="dogmeat"] .vault-dweller{transform:translateX(-18px) scale(.96)}.interface-companion[data-vault-form="dogmeat"] .vault-dogmeat{transform:translateX(0)}
.companion-dialogue{display:grid;min-width:0;gap:3px}.companion-role{color:var(--accent,#38bdf8);font-size:10px;font-weight:950;letter-spacing:.14em;text-transform:uppercase}.companion-status{overflow:hidden;color:var(--text,#f6f8fb);font-size:15px;line-height:1.35;text-overflow:ellipsis}.companion-effect-text{position:absolute;right:-5px;top:4px;min-width:30px;padding:3px 5px;border:1px solid color-mix(in srgb,var(--accent,#38bdf8) 70%,transparent);border-radius:5px;background:color-mix(in srgb,var(--bg,#081018) 90%,transparent);color:var(--accent,#38bdf8);font:900 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;text-align:center;opacity:0;pointer-events:none}
.interface-companion.is-reacting .companion-effect-text{animation:companionEffect 1s steps(4,end) both}.interface-companion[data-companion-state="typing"] .companion-avatar{animation:companionType .44s steps(2,end) infinite!important}.interface-companion[data-companion-state="scanning"] .companion-avatar{animation:companionScan .68s steps(4,end) infinite!important}.interface-companion[data-companion-state="success"] .companion-avatar{animation:companionCelebrate .72s steps(4,end) both!important}.interface-companion[data-companion-state="error"] .companion-avatar{animation:companionError .48s steps(4,end) both!important}.interface-companion[data-companion-state="copied"] .companion-avatar{animation:companionCopy .62s steps(4,end) both!important}.interface-companion[data-companion-state="style"] .companion-avatar{animation:companionStyleIn .58s ease-out both!important}.interface-companion:is([data-companion-state="typing"],[data-companion-state="scanning"]) .sprite-arm-right{animation:companionUseTool .38s steps(2,end) infinite}.interface-companion:is([data-companion-state="scanning"],[data-companion-state="success"],[data-companion-state="copied"]) .sprite-effect{opacity:1;animation:companionSpark .72s steps(3,end) infinite}
@keyframes companionIdle{50%{transform:translateY(-1px)}}@keyframes companionType{50%{transform:translateY(1px)}}@keyframes companionScan{0%,100%{transform:translateX(-1px)}50%{transform:translateX(2px) scale(1.02)}}@keyframes companionCelebrate{35%,65%{transform:translateY(-8px) scale(1.04)}100%{transform:none}}@keyframes companionError{25%{transform:translateX(-4px) rotate(-2deg)}75%{transform:translateX(4px) rotate(2deg)}}@keyframes companionCopy{45%{transform:translateY(-4px) rotate(-3deg)}}@keyframes companionStyleIn{from{opacity:0;transform:translateY(12px) scale(.78);filter:blur(2px)}}@keyframes companionWave{50%{transform:translateY(-5px) rotate(-24deg)}}@keyframes companionUseTool{50%{transform:translateY(-2px) rotate(-7deg)}}@keyframes companionSpark{50%{opacity:1;transform:scale(1.12)}}@keyframes companionEffect{0%{opacity:0;transform:translateY(6px) scale(.8)}18%,70%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-9px)}}
html[data-display-style="standard"] .interface-companion{--companion-bg:linear-gradient(115deg,#101923f7,#142330f7);--companion-line:#34495a}
html[data-display-style="neon-grid"] .interface-companion{--companion-bg:linear-gradient(105deg,#060b12f8,#11121df8);--companion-line:#00e5ff;--companion-glow:#00e5ff40;border-radius:0;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));box-shadow:inset 3px 0 #ffd51c,0 0 24px #00e5ff1c}html[data-display-style="neon-grid"] .companion-stage::after{content:"";position:absolute;left:8px;right:8px;top:9px;height:2px;background:#00e5ff;box-shadow:0 0 9px #00e5ff;opacity:.25;animation:companionNeonBeam 2.4s linear infinite}html[data-display-style="neon-grid"] .interface-companion[data-companion-state="scanning"] .companion-avatar{filter:drop-shadow(3px 0 #ff4db8) drop-shadow(-3px 0 #00e5ff)}html[data-display-style="neon-grid"] .companion-effect-text{border-radius:0;color:#ffd51c}@keyframes companionNeonBeam{0%{transform:translateY(0);opacity:.1}50%{opacity:.62}100%{transform:translateY(51px);opacity:.06}}
html[data-display-style="ember-silver"] .interface-companion{--companion-bg:linear-gradient(110deg,#201b1af9,#312523f7);--companion-line:#a8adb1;--companion-glow:#b9433c3d;border-radius:2px;border-width:2px;box-shadow:inset 0 0 0 3px #120f0e,0 16px 34px #0007}html[data-display-style="ember-silver"] .interface-companion::after{content:"◆";position:absolute;right:13px;top:8px;color:#c8cccf;font-size:12px;opacity:.45}html[data-display-style="ember-silver"] .interface-companion[data-companion-state="scanning"] .companion-stage{filter:sepia(.25) saturate(1.35)}html[data-display-style="ember-silver"] .interface-companion[data-companion-state="success"] .sprite-effect{filter:drop-shadow(0 0 5px #d64b42)}
html[data-display-style="frost-rune"] .interface-companion{--companion-bg:linear-gradient(110deg,#111c25f7,#243543f5);--companion-line:#a9d8e7;--companion-glow:#8bd8f14d;border-radius:3px;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px);box-shadow:inset 0 1px #e4f8ff,0 15px 36px #07121d75}html[data-display-style="frost-rune"] .interface-companion[data-companion-state="success"]::before{animation:companionFrostVoice .75s ease-out both}@keyframes companionFrostVoice{from{opacity:.95;transform:scale(.3)}to{opacity:0;transform:scale(1.8)}}
html[data-display-style="classic-quest"] .interface-companion{--companion-bg:linear-gradient(110deg,#21170ff9,#392818f8);--companion-line:#b4935c;--companion-glow:#f2c85b33;border-radius:3px;border-width:2px;box-shadow:inset 0 0 0 3px #171009,inset 0 1px #ffe7a34a,0 14px 32px #0008}html[data-display-style="classic-quest"] .companion-status,html[data-display-style="classic-quest"] .companion-effect-text{font-family:Georgia,serif}html[data-display-style="classic-quest"] .companion-effect-text{border-radius:0;background:#24180ef2;color:#f2c85b}html[data-display-style="classic-quest"] .interface-companion[data-companion-state="success"] .companion-effect-text{font-size:10px;animation:companionXpDrop 1.25s steps(4,end) both}@keyframes companionXpDrop{18%,62%{opacity:1;transform:translateY(-5px)}100%{opacity:0;transform:translateY(-21px)}}
html[data-display-style="life-mode"] .interface-companion{--companion-bg:linear-gradient(110deg,#fffffffa,#e6f9fffa);--companion-line:#70b9cf;--companion-glow:#41cf7342;border-radius:22px;box-shadow:0 13px 30px #287b9630}html[data-display-style="life-mode"] .companion-status{color:#12384d}html[data-display-style="life-mode"] [data-companion-avatar="life-mode"] .sprite-diamond{animation:companionDiamond 2s ease-in-out infinite;filter:drop-shadow(0 2px 3px #159b45aa)}html[data-display-style="life-mode"] .interface-companion[data-companion-state="success"] .sprite-diamond{fill:#75e68e}html[data-display-style="life-mode"] .interface-companion[data-companion-state="error"] .sprite-diamond{fill:#e86969}@keyframes companionDiamond{50%{transform:translateY(-3px) rotate(5deg)}}
html[data-display-style="vault-108"] .interface-companion{--companion-bg:linear-gradient(105deg,#09140ff9,#15261df8);--companion-line:#6d8d76;--companion-glow:#54f28d36;border-radius:3px;border-left:4px solid #f4d43f;box-shadow:inset 0 1px #54f28d24,0 14px 34px #0009}html[data-display-style="vault-108"] .companion-status{font-family:Consolas,"Lucida Console",monospace}html[data-display-style="vault-108"] .companion-effect-text{border-radius:2px;border-color:#54f28d;color:#f4d43f;background:#07100df2}html[data-display-style="vault-108"] .interface-companion::after{content:"108";position:absolute;right:11px;bottom:7px;color:#54f28d;font:900 9px/1 Consolas,monospace;letter-spacing:.18em;opacity:.58}html[data-display-style="vault-108"] .interface-companion[data-companion-state="scanning"] .vault-pipboy{animation:vaultPipScan .32s steps(2,end) infinite;filter:drop-shadow(0 0 6px #54f28d)}@keyframes vaultPipScan{50%{transform:translateY(-2px) rotate(-5deg);filter:drop-shadow(0 0 9px #54f28d) brightness(1.35)}}
html[data-display-style="covert-ops"] .interface-companion{--companion-bg:linear-gradient(105deg,#08090af9,#17191bf8);--companion-line:#777b7e;--companion-glow:#ff7a1a38;border-radius:0;border-left:4px solid #ff7a1a;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));box-shadow:inset 0 1px #ffffff1c,0 14px 36px #000a}html[data-display-style="covert-ops"] .interface-companion::after{content:"03";position:absolute;right:11px;bottom:7px;color:#ff7a1a;font:900 9px/1 Bahnschrift,Arial,sans-serif;letter-spacing:.2em;opacity:.6}html[data-display-style="covert-ops"] .interface-companion[data-companion-state="scanning"] .companion-avatar{animation:companionOpsScan .34s steps(2,end) infinite!important}@keyframes companionOpsScan{50%{transform:translateX(3px);filter:contrast(1.35) brightness(1.15)}}

/* Strong silhouettes and contained avatar-stage identities. */
.companion-stage::before{content:"";position:absolute;inset:7px;z-index:0;pointer-events:none;opacity:.72;transition:opacity .2s ease,transform .25s ease}
[data-companion-avatar="standard"]{--avatar-width:51px}
[data-companion-avatar="neon-grid"]{--avatar-width:65px}
[data-companion-avatar="ember-silver"]{--avatar-width:67px}
[data-companion-avatar="frost-rune"]{--avatar-width:69px}
[data-companion-avatar="classic-quest"]{--avatar-width:62px}
[data-companion-avatar="life-mode"]{--avatar-width:59px}
[data-companion-avatar="vault-108"]{--avatar-width:118px}
[data-companion-avatar="covert-ops"]{--avatar-width:68px}
html[data-display-style="standard"] .companion-stage::before{inset:12px 8px 7px;border:1px solid #5d8197;border-radius:9px;background:linear-gradient(150deg,#24405280,#0f1b2580);box-shadow:inset 0 0 0 3px #0b131a66}
html[data-display-style="neon-grid"] .companion-stage::before{inset:9px 3px 5px;border:1px solid #00e5ff99;background:linear-gradient(135deg,#00e5ff18,#ff4db814);clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);box-shadow:inset 3px 0 #ffd51c99,0 0 10px #00e5ff38}
html[data-display-style="ember-silver"] .companion-stage::before{inset:8px 4px 4px;border:2px double #aeb5ba99;border-radius:50% 50% 42% 42%;background:radial-gradient(circle at 50% 42%,#b9433c36 0 10%,#19151599 11% 58%,transparent 59%);box-shadow:0 0 13px #b9433c24}
html[data-display-style="frost-rune"] .companion-stage::before{inset:7px 1px 3px;border:1px solid #bfeeffaa;background:radial-gradient(circle,#8bd8f124,transparent 62%);clip-path:polygon(50% 0,93% 18%,100% 72%,72% 100%,28% 100%,0 72%,7% 18%);box-shadow:inset 0 0 14px #8bd8f12e}
html[data-display-style="classic-quest"] .companion-stage::before{inset:10px 7px 4px;border:3px ridge #b4935c;border-radius:50% 50% 44% 44%;background:radial-gradient(circle at 50% 35%,#f2c85b22,#21170faa 68%);box-shadow:inset 0 -5px #17100980}
html[data-display-style="life-mode"] .companion-stage::before{inset:8px 5px 5px;border:1px solid #70b9cf88;border-radius:44% 56% 48% 52%;background:radial-gradient(circle at 30% 28%,#ffffffcc 0 8%,transparent 9%),radial-gradient(circle at 72% 38%,#41cf7355 0 10%,transparent 11%),linear-gradient(155deg,#dff8ffcc,#86dff266);box-shadow:0 6px 14px #287b9638}
html[data-display-style="vault-108"] .companion-stage::before{inset:7px 0 4px;border:1px solid #54f28d8a;border-radius:3px;background:linear-gradient(#54f28d 0 0) 8px 9px/18px 1px no-repeat,linear-gradient(#54f28d 0 0) calc(100% - 8px) calc(100% - 9px)/18px 1px no-repeat,repeating-linear-gradient(0deg,#54f28d08 0 4px,#54f28d15 5px,#07100d55 6px);box-shadow:inset 4px 0 #f4d43f80,0 0 12px #54f28d22}
html[data-display-style="covert-ops"] .companion-stage::before{inset:8px 1px 4px;border:1px solid #ff7a1a8f;background:linear-gradient(#ff7a1a 0 0) 50% 0/1px 15% no-repeat,linear-gradient(#ff7a1a 0 0) 50% 100%/1px 15% no-repeat,linear-gradient(90deg,#ff7a1a 0 0) 0 50%/15% 1px no-repeat,linear-gradient(90deg,#ff7a1a 0 0) 100% 50%/15% 1px no-repeat,radial-gradient(circle,transparent 36%,#ff7a1a4d 37% 39%,transparent 40%);clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}
.interface-companion[data-companion-state="copied"] .sprite-clipboard{animation:companionClipboard .62s steps(3,end) both}
html[data-display-style="neon-grid"] .interface-companion[data-companion-state="scanning"] .sprite-coat-tail{animation:companionCoatSignal .5s steps(2,end) infinite}
html[data-display-style="ember-silver"] .interface-companion:is([data-companion-state="greet"],[data-companion-state="success"]) .sprite-weapons{animation:companionBlades .72s ease-out both}
html[data-display-style="frost-rune"] .interface-companion:is([data-companion-state="success"],[data-companion-state="greet"]) .sprite-shield{animation:companionShield .7s steps(3,end) both;filter:drop-shadow(0 0 5px #8bd8f1)}
html[data-display-style="classic-quest"] .interface-companion[data-companion-state="success"] .sprite-round-shield{animation:companionQuestShield .7s steps(3,end) both}
html[data-display-style="life-mode"] .interface-companion[data-companion-state="greet"] .companion-stage::before{animation:companionLifeBubble .8s ease-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-state="scanning"] .sprite-radio{animation:companionRadio .34s steps(2,end) infinite;filter:drop-shadow(0 0 4px #ff7a1a)}
@keyframes companionClipboard{45%{transform:translateY(-4px) rotate(-8deg)}}
@keyframes companionCoatSignal{50%{transform:skewX(-8deg) translateX(-2px)}}
@keyframes companionBlades{35%{transform:translateY(-4px) scale(1.08)}70%{transform:translateY(-2px)}}
@keyframes companionShield{35%{transform:translateX(-3px) scale(1.12)}70%{transform:translateX(1px)}}
@keyframes companionQuestShield{40%{transform:rotate(-12deg) translateY(-3px)}}
@keyframes companionLifeBubble{45%{transform:scale(1.08) rotate(3deg);opacity:1}}
@keyframes companionRadio{50%{transform:translateY(-1px);opacity:.55}}

/* Hero motion library v2.0.0: rotating ambient poses plus expanded click gestures. */
.interface-companion[data-companion-motion="idle-breathe"] .companion-avatar{animation:heroBreathe 2.7s steps(3,end) infinite!important}
.interface-companion[data-companion-motion="idle-look"] .companion-avatar{animation:heroLook 3.4s steps(4,end) infinite!important}
.interface-companion[data-companion-motion="idle-ready"] .companion-avatar{animation:heroReady 2.9s steps(3,end) infinite!important}
.interface-companion[data-companion-motion="type-work"] .companion-avatar{animation:heroWork .54s steps(3,end) infinite!important}
.interface-companion[data-companion-motion="scan-focus"] .companion-avatar{animation:heroFocus .86s steps(4,end) infinite!important}
.interface-companion[data-companion-motion="scan-power"] .companion-avatar{animation:heroPower .92s steps(4,end) infinite!important}
.interface-companion[data-companion-motion="success-celebrate"] .companion-avatar{animation:heroCelebrate .9s steps(5,end) both!important}
.interface-companion[data-companion-motion="success-flourish"] .companion-avatar{animation:heroFlourish 1s steps(5,end) both!important}
.interface-companion[data-companion-motion="error-stagger"] .companion-avatar{animation:heroStagger .62s steps(5,end) both!important}
.interface-companion[data-companion-motion="error-think"] .companion-avatar{animation:heroThink .9s steps(4,end) both!important}
.interface-companion[data-companion-motion="copy-present"] .companion-avatar{animation:heroPresent .78s steps(4,end) both!important}
.interface-companion[data-companion-motion="style-arrive"] .companion-avatar{animation:heroArrive .72s cubic-bezier(.16,.84,.32,1) both!important}
.interface-companion[data-companion-motion="greet-wave"] .companion-avatar{animation:heroWaveBody .92s steps(4,end) both!important}
.interface-companion[data-companion-motion="greet-wave"] .sprite-arm-right{animation:heroWaveArm .92s steps(4,end) both!important}
.interface-companion[data-companion-motion="greet-salute"] .companion-avatar{animation:heroSaluteBody .86s steps(4,end) both!important}
.interface-companion[data-companion-motion="greet-salute"] .sprite-arm-right{animation:heroSaluteArm .86s steps(4,end) both!important}
.interface-companion[data-companion-motion="greet-ready"] .companion-avatar{animation:heroReadyGesture .92s steps(4,end) both!important}
.interface-companion[data-companion-motion="greet-cheer"] .companion-avatar{animation:heroCheer .96s steps(5,end) both!important}
.interface-companion[data-companion-motion="greet-cheer"] .sprite-arm{animation:heroCheerArms .96s steps(5,end) both!important}
.interface-companion[data-companion-motion="greet-bow"] .companion-avatar{animation:heroBow 1s steps(5,end) both!important}
.interface-companion[data-companion-motion="greet-spin"] .companion-avatar{animation:heroSpin .96s steps(6,end) both!important}
.interface-companion[data-companion-motion="greet-hop"] .companion-avatar{animation:heroHop .9s steps(5,end) both!important}
.interface-companion[data-companion-motion="greet-quickdraw"] .companion-avatar{animation:heroQuickdraw .92s steps(5,end) both!important}
.interface-companion[data-companion-motion="greet-scan"] .companion-avatar{animation:heroScanGesture 1.05s steps(5,end) both!important}
.interface-companion[data-companion-motion="greet-blade"] .companion-avatar{animation:heroBladeGesture 1.05s steps(6,end) both!important}
.interface-companion[data-companion-motion="greet-stomp"] .companion-avatar{animation:heroStomp .92s steps(5,end) both!important}
.interface-companion[data-companion-motion="greet-shout"] .companion-avatar{animation:heroShout .98s steps(5,end) both!important}
.interface-companion[data-companion-motion="greet-shield"] .companion-avatar{animation:heroShieldGesture .98s steps(5,end) both!important}
.interface-companion[data-companion-motion="greet-dance"] .companion-avatar{animation:heroDance 1.12s steps(7,end) both!important}
.interface-companion[data-companion-motion="greet-dance"] .sprite-arm{animation:heroDanceArms 1.12s steps(7,end) both!important}
.interface-companion[data-companion-motion="greet-crouch"] .companion-avatar{animation:heroCrouch .96s steps(5,end) both!important}
.interface-companion.is-ambient .companion-avatar{filter:brightness(1.07) drop-shadow(0 6px 3px #0005)}
@keyframes heroBreathe{0%,100%{transform:none}45%{transform:translateY(-2px) scaleY(1.015)}55%{transform:translateY(-2px) scaleY(1.015)}}
@keyframes heroLook{0%,28%,100%{transform:none}38%,58%{transform:translateX(-2px) rotate(-1deg)}68%,84%{transform:translateX(2px) rotate(1deg)}}
@keyframes heroReady{0%,100%{transform:none}42%,58%{transform:translateY(-1px) scaleX(1.025)}}
@keyframes heroWork{0%,100%{transform:none}50%{transform:translateY(2px) rotate(-1deg)}}
@keyframes heroFocus{0%,100%{transform:translateX(-1px)}50%{transform:translateX(2px) scale(1.035);filter:brightness(1.18)}}
@keyframes heroPower{0%,100%{transform:none}30%,65%{transform:translateY(-3px) scale(1.06);filter:drop-shadow(0 0 6px var(--sprite-accent))}}
@keyframes heroCelebrate{0%,100%{transform:none}32%,62%{transform:translateY(-9px) scale(1.06)}48%{transform:translateY(-12px) scale(1.08)}}
@keyframes heroFlourish{0%,100%{transform:none}25%{transform:rotate(-5deg) translateX(-2px)}52%{transform:rotate(7deg) translateX(3px) scale(1.06)}75%{transform:rotate(-2deg)}}
@keyframes heroStagger{0%,100%{transform:none}20%{transform:translateX(-5px) rotate(-4deg)}45%{transform:translateX(5px) rotate(3deg)}70%{transform:translateX(-2px)}}
@keyframes heroThink{0%,100%{transform:none}35%,70%{transform:translateY(2px) rotate(-3deg) scale(.98)}}
@keyframes heroPresent{0%,100%{transform:none}35%,68%{transform:translateY(-4px) scale(1.055)}}
@keyframes heroArrive{from{opacity:0;transform:translateY(14px) scale(.7);filter:blur(3px)}65%{transform:translateY(-3px) scale(1.06)}to{opacity:1;transform:none;filter:none}}
@keyframes heroWaveBody{0%,100%{transform:none}35%,70%{transform:translateX(-1px) rotate(-2deg)}}
@keyframes heroWaveArm{0%,100%{transform:none}18%{transform:translate(-1px,-2px) rotate(-112deg)}38%{transform:translate(-2px,-3px) rotate(-146deg)}58%{transform:translate(-1px,-3px) rotate(-116deg)}78%{transform:translate(-2px,-3px) rotate(-148deg)}90%{transform:translate(-1px,-2px) rotate(-116deg)}}
@keyframes heroWaveLeftArm{0%,100%{transform:none}18%{transform:translate(1px,-2px) rotate(112deg)}38%{transform:translate(2px,-3px) rotate(146deg)}58%{transform:translate(1px,-3px) rotate(116deg)}78%{transform:translate(2px,-3px) rotate(148deg)}90%{transform:translate(1px,-2px) rotate(116deg)}}
@keyframes heroSaluteBody{0%,100%{transform:none}30%,72%{transform:translateY(-2px) rotate(1deg)}}
@keyframes heroSaluteArm{0%,100%{transform:none}30%,72%{transform:translate(-5px,-12px) rotate(-52deg)}}
@keyframes heroReadyGesture{0%,100%{transform:none}28%{transform:translateY(2px) scale(.98)}58%{transform:translateY(-5px) scale(1.07)}78%{transform:translateY(-2px)}}
@keyframes heroCheer{0%,100%{transform:none}28%{transform:translateY(-4px) scale(1.04)}52%{transform:translateY(-11px) scale(1.08)}76%{transform:translateY(-3px) scale(1.03)}}
@keyframes heroCheerArms{0%,100%{transform:none}30%,72%{transform:translateY(-2px) rotate(-128deg)}}
@keyframes heroBow{0%,100%{transform:none}35%,72%{transform:translateY(4px) rotate(12deg) scaleY(.92)}}
@keyframes heroSpin{0%,100%{transform:none}20%{transform:translateY(-3px) rotate(-10deg) scaleX(.72)}42%{transform:translateY(-5px) scaleX(.18)}64%{transform:translateY(-4px) rotate(8deg) scaleX(-.72)}82%{transform:translateY(-2px) scaleX(-1)}}
@keyframes heroHop{0%,100%{transform:none}24%{transform:translateY(2px) scaleY(.94)}48%{transform:translateY(-12px) scaleY(1.07)}72%{transform:translateY(-3px)}}
@keyframes heroQuickdraw{0%,100%{transform:none}25%{transform:translateY(2px) rotate(-4deg)}48%,72%{transform:translate(-3px,-5px) rotate(7deg) scale(1.06)}}
@keyframes heroScanGesture{0%,100%{transform:none}20%{transform:translateX(-4px) rotate(-2deg)}42%{transform:translateX(4px) rotate(2deg);filter:brightness(1.3)}64%{transform:translateX(-2px)}82%{transform:translateX(2px)}}
@keyframes heroBladeGesture{0%,100%{transform:none}22%{transform:translate(-2px,1px) rotate(-5deg)}48%{transform:translate(3px,-6px) rotate(9deg) scale(1.07)}74%{transform:translate(-1px,-2px) rotate(-3deg)}}
@keyframes heroStomp{0%,100%{transform:none}25%{transform:translateY(-4px)}45%{transform:translateY(3px) scaleY(.94)}55%{transform:translateY(-1px)}72%{transform:translateY(2px) scaleX(1.05)}}
@keyframes heroShout{0%,100%{transform:none}25%{transform:translateY(2px) scale(.97)}46%,72%{transform:translateY(-3px) scale(1.08);filter:drop-shadow(0 0 7px var(--sprite-accent))}}
@keyframes heroShieldGesture{0%,100%{transform:none}25%{transform:translateX(-2px) rotate(-3deg)}52%,76%{transform:translateX(4px) scale(1.06)}}
@keyframes heroDance{0%,100%{transform:none}16%{transform:translate(-4px,-3px) rotate(-7deg)}34%{transform:translate(4px,-7px) rotate(8deg)}52%{transform:translate(-3px,-5px) rotate(-5deg)}70%{transform:translate(4px,-9px) rotate(7deg)}86%{transform:translateY(-2px)}}
@keyframes heroDanceArms{0%,100%{transform:none}20%{transform:rotate(-118deg)}40%{transform:rotate(42deg)}60%{transform:rotate(-132deg)}80%{transform:rotate(55deg)}}
@keyframes heroCrouch{0%,100%{transform:none}28%,70%{transform:translateY(8px) scaleY(.82) scaleX(1.08)}82%{transform:translateY(-2px)}}

/* Per-world prop animation turns the shared poses into character-specific actions. */
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="scan-focus"],[data-companion-motion="scan-power"]) :is(.sprite-optics,.sprite-cyber-arm){animation:neonOptics .38s steps(2,end) infinite;filter:drop-shadow(0 0 4px #00e5ff)}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="success-flourish"] .sprite-pistol{animation:neonDraw .9s steps(5,end) both}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="greet-ready"] .sprite-coat-tail{animation:neonCoatReady .9s steps(4,end) both}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="greet-quickdraw"] .sprite-pistol{animation:neonDraw .92s steps(5,end) both;filter:drop-shadow(0 0 5px #ff4db8)}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="greet-scan"] :is(.sprite-optics,.sprite-cyber-arm){animation:neonOptics .3s steps(2,end) 4;filter:drop-shadow(0 0 5px #00e5ff)}
html[data-display-style="neon-grid"] .sprite-johnny-guitar{opacity:0;transform-box:fill-box;transform-origin:58% 64%}
html[data-display-style="neon-grid"] .sprite-guitar-dark{fill:#15131b}
html[data-display-style="neon-grid"] .sprite-johnny-vest .sprite-cloth{fill:#22252b}
html[data-display-style="neon-grid"] [data-companion-avatar="neon-grid"] .sprite-outline{stroke-width:.72}
html[data-display-style="neon-grid"] [data-companion-avatar="neon-grid"] .sprite-rim{stroke-width:.72;opacity:.58}
html[data-display-style="neon-grid"] .johnny-leather-highlight{fill:#a04a5f;opacity:.28}
html[data-display-style="neon-grid"] .johnny-leather-shadow{fill:#08080d;opacity:.32}
html[data-display-style="neon-grid"] .johnny-chest-highlight{fill:#ffd3bd;opacity:.2}
html[data-display-style="neon-grid"] .johnny-vest-panel{fill:#252930}
html[data-display-style="neon-grid"] .johnny-tattoo-fill{fill:#29232c;opacity:.9}
html[data-display-style="neon-grid"] .johnny-tattoo-line{fill:none;stroke:#29232c;stroke-width:.9;stroke-linecap:round;stroke-linejoin:round}
html[data-display-style="neon-grid"] .johnny-tattoo-text{fill:#29232c;font:900 3.5px/1 Bahnschrift,Arial,sans-serif;letter-spacing:.08em}
html[data-display-style="neon-grid"] .johnny-metal-highlight{fill:#eefcff;opacity:.45}
html[data-display-style="neon-grid"] .johnny-hair-shadow{fill:#080a10;opacity:.74}
html[data-display-style="neon-grid"] .johnny-hair-highlight{fill:none;stroke:#4e4654;stroke-width:.9;stroke-linecap:round;opacity:.72}
html[data-display-style="neon-grid"] .johnny-face-highlight{fill:#ffd3bd;opacity:.16}
html[data-display-style="neon-grid"] .johnny-temple-shadow{fill:#744b43;opacity:.2}
html[data-display-style="neon-grid"] .johnny-cheek-shadow{fill:#643f3c;opacity:.24}
html[data-display-style="neon-grid"] .johnny-aviator-lens{stroke:#0a0d12;stroke-width:1.05;stroke-linejoin:round}
html[data-display-style="neon-grid"] .johnny-aviator-frame{fill:none;stroke:#8d979e;stroke-width:1.05;stroke-linecap:round;stroke-linejoin:round}
html[data-display-style="neon-grid"] .johnny-aviator-glint{fill:none;stroke:#ffd2d8;stroke-width:.75;stroke-linecap:round;opacity:.72}
html[data-display-style="neon-grid"] .sprite-johnny-beard{fill:#2a2224}
html[data-display-style="neon-grid"] .sprite-johnny-moustache{fill:#171519}
html[data-display-style="neon-grid"] .johnny-beard-highlight{fill:none;stroke:#665056;stroke-width:.8;stroke-linecap:round;opacity:.7}
html[data-display-style="neon-grid"] .johnny-lip-shadow{fill:none;stroke:#5e3438;stroke-width:.72;stroke-linecap:round}
html[data-display-style="neon-grid"] :is(.johnny-anatomy-line,.johnny-trouser-seam){fill:none;stroke:#613f38;stroke-width:.58;stroke-linecap:round;stroke-linejoin:round;opacity:.62}
html[data-display-style="neon-grid"] .johnny-trouser-seam{stroke:#b96379;opacity:.28}
html[data-display-style="neon-grid"] .johnny-guitar-highlight{fill:#ff7b87;opacity:.32}
html[data-display-style="neon-grid"] .sprite-cyber-arm{filter:drop-shadow(0 0 2px #00e5ff45)}
html[data-display-style="neon-grid"] .sprite-guitar-strum{transform-box:fill-box;transform-origin:center}
html[data-display-style="neon-grid"] .sprite-malorian{transform-box:fill-box;transform-origin:18% 68%}
html[data-display-style="neon-grid"] .sprite-johnny-shooting-arm{opacity:0;transform-box:fill-box;transform-origin:18% 25%}
html[data-display-style="neon-grid"] .sprite-malorian-flash{fill:#fff3b0;opacity:0;filter:drop-shadow(0 0 5px #ffb21c) drop-shadow(0 0 10px #ff3f63)}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] .companion-avatar{animation:johnnyRockBody 2.25s cubic-bezier(.2,.72,.28,1) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] :is(.sprite-pistol,.sprite-malorian){opacity:0}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] .sprite-johnny-guitar{opacity:1;animation:johnnyGuitar 2.25s steps(12,end) both!important;filter:drop-shadow(0 0 5px #ff3f63)}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] .sprite-cyber-arm{animation:johnnyFretArm .28s ease-in-out 8 alternate!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] .sprite-guitar-strum{animation:johnnyStrumHand .18s ease-in-out 12 alternate!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] .sprite-johnny-stage{opacity:1;animation:johnnyStagePulse 2.25s steps(10,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .companion-avatar{animation:johnnyGunBody 1.8s steps(10,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] :is(.sprite-arm-right,.sprite-malorian){opacity:0}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .sprite-johnny-shooting-arm{opacity:1;animation:johnnyMalorian 1.8s steps(10,end) both!important;filter:drop-shadow(0 0 5px #ff3f63)}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .sprite-malorian-raised-flash{animation:johnnyMuzzleFlash 1.8s steps(1,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .companion-scene i:nth-child(1){animation:johnnyBulletTrail 1.8s steps(10,end) both}

/* Photo-real Johnny v5.0.0: the supplied render remains the idle likeness; generated pose cutouts carry the two signature actions. */
html[data-display-style="neon-grid"] .interface-companion{grid-template-columns:132px minmax(0,1fr);min-height:134px}
html[data-display-style="neon-grid"] .companion-stage{width:122px!important;height:118px!important}
html[data-display-style="neon-grid"] .companion-sprites{width:118px;height:118px;place-items:end center}
html[data-display-style="neon-grid"] .companion-johnny-photo{position:relative;width:116px!important;height:118px!important;overflow:visible;image-rendering:auto;shape-rendering:auto;filter:drop-shadow(0 8px 6px #0008);isolation:isolate}
html[data-display-style="neon-grid"] .companion-avatar-legacy{display:none!important}
html[data-display-style="neon-grid"] .johnny-photo-viewport{position:absolute;inset:0;overflow:hidden;clip-path:polygon(4px 0,100% 0,100% 100%,0 100%,0 4px)}
html[data-display-style="neon-grid"] .johnny-photo{position:absolute;left:50%;top:0;display:block;max-width:none;width:108px;height:auto;opacity:0;transform:translateX(-50%);transform-origin:50% 70%;image-rendering:auto;filter:none;will-change:transform,opacity}
html[data-display-style="neon-grid"] .johnny-photo-idle{opacity:1}
html[data-display-style="neon-grid"] .johnny-photo-guitar{width:112px}
html[data-display-style="neon-grid"] .johnny-photo-malorian{width:112px}
html[data-display-style="neon-grid"] .johnny-photo-optics{position:absolute;z-index:4;left:46px;top:11px;width:25px;height:11px;border-top:1px solid #fff8;border-radius:50%;opacity:.32;pointer-events:none;filter:drop-shadow(0 0 4px #ff3f63)}
html[data-display-style="neon-grid"] .johnny-photo-mouth{position:absolute;z-index:4;left:56px;top:27px;width:10px;height:2px;border-bottom:1px solid #190d0d99;border-radius:50%;opacity:.2;pointer-events:none}
html[data-display-style="neon-grid"] .johnny-photo-cyber{position:absolute;z-index:3;right:3px;top:35px;width:20px;height:58px;border-right:1px solid #c8f8ff99;border-radius:45%;opacity:.3;pointer-events:none;filter:drop-shadow(0 0 4px #00e5ff)}
html[data-display-style="neon-grid"] .johnny-photo-stage{position:absolute;z-index:-1;inset:8px 3px 2px;border:1px solid #00e5ff66;background:linear-gradient(135deg,#00e5ff12,#ff3f6312);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);opacity:.34}
html[data-display-style="neon-grid"] .johnny-photo-muzzle{position:absolute;z-index:5;left:5px;top:18px;width:15px;height:15px;background:radial-gradient(circle,#fff 0 12%,#fff4a7 13% 28%,#ffb21c 29% 52%,#ff3f6300 72%);clip-path:polygon(50% 0,61% 35%,88% 12%,72% 43%,100% 50%,70% 58%,88% 88%,60% 66%,50% 100%,41% 66%,12% 88%,30% 58%,0 50%,29% 42%,12% 12%,40% 35%);opacity:0;pointer-events:none;filter:drop-shadow(0 0 7px #ffb21c) drop-shadow(0 0 11px #ff3f63);transform-origin:center}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] .johnny-photo-idle,
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .johnny-photo-idle{opacity:0}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] .johnny-photo-guitar{opacity:1;animation:johnnyPhotoGuitar 2.25s cubic-bezier(.2,.72,.28,1) both!important;filter:drop-shadow(0 0 5px #ff3f63)}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] :is(.johnny-photo-optics,.johnny-photo-mouth,.johnny-photo-cyber){opacity:0}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .johnny-photo-malorian{opacity:1;animation:johnnyPhotoMalorian 1.8s cubic-bezier(.16,.76,.26,1) both!important;filter:drop-shadow(0 0 5px #ff3f63)}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] :is(.johnny-photo-optics,.johnny-photo-mouth,.johnny-photo-cyber){opacity:0}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .johnny-photo-muzzle{animation:johnnyPhotoMuzzle 1.8s steps(1,end) both!important}
@keyframes johnnyPhotoGuitar{0%,100%{transform:translateX(-50%) rotate(0)}16%{transform:translate(-53%,-2px) rotate(-2deg)}34%{transform:translate(-47%,-4px) rotate(2deg) scale(1.025)}52%{transform:translate(-52%,-3px) rotate(-2deg) scale(1.02)}70%{transform:translate(-47%,-5px) rotate(2deg) scale(1.03)}88%{transform:translate(-51%,-1px) rotate(-1deg)}}
@keyframes johnnyPhotoMalorian{0%,18%,100%{opacity:0;transform:translate(-47%,7px) rotate(3deg) scale(.94)}28%{opacity:1;transform:translateX(-50%)}42%,82%{opacity:1;transform:translateX(-50%)}47%,61%,75%{opacity:1;transform:translate(-48%,2px) rotate(1.5deg)}49%,63%,77%{opacity:1;transform:translate(-52%,-1px) rotate(-1.5deg)}92%{opacity:0;transform:translate(-49%,5px) scale(.97)}}
@keyframes johnnyPhotoMuzzle{0%,40%,45%,58%,63%,72%,77%,100%{opacity:0;transform:scale(.2) rotate(0)}41%,44%,59%,62%,73%,76%{opacity:1;transform:scale(1.35) rotate(22deg)}}
html[data-display-style="ember-silver"] .interface-companion:is([data-companion-motion="scan-power"],[data-companion-motion="greet-salute"]) .sprite-medallion{animation:hunterMedallion .64s steps(3,end) infinite;filter:drop-shadow(0 0 5px #d64b42)}
html[data-display-style="ember-silver"] .interface-companion[data-companion-motion="success-flourish"] .sprite-weapons{animation:hunterBlades 1s steps(5,end) both}
html[data-display-style="ember-silver"] .interface-companion[data-companion-motion="greet-blade"] .sprite-weapons{animation:hunterBlades 1.05s steps(6,end) both;filter:drop-shadow(0 0 4px #e2e4e5)}
html[data-display-style="ember-silver"] .interface-companion:is([data-companion-motion="idle-look"],[data-companion-motion="greet-wave"]) .sprite-ponytail{animation:hunterHair 1.4s steps(3,end) infinite}
html[data-display-style="frost-rune"] .interface-companion[data-companion-motion="idle-breathe"] .sprite-breath{opacity:1;animation:nordBreath 2.7s steps(4,end) infinite}
html[data-display-style="frost-rune"] .interface-companion:is([data-companion-motion="scan-power"],[data-companion-motion="success-celebrate"]) .sprite-breath{opacity:1;animation:nordShout .88s steps(4,end) both}
html[data-display-style="frost-rune"] .interface-companion:is([data-companion-motion="success-flourish"],[data-companion-motion="greet-ready"]) .sprite-sword{animation:nordSword 1s steps(5,end) both;filter:drop-shadow(0 0 5px #8bd8f1)}
html[data-display-style="frost-rune"] .interface-companion:is([data-companion-motion="greet-salute"],[data-companion-motion="error-stagger"]) .sprite-shield{animation:nordShield .88s steps(4,end) both}
html[data-display-style="frost-rune"] .interface-companion[data-companion-motion="greet-stomp"] .sprite-shield{animation:nordShield .92s steps(4,end) both}
html[data-display-style="frost-rune"] .interface-companion[data-companion-motion="greet-shout"] .sprite-breath{opacity:1;animation:nordShout .98s steps(5,end) both}
html[data-display-style="frost-rune"] .interface-companion[data-companion-motion="greet-shield"] .sprite-shield{animation:nordShield .98s steps(5,end) both;filter:drop-shadow(0 0 6px #8bd8f1)}
html[data-display-style="classic-quest"] .interface-companion[data-companion-motion="success-celebrate"] .sprite-effect{opacity:1;animation:questXp 1.1s steps(5,end) both}
html[data-display-style="classic-quest"] .interface-companion:is([data-companion-motion="success-flourish"],[data-companion-motion="greet-ready"]) .sprite-quest-sword{animation:questSword .92s steps(4,end) both}
html[data-display-style="classic-quest"] .interface-companion[data-companion-motion="greet-salute"] .sprite-round-shield{animation:questShield .86s steps(4,end) both}
html[data-display-style="classic-quest"] .interface-companion[data-companion-motion="greet-blade"] .sprite-quest-sword{animation:questSword 1.05s steps(5,end) both;filter:drop-shadow(0 0 4px #f2c85b)}
html[data-display-style="life-mode"] .interface-companion:is([data-companion-motion="success-celebrate"],[data-companion-motion="greet-wave"]) .sprite-diamond{animation:simDiamondHappy .86s ease-in-out 2}
html[data-display-style="life-mode"] .interface-companion[data-companion-motion="type-work"] .sprite-phone{animation:simPhone .5s steps(3,end) infinite}
html[data-display-style="life-mode"] .interface-companion[data-companion-motion="success-flourish"] .sprite-arm{animation:simDanceArms .78s steps(4,end) both}
html[data-display-style="life-mode"] .interface-companion[data-companion-motion="greet-wave"] .sprite-arm-right{animation:none!important}
html[data-display-style="life-mode"] .interface-companion[data-companion-motion="greet-wave"] .sprite-arm-left{animation:heroWaveLeftArm .92s steps(5,end) both!important}
html[data-display-style="life-mode"] .interface-companion:is([data-companion-motion="greet-cheer"],[data-companion-motion="greet-dance"],[data-companion-motion="greet-spin"],[data-companion-motion="greet-hop"]) .sprite-diamond{animation:simDiamondHappy .78s ease-in-out 2}
html[data-display-style="vault-108"] .interface-companion:is([data-companion-motion="idle-breathe"],[data-companion-motion="idle-look"],[data-companion-motion="greet-wave"],[data-companion-motion="success-celebrate"]) .vault-dog-tail{animation:vaultDogTail .48s ease-in-out infinite alternate}
html[data-display-style="vault-108"] .interface-companion:is([data-companion-motion="scan-focus"],[data-companion-motion="scan-power"],[data-companion-motion="error-think"]) .vault-dog-head{animation:vaultDogSniff .72s steps(4,end) infinite}
html[data-display-style="vault-108"] .interface-companion:is([data-companion-motion="success-celebrate"],[data-companion-motion="greet-cheer"],[data-companion-motion="greet-hop"]) :is(.vault-dog-head,.vault-dog-leg){animation:vaultDogHappy .82s steps(5,end) both}
html[data-display-style="vault-108"] .interface-companion[data-companion-motion="greet-wave"] .vault-dog-paw{animation:vaultDogPaw .92s steps(5,end) both}
html[data-display-style="vault-108"] .interface-companion:is([data-companion-motion="scan-focus"],[data-companion-motion="scan-power"],[data-companion-motion="type-work"]) .vault-pipboy{animation:vaultPipScan .32s steps(2,end) infinite}
html[data-display-style="vault-108"] .interface-companion[data-vault-form="power-armour"]:is([data-companion-motion="idle-breathe"],[data-companion-motion="idle-ready"]) .vault-core{animation:vaultCoreIdle 1.2s ease-in-out infinite}
html[data-display-style="covert-ops"] .interface-companion:is([data-companion-motion="scan-focus"],[data-companion-motion="scan-power"]) .sprite-optics{animation:opsVisor .3s steps(2,end) infinite;filter:drop-shadow(0 0 5px #ff7a1a)}
html[data-display-style="covert-ops"] .interface-companion:is([data-companion-motion="success-flourish"],[data-companion-motion="greet-ready"]) .sprite-dual-guns{animation:opsWeapons .9s steps(5,end) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="greet-salute"] .sprite-radio{animation:opsComms .74s steps(3,end) both;filter:drop-shadow(0 0 4px #ff7a1a)}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="greet-quickdraw"] .sprite-dual-guns{animation:opsWeapons .92s steps(5,end) both;filter:drop-shadow(0 0 5px #ff7a1a)}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="greet-scan"] .sprite-optics{animation:opsVisor .28s steps(2,end) 4;filter:drop-shadow(0 0 6px #ff7a1a)}
@keyframes neonOptics{50%{transform:translateX(2px);filter:drop-shadow(0 0 7px #00e5ff) brightness(1.5)}}
@keyframes neonDraw{35%{transform:translate(-7px,-12px) rotate(-22deg)}62%{transform:translate(-4px,-8px) rotate(-8deg)}}
@keyframes neonCoatReady{35%,70%{transform:skewX(-9deg) translateX(-3px)}}
@keyframes johnnyRockBody{0%,100%{transform:none}12%{transform:translate(-7px,1px) rotate(-3deg)}27%{transform:translate(-4px,-3px) rotate(4deg) scale(1.02)}43%{transform:translate(6px,-2px) rotate(-5deg) scale(1.03)}58%{transform:translate(8px,-4px) rotate(5deg) scale(1.03)}73%{transform:translate(3px,-2px) rotate(-4deg)}88%{transform:translate(-5px,-1px) rotate(3deg)}}
@keyframes johnnyGuitar{0%,100%{transform:translate(5px,15px) rotate(20deg) scale(.82)}12%{transform:translate(1px,3px) rotate(-5deg) scale(1.01)}28%{transform:translate(-3px,-1px) rotate(5deg) scale(1.03)}44%{transform:translate(4px,-3px) rotate(-7deg) scale(1.04)}60%{transform:translate(-3px,-4px) rotate(7deg) scale(1.04)}76%{transform:translate(3px,-2px) rotate(-5deg) scale(1.03)}90%{transform:translate(-1px,1px) rotate(3deg)}}
@keyframes johnnyFretArm{to{transform:translate(6px,-8px) rotate(-32deg)}}
@keyframes johnnyStrumHand{to{transform:translate(3px,3px) rotate(14deg)}}
@keyframes johnnyStagePulse{0%,100%{opacity:0;transform:scale(.5)}16%,82%{opacity:1;transform:scale(1.18)}35%{filter:drop-shadow(0 0 8px #00e5ff)}55%{filter:drop-shadow(0 0 10px #ff3f63)}}
@keyframes johnnyGunBody{0%,100%{transform:none}12%{transform:translateX(-8px) rotate(-3deg)}28%{transform:translate(-2px,-2px) rotate(2deg) scale(1.02)}42%,78%{transform:translate(7px,-3px) rotate(-2deg) scale(1.03)}49%{transform:translate(4px,-2px) rotate(-4deg) scale(1.02)}57%{transform:translate(7px,-3px) rotate(-2deg) scale(1.03)}66%{transform:translate(4px,-2px) rotate(-5deg) scale(1.02)}90%{transform:translateX(-3px)}}
@keyframes johnnyMalorian{0%,18%{opacity:0;transform:translate(3px,9px) rotate(14deg) scale(.88)}30%{opacity:1;transform:translate(1px,1px) rotate(3deg)}42%,82%{opacity:1;transform:none}48%,64%,76%{opacity:1;transform:translate(-3px,1px) rotate(-4deg)}100%{opacity:0;transform:translate(3px,8px) rotate(12deg) scale(.9)}}
@keyframes johnnyMuzzleFlash{0%,41%,45%,58%,62%,73%,77%,100%{opacity:0;transform:scale(.2)}42%,44%,59%,61%,74%,76%{opacity:1;transform:scale(2.7)}}
@keyframes johnnyBulletTrail{0%,36%,84%,100%{opacity:0;transform:translateX(-55px) scaleX(.1)}44%,76%{opacity:1;transform:translate(58px,-31px) scaleX(1.35);background:#fff3b0;box-shadow:0 0 9px #ffb21c}}
@keyframes hunterMedallion{50%{transform:scale(1.35);fill:#e65b4d}}
@keyframes hunterBlades{30%{transform:translateY(-6px) scale(1.08)}55%{transform:rotate(8deg) scale(1.13)}78%{transform:rotate(-3deg)}}
@keyframes hunterHair{50%{transform:translateX(2px) skewY(7deg)}}
@keyframes nordBreath{0%,100%{opacity:0;transform:translateX(0) scale(.6)}42%,62%{opacity:.72;transform:translateX(-8px) scale(1.12)}}
@keyframes nordShout{0%{opacity:0;transform:translateX(0) scale(.5)}40%,70%{opacity:1;transform:translateX(-13px) scale(1.45)}100%{opacity:0;transform:translateX(-20px) scale(1.8)}}
@keyframes nordSword{25%{transform:translate(-8px,-12px) rotate(-28deg)}55%{transform:translate(-13px,-16px) rotate(-48deg)}78%{transform:translate(-5px,-7px) rotate(-12deg)}}
@keyframes nordShield{30%,65%{transform:translate(7px,-5px) scale(1.13) rotate(8deg)}}
@keyframes questXp{20%,62%{opacity:1;transform:translateY(-7px) scale(1.3)}100%{opacity:0;transform:translateY(-25px) scale(.8)}}
@keyframes questSword{32%{transform:translate(-10px,-14px) rotate(-32deg)}65%{transform:translate(-5px,-8px) rotate(-12deg)}}
@keyframes questShield{35%,68%{transform:translate(5px,-5px) rotate(10deg)}}
@keyframes simDiamondHappy{50%{transform:translateY(-6px) rotate(12deg) scale(1.18);filter:drop-shadow(0 3px 6px #159b45cc)}}
@keyframes simPhone{50%{transform:translate(-3px,-4px) rotate(-8deg)}}
@keyframes simDanceArms{30%{transform:translateY(-9px) rotate(-28deg)}62%{transform:translateY(-7px) rotate(25deg)}}
@keyframes vaultDogTail{to{transform:rotate(22deg) translateY(-1px)}}@keyframes vaultDogSniff{25%{transform:translate(-2px,3px) rotate(-5deg)}55%{transform:translate(2px,4px) rotate(5deg)}80%{transform:translateY(1px)}}@keyframes vaultDogHappy{35%{transform:translateY(-7px) rotate(-4deg)}65%{transform:translateY(-3px) rotate(4deg)}}@keyframes vaultDogPaw{30%,68%{transform:translate(-7px,-11px) rotate(-28deg)}}@keyframes vaultCoreIdle{50%{fill:#74ff9e;filter:drop-shadow(0 0 8px #54f28d)}}
@keyframes opsVisor{50%{transform:scaleX(.85);filter:drop-shadow(0 0 8px #ff7a1a) brightness(1.6)}}
@keyframes opsWeapons{28%{transform:translateY(-10px) rotate(-8deg)}52%{transform:translateY(-14px) scale(1.1)}76%{transform:translateY(-7px) rotate(5deg)}}
@keyframes opsComms{35%,70%{transform:translate(7px,-8px) rotate(12deg)}}
@media(max-width:680px){.interface-companion{grid-template-columns:74px minmax(0,1fr);min-height:80px;padding:6px 12px 6px 5px;border-radius:11px}.companion-stage{width:68px!important;height:68px!important}.companion-sprites{width:56px;height:65px}.companion-avatar{width:48px;height:64px}.companion-status{font-size:13px}.companion-role{font-size:9px}}
@media(max-width:680px){.companion-avatar{width:calc(var(--avatar-width,54px)*.84)}.companion-stage::before{inset:8px 4px 4px}}
html[data-display-style="life-mode"] .companion-stage{height:88px!important}
html[data-display-style="life-mode"] .companion-sprites{height:84px}
html[data-display-style="life-mode"] [data-companion-avatar="life-mode"] .sprite-diamond{filter:drop-shadow(0 3px 4px #159b45cc)}
@media(max-width:680px){html[data-display-style="life-mode"] .interface-companion{min-height:91px;padding-top:9px}html[data-display-style="life-mode"] .companion-stage{height:77px!important}html[data-display-style="life-mode"] .companion-sprites{height:75px}}

/* Local companion progression v2.0.0. The reading surface stays calm; game feedback lives inside the companion. */
.interface-companion{min-height:108px}
.companion-progress{display:grid;grid-template-columns:minmax(96px,auto) minmax(70px,180px) auto;align-items:center;gap:7px 10px;min-width:0;margin-top:4px;color:var(--muted,#aeb9c6)}
.companion-rank{display:flex;align-items:baseline;gap:7px;min-width:0;white-space:nowrap}.companion-rank b{color:var(--text,#f6f8fb);font-size:10px;font-weight:950;letter-spacing:.06em;text-transform:uppercase}.companion-rank small,.companion-moves{font-size:9px;font-weight:850;letter-spacing:.035em}.companion-moves{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.companion-xp-track{position:relative;display:block;height:5px;overflow:hidden;border:1px solid color-mix(in srgb,var(--companion-line) 82%,transparent);border-radius:999px;background:color-mix(in srgb,var(--bg,#081018) 80%,transparent);box-shadow:inset 0 1px 3px #0005}.companion-xp-track i{display:block;width:var(--companion-progress,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent,#38bdf8),var(--accent2,var(--accent,#38bdf8)));box-shadow:0 0 7px color-mix(in srgb,var(--accent,#38bdf8) 68%,transparent);transition:width .55s cubic-bezier(.2,.8,.25,1)}
.companion-loadout{grid-column:1/-1;display:flex;align-items:center;gap:7px;color:var(--accent,#38bdf8);font-size:9px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.companion-loadout[hidden]{display:none!important}.companion-loadout select{min-width:150px;padding:4px 24px 4px 7px!important;border:1px solid var(--display-field-line,var(--line,#2d3947))!important;border-radius:3px!important;background:var(--display-field,var(--bg,#081018))!important;color:var(--text,#f6f8fb)!important;font:800 10px/1.2 inherit!important;letter-spacing:0;text-transform:none;cursor:pointer}
html[data-display-style="neon-grid"] .companion-xp-track i{background:linear-gradient(90deg,#ffd51c,#00e5ff)}
html[data-display-style="ember-silver"] .companion-xp-track i{background:linear-gradient(90deg,#9e2f2d,#f3e3c7)}
html[data-display-style="frost-rune"] .companion-xp-track i{background:linear-gradient(90deg,#557d91,#dff7ff)}
html[data-display-style="classic-quest"] .companion-xp-track i{background:linear-gradient(90deg,#94702d,#f2c85b)}
html[data-display-style="life-mode"] .companion-rank b,html[data-display-style="life-mode"] .companion-moves{color:#17485d}html[data-display-style="life-mode"] .companion-xp-track{background:#ccecf3;border-color:#4e9fba}html[data-display-style="life-mode"] .companion-xp-track i{background:linear-gradient(90deg,#159b45,#48d976,#40bde0)}
html[data-display-style="vault-108"] .companion-xp-track i{background:linear-gradient(90deg,#155f9f,#f4d43f 58%,#54f28d)}
html[data-display-style="covert-ops"] .companion-xp-track i{background:linear-gradient(90deg,#9b3612,#ff7a1a)}

.interface-companion[data-companion-motion="rank-levelup"]{animation:companionRankFrame 1.35s ease-out both}.interface-companion[data-companion-motion="rank-levelup"] .companion-avatar{animation:companionRankUp 1.25s steps(7,end) both!important}.interface-companion[data-companion-motion="rank-levelup"] .companion-effect-text{font-size:9px;box-shadow:0 0 14px var(--companion-glow)}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="rank-levelup"] :is(.sprite-optics,.sprite-cyber-arm){animation:rankTechFlash .22s steps(2,end) 5!important}
html[data-display-style="ember-silver"] .interface-companion[data-companion-motion="rank-levelup"] .sprite-medallion{animation:rankMedallion 1.15s steps(6,end) both!important}
html[data-display-style="frost-rune"] .interface-companion[data-companion-motion="rank-levelup"] .sprite-breath{opacity:1;animation:rankVoiceRing 1.2s steps(6,end) both!important}
html[data-display-style="classic-quest"] .interface-companion[data-companion-motion="rank-levelup"] .sprite-effect{opacity:1;animation:rankXpRise 1.35s steps(7,end) both!important}
html[data-display-style="life-mode"] .interface-companion[data-companion-motion="rank-levelup"] .sprite-diamond{animation:rankDiamond 1.15s ease-in-out 2!important}
html[data-display-style="vault-108"] .interface-companion[data-companion-motion="rank-levelup"] :is(.vault-pipboy,.vault-core,.vault-visor){animation:vaultRankFlash .22s steps(2,end) 6!important}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="rank-levelup"] .sprite-optics{animation:rankOpsCharge .24s steps(2,end) 5!important}
@keyframes companionRankFrame{0%{box-shadow:0 0 0 transparent}38%{box-shadow:0 0 0 3px var(--companion-glow),0 0 34px var(--companion-glow)}100%{box-shadow:0 12px 30px #0003}}
@keyframes companionRankUp{0%,100%{transform:none}16%{transform:translateY(3px) scale(.96)}38%{transform:translateY(-13px) scale(1.1)}58%{transform:translateY(-6px) rotate(-5deg)}76%{transform:translateY(-8px) rotate(5deg)}90%{transform:translateY(-2px)}}
@keyframes rankTechFlash{50%{filter:drop-shadow(0 0 9px #00e5ff) brightness(1.8)}}@keyframes rankMedallion{35%,70%{transform:scale(1.7) rotate(30deg);fill:#ff776f;filter:drop-shadow(0 0 9px #e65b4d)}}@keyframes rankVoiceRing{0%{opacity:0;transform:translateX(0) scale(.4)}45%,70%{opacity:1;transform:translateX(-15px) scale(1.7)}100%{opacity:0;transform:translateX(-25px) scale(2.2)}}@keyframes rankXpRise{20%,72%{opacity:1;transform:translateY(-17px) scale(1.6)}100%{opacity:0;transform:translateY(-34px)}}@keyframes rankDiamond{50%{transform:translateY(-9px) rotate(180deg) scale(1.35);filter:drop-shadow(0 0 9px #159b45)}}@keyframes vaultRankFlash{50%{filter:drop-shadow(0 0 10px #54f28d) brightness(1.9)}}@keyframes rankOpsCharge{50%{transform:scaleX(.72);filter:drop-shadow(0 0 10px #ff7a1a) brightness(2)}}

/* Standard workshop unlocks. */
.interface-companion[data-companion-motion="standard-inspect"] .companion-avatar{animation:moveInspect 1s steps(5,end) both!important}.interface-companion[data-companion-motion="standard-inspect"] .sprite-clipboard{animation:moveClipboardInspect 1s steps(5,end) both!important}
.interface-companion[data-companion-motion="standard-stamp"] .companion-avatar{animation:moveStamp .95s steps(5,end) both!important}.interface-companion[data-companion-motion="standard-stamp"] .sprite-arm-right{animation:moveStampArm .95s steps(5,end) both!important}
.interface-companion[data-companion-motion="standard-tool"] .companion-avatar{animation:moveToolToss 1.05s steps(6,end) both!important}.interface-companion[data-companion-motion="standard-tool"] .sprite-effect{opacity:1;animation:moveToolSpark 1.05s steps(6,end) both!important}
@keyframes moveInspect{30%,65%{transform:translate(-3px,2px) rotate(-4deg) scale(.98)}}@keyframes moveClipboardInspect{30%,65%{transform:translate(8px,-9px) rotate(8deg) scale(1.15)}}@keyframes moveStamp{25%{transform:translateY(-3px)}48%{transform:translateY(4px) scaleY(.94)}70%{transform:translateY(-2px)}}@keyframes moveStampArm{25%{transform:translate(-5px,-12px) rotate(-40deg)}48%{transform:translate(-4px,2px) rotate(12deg)}}@keyframes moveToolToss{20%{transform:translateY(-3px) rotate(-4deg)}44%{transform:translateY(-9px) rotate(7deg)}68%{transform:translateY(-4px) rotate(-5deg)}}@keyframes moveToolSpark{35%,70%{opacity:1;transform:translateY(-14px) rotate(90deg) scale(1.4)}100%{opacity:0;transform:translateY(2px) rotate(180deg)}}

/* Neon mercenary unlocks. */
.interface-companion[data-companion-motion="neon-dash"] .companion-avatar{animation:moveNeonDash .82s steps(6,end) both!important}.interface-companion[data-companion-motion="neon-dash"] .sprite-coat-tail{animation:moveNeonCoat .82s steps(5,end) both!important}
.interface-companion[data-companion-motion="neon-holo"] .companion-avatar{animation:moveNeonHolo 1s steps(7,end) both!important}.interface-companion[data-companion-motion="neon-holo"] .sprite-effect{opacity:1;animation:moveHoloEcho 1s steps(6,end) both!important}
.interface-companion[data-companion-motion="neon-overclock"] .companion-avatar{animation:moveOverclock 1.1s steps(8,end) both!important}.interface-companion[data-companion-motion="neon-overclock"] :is(.sprite-optics,.sprite-cyber-arm,.sprite-pistol){animation:rankTechFlash .18s steps(2,end) 6!important}
@keyframes moveNeonDash{0%,100%{transform:none}18%{transform:translateX(-7px) skewX(-7deg)}35%{transform:translateX(18px) skewX(12deg);opacity:.45}52%{transform:translateX(-11px) skewX(-9deg)}72%{transform:translateX(5px)}}@keyframes moveNeonCoat{35%,65%{transform:skewX(-20deg) translateX(-8px)}}@keyframes moveNeonHolo{20%{filter:drop-shadow(-6px 0 #00e5ff) drop-shadow(6px 0 #ff4db8)}40%{transform:translateX(-5px);opacity:.55}60%{transform:translateX(5px);opacity:.7}82%{filter:drop-shadow(-2px 0 #00e5ff) drop-shadow(2px 0 #ff4db8)}}@keyframes moveHoloEcho{25%,70%{opacity:1;transform:scale(1.6) rotate(45deg)}}@keyframes moveOverclock{15%,85%{transform:none}28%{transform:translate(-3px,-4px)}40%{transform:translate(4px,-7px) scale(1.07)}54%{transform:translate(-4px,-5px)}68%{transform:translate(3px,-9px) scale(1.1);filter:brightness(1.55)}}

/* Silver hunter unlocks. */
.interface-companion[data-companion-motion="hunter-sign"] .companion-avatar{animation:moveHunterSign 1.08s steps(6,end) both!important}.interface-companion[data-companion-motion="hunter-sign"] .sprite-arm-left{animation:moveCastArm 1.08s steps(6,end) both!important}.interface-companion[data-companion-motion="hunter-sign"] .sprite-effect{opacity:1;animation:moveEmberSign 1.08s steps(6,end) both!important}
.interface-companion[data-companion-motion="hunter-pulse"] .companion-avatar{animation:heroFocus 1s steps(5,end) both!important}.interface-companion[data-companion-motion="hunter-pulse"] .sprite-medallion{animation:rankMedallion 1s steps(5,end) both!important}
.interface-companion[data-companion-motion="hunter-whirl"] .companion-avatar{animation:moveHunterWhirl 1.15s steps(8,end) both!important}.interface-companion[data-companion-motion="hunter-whirl"] .sprite-weapons{animation:hunterBlades 1.15s steps(7,end) both!important}
@keyframes moveHunterSign{20%{transform:translateY(2px) scale(.97)}48%,72%{transform:translate(-3px,-4px) rotate(-5deg) scale(1.05)}}@keyframes moveCastArm{25%{transform:translate(-3px,-6px) rotate(-38deg)}52%,76%{transform:translate(-10px,-13px) rotate(-92deg)}}@keyframes moveEmberSign{20%{opacity:.2;transform:scale(.5)}52%,76%{opacity:1;transform:translate(-7px,-4px) scale(1.9) rotate(45deg);filter:drop-shadow(0 0 7px #ff5b38)}100%{opacity:0;transform:translate(-13px,-8px) scale(2.4)}}@keyframes moveHunterWhirl{0%,100%{transform:none}18%{transform:rotate(-10deg) scaleX(.8)}38%{transform:rotate(-2deg) scaleX(.18)}58%{transform:rotate(8deg) scaleX(-.82)}76%{transform:rotate(3deg) scaleX(-1)}90%{transform:rotate(-3deg)}}

/* Northern warrior unlocks. */
.interface-companion[data-companion-motion="frost-bash"] .companion-avatar{animation:moveShieldBash .95s steps(6,end) both!important}.interface-companion[data-companion-motion="frost-bash"] .sprite-shield{animation:moveBashShield .95s steps(6,end) both!important}
.interface-companion[data-companion-motion="frost-voice"] .companion-avatar{animation:heroShout 1.15s steps(6,end) both!important}.interface-companion[data-companion-motion="frost-voice"] .sprite-breath{opacity:1;animation:rankVoiceRing 1.15s steps(6,end) both!important}
.interface-companion[data-companion-motion="frost-oath"] .companion-avatar{animation:moveSwordOath 1.15s steps(6,end) both!important}.interface-companion[data-companion-motion="frost-oath"] .sprite-sword{animation:moveOathSword 1.15s steps(6,end) both!important}
@keyframes moveShieldBash{20%{transform:translateX(-5px) scale(.97)}48%,70%{transform:translateX(9px) scale(1.06)}90%{transform:translateX(-2px)}}@keyframes moveBashShield{22%{transform:translateX(-8px) rotate(-8deg)}50%,72%{transform:translate(14px,-3px) rotate(16deg) scale(1.22)}}@keyframes moveSwordOath{25%{transform:translateY(3px)}48%,78%{transform:translateY(-5px) scale(1.05)}}@keyframes moveOathSword{22%{transform:translate(-10px,-8px) rotate(-28deg)}48%,78%{transform:translate(-23px,-22px) rotate(-88deg);filter:drop-shadow(0 0 8px #8bd8f1)}}

/* Classic adventure unlocks. */
.interface-companion[data-companion-motion="quest-xp"] .companion-avatar{animation:heroCelebrate 1s steps(6,end) both!important}.interface-companion[data-companion-motion="quest-xp"] .sprite-effect{opacity:1;animation:rankXpRise 1.2s steps(6,end) both!important}
.interface-companion[data-companion-motion="quest-emote"] .companion-avatar{animation:moveQuestEmote 1.08s steps(7,end) both!important}.interface-companion[data-companion-motion="quest-emote"] :is(.sprite-round-shield,.sprite-quest-sword){animation:moveQuestGear 1.08s steps(6,end) both!important}
.interface-companion[data-companion-motion="quest-cape"] .companion-avatar{animation:heroSpin 1.1s steps(7,end) both!important}.interface-companion[data-companion-motion="quest-cape"] .sprite-cape{animation:moveQuestCape 1.1s steps(7,end) both!important}
@keyframes moveQuestEmote{15%,100%{transform:none}32%{transform:translateY(-9px) rotate(-6deg)}50%{transform:translateY(2px) scaleY(.9)}68%{transform:translateY(-11px) rotate(6deg)}86%{transform:translateY(-2px)}}@keyframes moveQuestGear{35%,72%{transform:translateY(-9px) rotate(15deg)}}@keyframes moveQuestCape{28%{transform:skewX(-18deg) translateX(-7px)}56%{transform:skewX(22deg) translateX(8px)}82%{transform:skewX(-7deg)}}

/* Life simulation unlocks. */
.interface-companion[data-companion-motion="life-spark"] .companion-avatar{animation:heroHop .96s steps(5,end) both!important}.interface-companion[data-companion-motion="life-spark"] .sprite-diamond{animation:moveDiamondSpark .96s ease-in-out 2!important}.interface-companion[data-companion-motion="life-spark"] .sprite-effect{opacity:1;animation:moveLifeBubbles .96s ease-out both!important}
.interface-companion[data-companion-motion="life-selfie"] .companion-avatar{animation:moveSelfie 1.1s steps(6,end) both!important}.interface-companion[data-companion-motion="life-selfie"] .sprite-phone{animation:moveSelfiePhone 1.1s steps(6,end) both!important}
.interface-companion[data-companion-motion="life-celebration"] .companion-avatar{animation:heroDance 1.3s steps(8,end) both!important}.interface-companion[data-companion-motion="life-celebration"] .sprite-arm{animation:heroDanceArms 1.3s steps(8,end) both!important}.interface-companion[data-companion-motion="life-celebration"] .sprite-diamond{animation:rankDiamond 1.3s ease-in-out 2!important}
@keyframes moveDiamondSpark{50%{transform:translateY(-10px) rotate(90deg) scale(1.45);filter:drop-shadow(0 0 10px #41cf73)}}@keyframes moveLifeBubbles{25%,72%{opacity:1;transform:translateY(-9px) scale(1.8)}100%{opacity:0;transform:translateY(-22px) scale(.8)}}@keyframes moveSelfie{25%{transform:translateX(-3px) rotate(-3deg)}48%,78%{transform:translate(3px,-4px) rotate(4deg) scale(1.04)}}@keyframes moveSelfiePhone{25%{transform:translate(-5px,-8px) rotate(-16deg)}48%,78%{transform:translate(-16px,-19px) rotate(12deg);filter:drop-shadow(0 0 7px #ffffff)}}

/* Vault 108 unlocks. Dogmeat and power armour temporarily appear for their signature moves. */
.interface-companion[data-companion-motion="vault-dog-highfive"] :is(.vault-dweller,.vault-dogmeat){opacity:1}.interface-companion[data-companion-motion="vault-dog-highfive"] .vault-power-armour{opacity:0}.interface-companion[data-companion-motion="vault-dog-highfive"] .vault-dweller{transform:translateX(-18px) scale(.96)}.interface-companion[data-companion-motion="vault-dog-highfive"] .vault-dweller-arm{animation:vaultHumanHighFive 1.14s steps(6,end) both!important}.interface-companion[data-companion-motion="vault-dog-highfive"] .vault-dog-paw{animation:vaultDogHighFive 1.14s steps(6,end) both!important}.interface-companion[data-companion-motion="vault-dog-highfive"] .vault-dog-tail{animation:vaultDogTail .22s ease-in-out 5 alternate}
.interface-companion[data-companion-motion="vault-armour-entry"] :is(.vault-dweller,.vault-dogmeat){opacity:0}.interface-companion[data-companion-motion="vault-armour-entry"] .vault-power-armour{opacity:1;animation:vaultArmourEntry 1.28s steps(8,end) both!important}.interface-companion[data-companion-motion="vault-armour-entry"] :is(.vault-core,.vault-visor){animation:vaultRankFlash .2s steps(2,end) 6!important}
.interface-companion[data-companion-motion="vault-vats-burst"] .companion-avatar{animation:vaultVatsBody 1.12s steps(7,end) both!important}.interface-companion[data-companion-motion="vault-vats-burst"] :is(.vault-pipboy,.vault-visor){animation:vaultVatsScan .18s steps(2,end) 6!important}.interface-companion[data-companion-motion="vault-vats-burst"] .companion-scene i{animation:vaultTargetLock 1.12s steps(7,end) both}
@keyframes vaultHumanHighFive{28%,72%{transform:translate(8px,-15px) rotate(54deg)}}@keyframes vaultDogHighFive{28%,72%{transform:translate(-10px,-16px) rotate(-52deg) scale(1.12)}}@keyframes vaultArmourEntry{0%{opacity:0;transform:translateY(26px) scale(.72)}32%{opacity:.65;transform:translateY(9px) scale(.88)}62%{opacity:1;transform:translateY(-5px) scale(1.07)}82%{transform:translateY(2px) scale(.98)}100%{transform:none}}@keyframes vaultVatsBody{0%,100%{transform:none}20%{transform:translateX(-5px)}42%{transform:translateX(5px);filter:contrast(1.3)}64%{transform:translateX(-2px) scale(1.05)}82%{transform:translateY(-3px)}}@keyframes vaultVatsScan{50%{filter:drop-shadow(0 0 11px #54f28d) brightness(2);transform:scaleX(.78)}}@keyframes vaultTargetLock{0%,100%{opacity:0;transform:scale(2.8)}30%,72%{opacity:1;transform:scale(1);border-color:#54f28d;box-shadow:0 0 14px #54f28d}}

/* Tactical sci-fi unlocks. */
.interface-companion[data-companion-motion="ops-boost"] .companion-avatar{animation:moveBoost 1s steps(7,end) both!important}.interface-companion[data-companion-motion="ops-boost"] .sprite-effect{opacity:1;animation:moveBoostTrail 1s steps(6,end) both!important}
.interface-companion[data-companion-motion="ops-core"] .companion-avatar{animation:heroPower 1.1s steps(6,end) both!important}.interface-companion[data-companion-motion="ops-core"] :is(.sprite-optics,.sprite-accent){animation:rankOpsCharge .2s steps(2,end) 6!important}
.interface-companion[data-companion-motion="ops-akimbo"] .companion-avatar{animation:moveAkimbo 1.1s steps(7,end) both!important}.interface-companion[data-companion-motion="ops-akimbo"] .sprite-dual-guns{animation:moveAkimboGuns 1.1s steps(7,end) both!important}
@keyframes moveBoost{0%,100%{transform:none}20%{transform:translateY(3px) scaleY(.93)}42%{transform:translateY(-18px) scaleY(1.08)}62%{transform:translate(6px,-11px) rotate(5deg)}82%{transform:translateY(-3px)}}@keyframes moveBoostTrail{30%,65%{opacity:1;transform:translateY(18px) scaleY(2.2);filter:drop-shadow(0 0 7px #ff7a1a)}100%{opacity:0}}@keyframes moveAkimbo{18%{transform:translateY(2px) scale(.97)}40%{transform:translateY(-4px) rotate(-4deg)}62%{transform:translateY(-5px) rotate(4deg) scale(1.06)}82%{transform:translateY(-2px)}}@keyframes moveAkimboGuns{20%{transform:translateY(-4px)}42%,72%{transform:translateY(-16px) scale(1.14);filter:drop-shadow(-5px 0 4px #ff7a1a) drop-shadow(5px 0 4px #ff7a1a)}}

@media(max-width:680px){.interface-companion{min-height:101px}.companion-progress{grid-template-columns:auto minmax(54px,1fr);gap:4px 7px}.companion-rank b{font-size:9px}.companion-rank small,.companion-moves{font-size:8px}.companion-moves{grid-column:1/-1}}

/* Account progression, full-stage actions and stats v3.0.0. */
.interface-companion{grid-template-columns:174px minmax(0,1fr);min-height:124px;padding-left:10px}
html[data-display-style] .companion-stage{width:164px!important;height:106px!important;overflow:hidden!important}
.companion-sprites{width:150px;height:100px;place-items:end center}
.companion-avatar{height:88px}
.companion-stage::before{inset:7px!important}
.companion-effect-text{right:8px;top:8px}
.companion-progress{grid-template-columns:minmax(96px,auto) minmax(70px,180px) auto auto auto}
.companion-account{font-size:9px;font-weight:800;color:var(--muted,#aeb9c6);white-space:nowrap}
.companion-stats-link{justify-self:start;padding:3px 7px!important;border:1px solid var(--display-action-line,var(--companion-line))!important;border-radius:6px!important;background:var(--display-action,transparent)!important;color:var(--display-action-text,var(--text,#f6f8fb))!important;font-size:9px!important;font-weight:900!important;line-height:1.2!important;text-decoration:none!important;white-space:nowrap}
.companion-stats-link:hover{transform:translateY(-1px)}
.companion-scene{position:absolute;inset:8px;z-index:0;overflow:hidden;border-radius:7px;pointer-events:none}
.companion-scene i{position:absolute;display:block;opacity:0;background:var(--accent,#38bdf8);filter:drop-shadow(0 0 5px var(--companion-glow));transform-origin:center}
.companion-scene i:nth-child(1){left:7%;bottom:11%;width:86%;height:2px}
.companion-scene i:nth-child(2){left:13%;top:18%;width:13px;height:13px;border:2px solid var(--accent,#38bdf8);border-radius:50%;background:transparent}
.companion-scene i:nth-child(3){right:12%;top:24%;width:8px;height:28px}
html[data-display-style="neon-grid"] .companion-scene{clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
html[data-display-style="ember-silver"] .companion-scene i:nth-child(2){border-radius:0;transform:rotate(45deg)}
html[data-display-style="frost-rune"] .companion-scene i:nth-child(2){width:19px;height:19px;border-radius:0;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
html[data-display-style="classic-quest"] .companion-scene i{image-rendering:pixelated}
html[data-display-style="life-mode"] .companion-scene i:nth-child(2){border-radius:50%;background:#41cf73;border-color:#fff}
html[data-display-style="vault-108"] .companion-scene i:nth-child(2){border-radius:0;border-color:#54f28d;box-shadow:inset 0 0 0 2px #07100d}
html[data-display-style="covert-ops"] .companion-scene i:nth-child(2){border-radius:0;border-color:#ff7a1a}

.interface-companion:is([data-companion-motion="standard-bay-run"],[data-companion-motion="neon-rail-dash"],[data-companion-motion="hunter-dodge-slash"],[data-companion-motion="frost-shield-charge"],[data-companion-motion="quest-tile-run"],[data-companion-motion="life-room-walk"],[data-companion-motion="vault-wasteland-scout"],[data-companion-motion="ops-wall-run"]) .companion-avatar{animation:stageTraverse 1.3s steps(9,end) both!important}
.interface-companion:is([data-companion-motion="standard-lift-check"],[data-companion-motion="neon-mantis-leap"],[data-companion-motion="hunter-trophy-circle"],[data-companion-motion="frost-axe-sweep"],[data-companion-motion="quest-victory-lap"],[data-companion-motion="life-needs-panic"],[data-companion-motion="vault-dog-fetch"],[data-companion-motion="ops-thruster-sweep"]) .companion-avatar{animation:stageArc 1.42s steps(10,end) both!important}
.interface-companion:is([data-companion-motion="standard-parts-relay"],[data-companion-motion="neon-data-storm"],[data-companion-motion="hunter-sign-wall"],[data-companion-motion="frost-dragon-shout"],[data-companion-motion="quest-loot-rain"],[data-companion-motion="life-dance-party"],[data-companion-motion="vault-fusion-charge"],[data-companion-motion="ops-drone-lock"]) .companion-avatar{animation:stageCommand 1.55s steps(10,end) both!important}
.interface-companion[data-companion-motion^="standard-"] .companion-scene i,
.interface-companion[data-companion-motion^="neon-"] .companion-scene i,
.interface-companion[data-companion-motion^="hunter-"] .companion-scene i,
.interface-companion[data-companion-motion^="frost-"] .companion-scene i,
.interface-companion[data-companion-motion^="quest-"] .companion-scene i,
.interface-companion[data-companion-motion^="life-"] .companion-scene i,
.interface-companion[data-companion-motion^="vault-"] .companion-scene i,
.interface-companion[data-companion-motion^="ops-"] .companion-scene i{animation:stageScenePulse 1.45s steps(7,end) both}
@keyframes stageTraverse{0%,100%{transform:none}8%{transform:translateX(-46px) scale(.92)}24%{transform:translate(-22px,-5px) rotate(-5deg)}46%{transform:translateX(49px) skewX(-8deg)}65%{transform:translate(27px,-9px) rotate(6deg)}82%{transform:translateX(-18px)}}
@keyframes stageArc{0%,100%{transform:none}12%{transform:translate(-37px,4px) scale(.92)}31%{transform:translate(-15px,-28px) rotate(-12deg)}52%{transform:translate(25px,-34px) rotate(15deg) scale(1.08)}72%{transform:translate(46px,-5px) rotate(5deg)}88%{transform:translate(-9px,-3px)}}
@keyframes stageCommand{0%,100%{transform:none}15%{transform:translateY(5px) scale(.93)}35%{transform:translateY(-9px) scale(1.08)}55%{transform:rotate(-8deg) scale(1.13)}72%{transform:rotate(8deg) scale(1.13)}88%{transform:translateY(-3px)}}
@keyframes stageScenePulse{0%,100%{opacity:0;transform:none}18%{opacity:.25;transform:scale(.45)}42%,72%{opacity:.9;transform:scale(1.25) rotate(90deg)}88%{opacity:.2;transform:translateY(-17px) scale(.7)}}

.interface-companion[data-companion-motion="neon-rail-dash"] .companion-scene i:nth-child(1){animation:sceneRail 1.3s linear both}.interface-companion[data-companion-motion="neon-data-storm"] .companion-scene i{animation:sceneData 1.5s steps(9,end) both}
.interface-companion[data-companion-motion="hunter-dodge-slash"] .sprite-weapons{animation:hunterBlades 1.3s steps(8,end) both!important}.interface-companion[data-companion-motion="hunter-sign-wall"] .companion-scene i:nth-child(2){animation:sceneSign 1.5s steps(8,end) both}
.interface-companion[data-companion-motion="frost-shield-charge"] .sprite-shield{animation:moveBashShield 1.3s steps(8,end) both!important}.interface-companion[data-companion-motion="frost-dragon-shout"] .sprite-breath{opacity:1;animation:sceneShout 1.55s steps(9,end) both!important}.interface-companion[data-companion-motion="frost-axe-sweep"] .sprite-sword{animation:sceneWeaponSweep 1.42s steps(9,end) both!important}
.interface-companion[data-companion-motion="quest-loot-rain"] .companion-scene i{animation:sceneLoot 1.55s steps(9,end) both}.interface-companion[data-companion-motion="quest-victory-lap"] .sprite-cape{animation:moveQuestCape 1.42s steps(9,end) both!important}
.interface-companion[data-companion-motion="life-needs-panic"] .sprite-diamond{animation:sceneNeeds 1.42s steps(8,end) both!important}.interface-companion[data-companion-motion="life-dance-party"] .companion-scene i{animation:sceneParty 1.55s ease-out both}.interface-companion[data-companion-motion="life-dance-party"] .sprite-arm{animation:heroDanceArms 1.55s steps(10,end) both!important}
.interface-companion[data-companion-motion="vault-dog-fetch"] :is(.vault-dweller,.vault-dogmeat){opacity:1}.interface-companion[data-companion-motion="vault-dog-fetch"] .vault-power-armour{opacity:0}.interface-companion[data-companion-motion="vault-dog-fetch"] .vault-dweller{transform:translateX(-18px) scale(.96)}.interface-companion[data-companion-motion="vault-dog-fetch"] .vault-dog-tail{animation:vaultDogTail .16s ease-in-out 9 alternate}.interface-companion[data-companion-motion="vault-dog-fetch"] :is(.vault-dog-head,.vault-dog-leg){animation:vaultDogFetch 1.42s steps(9,end) both!important}.interface-companion[data-companion-motion="vault-fusion-charge"] :is(.vault-dweller,.vault-dogmeat){opacity:0}.interface-companion[data-companion-motion="vault-fusion-charge"] .vault-power-armour{opacity:1}.interface-companion[data-companion-motion="vault-fusion-charge"] :is(.vault-core,.vault-visor,.vault-armour-effect){opacity:1;animation:vaultFusionCharge 1.55s steps(9,end) both!important}.interface-companion[data-companion-motion="vault-wasteland-scout"] .vault-pipboy{animation:vaultPipScan .22s steps(2,end) 6}
.interface-companion[data-companion-motion="ops-wall-run"] .sprite-dual-guns{animation:opsWeapons 1.3s steps(8,end) both!important}.interface-companion[data-companion-motion="ops-thruster-sweep"] .companion-scene i:nth-child(3){animation:sceneThruster 1.42s steps(9,end) both}.interface-companion[data-companion-motion="ops-drone-lock"] .companion-scene i:nth-child(2){animation:sceneLock 1.55s steps(9,end) both}
@keyframes sceneRail{0%,100%{opacity:0;transform:scaleX(.1)}20%,78%{opacity:1;transform:scaleX(1);box-shadow:0 0 13px #00e5ff,0 -28px #ff4db866}}
@keyframes sceneData{0%,100%{opacity:0;transform:translateY(-40px)}25%,75%{opacity:.9;transform:translateY(42px) scaleY(2)}}
@keyframes sceneSign{0%,100%{opacity:0;transform:rotate(0) scale(.25)}35%,70%{opacity:1;transform:rotate(225deg) scale(3);box-shadow:0 0 15px #e65b4d}}
@keyframes sceneShout{0%{opacity:0;transform:translateX(0) scale(.3)}35%,68%{opacity:1;transform:translateX(-35px) scale(2.5)}100%{opacity:0;transform:translateX(-68px) scale(4)}}
@keyframes sceneWeaponSweep{25%{transform:translate(-15px,-22px) rotate(-55deg)}55%{transform:translate(25px,-29px) rotate(48deg) scale(1.22)}82%{transform:translate(-5px,-8px) rotate(-15deg)}}
@keyframes sceneLoot{0%{opacity:0;transform:translateY(-45px) rotate(0)}30%,72%{opacity:1;transform:translateY(38px) rotate(180deg)}100%{opacity:0;transform:translateY(50px) rotate(270deg)}}
@keyframes sceneNeeds{0%,100%{transform:none;fill:#41cf73}28%{transform:translateY(8px) rotate(-18deg);fill:#e6b23c}48%{transform:translateY(-11px) rotate(18deg);fill:#e86969}68%{transform:translateY(6px) rotate(-14deg);fill:#e86969}84%{transform:translateY(-6px) rotate(8deg);fill:#41cf73}}
@keyframes sceneParty{0%,100%{opacity:0;transform:translateY(30px) scale(.3)}30%,72%{opacity:.85;transform:translateY(-12px) scale(1.5) rotate(160deg)}}
@keyframes vaultDogFetch{0%,100%{transform:none}20%{transform:translate(-8px,-4px) rotate(-8deg)}42%{transform:translate(15px,-10px) rotate(7deg)}62%{transform:translate(27px,-4px)}82%{transform:translate(6px,-7px) rotate(-5deg)}}@keyframes vaultFusionCharge{0%,100%{opacity:.2;filter:none}28%{opacity:.72;filter:drop-shadow(0 0 5px #54f28d)}52%,76%{opacity:1;transform:scale(1.22);filter:drop-shadow(0 0 14px #54f28d) brightness(1.8)}}
@keyframes sceneThruster{0%,100%{opacity:0;transform:translateY(20px) scaleY(.2)}25%,72%{opacity:1;transform:translateY(37px) scaleY(2.8);box-shadow:0 0 12px #ff7a1a}}
@keyframes sceneLock{0%,100%{opacity:0;transform:scale(2.8) rotate(0)}32%,72%{opacity:1;transform:scale(1) rotate(180deg);box-shadow:0 0 14px #ff7a1a}}

.companion-stats-page{display:grid;gap:18px;padding-bottom:30px}
.stats-identity,.stats-section-heading,.stats-board,.theme-stat-card,.stats-summary article{border:1px solid var(--line,#2d3947);background:var(--display-surface,var(--panel,#101923));box-shadow:var(--display-panel-shadow,0 12px 30px #0003)}
.stats-identity{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px;border-radius:16px}.stats-identity h1,.stats-identity p{margin:0}.stats-identity p:last-child{margin-top:7px;color:var(--muted,#aeb9c6)}
.stats-local-badge{padding:7px 10px;border:1px solid var(--accent,#38bdf8);border-radius:999px;color:var(--accent,#38bdf8);font-size:10px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.stats-summary{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.stats-summary article{display:grid;gap:4px;padding:16px;border-radius:12px}.stats-summary strong{color:var(--accent,#38bdf8);font-size:24px}.stats-summary span{color:var(--muted,#aeb9c6);font-size:11px;font-weight:800}
.stats-section-heading{padding:18px 20px;border-radius:14px}.stats-section-heading h2,.stats-section-heading p{margin:0}.stats-section-heading p:last-child{margin-top:6px;color:var(--muted,#aeb9c6)}
.theme-stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.theme-stat-card{display:grid;gap:15px;padding:18px;border-radius:14px}.theme-stat-card.is-active{border-color:var(--accent,#38bdf8);box-shadow:inset 4px 0 var(--accent,#38bdf8),var(--display-panel-shadow,0 12px 30px #0003)}.theme-stat-head{display:flex;align-items:start;justify-content:space-between;gap:14px}.theme-stat-head h2,.theme-stat-head p{margin:0}.theme-stat-head>strong{color:var(--accent,#38bdf8);font-size:12px}.theme-stat-card dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0}.theme-stat-card dl div{padding:9px;border:1px solid var(--display-soft-line,var(--line,#2d3947));border-radius:8px;background:var(--display-soft,color-mix(in srgb,var(--panel,#101923) 80%,#000))}.theme-stat-card dt{color:var(--muted,#aeb9c6);font-size:9px;font-weight:850;text-transform:uppercase}.theme-stat-card dd{margin:3px 0 0;color:var(--text,#f6f8fb);font-size:16px;font-weight:950}.theme-stat-card button{justify-self:start}
.stats-board-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.stats-board{display:grid;align-content:start;gap:13px;padding:18px;border-radius:14px}.stats-board h2,.stats-board p{margin:0}.stats-table-wrap{overflow-x:auto}.stats-board table{width:100%;border-collapse:collapse;font-size:12px}.stats-board :is(th,td){padding:9px 7px;border-bottom:1px solid var(--display-soft-line,var(--line,#2d3947));text-align:left}.stats-board thead th{color:var(--muted,#aeb9c6);font-size:9px;letter-spacing:.07em;text-transform:uppercase}.stats-board tbody tr.is-current{background:var(--display-hover,color-mix(in srgb,var(--accent,#38bdf8) 12%,transparent))}.stats-board tbody td:last-child{color:var(--accent,#38bdf8);font-weight:900}.stats-champions{margin-bottom:8px}
html[data-display-style="life-mode"] :is(.stats-identity,.stats-section-heading,.stats-board,.theme-stat-card,.stats-summary article){color:#12384d}
@media(max-width:980px){.stats-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.stats-board-grid{grid-template-columns:1fr}.companion-progress{grid-template-columns:minmax(96px,auto) minmax(70px,1fr) auto}.companion-account,.companion-stats-link{grid-row:2}.companion-stats-link{grid-column:2}}
@media(max-width:680px){.interface-companion{grid-template-columns:128px minmax(0,1fr);min-height:118px;padding-left:5px}.companion-stage,html[data-display-style="life-mode"] .companion-stage{width:124px!important;height:104px!important}.companion-sprites{width:116px;height:96px}.companion-avatar{height:82px;width:calc(var(--avatar-width,54px)*.94)}.companion-progress{grid-template-columns:auto minmax(50px,1fr);gap:4px 7px}.companion-account{grid-row:auto;grid-column:1}.companion-stats-link{grid-row:auto;grid-column:2}.stats-identity{align-items:flex-start;padding:18px}.stats-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.theme-stats-grid{grid-template-columns:1fr}.theme-stat-card dl{grid-template-columns:repeat(2,minmax(0,1fr))}.stats-section-heading{padding:15px}.stats-board{padding:14px}}

/* Site-wide Interface shell. Standard deliberately inherits every portal's native design. */
.companion-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}.companion-toolbar>.companion-role{min-width:0}.site-interface-picker{flex:0 0 auto;min-height:32px;padding:3px 4px 3px 8px;border-radius:8px}.site-interface-picker label{font-size:9px}.site-interface-picker select{min-width:124px;padding-top:5px;padding-bottom:5px;font-size:11px}
.portal-shell>.interface-companion,[data-auth-content]>.interface-companion,body>main>.interface-companion{margin:16px auto;width:min(100%,1180px)}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) body{transition:color .3s ease,background-color .35s ease}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(.portal-shell,.page-shell,.site-shell,.wrapper,main){color:var(--text)}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(.site-header,body>header,.portal-shell>.hero,.portal-header,.app-header){border-color:var(--line)!important;background-color:var(--display-nav)!important;background-image:var(--display-surface-image)!important;color:var(--text)!important;box-shadow:var(--display-nav-shadow)!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(.portal-tile,.status-pill,.box,.finder-card,.manual-panel,.catalogue,.important-note,.lookup-block,.results-panel,.result-section,.table-wrap,.card,.drawer,.empty-state,.secure,.note){border-color:var(--line)!important;background-color:var(--display-surface)!important;background-image:var(--display-surface-image)!important;color:var(--text)!important;box-shadow:var(--display-panel-shadow)!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(.portal-tile,.resource-card,.tile,.card,.box,.finder-card,.manual-panel,.lookup-block){transition:transform .2s ease,border-color .2s ease,box-shadow .25s ease,background-color .25s ease}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(.portal-tile,.resource-card,.tile):hover{transform:translateY(-3px);border-color:var(--accent)!important;box-shadow:var(--display-panel-shadow),0 0 20px var(--companion-glow)!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(h1,h2,h3,h4,.tile-name,.partNumber,.section-title){color:var(--text)!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(p,.hero-copy,.tile-detail,.quickMeta,.field,.note,.privacy-note,.mini,.status,.empty-state){color:var(--muted)!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(.eyebrow,.tile-kicker,.brandBadge,.label,.count-badge,.finder-step){color:var(--accent)!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){border-color:var(--display-field-line)!important;background:var(--display-field)!important;color:var(--text)!important;box-shadow:none!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(select option,select optgroup){background-color:var(--display-field)!important;color:var(--text)!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(select option:checked){background-color:var(--accent)!important;color:var(--display-accent-ink)!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(.partNumber,.noPn){border-color:var(--display-field-line)!important;background-color:var(--display-field)!important;background-image:none!important;color:var(--text)!important;text-shadow:none!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(input,textarea)::placeholder{color:var(--display-placeholder-text)!important;opacity:1}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(button,.button,.btn,.back-link){border-color:var(--display-action-line)!important;background:var(--display-action)!important;color:var(--display-action-text)!important;transition:transform .18s ease,filter .18s ease,border-color .18s ease!important}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(button,.button,.btn,.back-link):hover{filter:brightness(1.12);transform:translateY(-1px)}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(a:not(.portal-tile):not(.resource-card):not(.tile)){color:var(--accent)}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(table,th,td){border-color:var(--display-soft-line)!important;color:var(--text)}
html.pleiades-interface-enabled[data-display-style]:not([data-display-style="standard"]) :where(thead,tr:nth-child(even)){background-color:var(--display-soft)!important}

html.pleiades-interface-enabled[data-display-style="neon-grid"] :where(.portal-tile,.box,.finder-card,.lookup-block){border-radius:2px 16px 2px 16px!important}
html.pleiades-interface-enabled[data-display-style="ember-silver"] :where(.portal-tile,.box,.finder-card,.lookup-block){border-radius:4px!important;box-shadow:inset 3px 0 var(--accent2),var(--display-panel-shadow)!important}
html.pleiades-interface-enabled[data-display-style="frost-rune"] :where(.portal-tile,.box,.finder-card,.lookup-block){border-radius:0 13px 0 13px!important;border-bottom-width:3px!important}
html.pleiades-interface-enabled[data-display-style="classic-quest"] :where(.portal-tile,.box,.finder-card,.lookup-block){border-radius:3px!important;box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--line) 24%,transparent),var(--display-panel-shadow)!important}
html.pleiades-interface-enabled[data-display-style="life-mode"] :where(.portal-tile,.box,.finder-card,.lookup-block){border-radius:20px!important;box-shadow:0 12px 28px #176b9c28,var(--display-panel-shadow)!important}
html.pleiades-interface-enabled[data-display-style="vault-108"] :where(.portal-tile,.box,.finder-card,.lookup-block){border-radius:3px!important;border-left:3px solid var(--accent)!important;box-shadow:inset 0 1px #54f28d1f,var(--display-panel-shadow)!important}
html.pleiades-interface-enabled[data-display-style="covert-ops"] :where(.portal-tile,.box,.finder-card,.lookup-block){border-radius:1px 12px 1px 12px!important;border-left:3px solid var(--accent)!important}
html.pleiades-interface-enabled[data-display-style="covert-ops"] :where(.partNumber,.noPn){border:2px solid #f08a3f!important;border-left:5px solid #ff7a1a!important;background:#050607!important;color:#fff!important;box-shadow:inset 0 0 0 1px #ffffff0d,0 0 14px #ff7a1a26!important}

@media(max-width:680px){.companion-toolbar{align-items:flex-start;flex-direction:column;gap:5px}.site-interface-picker{width:100%}.site-interface-picker select{min-width:0}.portal-shell>.interface-companion,[data-auth-content]>.interface-companion,body>main>.interface-companion{width:calc(100% - 20px)}}

/* Modern illustrated companions v4.3.0: smooth vector artwork with the existing motion API. */
.companion-avatar{
  height:96px;
  width:var(--avatar-width,76px);
  shape-rendering:geometricPrecision;
  image-rendering:auto;
  filter:drop-shadow(0 8px 5px #0008) drop-shadow(0 0 7px color-mix(in srgb,var(--sprite-accent) 12%,transparent));
  transform-origin:center bottom;
}
[data-companion-avatar="neon-grid"]{height:160px}
html[data-display-style="neon-grid"] .interface-companion{grid-template-columns:132px minmax(0,1fr);min-height:172px}
html[data-display-style="neon-grid"] .companion-stage{width:126px!important;height:164px!important}
html[data-display-style="neon-grid"] .companion-sprites{width:122px;height:164px}
[data-companion-avatar="standard"]{--avatar-width:70px;--sprite-cloth:#2e6b8c}
[data-companion-avatar="neon-grid"]{--avatar-width:108px;--sprite-cloth:#342b47}
[data-companion-avatar="ember-silver"]{--avatar-width:78px;--sprite-cloth:#34302e}
[data-companion-avatar="frost-rune"]{--avatar-width:80px;--sprite-cloth:#453a30}
[data-companion-avatar="classic-quest"]{--avatar-width:76px;--sprite-cloth:#3f8049}
[data-companion-avatar="life-mode"]{--avatar-width:74px}
[data-companion-avatar="vault-108"]{--avatar-width:126px;--sprite-cloth:#155f9f}
[data-companion-avatar="covert-ops"]{--avatar-width:80px;--sprite-cloth:#1b2025}
.sprite-outline{
  stroke:var(--sprite-dark);
  stroke-width:1.45;
  stroke-linecap:round;
  stroke-linejoin:round;
  paint-order:stroke fill;
  vector-effect:non-scaling-stroke;
}
.sprite-shade{fill:color-mix(in srgb,var(--sprite-dark) 38%,var(--sprite-cloth))}
.sprite-skin-shade{fill:color-mix(in srgb,var(--sprite-skin) 72%,var(--sprite-dark))}
.sprite-highlight{fill:color-mix(in srgb,var(--sprite-light) 72%,transparent)}
.sprite-eye{fill:#081018;transform-box:fill-box;transform-origin:center;transition:transform .18s ease}
.sprite-face-line{fill:none;stroke:#754a38;stroke-width:1.15;stroke-linecap:round;transform-box:fill-box;transform-origin:center;transition:transform .18s ease,stroke .18s ease}
.sprite-rim{fill:none;stroke:var(--sprite-light);stroke-width:1.15;stroke-linecap:round;opacity:.72;vector-effect:non-scaling-stroke}
.companion-avatar :is(.sprite-skin,.sprite-hair,.sprite-cloth,.sprite-metal,.sprite-light,.sprite-accent,.sprite-dark,.sprite-diamond){transition:fill .2s ease,filter .2s ease}
.interface-companion[data-companion-state="success"] .sprite-face-line{transform:translateY(-.45px) scaleX(1.18)}
.interface-companion[data-companion-state="success"] .sprite-eye{transform:scaleY(.82)}
.interface-companion[data-companion-state="error"] .sprite-eye{transform:translateY(1px) scaleY(.55)}
.interface-companion[data-companion-state="error"] .sprite-face-line{transform:translateY(1.2px) scaleX(.78);stroke:var(--danger,#ff768c)}
.interface-companion:is([data-companion-state="scanning"],[data-companion-state="typing"]) .sprite-eye{transform:scaleX(1.12)}
.interface-companion[data-companion-state="copied"] .sprite-face-line{transform:translateY(-.35px) scaleX(1.08)}
html[data-display-style="standard"] .companion-avatar{filter:drop-shadow(0 8px 5px #0008) drop-shadow(0 0 6px #38bdf82b)}
html[data-display-style="neon-grid"] .companion-avatar{filter:drop-shadow(-2px 0 #00e5ff42) drop-shadow(2px 0 #ff3f6342) drop-shadow(0 8px 5px #0009)}
html[data-display-style="ember-silver"] .companion-avatar{filter:drop-shadow(0 8px 5px #0009) drop-shadow(0 0 7px #b9433c2b)}
html[data-display-style="frost-rune"] .companion-avatar{filter:drop-shadow(0 8px 5px #0009) drop-shadow(0 0 8px #8bd8f13b)}
html[data-display-style="classic-quest"] .companion-avatar{image-rendering:auto;filter:drop-shadow(0 8px 5px #0009) drop-shadow(0 0 6px #d5a53330)}
html[data-display-style="life-mode"] .companion-avatar{filter:drop-shadow(0 8px 5px #287b965c) drop-shadow(0 0 7px #41cf7335)}
html[data-display-style="vault-108"] .companion-avatar{filter:drop-shadow(0 8px 5px #0009) drop-shadow(0 0 8px #54f28d30)}
html[data-display-style="covert-ops"] .companion-avatar{filter:drop-shadow(0 8px 5px #000b) drop-shadow(0 0 8px #ff7a1a35)}
html[data-display-style="life-mode"] [data-companion-avatar="life-mode"] .sprite-diamond{filter:drop-shadow(0 2px 4px #159b45cc) drop-shadow(0 0 5px #41cf7377)}
@media(max-width:680px){
  .companion-avatar{height:88px;width:calc(var(--avatar-width,76px)*.92)}
  html[data-display-style="neon-grid"] .interface-companion{grid-template-columns:1fr;gap:5px;min-height:0;padding:9px 10px 10px}
  html[data-display-style="neon-grid"] .companion-stage{justify-self:center;width:118px!important;height:152px!important}
  html[data-display-style="neon-grid"] .companion-sprites{width:112px;height:152px}
  html[data-display-style="neon-grid"] [data-companion-avatar="neon-grid"]{width:102px;height:150px}
  html[data-display-style="neon-grid"] .companion-dialogue{width:100%}
  html[data-display-style="vault-108"] .interface-companion{grid-template-columns:1fr;gap:5px;padding:9px 10px 10px}
  html[data-display-style="vault-108"] .companion-stage{justify-self:center;width:164px!important;height:106px!important}
  html[data-display-style="vault-108"] .companion-sprites{width:150px;height:100px}
  html[data-display-style="vault-108"] .companion-dialogue{width:100%}
  html[data-display-style="vault-108"] .companion-loadout{display:grid;grid-template-columns:auto minmax(0,1fr);width:100%}
  html[data-display-style="vault-108"] .companion-loadout[hidden]{display:none!important}
  html[data-display-style="vault-108"] .companion-loadout select{width:100%;min-width:0}
}
@media(prefers-reduced-motion:reduce){
  .companion-avatar :is(.sprite-skin,.sprite-hair,.sprite-cloth,.sprite-metal,.sprite-light,.sprite-accent,.sprite-dark,.sprite-diamond,.sprite-eye,.sprite-face-line){transition:none!important}
}

/* Expressive faces and rare Vault encounters v4.4.0. */
.sprite-eyes,.sprite-mouth,.sprite-optic-eyes{transform-box:fill-box;transform-origin:center}
.sprite-eyes{animation:avatarFaceBlink 5.8s steps(1,end) infinite}
.sprite-mouth{animation:avatarMouthIdle 4.6s ease-in-out infinite}
.sprite-optic-eyes{animation:avatarOpticBlink 5.1s steps(1,end) infinite}
.interface-companion.is-reacting .sprite-mouth{animation:avatarMouthTalk .22s ease-in-out 7 alternate}
.interface-companion[data-companion-state="success"] .sprite-mouth{animation:avatarMouthSmile .72s ease-out both}
.interface-companion[data-companion-state="error"] .sprite-mouth{animation:avatarMouthConcern .7s ease-out both}
.interface-companion:is([data-companion-state="typing"],[data-companion-state="scanning"]) .sprite-eyes{animation:avatarFocusedBlink 3.1s steps(1,end) infinite}
@keyframes avatarFaceBlink{0%,43%,46%,78%,81%,100%{transform:scaleY(1)}44%,45%,79%,80%{transform:scaleY(.08)}}
@keyframes avatarFocusedBlink{0%,72%,76%,100%{transform:scaleY(1)}73%,75%{transform:scaleY(.12)}}
@keyframes avatarMouthIdle{0%,100%{transform:none}50%{transform:translateY(.35px) scaleX(1.04)}}
@keyframes avatarMouthTalk{0%{transform:scaleY(.72) scaleX(.95)}100%{transform:translateY(.8px) scaleY(1.42) scaleX(1.08)}}
@keyframes avatarMouthSmile{55%{transform:translateY(-.5px) scaleX(1.22) scaleY(.86)}}
@keyframes avatarMouthConcern{55%{transform:translateY(1px) scaleX(.78) rotate(3deg)}}
@keyframes avatarOpticBlink{0%,46%,49%,100%{filter:none;transform:scaleY(1)}47%,48%{filter:brightness(1.8) drop-shadow(0 0 4px var(--sprite-accent));transform:scaleY(.22)}}

[data-companion-avatar="vault-108"] .vault-stranger-dark{fill:#151816}
[data-companion-avatar="vault-108"] .vault-stranger-coat{fill:#6a6354}
[data-companion-avatar="vault-108"] .vault-stranger-shade{fill:#413d35}
[data-companion-avatar="vault-108"] .vault-stranger-shirt{fill:#d9d4c4}
[data-companion-avatar="vault-108"] .vault-stranger-tie{fill:#7b241f}
[data-companion-avatar="vault-108"] .vault-stranger-hair{fill:#33291f}
[data-companion-avatar="vault-108"] .vault-stranger-band{fill:#8d3329}
.vault-stranger,.vault-stranger-hat,.vault-stranger-arm,.vault-stranger-gun-arm,.vault-stranger-smoke{transform-box:fill-box;transform-origin:center bottom}
.vault-stranger{opacity:0;pointer-events:none}
.vault-stranger-flash,.vault-stranger-smoke{opacity:0}
.vault-stranger-flash{fill:#f4d43f;filter:drop-shadow(0 0 6px #f4d43f)}
.vault-stranger-smoke{fill:#d8dacb;filter:drop-shadow(0 0 4px #ffffff66)}
.interface-companion:is([data-companion-motion="vault-stranger-cover"],[data-companion-motion="vault-stranger-hat-tip"],[data-companion-motion="vault-stranger-vanish"]) .companion-avatar{animation:none!important}
.interface-companion:is([data-companion-motion="vault-stranger-cover"],[data-companion-motion="vault-stranger-hat-tip"],[data-companion-motion="vault-stranger-vanish"]) .vault-stranger{opacity:1}
.interface-companion[data-companion-motion="vault-stranger-cover"] .vault-stranger{animation:vaultStrangerCover 3.3s cubic-bezier(.2,.72,.25,1) both}
.interface-companion[data-companion-motion="vault-stranger-cover"] .vault-stranger-gun-arm{animation:vaultStrangerDraw 3.3s steps(8,end) both}
.interface-companion[data-companion-motion="vault-stranger-cover"] .vault-stranger-flash{animation:vaultStrangerFlash 3.3s steps(1,end) both}
.interface-companion[data-companion-motion="vault-stranger-cover"] .vault-dweller{animation:vaultDwellerDuck 3.3s steps(8,end) both}
.interface-companion[data-companion-motion="vault-stranger-cover"] .companion-scene i:nth-child(2){animation:vaultStrangerTarget 3.3s steps(8,end) both}
.interface-companion[data-companion-motion="vault-stranger-hat-tip"] .vault-stranger{animation:vaultStrangerArrive 3.3s ease-in-out both}
.interface-companion[data-companion-motion="vault-stranger-hat-tip"] .vault-stranger-hat{animation:vaultStrangerHatTip 3.3s steps(9,end) both}
.interface-companion[data-companion-motion="vault-stranger-hat-tip"] .vault-dweller-arm{animation:vaultDwellerWaveBack 3.3s steps(9,end) both}
.interface-companion[data-companion-motion="vault-stranger-vanish"] .vault-stranger{animation:vaultStrangerVanish 3.3s ease-in-out both}
.interface-companion[data-companion-motion="vault-stranger-vanish"] .vault-stranger-smoke{animation:vaultStrangerSmoke 3.3s ease-out both}
.interface-companion[data-companion-motion="vault-stranger-vanish"] .vault-dweller{animation:vaultDwellerLookBack 3.3s steps(9,end) both}
@keyframes vaultStrangerCover{0%{opacity:0;transform:translateX(-48px)}13%{opacity:1;transform:translateX(-8px)}25%,76%{opacity:1;transform:translateX(0)}88%{opacity:1;transform:translateX(-5px)}100%{opacity:0;transform:translateX(-42px)}}
@keyframes vaultStrangerDraw{0%,25%,76%,100%{transform:none}36%,64%{transform:translate(8px,-12px) rotate(-16deg)}}
@keyframes vaultStrangerFlash{0%,43%,47%,100%{opacity:0;transform:scale(.2)}44%,46%{opacity:1;transform:scale(2.1)}}
@keyframes vaultDwellerDuck{0%,100%{transform:translateX(7px)}34%,68%{transform:translate(13px,9px) scale(.92) rotate(3deg)}}
@keyframes vaultStrangerTarget{0%,31%,69%,100%{opacity:0;transform:translate(88px,20px) scale(2.2)}38%,61%{opacity:1;transform:translate(88px,20px) scale(.72);border-color:#54f28d;box-shadow:0 0 12px #54f28d}}
@keyframes vaultStrangerArrive{0%,100%{opacity:0;transform:translateX(-42px)}16%,82%{opacity:1;transform:translateX(0)}}
@keyframes vaultStrangerHatTip{0%,27%,72%,100%{transform:none}38%,61%{transform:translate(5px,-10px) rotate(18deg)}}
@keyframes vaultDwellerWaveBack{0%,30%,73%,100%{transform:none}40%,63%{transform:translate(7px,-12px) rotate(48deg)}}
@keyframes vaultStrangerVanish{0%{opacity:0;transform:translateX(-45px)}18%{opacity:1;transform:translateX(-4px)}48%{opacity:1;transform:translateX(30px)}72%{opacity:.82;transform:translateX(66px) scale(.96)}100%{opacity:0;transform:translateX(94px) scale(.72)}}
@keyframes vaultStrangerSmoke{0%,48%,100%{opacity:0;transform:scale(.3)}66%{opacity:.78;transform:translate(45px,-5px) scale(1.45)}82%{opacity:.25;transform:translate(70px,-18px) scale(2)}}
@keyframes vaultDwellerLookBack{0%,100%{transform:translateX(7px)}28%,68%{transform:translateX(12px) rotate(4deg) scale(.97)}}

@media(prefers-reduced-motion:reduce){
  .sprite-eyes,.sprite-mouth,.sprite-optic-eyes{animation:none!important}
  html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] .sprite-johnny-guitar{opacity:1;transform:translateY(-2px) rotate(-6deg);animation:none!important}
  html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] :is(.sprite-pistol,.sprite-malorian){opacity:0}
  html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] :is(.sprite-arm-right,.sprite-malorian){opacity:0}
  html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .sprite-johnny-shooting-arm{opacity:1;transform:none;animation:none!important}
  .interface-companion:is([data-companion-motion="vault-stranger-cover"],[data-companion-motion="vault-stranger-hat-tip"],[data-companion-motion="vault-stranger-vanish"]) .vault-stranger{opacity:1;transform:none;animation:none!important}
  .interface-companion:is([data-companion-motion="vault-stranger-cover"],[data-companion-motion="vault-stranger-hat-tip"],[data-companion-motion="vault-stranger-vanish"]) .vault-dweller{transform:translateX(7px);animation:none!important}
}

@media(max-width:680px){
  html[data-display-style="neon-grid"] .companion-stage{width:108px!important;height:104px!important}
  html[data-display-style="neon-grid"] .companion-sprites{width:104px;height:104px}
  html[data-display-style="neon-grid"] .companion-johnny-photo{width:104px!important;height:104px!important}
  html[data-display-style="neon-grid"] .johnny-photo-idle{width:96px}
  html[data-display-style="neon-grid"] :is(.johnny-photo-guitar,.johnny-photo-malorian){width:100px}
  html[data-display-style="neon-grid"] .johnny-photo-optics{left:42px;top:10px;width:22px;height:10px}
  html[data-display-style="neon-grid"] .johnny-photo-mouth{left:50px;top:24px}
  html[data-display-style="neon-grid"] .johnny-photo-cyber{right:3px;top:31px;height:52px}
  html[data-display-style="neon-grid"] .johnny-photo-muzzle{left:4px;top:16px;width:14px;height:14px}
}

@media(prefers-reduced-motion:reduce){
  html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-guitar"] .johnny-photo-guitar,
  html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .johnny-photo-malorian{opacity:1;transform:translateX(-50%);animation:none!important}
  html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian"] .johnny-photo-muzzle{opacity:0;animation:none!important}
}

/* Johnny Silverhand motion overhaul v5.1.0: substantial photo-layer sequences replace generic mascot gestures. */
html[data-display-style="neon-grid"] .johnny-photo-glitch{z-index:2;opacity:0;mix-blend-mode:screen;pointer-events:none}
html[data-display-style="neon-grid"] .johnny-photo-fx{position:absolute;inset:0;z-index:6;display:block;overflow:hidden;opacity:0;pointer-events:none}
html[data-display-style="neon-grid"] .johnny-photo-fx>i{position:absolute;display:block}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion^="johnny-"]:not(:is([data-companion-motion="johnny-guitar"],[data-companion-motion="johnny-malorian"])) .companion-johnny-photo,
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion^="neon-"] .companion-johnny-photo{animation:none!important}

html[data-display-style="neon-grid"] .johnny-cigarette-fx i:nth-child(1){left:63px;top:28px;width:18px;height:2px;border-radius:2px;background:linear-gradient(90deg,#f2e6cf 0 72%,#9d5c3b 73%);box-shadow:0 0 1px #fff;transform-origin:left center}
html[data-display-style="neon-grid"] .johnny-cigarette-fx i:nth-child(2){left:79px;top:27px;width:4px;height:4px;border-radius:50%;background:#ffcf76;box-shadow:0 0 5px #ff5b2e,0 0 9px #ff3f63}
html[data-display-style="neon-grid"] .johnny-cigarette-fx i:nth-child(3),
html[data-display-style="neon-grid"] .johnny-cigarette-fx i:nth-child(4){left:80px;top:16px;width:11px;height:17px;border:2px solid #dbe9ee;border-color:#dbe9ee transparent transparent #dbe9ee;border-radius:55% 45% 60% 35%;filter:blur(.3px);opacity:0}
html[data-display-style="neon-grid"] .johnny-cigarette-fx i:nth-child(4){left:85px;top:10px;width:15px;height:23px;transform:rotate(18deg) scale(.8)}

html[data-display-style="neon-grid"] .johnny-chrome-fx i:nth-child(1){right:4px;top:34px;width:22px;height:61px;border:1px solid #00e5ff;border-left:0;border-radius:0 55% 45% 0;box-shadow:inset -3px 0 #00e5ff20,0 0 7px #00e5ff;clip-path:polygon(36% 0,100% 0,100% 100%,0 100%,18% 72%,0 44%)}
html[data-display-style="neon-grid"] .johnny-chrome-fx i:nth-child(2){right:7px;top:48px;width:17px;height:2px;background:#e9fdff;box-shadow:0 13px #00e5ff,0 26px #e9fdff,0 0 8px #00e5ff;transform-origin:right center}
html[data-display-style="neon-grid"] .johnny-chrome-fx i:nth-child(3){right:10px;top:39px;width:5px;height:5px;border:1px solid #e9fdff;border-radius:50%;background:#00e5ff;box-shadow:0 21px #00e5ff,0 42px #e9fdff,0 0 8px #00e5ff}

html[data-display-style="neon-grid"] .johnny-data-fx{z-index:7;perspective:90px}
html[data-display-style="neon-grid"] .johnny-data-fx i{width:31px;height:18px;border:1px solid #00e5ff;background:repeating-linear-gradient(0deg,#00e5ff24 0 2px,transparent 2px 5px),linear-gradient(135deg,#061824e8,#11101de8);box-shadow:inset 3px 0 #ff3f63,0 0 8px #00e5ff;color:#bdfbff;clip-path:polygon(4px 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%,0 4px)}
html[data-display-style="neon-grid"] .johnny-data-fx i:nth-child(1){left:4px;top:43px}
html[data-display-style="neon-grid"] .johnny-data-fx i:nth-child(2){right:1px;top:12px;transform:scale(.82)}
html[data-display-style="neon-grid"] .johnny-data-fx i:nth-child(3){right:8px;bottom:7px;transform:scale(.7)}

html[data-display-style="neon-grid"] .johnny-reticle-fx i:nth-child(1){left:41px;top:7px;width:42px;height:42px;border:1px solid #ff3f63;border-radius:50%;box-shadow:inset 0 0 9px #ff3f6344,0 0 9px #ff3f63;clip-path:polygon(0 0,42% 0,42% 7%,58% 7%,58% 0,100% 0,100% 42%,93% 42%,93% 58%,100% 58%,100% 100%,58% 100%,58% 93%,42% 93%,42% 100%,0 100%,0 58%,7% 58%,7% 42%,0 42%)}
html[data-display-style="neon-grid"] .johnny-reticle-fx i:nth-child(2){left:7px;top:24px;width:102px;height:1px;background:linear-gradient(90deg,transparent,#00e5ff 25% 75%,transparent);box-shadow:0 0 8px #00e5ff}
html[data-display-style="neon-grid"] .johnny-reticle-fx i:nth-child(3){left:61px;top:0;width:1px;height:76px;background:linear-gradient(transparent,#ff3f63 28% 72%,transparent);box-shadow:0 0 8px #ff3f63}

html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-smoke-break"] .johnny-photo-idle{animation:johnnySmokeBody 3.6s cubic-bezier(.22,.7,.25,1) infinite!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-smoke-break"] .johnny-cigarette-fx{opacity:1;animation:johnnyCigaretteIn 3.6s ease-in-out infinite}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-smoke-break"] .johnny-cigarette-fx i:nth-child(2){animation:johnnyEmber 1.2s steps(3,end) infinite}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-smoke-break"] .johnny-cigarette-fx i:nth-child(3){animation:johnnySmokeCurl 3.6s ease-out infinite}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-smoke-break"] .johnny-cigarette-fx i:nth-child(4){animation:johnnySmokeCurl 3.6s .55s ease-out infinite}

html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-relic-glitch"],[data-companion-motion="johnny-relic-scan"],[data-companion-motion="neon-holo"]) .johnny-photo-idle{animation:johnnyRelicBody 2.25s steps(12,end) both!important}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-relic-glitch"],[data-companion-motion="johnny-relic-scan"],[data-companion-motion="neon-holo"]) .johnny-photo-glitch-a{animation:johnnyRelicGhostA 2.25s steps(12,end) both!important}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-relic-glitch"],[data-companion-motion="johnny-relic-scan"],[data-companion-motion="neon-holo"]) .johnny-photo-glitch-b{animation:johnnyRelicGhostB 2.25s steps(12,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-relic-scan"] .johnny-reticle-fx{opacity:1;animation:johnnyTargetHud 2.2s steps(10,end) both}

html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-chrome-check"],[data-companion-motion="neon-mantis-leap"]) .johnny-photo-idle{animation:johnnyChromeBody 2.35s cubic-bezier(.2,.72,.25,1) both!important}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-chrome-check"],[data-companion-motion="neon-mantis-leap"]) .johnny-chrome-fx{opacity:1;animation:johnnyChromePanel 2.35s steps(12,end) both}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-chrome-check"],[data-companion-motion="neon-mantis-leap"]) .johnny-chrome-fx i:nth-child(2){animation:johnnyChromeTrace .42s steps(3,end) 5}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-mantis-leap"] .johnny-photo-cyber{animation:johnnyChromeOverload 2.35s steps(12,end) both!important}

html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-data-breach"],[data-companion-motion="johnny-shard-pocket"],[data-companion-motion="neon-data-storm"]) .johnny-data-fx{opacity:1}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-data-breach"] .johnny-photo-idle{animation:johnnyDataBody 1.2s steps(7,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-data-breach"] .johnny-data-fx i{animation:johnnyDataBreach 1.2s steps(7,end) both}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-data-breach"] .johnny-data-fx i:nth-child(2){animation-delay:.1s}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-data-breach"] .johnny-data-fx i:nth-child(3){animation-delay:.2s}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-shard-pocket"] .johnny-photo-idle{animation:johnnyPocketBody 1.95s cubic-bezier(.2,.72,.25,1) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-shard-pocket"] .johnny-data-fx i{animation:johnnyShardPocket 1.95s steps(10,end) both}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-data-storm"] .johnny-photo-idle{animation:johnnyDataBurnBody 2.3s steps(14,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-data-storm"] .johnny-data-fx i{animation:johnnyDataBurn 2.3s steps(14,end) both}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-data-storm"] .johnny-data-fx i:nth-child(2){animation-delay:.12s}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-data-storm"] .johnny-data-fx i:nth-child(3){animation-delay:.24s}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-data-storm"] .johnny-photo-glitch-a{animation:johnnyRelicGhostA 2.3s steps(14,end) both!important}

html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-target-lock"] .johnny-photo-idle{animation:johnnyTargetBody 2.1s steps(10,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-target-lock"] .johnny-reticle-fx{opacity:1;animation:johnnyTargetHud 2.1s steps(10,end) both}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-target-lock"] .johnny-photo-optics{animation:johnnyOpticLock 2.1s steps(10,end) both!important}

html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-system-break"] .johnny-photo-idle{animation:johnnySystemBreak 2.15s steps(13,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-system-break"] .johnny-photo-glitch-a{animation:johnnyErrorGhost 2.15s steps(13,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-system-break"] .johnny-data-fx{opacity:1;filter:hue-rotate(135deg) saturate(1.7)}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-system-break"] .johnny-data-fx i{animation:johnnyErrorPanels 2.15s steps(13,end) both}

html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-materialize"] .johnny-photo-idle{animation:johnnyMaterialize 2.2s steps(14,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-materialize"] .johnny-photo-glitch-a{animation:johnnyMaterializeGhost 2.2s steps(14,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-materialize"] .johnny-photo-stage{opacity:1;animation:johnnyMaterializeStage 2.2s steps(14,end) both!important}

html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-malorian-check"],[data-companion-motion="neon-dash"]) .johnny-photo-idle{opacity:0}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-malorian-check"],[data-companion-motion="neon-dash"]) .johnny-photo-malorian{opacity:1}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-malorian-check"],[data-companion-motion="neon-dash"]) :is(.johnny-photo-optics,.johnny-photo-mouth,.johnny-photo-cyber){opacity:0}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="johnny-malorian-check"] .johnny-photo-malorian{animation:johnnyMalorianInspect 2.25s cubic-bezier(.2,.72,.25,1) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-dash"] .companion-johnny-photo{animation:none!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-dash"] .johnny-photo-malorian{animation:johnnyMalorianSlide 2.25s steps(13,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-dash"] .companion-scene i:nth-child(1){animation:johnnySlideTrail 2.25s steps(13,end) both!important}

html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-encore"],[data-companion-motion="neon-overclock"]) .johnny-photo-idle{opacity:0}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-encore"],[data-companion-motion="neon-overclock"]) .johnny-photo-guitar{opacity:1;animation:johnnySamuraiEncore 2.35s steps(14,end) both!important;filter:drop-shadow(-3px 0 5px #00e5ff) drop-shadow(3px 0 6px #ff3f63)}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-encore"],[data-companion-motion="neon-overclock"]) :is(.johnny-photo-optics,.johnny-photo-mouth,.johnny-photo-cyber){opacity:0}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-encore"],[data-companion-motion="neon-overclock"]) .johnny-photo-stage{opacity:1;animation:johnnyEncoreStage 2.35s steps(14,end) both!important}
html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-encore"],[data-companion-motion="neon-overclock"]) .companion-scene i{animation:johnnyEncoreLights 2.35s steps(14,end) both!important}

html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-rail-dash"] .companion-johnny-photo{animation:none!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-rail-dash"] .johnny-photo-idle{animation:johnnyNightCityWalk 2.25s cubic-bezier(.2,.74,.28,1) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-rail-dash"] .johnny-photo-glitch-a{animation:johnnyWalkGhost 2.25s steps(13,end) both!important}
html[data-display-style="neon-grid"] .interface-companion[data-companion-motion="neon-rail-dash"] .companion-scene i:nth-child(1){animation:johnnySlideTrail 2.25s steps(13,end) both!important}

@keyframes johnnySmokeBody{0%,12%,100%{transform:translateX(-50%)}28%{transform:translate(-52%,2px) rotate(-1.2deg)}48%,70%{transform:translate(-50%,1px) rotate(.5deg) scale(1.012)}84%{transform:translate(-49%,-1px)}}
@keyframes johnnyCigaretteIn{0%,12%,96%,100%{opacity:0;transform:translate(-5px,4px) rotate(8deg)}24%,84%{opacity:1;transform:none}}
@keyframes johnnyEmber{0%,100%{filter:brightness(.75);transform:scale(.75)}45%{filter:brightness(2);transform:scale(1.35)}}
@keyframes johnnySmokeCurl{0%,20%{opacity:0;transform:translate(0,8px) scale(.45) rotate(0)}42%{opacity:.68}78%{opacity:.28;transform:translate(8px,-14px) scale(1.25) rotate(34deg)}100%{opacity:0;transform:translate(15px,-25px) scale(1.7) rotate(72deg)}}
@keyframes johnnyRelicBody{0%,100%{transform:translateX(-50%);filter:none;clip-path:inset(0)}15%{transform:translate(-46%,-1px);filter:contrast(1.45) saturate(.7);clip-path:inset(0 0 68%)}22%{transform:translate(-54%,1px);clip-path:inset(34% 0 34%)}37%{transform:translate(-48%,-2px);filter:hue-rotate(25deg) brightness(1.25);clip-path:inset(66% 0 0)}49%,72%{transform:translateX(-50%);filter:none;clip-path:inset(0)}82%{transform:translate(-53%,0);filter:contrast(1.55);clip-path:inset(16% 0 52%)}90%{transform:translate(-47%,1px);clip-path:inset(57% 0 14%)}}
@keyframes johnnyRelicGhostA{0%,8%,76%,100%{opacity:0;transform:translateX(-50%);clip-path:inset(0)}13%,25%{opacity:.55;transform:translateX(-43%);clip-path:polygon(0 8%,100% 4%,100% 29%,0 35%)}33%,47%{opacity:.42;transform:translateX(-56%);clip-path:polygon(0 42%,100% 35%,100% 66%,0 72%)}80%,91%{opacity:.5;transform:translateX(-42%);clip-path:polygon(0 69%,100% 63%,100% 95%,0 100%);filter:hue-rotate(150deg)}}
@keyframes johnnyRelicGhostB{0%,18%,58%,100%{opacity:0;transform:translateX(-50%)}23%,38%{opacity:.38;transform:translateX(-59%);clip-path:polygon(0 0,100% 8%,100% 48%,0 39%);filter:hue-rotate(300deg)}43%,54%{opacity:.3;transform:translateX(-43%);clip-path:polygon(0 57%,100% 49%,100% 100%,0 93%)}}
@keyframes johnnyChromeBody{0%,100%{transform:translateX(-50%)}18%{transform:translate(-53%,1px) rotate(-1deg)}38%,72%{transform:translate(-47%,-2px) rotate(1.5deg) scale(1.018)}84%{transform:translate(-51%,-1px)}}
@keyframes johnnyChromePanel{0%,10%,100%{opacity:0;transform:translateX(9px) scaleX(.4)}22%,78%{opacity:1;transform:none}88%{opacity:.25;transform:translateX(4px)}}
@keyframes johnnyChromeTrace{0%,100%{opacity:.2;transform:scaleX(.25)}50%{opacity:1;transform:scaleX(1.18);filter:brightness(2)}}
@keyframes johnnyChromeOverload{0%,100%{opacity:.3;filter:drop-shadow(0 0 4px #00e5ff)}35%,72%{opacity:1;filter:drop-shadow(0 0 12px #00e5ff) brightness(2.4);transform:scaleX(1.18)}}
@keyframes johnnyDataBody{0%,100%{transform:translateX(-50%)}20%{transform:translate(-53%,1px) rotate(-1deg)}45%,75%{transform:translate(-47%,-2px) rotate(1deg) scale(1.018)}}
@keyframes johnnyDataBreach{0%{opacity:0;transform:translateX(var(--breach-x,-28px)) rotateY(75deg) scale(.45)}28%,68%{opacity:1;transform:none}82%{opacity:.8;transform:translateX(-12px) scale(.72)}100%{opacity:0;transform:translate(35px,-9px) scale(.18)}}
@keyframes johnnyPocketBody{0%,100%{transform:translateX(-50%)}22%{transform:translate(-53%,-1px) rotate(-1deg)}48%,74%{transform:translate(-47%,2px) rotate(1.2deg) scale(.99)}}
@keyframes johnnyShardPocket{0%{opacity:0;transform:translate(45px,-18px) rotateY(80deg) scale(.45)}24%,52%{opacity:1;transform:translate(0,0) rotateY(0) scale(1)}76%{opacity:.9;transform:translate(33px,32px) rotate(18deg) scale(.48)}100%{opacity:0;transform:translate(39px,49px) scale(.1)}}
@keyframes johnnyDataBurnBody{0%,100%{transform:translateX(-50%);filter:none}18%{transform:translate(-54%,1px);filter:contrast(1.35)}38%{transform:translate(-45%,-3px) rotate(2deg) scale(1.035)}56%{transform:translate(-52%,-5px) rotate(-2deg);filter:drop-shadow(0 0 8px #ff3f63)}74%{transform:translate(-47%,-2px) rotate(1deg);filter:drop-shadow(0 0 11px #00e5ff)}88%{transform:translate(-50%,-1px)}}
@keyframes johnnyDataBurn{0%{opacity:0;transform:translateY(-55px) rotateX(70deg) scale(.6)}20%,67%{opacity:1;transform:translateY(0) rotateX(0) scale(1)}42%{filter:hue-rotate(140deg) brightness(1.8)}75%{opacity:.85;transform:translateY(34px) skewX(-15deg) scale(1.2)}100%{opacity:0;transform:translateY(70px) scale(.2)}}
@keyframes johnnyTargetBody{0%,100%{transform:translateX(-50%)}20%{transform:translate(-53%,1px)}42%,75%{transform:translate(-47%,-3px) scale(1.035)}86%{transform:translate(-50%,-1px)}}
@keyframes johnnyTargetHud{0%,100%{opacity:0;transform:scale(1.8) rotate(-35deg)}20%{opacity:.75;transform:scale(1.25) rotate(-12deg)}38%,72%{opacity:1;transform:scale(.72) rotate(0)}84%{opacity:.4;transform:scale(.68) rotate(18deg)}}
@keyframes johnnyOpticLock{0%,100%{opacity:.18;filter:none}28%,76%{opacity:1;transform:scaleX(1.16);filter:drop-shadow(0 0 9px #ff3f63) brightness(2)}}
@keyframes johnnySystemBreak{0%,100%{transform:translateX(-50%);filter:none}13%{transform:translate(-57%,1px) skewX(4deg);filter:contrast(1.6)}23%{transform:translate(-43%,-2px) skewX(-5deg);filter:hue-rotate(155deg)}36%,63%{transform:translate(-51%,3px) rotate(-1deg);filter:saturate(.45) contrast(1.45)}48%{transform:translate(-46%,-3px) rotate(2deg);filter:brightness(1.45)}78%{transform:translate(-54%,1px);filter:contrast(1.7)}90%{transform:translate(-48%,-1px)}}
@keyframes johnnyErrorGhost{0%,100%{opacity:0;transform:translateX(-50%)}14%,31%{opacity:.65;transform:translateX(-61%);clip-path:polygon(0 6%,100% 14%,100% 38%,0 31%);filter:hue-rotate(145deg)}42%,69%{opacity:.42;transform:translateX(-39%);clip-path:polygon(0 47%,100% 39%,100% 78%,0 85%)}78%,90%{opacity:.55;transform:translateX(-57%);clip-path:inset(68% 0 0)}}
@keyframes johnnyErrorPanels{0%,100%{opacity:0;transform:scale(.25) rotate(18deg)}16%,70%{opacity:1;transform:scale(1) rotate(0)}30%,46%,62%{filter:brightness(2);transform:translateX(7px) skewX(-8deg)}38%,54%,68%{transform:translateX(-5px) skewX(6deg)}84%{opacity:.2;transform:translateY(26px) scale(.7)}}
@keyframes johnnyMaterialize{0%{opacity:0;transform:translate(-50%,15px) scale(.82);filter:blur(4px);clip-path:inset(100% 0 0)}18%{opacity:.45;clip-path:inset(72% 0 0)}38%{opacity:.8;transform:translate(-50%,3px) scale(.96);filter:blur(1px);clip-path:inset(42% 0 0)}58%{opacity:1;clip-path:inset(12% 0 0)}72%{transform:translate(-47%,-2px);filter:drop-shadow(-3px 0 #00e5ff) drop-shadow(3px 0 #ff3f63)}86%,100%{opacity:1;transform:translateX(-50%);filter:none;clip-path:inset(0)}}
@keyframes johnnyMaterializeGhost{0%,20%,100%{opacity:0;transform:translateX(-50%)}32%,61%{opacity:.55;transform:translateX(-42%);clip-path:polygon(0 55%,100% 48%,100% 100%,0 100%);filter:hue-rotate(140deg)}67%,82%{opacity:.35;transform:translateX(-57%);clip-path:polygon(0 18%,100% 12%,100% 47%,0 55%)}}
@keyframes johnnyMaterializeStage{0%,100%{opacity:0;transform:scaleY(.05)}22%,68%{opacity:1;transform:scaleY(1.08);filter:drop-shadow(0 0 12px #00e5ff)}82%{opacity:.25;transform:scale(1.2)}}
@keyframes johnnyMalorianInspect{0%,100%{transform:translate(-50%,8px) rotate(3deg) scale(.92);opacity:0}18%{opacity:1;transform:translate(-53%,1px) rotate(-2deg) scale(.99)}38%{transform:translate(-46%,-3px) rotate(2.5deg) scale(1.03)}56%{transform:translate(-52%,-4px) rotate(-1.5deg) scale(1.035);filter:brightness(1.12)}74%{transform:translate(-47%,-2px) rotate(1deg) scale(1.02)}90%{opacity:1;transform:translate(-50%,1px)}}
@keyframes johnnyMalorianSlide{0%,100%{opacity:0;transform:translate(-88%,7px) rotate(5deg) scale(.9)}14%{opacity:1;transform:translate(-73%,1px) rotate(-3deg) scale(.98)}36%{transform:translate(-43%,-4px) rotate(2deg) scale(1.04)}55%,73%{transform:translate(-28%,-6px) rotate(-2deg) scale(1.05)}86%{opacity:1;transform:translate(-47%,-1px)}94%{opacity:.4}}
@keyframes johnnySlideTrail{0%,100%{opacity:0;transform:translateX(-80px) scaleX(.08)}18%,78%{opacity:1;transform:translateX(0) scaleX(1.2);background:linear-gradient(90deg,transparent,#00e5ff,#ff3f63,transparent);box-shadow:0 0 10px #00e5ff,0 -24px #ff3f6355}90%{opacity:.15;transform:translateX(55px) scaleX(.4)}}
@keyframes johnnySamuraiEncore{0%,100%{opacity:0;transform:translate(-50%,12px) rotate(7deg) scale(.9)}12%{opacity:1;transform:translate(-54%,1px) rotate(-3deg) scale(1)}26%{transform:translate(-45%,-5px) rotate(4deg) scale(1.045)}40%{transform:translate(-55%,-7px) rotate(-5deg) scale(1.05)}54%{transform:translate(-44%,-9px) rotate(5deg) scale(1.055)}68%{transform:translate(-54%,-6px) rotate(-4deg) scale(1.045)}82%{transform:translate(-46%,-3px) rotate(3deg) scale(1.025)}92%{opacity:1;transform:translate(-50%,0)}}
@keyframes johnnyEncoreStage{0%,100%{opacity:0;transform:scale(.45)}14%,86%{opacity:1;transform:scale(1.18)}28%,56%{filter:drop-shadow(-10px 0 11px #00e5ff) drop-shadow(10px 0 12px #ff3f63)}42%,72%{filter:drop-shadow(0 0 18px #ffd51c)}}
@keyframes johnnyEncoreLights{0%,100%{opacity:0;transform:translateY(35px) scale(.25)}18%{opacity:.7;transform:translate(-38px,-28px) scale(1.4) rotate(35deg)}38%{opacity:1;transform:translate(34px,-18px) scale(1.8) rotate(120deg)}58%{opacity:.8;transform:translate(-20px,-42px) scale(1.5) rotate(220deg)}78%{opacity:1;transform:translate(28px,-30px) scale(1.7) rotate(310deg)}92%{opacity:.15;transform:translateY(-48px) scale(.6)}}
@keyframes johnnyNightCityWalk{0%,100%{opacity:0;transform:translate(-98%,3px) scale(.9)}10%{opacity:.45;transform:translate(-82%,1px) scale(.94)}26%{opacity:1;transform:translate(-66%,-2px) rotate(-1deg)}44%{transform:translate(-49%,-5px) rotate(1deg) scale(1.03)}62%{transform:translate(-35%,-3px) rotate(-1deg) scale(1.02)}78%{transform:translate(-51%,-4px) rotate(.5deg)}92%{opacity:1;transform:translateX(-50%)}}
@keyframes johnnyWalkGhost{0%,100%{opacity:0;transform:translateX(-90%)}18%,36%{opacity:.32;transform:translateX(-72%);clip-path:inset(0 0 35%)}43%,64%{opacity:.25;transform:translateX(-44%);clip-path:inset(36% 0 18%)}70%,86%{opacity:.18;transform:translateX(-28%);clip-path:inset(70% 0 0)}}

@media(max-width:680px){
  html[data-display-style="neon-grid"] .johnny-cigarette-fx i:nth-child(1){left:56px;top:25px;width:16px}
  html[data-display-style="neon-grid"] .johnny-cigarette-fx i:nth-child(2){left:70px;top:24px}
  html[data-display-style="neon-grid"] .johnny-cigarette-fx i:nth-child(3){left:71px;top:14px}
  html[data-display-style="neon-grid"] .johnny-cigarette-fx i:nth-child(4){left:76px;top:8px}
  html[data-display-style="neon-grid"] .johnny-reticle-fx i:nth-child(1){left:36px;top:6px;width:37px;height:37px}
  html[data-display-style="neon-grid"] .johnny-reticle-fx i:nth-child(2){width:92px}
  html[data-display-style="neon-grid"] .johnny-reticle-fx i:nth-child(3){left:53px;height:68px}
  html[data-display-style="neon-grid"] .johnny-data-fx i{transform:scale(.88)}
}

@media(prefers-reduced-motion:reduce){
  html[data-display-style="neon-grid"] .johnny-photo-fx,
  html[data-display-style="neon-grid"] .johnny-photo-glitch{display:none!important}
  html[data-display-style="neon-grid"] .interface-companion[data-companion-motion] :is(.companion-johnny-photo,.johnny-photo){animation:none!important}
  html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-malorian-check"],[data-companion-motion="neon-dash"]) .johnny-photo-malorian,
  html[data-display-style="neon-grid"] .interface-companion:is([data-companion-motion="johnny-encore"],[data-companion-motion="neon-overclock"]) .johnny-photo-guitar{opacity:1;transform:translateX(-50%)}
}

/* Covert Ops Task Force duo v5.1.0: larger Soap MacTavish + Captain Price window. */
html[data-display-style="covert-ops"] .interface-companion{grid-template-columns:270px minmax(0,1fr);min-height:194px}
html[data-display-style="covert-ops"] .interface-companion::after{content:"TF 141"}
html[data-display-style="covert-ops"] .companion-stage{width:260px!important;height:178px!important}
html[data-display-style="covert-ops"] .companion-sprites{width:254px;height:172px}
html[data-display-style="covert-ops"] .companion-mw-duo{position:relative;width:252px!important;height:172px!important;overflow:visible;isolation:isolate;filter:drop-shadow(0 10px 6px #000c) drop-shadow(0 0 9px #ff7a1a35);animation:mwDuoSettle 3.8s ease-in-out infinite!important}
.mw-photo-viewport{position:absolute;inset:0;z-index:2;overflow:visible}
.mw-operator{position:absolute;bottom:-3px;width:138px;height:181px;transform-origin:50% 90%;will-change:transform,filter,opacity}
.mw-operator img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:contrast(1.08) saturate(.82) brightness(.9)}
.mw-soap{left:4px;z-index:4;transform:translateX(-2px) scale(.96)}
.mw-ghost{left:50%;z-index:2;display:none;transform:translateX(-50%) scale(.94)}
.mw-ghost img{position:absolute;inset:0}
.mw-ghost-rifle{opacity:0}
.mw-price{right:2px;z-index:3;transform:translateX(3px) scale(1.01)}
html[data-display-style="covert-ops"] .interface-companion:not([data-companion-level="1"]):not([data-companion-level="2"]) .mw-ghost{display:block}
.mw-floor-shadow{position:absolute;left:16px;right:14px;bottom:2px;z-index:1;height:12px;border-radius:50%;background:radial-gradient(ellipse,#000d 0 38%,transparent 72%);filter:blur(2px)}
.mw-reticle,.mw-comms-pulse,.mw-breach-flash,.mw-night-vision{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0}
.mw-reticle i{position:absolute;left:50%;top:46%;display:block;background:#ff8b37;box-shadow:0 0 7px #ff7a1a}
.mw-reticle i:nth-child(1){width:48px;height:1px;transform:translate(-50%,-50%)}
.mw-reticle i:nth-child(2){width:1px;height:48px;transform:translate(-50%,-50%)}
.mw-reticle i:nth-child(3){width:34px;height:34px;border:1px solid #ff8b37;border-radius:50%;background:transparent;transform:translate(-50%,-50%)}
.mw-comms-pulse i{position:absolute;right:15px;top:20px;width:18px;height:18px;border:1px solid #ff8b37;border-radius:50%;transform-origin:center}
.mw-comms-pulse i:nth-child(2){animation-delay:.16s}.mw-comms-pulse i:nth-child(3){animation-delay:.32s}
.mw-breach-flash{inset:7px;background:radial-gradient(circle at 54% 47%,#fff 0 6%,#ffb16caa 13%,#ff7a1a24 35%,transparent 62%);mix-blend-mode:screen}
.mw-night-vision{inset:7px;background:radial-gradient(circle at 37% 43%,#8dff814a 0 15%,transparent 34%),radial-gradient(circle at 63% 43%,#8dff814a 0 15%,transparent 34%),linear-gradient(#69ff6d0c,#0a160cf0);box-shadow:inset 0 0 24px #55ff5b38;mix-blend-mode:screen}

html[data-display-style="covert-ops"] .interface-companion[data-companion-state="typing"] .companion-mw-duo,
html[data-display-style="covert-ops"] .interface-companion[data-companion-state="scanning"] .companion-mw-duo,
html[data-display-style="covert-ops"] .interface-companion[data-companion-state="success"] .companion-mw-duo,
html[data-display-style="covert-ops"] .interface-companion[data-companion-state="error"] .companion-mw-duo,
html[data-display-style="covert-ops"] .interface-companion[data-companion-state="copied"] .companion-mw-duo,
html[data-display-style="covert-ops"] .interface-companion[data-companion-state="style"] .companion-mw-duo,
html[data-display-style="covert-ops"] .interface-companion[data-companion-state="greet"] .companion-mw-duo{animation:mwDuoSettle 3.8s ease-in-out infinite!important}
html[data-display-style="covert-ops"] .interface-companion.is-ambient .mw-soap{animation:mwSoapIdle 4.2s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion.is-ambient .mw-ghost{animation:mwGhostIdle 4.6s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion.is-ambient .mw-price{animation:mwPriceIdle 4.2s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion:is([data-companion-motion="mw-ghost-arrival"],[data-companion-level="3"][data-companion-motion="rank-levelup"]) .mw-ghost{display:block;animation:mwGhostArrival 4.1s cubic-bezier(.16,.8,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion:is([data-companion-motion="mw-ghost-arrival"],[data-companion-level="3"][data-companion-motion="rank-levelup"]) .mw-ghost-idle{animation:mwGhostIdleFade 4.1s ease-out both}
html[data-display-style="covert-ops"] .interface-companion:is([data-companion-motion="mw-ghost-arrival"],[data-companion-level="3"][data-companion-motion="rank-levelup"]) .mw-ghost-rifle{animation:mwGhostRifleReveal 4.1s ease-out both}

html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-perimeter"] .mw-soap{animation:mwPerimeterSoap 3.25s cubic-bezier(.22,.75,.23,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-perimeter"] .mw-price{animation:mwPerimeterPrice 3.25s cubic-bezier(.22,.75,.23,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-comms-check"] :is(.mw-soap,.mw-price){animation:mwCommsCheck 3.1s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-comms-check"] .mw-comms-pulse{opacity:1}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-comms-check"] .mw-comms-pulse i{animation:mwCommsRing 1.15s ease-out 2 both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-rifle-check"] .mw-soap{animation:mwRifleCheckSoap 3.2s cubic-bezier(.18,.72,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-rifle-check"] .mw-price{animation:mwRifleCheckPrice 3.2s cubic-bezier(.18,.72,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-banter"] .mw-soap{animation:mwBanterSoap 3.4s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-banter"] .mw-price{animation:mwBanterPrice 3.4s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-intel-pass"] .mw-soap{animation:mwIntelSoap 3.3s cubic-bezier(.2,.72,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-intel-pass"] .mw-price{animation:mwIntelPrice 3.3s cubic-bezier(.2,.72,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-dossier"] :is(.mw-soap,.mw-price){animation:mwDossierReview 3.2s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-target-lock"] .mw-soap{animation:mwTargetSoap 3.15s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-target-lock"] .mw-price{animation:mwTargetPrice 3.15s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-target-lock"] .mw-reticle{opacity:1;animation:mwReticleLock 2.8s cubic-bezier(.16,.8,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-overwatch"] .mw-soap{animation:mwOverwatchSoap 3.35s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-overwatch"] .mw-price{animation:mwOverwatchPrice 3.35s cubic-bezier(.18,.74,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-hand-signal"] .mw-soap{animation:mwSignalSoap 3.1s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-hand-signal"] .mw-price{animation:mwSignalPrice 3.1s cubic-bezier(.16,.78,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-area-clear"] .mw-soap{animation:mwClearSoap 3.2s cubic-bezier(.2,.76,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-area-clear"] .mw-price{animation:mwClearPrice 3.2s cubic-bezier(.2,.76,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-rifle-ready"] :is(.mw-soap,.mw-price){animation:mwRifleReady 3.15s cubic-bezier(.17,.79,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-clean-exfil"] .mw-soap{animation:mwExfilSoap 3.45s cubic-bezier(.18,.76,.24,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-clean-exfil"] .mw-price{animation:mwExfilPrice 3.45s cubic-bezier(.18,.76,.24,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-no-contact"] :is(.mw-soap,.mw-price){animation:mwNoContact 3.15s ease-in-out both;filter:grayscale(.32) brightness(.72)}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-intel-secure"] .mw-soap{animation:mwSecureSoap 3.2s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-intel-secure"] .mw-price{animation:mwSecurePrice 3.2s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-deploy"] .mw-soap{animation:mwDeploySoap 3.45s cubic-bezier(.12,.84,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-deploy"] .mw-price{animation:mwDeployPrice 3.45s cubic-bezier(.12,.84,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-going-dark"] :is(.mw-soap,.mw-price){animation:mwGoingDark 3.55s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-going-dark"] .mw-night-vision{animation:mwNightVision 3.55s ease-in-out both}

html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-breach-stack"] .mw-soap{animation:mwBreachStackSoap 3.7s cubic-bezier(.17,.79,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-breach-stack"] .mw-price{animation:mwBreachStackPrice 3.7s cubic-bezier(.17,.79,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-cover-swap"] .mw-soap{animation:mwCoverSwapSoap 3.7s cubic-bezier(.17,.79,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-cover-swap"] .mw-price{animation:mwCoverSwapPrice 3.7s cubic-bezier(.17,.79,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-patrol-cross"] .mw-soap{animation:mwPatrolSoap 3.8s cubic-bezier(.18,.74,.24,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-patrol-cross"] .mw-price{animation:mwPatrolPrice 3.8s cubic-bezier(.18,.74,.24,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-rooftop-overwatch"] .mw-soap{animation:mwRoofSoap 3.8s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-rooftop-overwatch"] .mw-price{animation:mwRoofPrice 3.8s cubic-bezier(.18,.76,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-breach-clear"] .mw-soap,
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-breach-sync"] .mw-soap{animation:mwBreachClearSoap 3.9s cubic-bezier(.16,.8,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-breach-clear"] .mw-price,
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-breach-sync"] .mw-price{animation:mwBreachClearPrice 3.9s cubic-bezier(.16,.8,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion:is([data-companion-motion="mw-breach-clear"],[data-companion-motion="mw-breach-sync"]) .mw-breach-flash{animation:mwBreachFlash 3.9s ease-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-price-callout"] .mw-price{animation:mwPriceCallout 3.7s cubic-bezier(.16,.78,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-price-callout"] .mw-soap{animation:mwSoapAcknowledge 3.7s ease-in-out both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-soap-reply"] .mw-soap{animation:mwSoapReply 3.7s cubic-bezier(.18,.76,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-soap-reply"] .mw-price{animation:mwPriceReaction 3.7s ease-in-out both}
.mw-ship-exfil{position:absolute;inset:2px -4px 0;z-index:0;overflow:hidden;border:1px solid #7d8485;background:linear-gradient(168deg,#11181c 0 48%,#080b0d 49% 100%);clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px);opacity:0;pointer-events:none}
.mw-ship-exfil::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 31px,#9da4a51a 32px 33px),linear-gradient(110deg,transparent 0 44%,#ff4a191f 45% 47%,transparent 48%);transform-origin:center bottom}
.mw-ship-deck{position:absolute;left:-12%;right:-12%;bottom:14px;height:26px;border-top:2px solid #9aa1a2;background:repeating-linear-gradient(90deg,#22292c 0 20px,#171c1f 21px 40px);box-shadow:0 -3px 9px #000a;transform-origin:50% 100%}
.mw-ship-alarm{position:absolute;top:12px;width:10px;height:10px;border-radius:50%;background:#ff351c;box-shadow:0 0 5px 2px #ff351c,0 0 20px 7px #ff351c66;opacity:0}.mw-ship-alarm-a{left:26px}.mw-ship-alarm-b{right:32px}
.mw-ship-sparks{position:absolute;right:38px;top:26px;width:2px;height:2px}.mw-ship-sparks i{position:absolute;width:2px;height:16px;background:linear-gradient(#fff7bc,#ff8a2a,transparent);transform-origin:center top;opacity:0}.mw-ship-sparks i:nth-child(2){transform:rotate(34deg)}.mw-ship-sparks i:nth-child(3){transform:rotate(-42deg)}.mw-ship-sparks i:nth-child(4){transform:rotate(76deg)}
.mw-ship-water{position:absolute;left:-10%;right:-10%;bottom:-18px;height:42px;background:linear-gradient(#90c6d65c,#102e3cdd 35%,#07131be8);opacity:0}.mw-ship-water i{position:absolute;left:0;right:0;top:2px;height:2px;background:repeating-linear-gradient(90deg,transparent 0 18px,#d7f5ff99 19px 29px,transparent 30px 47px)}.mw-ship-water i:nth-child(2){top:10px;transform:translateX(-19px);opacity:.55}
.mw-exfil-heli{position:absolute;right:-92px;top:21px;width:70px;height:25px;border-radius:44% 48% 28% 34%;background:#0a0d0e;box-shadow:inset 12px 4px #20282b,0 3px 8px #000;opacity:0}.mw-exfil-heli::before{content:"";position:absolute;right:61px;top:8px;width:40px;height:6px;background:#0a0d0e;transform:skewY(-7deg)}.mw-exfil-heli::after{content:"";position:absolute;left:30px;bottom:-12px;width:3px;height:14px;background:#0a0d0e;box-shadow:18px 0 #0a0d0e}.mw-heli-rotor{position:absolute;left:-19px;top:-5px;width:108px;height:2px;background:#161c1e;transform-origin:55% 50%}.mw-heli-tail{position:absolute;right:65px;top:-3px;width:2px;height:20px;background:#171d1f;transform-origin:center}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-ship-exfil{animation:mwShipExfilScene 6.8s linear both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-ship-deck{animation:mwShipDeckList 6.8s cubic-bezier(.38,.05,.55,.95) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-ship-alarm{animation:mwShipAlarm 6.8s steps(2,end) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-ship-sparks i{animation:mwShipSparks 1.05s ease-out 2.2s 3 both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-ship-water{animation:mwShipWater 6.8s ease-in both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-exfil-heli{animation:mwHeliApproach 6.8s cubic-bezier(.2,.72,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-heli-rotor{animation:mwHeliRotor .12s linear 1.5s infinite}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-heli-tail{animation:mwHeliTail .16s linear 1.5s infinite}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-price{animation:mwPriceLeaving 6.8s cubic-bezier(.16,.78,.2,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-soap{animation:mwSoapLeaving 6.8s cubic-bezier(.18,.76,.22,1) both}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-ghost{display:none}
html[data-display-style="covert-ops"] .interface-companion[data-companion-motion="mw-we-are-leaving"] .mw-breach-flash{animation:mwExtractionFlash 6.8s ease-out both}

@keyframes mwDuoSettle{0%,100%{transform:translateY(0)}45%,58%{transform:translateY(-1.8px)}}
@keyframes mwGhostIdle{0%,100%{transform:translateX(-50%) scale(.94)}45%{transform:translate(-50%,-2px) rotate(-.5deg) scale(.945)}72%{transform:translate(-50%,-1px) rotate(.4deg) scale(.94)}}
@keyframes mwGhostArrival{0%{opacity:0;transform:translate(-50%,22px) scale(.72);filter:blur(5px) brightness(.35)}22%{opacity:.35;transform:translate(-50%,8px) scale(.86);filter:blur(2px) brightness(.62)}48%{opacity:1;transform:translate(-50%,-8px) scale(1.02);filter:drop-shadow(0 0 13px #ff7a1a) brightness(1.12)}72%{transform:translate(-50%,-2px) scale(.96)}100%{opacity:1;transform:translateX(-50%) scale(.94);filter:none}}
@keyframes mwGhostIdleFade{0%,36%{opacity:0}56%,100%{opacity:1}}
@keyframes mwGhostRifleReveal{0%,38%{opacity:0}52%,78%{opacity:1;filter:brightness(1.18) drop-shadow(0 0 7px #ff7a1a)}100%{opacity:0}}
@keyframes mwSoapIdle{0%,100%{transform:translateX(-2px) scale(.96)}42%{transform:translate(-5px,-2px) rotate(-1.2deg) scale(.965)}72%{transform:translate(0,-1px) rotate(.7deg) scale(.96)}}
@keyframes mwPriceIdle{0%,100%{transform:translateX(3px) scale(1.01)}36%{transform:translate(5px,-1px) rotate(.8deg) scale(1.015)}68%{transform:translate(1px,-2px) rotate(-.6deg) scale(1.01)}}
@keyframes mwPerimeterSoap{0%,100%{transform:translateX(-2px) scale(.96)}20%{transform:translate(-15px,1px) rotate(-3deg) scale(.94)}48%{transform:translate(-5px,-3px) rotate(2deg) scale(.98)}72%{transform:translate(10px,-1px) rotate(3deg) scale(.965)}}
@keyframes mwPerimeterPrice{0%,100%{transform:translateX(3px) scale(1.01)}22%{transform:translate(9px,-2px) rotate(2deg) scale(1.02)}49%{transform:translate(2px,-4px) rotate(-2.5deg) scale(1.03)}76%{transform:translate(-8px,-1px) rotate(-1deg) scale(1.01)}}
@keyframes mwCommsCheck{0%,100%{filter:none}22%{transform:translateY(-2px) rotate(-1deg)}42%,68%{transform:translateY(-4px) scale(1.025);filter:brightness(1.13)}82%{transform:translateY(-1px)}}
@keyframes mwCommsRing{0%{opacity:.8;transform:scale(.2)}80%{opacity:.08;transform:scale(2.8)}100%{opacity:0;transform:scale(3.2)}}
@keyframes mwRifleCheckSoap{0%,100%{transform:translateX(-2px) scale(.96)}18%{transform:translate(-5px,-3px) rotate(-3deg) scale(.98)}38%{transform:translate(2px,-7px) rotate(4deg) scale(1.03)}62%{transform:translate(-1px,-5px) rotate(-2deg) scale(1.015)}82%{transform:translate(-4px,-1px) rotate(1deg) scale(.98)}}
@keyframes mwRifleCheckPrice{0%,100%{transform:translateX(3px) scale(1.01)}20%,44%{transform:translate(7px,-2px) rotate(2deg) scale(1.015)}64%{transform:translate(3px,-4px) rotate(-1deg) scale(1.025)}84%{transform:translate(1px,-1px) scale(1.01)}}
@keyframes mwBanterSoap{0%,100%{transform:translateX(-2px) scale(.96)}24%,55%{transform:translate(8px,-2px) rotate(3deg) scale(.98)}72%{transform:translate(5px,-4px) rotate(-2deg) scale(.985)}}
@keyframes mwBanterPrice{0%,100%{transform:translateX(3px) scale(1.01)}26%,58%{transform:translate(-7px,-1px) rotate(-2deg) scale(1.02)}76%{transform:translate(-4px,-3px) rotate(1deg) scale(1.025)}}
@keyframes mwIntelSoap{0%,100%{transform:translateX(-2px) scale(.96)}18%{transform:translate(-9px,-2px) scale(.95)}42%,62%{transform:translate(13px,-7px) rotate(4deg) scale(1.01)}82%{transform:translate(4px,-2px) rotate(-1deg) scale(.98)}}
@keyframes mwIntelPrice{0%,100%{transform:translateX(3px) scale(1.01)}20%{transform:translate(10px,-1px) scale(1.005)}44%,64%{transform:translate(-12px,-5px) rotate(-3deg) scale(1.04)}84%{transform:translate(-2px,-2px) scale(1.02)}}
@keyframes mwDossierReview{0%,100%{transform:none}28%,68%{transform:translateY(4px) scale(.98);filter:brightness(.9)}48%{transform:translateY(5px) rotate(-1deg) scale(.985)}}
@keyframes mwTargetSoap{0%,100%{transform:translateX(-2px) scale(.96)}24%,72%{transform:translate(-10px,-7px) rotate(-4deg) scale(1.04);filter:contrast(1.12) brightness(1.05)}}
@keyframes mwTargetPrice{0%,100%{transform:translateX(3px) scale(1.01)}24%,72%{transform:translate(9px,-8px) rotate(3deg) scale(1.06);filter:contrast(1.12) brightness(1.06)}}
@keyframes mwReticleLock{0%,100%{opacity:0;transform:translate(42px,-22px) scale(2.2) rotate(-18deg)}18%{opacity:.35}44%,74%{opacity:.9;transform:translate(0) scale(.72) rotate(0)}86%{opacity:.22;transform:scale(.68)}}
@keyframes mwOverwatchSoap{0%,100%{transform:translateX(-2px) scale(.96)}24%,75%{transform:translate(-17px,7px) rotate(-4deg) scale(.9);filter:brightness(.76)}}
@keyframes mwOverwatchPrice{0%,100%{transform:translateX(3px) scale(1.01)}18%{transform:translate(8px,-4px) rotate(2deg) scale(1.04)}38%,74%{transform:translate(15px,-13px) rotate(5deg) scale(1.1);filter:contrast(1.18) brightness(1.08)}86%{transform:translate(7px,-3px) scale(1.03)}}
@keyframes mwSignalSoap{0%,100%{transform:translateX(-2px) scale(.96)}25%,72%{transform:translate(-8px,3px) rotate(-2deg) scale(.94)}}
@keyframes mwSignalPrice{0%,100%{transform:translateX(3px) scale(1.01)}18%{transform:translate(5px,-3px) rotate(-2deg) scale(1.03)}36%,68%{transform:translate(-6px,-11px) rotate(-7deg) scale(1.08)}84%{transform:translate(1px,-2px) rotate(1deg) scale(1.02)}}
@keyframes mwClearSoap{0%,100%{transform:translateX(-2px) scale(.96)}18%{transform:translate(-16px,-2px) rotate(-4deg) scale(.95)}40%,65%{transform:translate(-3px,-10px) rotate(5deg) scale(1.05)}82%{transform:translate(4px,-3px) scale(.99)}}
@keyframes mwClearPrice{0%,100%{transform:translateX(3px) scale(1.01)}20%{transform:translate(15px,-3px) rotate(4deg) scale(1.01)}43%,67%{transform:translate(2px,-11px) rotate(-4deg) scale(1.08)}84%{transform:translate(-3px,-3px) scale(1.03)}}
@keyframes mwRifleReady{0%,100%{transform:none}18%{transform:translateY(1px) scale(.98)}42%,72%{transform:translateY(-8px) scale(1.07);filter:contrast(1.12) brightness(1.1)}88%{transform:translateY(-2px) scale(1.02)}}
@keyframes mwExfilSoap{0%,100%{opacity:1;transform:translateX(-2px) scale(.96)}18%{transform:translate(-12px,-3px) scale(.98)}62%{opacity:1;transform:translate(24px,-5px) rotate(4deg) scale(1.03)}86%{opacity:0;transform:translate(92px,-3px) scale(.92)}}
@keyframes mwExfilPrice{0%,100%{opacity:1;transform:translateX(3px) scale(1.01)}22%{transform:translate(10px,-3px) scale(1.03)}66%{opacity:1;transform:translate(38px,-4px) rotate(3deg) scale(1.04)}90%{opacity:0;transform:translate(105px,-2px) scale(.94)}}
@keyframes mwNoContact{0%,100%{transform:none}24%{transform:translate(-4px,2px) rotate(-2deg)}48%{transform:translate(4px,3px) rotate(2deg)}72%{transform:translateY(4px) scale(.96)}}
@keyframes mwSecureSoap{0%,100%{transform:translateX(-2px) scale(.96)}24%,66%{transform:translate(9px,-5px) rotate(3deg) scale(1.02)}82%{transform:translate(2px,-2px) scale(.98)}}
@keyframes mwSecurePrice{0%,100%{transform:translateX(3px) scale(1.01)}26%,68%{transform:translate(-9px,-4px) rotate(-2deg) scale(1.05)}84%{transform:translate(-1px,-1px) scale(1.02)}}
@keyframes mwDeploySoap{0%{opacity:0;transform:translate(-96px,8px) scale(.84);filter:blur(3px)}28%{opacity:1;transform:translate(-18px,-3px) scale(1.02)}54%{transform:translate(5px,-7px) rotate(3deg) scale(1.05)}78%{transform:translate(-4px,-2px) scale(.98)}100%{opacity:1;transform:translateX(-2px) scale(.96);filter:none}}
@keyframes mwDeployPrice{0%{opacity:0;transform:translate(104px,8px) scale(.86);filter:blur(3px)}32%{opacity:1;transform:translate(22px,-3px) scale(1.06)}58%{transform:translate(-6px,-8px) rotate(-3deg) scale(1.1)}80%{transform:translate(5px,-2px) scale(1.03)}100%{opacity:1;transform:translateX(3px) scale(1.01);filter:none}}
@keyframes mwGoingDark{0%,100%{filter:none}18%{transform:translateY(-2px)}38%,76%{transform:translateY(-5px) scale(1.035);filter:grayscale(.3) sepia(.25) hue-rotate(65deg) brightness(.72) contrast(1.25)}88%{transform:translateY(-1px)}}
@keyframes mwNightVision{0%,100%{opacity:0}24%{opacity:.18}40%,76%{opacity:.82}88%{opacity:.12}}
@keyframes mwBreachStackSoap{0%,100%{transform:translateX(-2px) scale(.96)}16%{transform:translate(-24px,3px) scale(.92)}36%,58%{transform:translate(18px,-5px) rotate(3deg) scale(1.02)}70%{transform:translate(43px,-10px) rotate(5deg) scale(1.07)}86%{transform:translate(5px,-2px) scale(.98)}}
@keyframes mwBreachStackPrice{0%,100%{transform:translateX(3px) scale(1.01)}18%{transform:translate(-2px,5px) scale(.95)}40%,60%{transform:translate(30px,-2px) rotate(2deg) scale(1.01)}72%{transform:translate(52px,-8px) rotate(4deg) scale(1.07)}88%{transform:translate(7px,-1px) scale(1.02)}}
@keyframes mwCoverSwapSoap{0%,100%{transform:translateX(-2px) scale(.96);z-index:3}18%{transform:translate(-20px,5px) scale(.9)}42%{transform:translate(44px,-8px) rotate(6deg) scale(1.05)}62%{transform:translate(72px,-4px) rotate(3deg) scale(1.01);z-index:2}82%{transform:translate(12px,-2px) scale(.98)}}
@keyframes mwCoverSwapPrice{0%,100%{transform:translateX(3px) scale(1.01);z-index:2}20%{transform:translate(18px,-6px) rotate(4deg) scale(1.05)}46%{transform:translate(-48px,3px) rotate(-5deg) scale(.96)}66%{transform:translate(-68px,-3px) rotate(-2deg) scale(1.02);z-index:4}84%{transform:translate(-6px,-1px) scale(1.02)}}
@keyframes mwPatrolSoap{0%{opacity:0;transform:translate(-105px,5px) scale(.88)}18%{opacity:1;transform:translate(-54px,-1px) scale(.94)}42%{transform:translate(-6px,-7px) rotate(3deg) scale(1.01)}66%{transform:translate(52px,-4px) rotate(2deg) scale(1.03)}86%{opacity:0;transform:translate(112px,2px) scale(.9)}100%{opacity:1;transform:translateX(-2px) scale(.96)}}
@keyframes mwPatrolPrice{0%{opacity:0;transform:translate(-130px,6px) scale(.9)}24%{opacity:1;transform:translate(-72px,0) scale(.97)}48%{transform:translate(-17px,-6px) rotate(2deg) scale(1.03)}72%{transform:translate(42px,-3px) rotate(2deg) scale(1.04)}90%{opacity:0;transform:translate(108px,3px) scale(.91)}100%{opacity:1;transform:translateX(3px) scale(1.01)}}
@keyframes mwRoofSoap{0%,100%{transform:translateX(-2px) scale(.96)}22%,76%{transform:translate(-28px,12px) rotate(-3deg) scale(.84);filter:brightness(.68)}}
@keyframes mwRoofPrice{0%,100%{transform:translateX(3px) scale(1.01)}18%{transform:translate(15px,-8px) scale(1.05)}38%,72%{transform:translate(21px,-24px) rotate(4deg) scale(1.16);filter:contrast(1.2) brightness(1.08)}88%{transform:translate(7px,-4px) scale(1.04)}}
@keyframes mwBreachClearSoap{0%,100%{transform:translateX(-2px) scale(.96)}14%{transform:translate(-35px,5px) scale(.89)}34%{transform:translate(-3px,-8px) rotate(4deg) scale(1.05)}49%{transform:translate(35px,-14px) rotate(7deg) scale(1.12);filter:brightness(1.35)}70%{transform:translate(54px,-6px) rotate(3deg) scale(1.06)}87%{transform:translate(4px,-2px) scale(.99)}}
@keyframes mwBreachClearPrice{0%,100%{transform:translateX(3px) scale(1.01)}17%{transform:translate(-12px,5px) scale(.92)}38%{transform:translate(15px,-6px) rotate(3deg) scale(1.05)}53%{transform:translate(47px,-12px) rotate(6deg) scale(1.13);filter:brightness(1.3)}73%{transform:translate(63px,-4px) rotate(2deg) scale(1.07)}89%{transform:translate(7px,-2px) scale(1.02)}}
@keyframes mwBreachFlash{0%,38%,100%{opacity:0}44%{opacity:.95}50%{opacity:.18}57%{opacity:.52}66%{opacity:0}}
@keyframes mwPriceCallout{0%,100%{transform:translateX(3px) scale(1.01)}18%{transform:translate(4px,-3px) scale(1.03)}38%,68%{transform:translate(-12px,-10px) rotate(-6deg) scale(1.09)}84%{transform:translate(-2px,-2px) scale(1.03)}}
@keyframes mwSoapAcknowledge{0%,100%{transform:translateX(-2px) scale(.96)}24%,68%{transform:translate(5px,-2px) rotate(3deg) scale(.98)}78%{transform:translate(3px,1px) rotate(-1deg) scale(.96)}}
@keyframes mwSoapReply{0%,100%{transform:translateX(-2px) scale(.96)}18%{transform:translate(-4px,-3px) scale(.98)}38%,68%{transform:translate(11px,-9px) rotate(6deg) scale(1.05)}84%{transform:translate(2px,-2px) scale(.99)}}
@keyframes mwPriceReaction{0%,100%{transform:translateX(3px) scale(1.01)}26%,70%{transform:translate(-6px,-2px) rotate(-3deg) scale(1.03)}80%{transform:translate(-2px,1px) rotate(1deg) scale(1.01)}}
@keyframes mwPriceLeaving{0%,100%{opacity:1;transform:translateX(3px) scale(1.01)}8%{transform:translate(-7px,-3px) rotate(-3deg) scale(1.03)}20%{transform:translate(-18px,-8px) rotate(-7deg) scale(1.07)}34%{transform:translate(7px,-4px) rotate(6deg) scale(1.04)}49%{transform:translate(38px,-6px) rotate(-6deg) scale(1.02)}60%,68%{transform:translate(54px,-14px) rotate(-12deg) scale(1.08);filter:brightness(1.15)}76%{transform:translate(82px,-23px) rotate(4deg) scale(.98)}88%{opacity:1;transform:translate(118px,-44px) rotate(2deg) scale(.84)}96%{opacity:0;transform:translate(155px,-72px) scale(.72)}}
@keyframes mwSoapLeaving{0%,100%{opacity:1;transform:translateX(-2px) scale(.96)}12%{transform:translate(-14px,3px) rotate(-5deg) scale(.92)}25%{transform:translate(3px,-5px) rotate(7deg) scale(1)}40%{transform:translate(28px,0) rotate(-8deg) scale(.97)}54%{transform:translate(50px,-8px) rotate(8deg) scale(1.01)}66%{transform:translate(69px,4px) rotate(-13deg) scale(.94)}76%{transform:translate(93px,-18px) rotate(10deg) scale(.9)}86%{opacity:1;transform:translate(123px,-42px) rotate(4deg) scale(.8)}96%{opacity:0;transform:translate(158px,-70px) scale(.68)}}
@keyframes mwShipExfilScene{0%,3%,100%{opacity:0}6%,92%{opacity:1}96%{opacity:.25}}
@keyframes mwShipDeckList{0%,8%{transform:rotate(0)}24%{transform:rotate(-4deg) translateY(2px)}42%{transform:rotate(5deg) translateY(5px)}60%{transform:rotate(-9deg) translateY(8px)}78%,100%{transform:rotate(-14deg) translateY(13px)}}
@keyframes mwShipAlarm{0%,7%,100%{opacity:0}9%,18%,27%,36%,45%,54%,63%{opacity:1}14%,23%,32%,41%,50%,59%,68%{opacity:.08}}
@keyframes mwShipSparks{0%{opacity:0;transform:translate(0) scaleY(.2)}18%{opacity:1}100%{opacity:0;transform:translate(-14px,44px) scaleY(1.35)}}
@keyframes mwShipWater{0%,26%{opacity:0;transform:translateY(30px)}48%{opacity:.5;transform:translateY(17px)}72%{opacity:.85;transform:translateY(6px)}100%{opacity:1;transform:translateY(-3px)}}
@keyframes mwHeliApproach{0%,22%{opacity:0;transform:translate(0,-12px) scale(.72)}36%{opacity:.5;transform:translate(-32px,-5px) scale(.8)}54%{opacity:1;transform:translate(-82px,2px) scale(.92)}76%,88%{opacity:1;transform:translate(-112px,6px) scale(1)}100%{opacity:0;transform:translate(-154px,-32px) scale(.88)}}
@keyframes mwHeliRotor{to{transform:rotateY(180deg) scaleX(.2)}}
@keyframes mwHeliTail{to{transform:rotate(180deg)}}
@keyframes mwExtractionFlash{0%,15%,100%{opacity:0}18%{opacity:.78;transform:scale(.82)}22%{opacity:.12;transform:scale(1.08)}39%{opacity:.55;transform:scale(1.18)}43%{opacity:.06}72%{opacity:.72;transform:scale(1.28)}77%{opacity:.08;transform:scale(1.38)}}

@media(max-width:680px){
  html[data-display-style="covert-ops"] .interface-companion{grid-template-columns:1fr;gap:5px;padding:9px 10px 10px}
  html[data-display-style="covert-ops"] .companion-stage{justify-self:center;width:246px!important;height:174px!important}
  html[data-display-style="covert-ops"] .companion-sprites{width:240px;height:168px}
  html[data-display-style="covert-ops"] .companion-mw-duo{width:238px!important;height:168px!important}
  html[data-display-style="covert-ops"] .companion-dialogue{width:100%}
  .mw-operator{width:130px;height:171px}
}
@media(prefers-reduced-motion:reduce){
  html[data-display-style="covert-ops"] .companion-mw-duo,
  html[data-display-style="covert-ops"] .mw-operator,
  html[data-display-style="covert-ops"] :is(.mw-reticle,.mw-comms-pulse,.mw-breach-flash,.mw-night-vision){animation:none!important}
  html[data-display-style="covert-ops"] .mw-soap{transform:translateX(-2px) scale(.96)!important}
  html[data-display-style="covert-ops"] .mw-price{transform:translateX(3px) scale(1.01)!important}
}


/* Standard interface: minimal progression only.
   Existing XP, levels and account stats remain untouched; character/music UI is hidden. */
html[data-display-style="standard"] .interface-companion{
  grid-template-columns:1fr;
}
html[data-display-style="standard"] .interface-companion .companion-stage,
html[data-display-style="standard"] .interface-companion .companion-role,
html[data-display-style="standard"] .interface-companion .companion-status,
html[data-display-style="standard"] .interface-companion .companion-moves,
html[data-display-style="standard"] .interface-companion .companion-loadout,
html[data-display-style="standard"] .interface-companion .theme-music-player{
  display:none!important;
}
html[data-display-style="standard"] .interface-companion .companion-dialogue{
  width:100%;
}
html[data-display-style="standard"] .interface-companion .companion-progress{
  margin-top:0;
}