﻿/* =========================================================
   PROTOSS THEME 鈥?void, gold filigree, psi crystal
   Original UI artwork inspired by the Protoss aesthetic.
   No Blizzard game assets are used.
   ========================================================= */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) {
  color-scheme: dark;
  --canvas: #04070f;
  --canvas-deep: #070d18;
  --paper: #0a1321;
  --paper-warm: #0d192a;
  --paper-deep: #07101c;
  --ink: #e8eef8;
  --ink-soft: #cedaea;
  --muted: #8c9bb0;
  --faint: #5d6f86;
  --line: rgba(207, 174, 104, .24);
  --line-strong: rgba(218, 185, 118, .46);
  --accent: #d7b46b;
  --accent-deep: #f0d28c;
  --accent-soft: rgba(215, 180, 107, .12);
  --olive: #70c9d8;
  --olive-soft: rgba(112, 201, 216, .1);
  --gold: #d7b46b;
  --psi: #66d8ff;
  --psi-soft: rgba(102, 216, 255, .12);
  --danger: #d37878;
  --shadow-sm: 0 0 0 1px rgba(218, 185, 118, .08), 0 10px 26px -18px #000;
  --shadow-md: 0 0 0 1px rgba(218, 185, 118, .08), 0 22px 48px -26px #000;
  --shadow-lg: 0 0 0 1px rgba(218, 185, 118, .1), 0 35px 80px -36px #000;
  --serif: "Outfit", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --sans: "Outfit", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --radius: 3px;
  --ease: cubic-bezier(.22, 1, .36, 1);
  background: #04070f;
}

:is(html[data-theme="protoss"], html[data-theme="aiur"]) body {
  color: var(--ink);
  background:
    radial-gradient(900px 650px at 82% 2%, rgba(34, 108, 139, .2), transparent 64%),
    radial-gradient(760px 560px at 3% 92%, rgba(139, 101, 42, .11), transparent 60%),
    radial-gradient(1000px 700px at 50% 120%, rgba(20, 63, 88, .14), transparent 65%),
    linear-gradient(150deg, #03060d 0%, #060c16 46%, #03060d 100%);
  background-attachment: fixed;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) body::before {
  content: "";
  display: block;
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .34;
  background-image:
    radial-gradient(circle, rgba(231, 246, 255, .9) .7px, transparent 1.1px),
    radial-gradient(circle, rgba(117, 211, 241, .7) .6px, transparent 1px),
    radial-gradient(circle, rgba(227, 198, 126, .55) .5px, transparent .9px);
  background-size: 230px 190px, 340px 280px, 460px 370px;
  background-position: 0 0, 70px 120px, 200px 40px;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .app-shell { position: relative; z-index: 1; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) ::selection { color: #070b12; background: #d7b46b; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) :focus-visible { outline-color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .skip-link { color: #070b12; background: var(--accent); border-radius: 2px; }

/* ---------- header ---------- */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) .site-header {
  border-bottom-color: var(--line);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .brand-mark {
  color: var(--accent-deep);
  background:
    radial-gradient(circle at 32% 25%, rgba(255, 255, 255, .16), transparent 35%),
    linear-gradient(145deg, #122238, #070d17);
  border: 1px solid var(--line-strong);
  border-radius: 2px;
  clip-path: polygon(50% 0, 100% 24%, 100% 76%, 50% 100%, 0 76%, 0 24%);
  box-shadow: 0 0 18px rgba(102, 216, 255, .12), inset 0 0 14px rgba(215, 180, 107, .08);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .brand:hover .brand-mark {
  color: #fff2cc;
  background: linear-gradient(145deg, #193551, #0a121f);
  transform: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .brand-name {
  color: var(--ink);
  letter-spacing: .045em;
  text-transform: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .brand-sub {
  color: var(--psi);
  letter-spacing: .2em;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .main-nav {
  padding: 4px;
  background: rgba(7, 15, 26, .86);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: 0 0 24px rgba(0, 0, 0, .28), inset 0 0 0 1px rgba(102, 216, 255, .03);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .nav-link {
  color: var(--muted);
  border-radius: 1px;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .nav-link:hover {
  color: var(--accent-deep);
  background: rgba(215, 180, 107, .08);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .nav-link.is-active,
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .nav-link.is-active:hover {
  color: #080b12;
  background: linear-gradient(135deg, #f0d28c, #b88a3d);
  box-shadow: 0 0 18px rgba(215, 180, 107, .25), inset 0 1px 0 rgba(255, 255, 255, .35);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .avatar-nav {
  background: linear-gradient(145deg, #77d9f4, #1b6b8a);
  border-color: rgba(240, 210, 140, .7);
  box-shadow: 0 0 10px rgba(102, 216, 255, .3);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .header-note {
  color: var(--faint);
  background: rgba(7, 15, 26, .72);
  border-color: var(--line);
  border-radius: 2px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .header-note::before {
  background: var(--psi);
  box-shadow: 0 0 0 3px rgba(102, 216, 255, .12), 0 0 8px var(--psi);
}

/* ---------- common ---------- */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) .page-footer {
  color: var(--faint);
  border-top-color: var(--line);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .eyebrow {
  color: var(--psi);
  letter-spacing: .2em;
  text-transform: uppercase;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .eyebrow::before {
  height: 1px;
  background: linear-gradient(90deg, var(--accent), rgba(102, 216, 255, .25));
  box-shadow: 0 0 7px rgba(215, 180, 107, .4);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn {
  color: #080b12;
  background: linear-gradient(135deg, #f3d99b, #c39449 52%, #a47630);
  border-color: rgba(255, 237, 194, .55);
  border-radius: 2px;
  box-shadow: 0 0 20px rgba(215, 180, 107, .18), inset 0 1px 0 rgba(255, 255, 255, .35);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn:hover {
  color: #05080d;
  background: linear-gradient(135deg, #ffe6ad, #d2a353 55%, #b38438);
  box-shadow: 0 0 28px rgba(215, 180, 107, .3), inset 0 1px 0 rgba(255, 255, 255, .4);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn-accent { background: linear-gradient(135deg, #f3d99b, #c39449 52%, #a47630); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn-accent:hover { background: linear-gradient(135deg, #ffe6ad, #d2a353 55%, #b38438); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn-quiet {
  color: var(--accent-deep);
  background: rgba(8, 17, 29, .68);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn-quiet:hover {
  color: #fff1c9;
  background: rgba(215, 180, 107, .1);
  border-color: var(--line-strong);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn-danger { color: #1b080a; background: linear-gradient(135deg, #e69a9a, #bd6666); }

/* ---------- home ---------- */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) .home-hero {
  border-bottom: 1px solid rgba(215, 180, 107, .08);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .home-eyebrow {
  color: var(--muted);
  letter-spacing: .1em;
  text-transform: uppercase;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .home-eyebrow::before {
  width: 7px;
  height: 7px;
  background: var(--psi);
  border-radius: 0;
  box-shadow: 0 0 0 4px rgba(102, 216, 255, .08), 0 0 12px rgba(102, 216, 255, .6);
  transform: rotate(45deg);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-title {
  color: var(--ink);
  font-weight: 300;
  letter-spacing: -.045em;
  text-shadow: 0 0 40px rgba(84, 170, 205, .08);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-title em {
  color: var(--accent-deep);
  background: none;
  -webkit-text-fill-color: var(--accent-deep);
  text-shadow: 0 0 26px rgba(215, 180, 107, .28);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-title em::after { display: none; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-lede { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-tip { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-tip svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-stat {
  background: linear-gradient(145deg, rgba(14, 27, 44, .9), rgba(6, 13, 23, .92));
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: inset 0 0 0 1px rgba(102, 216, 255, .025);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-stat strong { color: var(--accent-deep); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-stat span { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .hero-stat + .hero-stat { border-left: 1px solid var(--line); }

/* protoss home sigil */
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .protoss-hero-art {
  width: 100%;
  max-width: 500px;
  height: 540px;
  margin-left: auto;
  isolation: isolate;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-aura {
  position: absolute;
  top: 34%;
  left: 50%;
  width: 370px;
  height: 370px;
  background:
    radial-gradient(circle at 50% 50%, rgba(102, 216, 255, .2), transparent 48%),
    radial-gradient(circle at 40% 40%, rgba(215, 180, 107, .12), transparent 58%);
  filter: blur(22px);
  transform: translate(-50%, -50%);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-sigil {
  position: absolute;
  top: 53%;
  left: 50%;
  width: 430px;
  height: 430px;
  transform: translate(-50%, -50%);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(215, 180, 107, .34);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ring-a {
  width: 215px;
  height: 215px;
  border-color: rgba(215, 180, 107, .46);
  box-shadow: 0 0 18px rgba(102, 216, 255, .08), inset 0 0 18px rgba(102, 216, 255, .05);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ring-b {
  width: 320px;
  height: 320px;
  border-style: dashed;
  border-color: rgba(102, 216, 255, .28);
  animation: protoss-spin 26s linear infinite;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ring-c {
  width: 410px;
  height: 410px;
  border-color: rgba(215, 180, 107, .16);
  border-style: dotted;
  animation: protoss-spin-reverse 44s linear infinite;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-axis {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 380px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(215, 180, 107, .4), transparent);
  transform: translate(-50%, -50%);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .axis-b {
  transform: translate(-50%, -50%) rotate(90deg);
  background: linear-gradient(90deg, transparent, rgba(102, 216, 255, .3), transparent);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-crystal {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 104px;
  height: 172px;
  background: linear-gradient(145deg, #edffff 0%, #88e4f7 24%, #2b8cae 55%, #092234 100%);
  border: 1px solid rgba(243, 220, 163, .85);
  clip-path: polygon(50% 0, 100% 28%, 78% 100%, 22% 100%, 0 28%);
  transform: translate(-50%, -50%);
  box-shadow: 0 0 34px rgba(102, 216, 255, .3);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-crystal::before {
  content: "";
  position: absolute;
  inset: 1px;
  background: linear-gradient(110deg, rgba(255, 255, 255, .55), transparent 34%, rgba(2, 20, 34, .35));
  clip-path: inherit;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-crystal i {
  position: absolute;
  top: 8%;
  bottom: 7%;
  left: 50%;
  width: 1px;
  background: rgba(255, 255, 255, .52);
  box-shadow: 0 0 9px rgba(255, 255, 255, .7);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-crystal b {
  position: absolute;
  top: 32%;
  left: 50%;
  width: 28px;
  height: 28px;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 0 26px 10px rgba(102, 216, 255, .65);
  transform: translate(-50%, -50%) rotate(45deg);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-rune {
  position: absolute;
  width: 12px;
  height: 12px;
  background: rgba(7, 15, 25, .9);
  border: 1px solid var(--accent);
  box-shadow: 0 0 12px rgba(215, 180, 107, .25);
  transform: rotate(45deg);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .rune-a { top: 52px; left: 50%; margin-left: -6px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .rune-b { right: 63px; top: 50%; margin-top: -6px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .rune-c { bottom: 54px; left: 91px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-readout {
  position: absolute;
  display: flex;
  flex-direction: column;
  min-width: 92px;
  padding: 10px 12px 9px;
  background: linear-gradient(145deg, rgba(11, 23, 38, .9), rgba(5, 11, 20, .92));
  border: 1px solid var(--line);
  clip-path: polygon(0 8px, 8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-readout::before {
  content: "";
  position: absolute;
  top: 0;
  left: 8px;
  width: 32px;
  height: 1px;
  background: var(--accent);
  box-shadow: 0 0 8px rgba(215, 180, 107, .5);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-readout-a { top: 18px; left: 0; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-readout-b { top: 79px; right: 0; min-width: 104px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-readout-c { top: 174px; right: 27px; min-width: 84px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-label {
  font-size: 6.5px;
  font-weight: 600;
  letter-spacing: .18em;
  color: var(--psi);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-readout strong {
  margin-top: 2px;
  font-family: var(--sans);
  font-size: 25px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.04em;
  color: var(--accent-deep);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-readout small {
  margin-top: 2px;
  font-size: 7px;
  letter-spacing: .08em;
  color: var(--faint);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-focus {
  position: absolute;
  bottom: 10px;
  left: 50%;
  display: flex;
  gap: 11px;
  align-items: center;
  width: 246px;
  min-height: 55px;
  padding: 8px 9px 8px 14px;
  color: var(--ink-soft);
  text-decoration: none;
  cursor: pointer;
  background: linear-gradient(145deg, rgba(13, 27, 44, .94), rgba(6, 13, 22, .96));
  border: 1px solid var(--line-strong);
  clip-path: polygon(0 9px, 9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%);
  transform: translateX(-50%);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-focus:hover {
  border-color: var(--accent);
  box-shadow: 0 0 24px rgba(215, 180, 107, .16);
  transform: translateX(-50%) translateY(-2px);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-focus-mark {
  display: grid;
  width: 33px;
  height: 33px;
  place-items: center;
  color: #07101a;
  background: linear-gradient(135deg, #f0d28c, #b88a3d);
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-focus-mark svg { width: 13px; height: 13px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-focus-copy { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-focus-copy small { font-size: 6.5px; letter-spacing: .16em; color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-focus-copy strong { overflow: hidden; font-size: 10px; font-weight: 500; letter-spacing: .03em; color: var(--ink-soft); text-overflow: ellipsis; white-space: nowrap; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-focus-arrow {
  display: grid;
  width: 30px;
  height: 30px;
  margin-left: auto;
  place-items: center;
  color: var(--accent);
  border: 1px solid var(--line);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-focus-arrow svg { width: 12px; height: 12px; }

/* ---------- cards / sections ---------- */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) .collections,
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-library {
  border-top-color: var(--line);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .section-title { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .section-title .count {
  color: var(--accent);
  background: rgba(215, 180, 107, .06);
  border: 1px solid var(--line);
  border-radius: 1px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .section-head .btn-quiet { border-radius: 1px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-card {
  background:
    linear-gradient(112deg, rgba(255, 255, 255, .035), transparent 46%),
    linear-gradient(145deg, #0d192a, #07101c);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(102, 216, 255, .02), 0 18px 38px -28px #000;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-card::before {
  height: 1px;
  background: linear-gradient(90deg, var(--accent), rgba(102, 216, 255, .4), transparent 72%);
  opacity: .8;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-card::after {
  background:
    radial-gradient(circle at 86% 96%, rgba(102, 216, 255, .1), transparent 42%),
    repeating-linear-gradient(135deg, transparent 0 22px, rgba(102, 216, 255, .025) 22px 23px);
  opacity: .8;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-card:hover,
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-card:focus-within {
  border-color: var(--line-strong);
  box-shadow: 0 0 24px rgba(102, 216, 255, .08), 0 22px 44px -28px #000;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-number { color: var(--accent); letter-spacing: .16em; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-count {
  color: var(--psi);
  background: rgba(102, 216, 255, .06);
  border: 1px solid rgba(102, 216, 255, .18);
  border-radius: 1px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-title { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-meta { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-meta::before { background: var(--accent); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-open { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-word-dots i { background: rgba(215, 180, 107, .55); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-delete {
  color: var(--faint);
  background: rgba(4, 9, 16, .9);
  border-color: var(--line);
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-delete:hover { color: var(--danger); background: rgba(45, 12, 16, .9); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-add {
  color: var(--muted);
  background: rgba(7, 15, 25, .35);
  border: 1px dashed var(--line-strong);
  border-radius: 2px;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-add:hover {
  color: var(--ink-soft);
  border-color: var(--accent);
  background: rgba(215, 180, 107, .04);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-add .add-ring {
  color: var(--accent);
  background: rgba(8, 17, 28, .9);
  border: 1px solid var(--line);
  border-radius: 1px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-add:hover .add-ring {
  color: #07101a;
  background: var(--accent);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-add strong { color: var(--ink-soft); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .card-add span:last-child { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .empty-collections {
  background: rgba(7, 15, 25, .38);
  border: 1px dashed var(--line);
  border-radius: 2px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .empty-glyph {
  color: var(--accent);
  background: rgba(8, 17, 28, .9);
  border: 1px solid var(--line);
  border-radius: 1px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .empty-collections h3 { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .empty-collections p { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-library-note,
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-library-note svg { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-library-note svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-card-desc { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-card-source { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-card-source svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-card-stamp { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-empty {
  background: rgba(7, 15, 25, .42);
  border-color: var(--line-strong);
  border-radius: 2px;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-empty-mark { color: var(--accent); background: var(--accent-soft); border-radius: 1px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-empty strong { color: var(--ink-soft); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-empty span { color: var(--muted); }

/* ---------- cover ---------- */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-frame {
  background: linear-gradient(145deg, #0a1422, #050a12);
  border-color: var(--line);
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgba(102, 216, 255, .04), 0 30px 70px -35px #000;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-photo { border-radius: 2px; filter: saturate(.9) contrast(1.04); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-shade {
  border-radius: 2px;
  background:
    linear-gradient(180deg, rgba(2, 5, 10, .34) 0%, transparent 34%, rgba(2, 6, 12, .75) 100%),
    linear-gradient(115deg, rgba(4, 10, 18, .3), transparent 46%, rgba(4, 12, 20, .42));
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-edition {
  color: var(--accent-deep);
  background: rgba(5, 12, 21, .72);
  border-color: var(--line);
  border-radius: 1px;
  box-shadow: none;
  backdrop-filter: blur(12px);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-change {
  color: var(--muted);
  background: rgba(5, 12, 21, .7);
  border-color: var(--line);
  border-radius: 1px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-change:hover { color: var(--accent); background: rgba(12, 25, 41, .92); border-color: var(--line-strong); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-content {
  color: var(--ink);
  background:
    linear-gradient(112deg, rgba(255, 255, 255, .04), transparent 42%),
    rgba(4, 10, 18, .88);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: 0 0 40px rgba(0, 0, 0, .35), inset 0 0 0 1px rgba(102, 216, 255, .03);
  backdrop-filter: blur(22px);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-id { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .avatar-cover {
  color: #06101a;
  background: linear-gradient(145deg, #f0d28c, #5cc8e8);
  border-color: rgba(240, 210, 140, .6);
  box-shadow: 0 0 14px rgba(102, 216, 255, .2);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-name { color: var(--ink); text-shadow: 0 0 30px rgba(102, 216, 255, .1); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-tagline { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-enter { color: #080b12; background: linear-gradient(135deg, #f3d99b, #c39449); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-enter:hover { color: #05080d; background: linear-gradient(135deg, #ffe6ad, #d2a353); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-edit { color: var(--muted); border-bottom-color: var(--line); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-edit:hover { color: var(--psi); border-bottom-color: rgba(102, 216, 255, .6); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-bottom {
  color: var(--muted);
  background: rgba(5, 12, 20, .82);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: none;
  backdrop-filter: blur(14px);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-counts strong { color: var(--accent-deep); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-counts i { background: var(--line-strong); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-page { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-vertical { color: rgba(215, 180, 107, .2); }

/* ---------- profile ---------- */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-hero {
  background:
    radial-gradient(75% 130% at 100% 0%, rgba(102, 216, 255, .08), transparent 54%),
    linear-gradient(145deg, #0c1727, #070f1a);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: var(--shadow-lg);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-hero::before {
  background:
    radial-gradient(circle at 35% 35%, rgba(102, 216, 255, .08), transparent 55%),
    radial-gradient(circle at 68% 62%, rgba(215, 180, 107, .08), transparent 56%);
  opacity: .6;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-hero::after { background: radial-gradient(circle at center, rgba(102, 216, 255, .06), transparent 65%); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .avatar-profile {
  color: #07101a;
  background: linear-gradient(145deg, #e6cc86, #55c4e3);
  border-color: rgba(240, 210, 140, .6);
  box-shadow: 0 0 0 1px rgba(102, 216, 255, .2), 0 14px 28px -18px #000;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .avatar-camera {
  color: #06101a;
  background: linear-gradient(140deg, #f0d28c, #b88a3d);
  border-color: #0a1321;
  box-shadow: 0 0 12px rgba(215, 180, 107, .3);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-identity h1 { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-identity > p { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-local { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-local svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-stat {
  background: rgba(8, 17, 29, .72);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-stat strong { color: var(--accent-deep); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-stat span { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-card {
  background: linear-gradient(145deg, #0c1727, #07101b);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: var(--shadow-md);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-card-head { border-bottom-color: var(--line); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-card-no { color: var(--accent); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-card-head h2 { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-card-head p { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .text-input {
  color: var(--ink);
  background: rgba(5, 12, 21, .76);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: inset 0 0 14px rgba(0, 0, 0, .25);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .text-input::placeholder { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .text-input:focus {
  background: rgba(8, 18, 31, .92);
  border-color: rgba(102, 216, 255, .5);
  box-shadow: 0 0 0 3px rgba(102, 216, 255, .08), inset 0 0 16px rgba(0, 0, 0, .25);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .field-hint { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-save-row { border-top-color: var(--line); color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-save-row svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .avatar-preview .avatar {
  color: #07101a;
  background: linear-gradient(145deg, #e6cc86, #55c4e3);
  border-color: rgba(240, 210, 140, .6);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .media-copy h3 { color: var(--ink-soft); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .media-copy p { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .text-button { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .text-button:hover { color: var(--psi); border-bottom-color: rgba(102, 216, 255, .35); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .media-divider { background: var(--line); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-thumb { border-color: var(--line); border-radius: 2px; box-shadow: none; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-note { border-top-color: var(--line); color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .profile-note svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-card {
  background: linear-gradient(145deg, #0c1727, #07101b);
  border-color: var(--line);
  border-radius: 2px;
  box-shadow: var(--shadow-md);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-mark {
  color: var(--accent);
  background: var(--accent-soft);
  border-color: var(--line);
  border-radius: 1px;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-setting-copy h2 { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-setting-copy > p:last-child { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-setting-copy strong { color: var(--accent); }

/* ---------- list page ---------- */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) .back-link { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .back-link svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .topbar-note { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .topbar-note svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-title { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-sub { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-sub kbd { color: var(--psi); background: rgba(102, 216, 255, .06); border-color: var(--line); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-stat {
  background: rgba(8, 17, 29, .72);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-stat strong { color: var(--accent-deep); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-stat span { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .workspace-toolbar {
  background: rgba(7, 15, 25, .7);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .toolbar-left .btn-quiet { background: rgba(8, 17, 29, .8); border: 1px solid var(--line); border-radius: 1px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .toolbar-hint { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .paper-sheet {
  background: linear-gradient(145deg, #0c1727, #060e19);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: var(--shadow-lg);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .sheet-kicker { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .sheet-title { color: var(--accent); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .sheet-rule { background: var(--line); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .sheet-rule i { background: var(--accent); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .sheet-sub { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .table-scroll-hint { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .table-viewport {
  background: rgba(4, 9, 16, .8);
  border-color: var(--line);
  border-radius: 2px;
  box-shadow: inset 0 1px 0 rgba(102, 216, 255, .03);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .word-table th,
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .word-table td { border-color: rgba(181, 151, 91, .18); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .th-main {
  color: var(--muted);
  background: #111e30 !important;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .th-main .th-en { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .th-group { color: var(--faint) !important; background: #0c1727 !important; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .th-sub { color: var(--muted); background: #0e1a2a !important; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .col-toggle {
  color: var(--psi);
  background: rgba(5, 12, 21, .9);
  border-color: var(--line);
  border-radius: 1px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .col-toggle:hover { color: var(--accent); background: rgba(15, 30, 48, .95); border-color: var(--line-strong); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .col-toggle[aria-pressed="true"] {
  color: #07101a;
  background: var(--accent);
  border-color: var(--accent);
  box-shadow: 0 0 12px rgba(215, 180, 107, .25);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .th.is-col-hidden { background: #1a2230 !important; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .word-table tbody td { color: var(--ink-soft); background: #08111d; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .word-table tbody tr:nth-child(even) td { background: #0a1523; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .word-table tbody tr:hover td { background: #112337; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .index-cell { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .row-delete {
  color: var(--faint);
  background: rgba(5, 12, 21, .9);
  border-color: var(--line);
  border-radius: 1px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .row-delete:hover { color: var(--danger); background: rgba(40, 12, 16, .9); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell-word .cell-value { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell-meaning .cell-value { color: var(--ink-soft); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell-record .cell-value { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell-edit {
  color: var(--psi);
  background: rgba(5, 12, 21, .92);
  border: 1px solid var(--line);
  border-radius: 1px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell-edit:hover { color: var(--accent); background: #112337; border-color: var(--line-strong); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell.is-editing { background: #0e1c2e !important; box-shadow: inset 0 0 0 1px var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell.is-editing .cell-value { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell.is-editing .cell-value:empty::before { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell-mask {
  color: var(--accent);
  background-color: #101b2a;
  background-image: repeating-linear-gradient(135deg, transparent 0 8px, rgba(102, 216, 255, .035) 8px 9px);
  box-shadow: inset 0 0 18px rgba(0, 0, 0, .28);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell.is-col-hidden .cell-mask { background-color: #142033; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .cell-mask svg { color: var(--accent); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .sheet-foot { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .sheet-foot .foot-left::before { background: var(--line-strong); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .sheet-foot .foot-right svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .add-row-bar {
  background: rgba(7, 15, 25, .58);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn-add-row {
  color: var(--muted);
  background: rgba(8, 17, 29, .82);
  border: 1px solid var(--line);
  border-radius: 1px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn-add-row:hover { color: #07101a; background: var(--accent); border-color: var(--accent); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn-add-row.subtle { color: var(--faint); background: transparent; border-color: transparent; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .btn-add-row.subtle:hover { color: var(--psi); background: rgba(102, 216, 255, .05); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .add-row-note { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .add-row-note svg { color: var(--psi); }

/* ---------- public list page ---------- */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-reviewed {
  color: var(--psi);
  background: rgba(102, 216, 255, .06);
  border-color: rgba(102, 216, 255, .2);
  border-radius: 1px;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-credit { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-credit svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-table th { color: var(--faint); background: #111e30; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-table .public-th-index { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-table tbody td { color: var(--ink-soft); background: #08111d; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-table tbody tr:nth-child(even) td { background: #0a1523; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-table tbody tr:hover td { background: #112337; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-index { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-word { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-meaning-cell { color: var(--ink-soft); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-mask {
  color: var(--accent);
  background: #101b2a;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-mask svg { color: var(--accent); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-pager .btn-quiet { border-radius: 1px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-page-label { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-loading strong { color: var(--ink-soft); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-loading span:last-child { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-loading-mark,
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-error-mark { color: var(--accent); background: var(--accent-soft); border-color: var(--line); border-radius: 1px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-error h1 { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .public-error p { color: var(--muted); }

/* ---------- modal / theme switcher / toast ---------- */

:is(html[data-theme="protoss"], html[data-theme="aiur"]) .modal::backdrop { background: rgba(1, 4, 8, .7); backdrop-filter: blur(9px); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .modal-card {
  color: var(--ink);
  background:
    linear-gradient(120deg, rgba(255, 255, 255, .035), transparent 42%),
    linear-gradient(145deg, #0c1727, #060e19);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(102, 216, 255, .04), 0 40px 100px -45px #000;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .modal-card::before {
  height: 1px;
  background: linear-gradient(90deg, var(--accent), rgba(102, 216, 255, .4), transparent);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .modal-close { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .modal-kicker { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .modal-title { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .modal-desc { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .modal-label { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .modal-actions { border-top-color: var(--line); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-option {
  background: linear-gradient(145deg, #0b1626, #07101b);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: none;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-option:hover { border-color: var(--line-strong); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-option.is-selected {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px rgba(215, 180, 107, .25), 0 0 22px rgba(215, 180, 107, .12);
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-option-copy strong { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-option-copy small { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-check { color: #07101a; background: var(--accent); border-color: #0a1321; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-hint { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .theme-hint svg { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .delete-summary { background: rgba(40, 12, 16, .5); border-color: rgba(211, 120, 120, .2); border-radius: 1px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .toast {
  color: var(--ink-soft);
  background: rgba(7, 15, 25, .94);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: 0 20px 46px -28px #000;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .toast-message svg { color: var(--accent); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .toast-action { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .toast-action:hover { color: var(--accent); }

/* public upload */
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-file-box {
  background: rgba(5, 12, 21, .7);
  border-color: var(--line-strong);
  border-radius: 2px;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-pick {
  color: var(--accent);
  background: rgba(8, 17, 29, .92);
  border-color: var(--line);
  border-radius: 1px;
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-pick:hover { background: var(--accent-soft); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-file-name { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-file-hint { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-file-hint strong { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-preview { background: rgba(5, 12, 21, .7); border-color: var(--line); border-radius: 2px; }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-preview-head { color: var(--muted); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-preview-head strong { color: var(--psi); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-preview-table th { color: var(--faint); border-bottom-color: var(--line); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-preview-table td { color: var(--ink-soft); border-bottom-color: var(--line); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-preview-table td:first-child { color: var(--ink); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-review-note { color: var(--faint); }
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .upload-review-note svg { color: var(--accent); }

/* ---------- motion ---------- */

@keyframes protoss-spin {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}
@keyframes protoss-spin-reverse {
  from { transform: translate(-50%, -50%) rotate(360deg); }
  to { transform: translate(-50%, -50%) rotate(0deg); }
}
@keyframes protoss-glow {
  0%, 100% { opacity: .55; transform: translate(-50%, -50%) scale(1); }
  50% { opacity: .9; transform: translate(-50%, -50%) scale(1.04); }
}
:is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-crystal b { animation: protoss-glow 3.8s ease-in-out infinite; }

@media (prefers-reduced-motion: reduce) {
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-ring,
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-crystal b { animation: none; }
}

/* ---------- responsive ---------- */

@media (max-width: 1080px) {
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .protoss-hero-art { max-width: 430px; height: 500px; }
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-sigil { transform: translate(-50%, -50%) scale(.9); }
}
@media (max-width: 860px) {
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .protoss-hero-art { max-width: 390px; height: 450px; margin: 0 auto; }
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-sigil { transform: translate(-50%, -50%) scale(.8); }
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .ps-readout-c { top: 150px; right: 0; }
}
@media (max-width: 640px) {
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .protoss-hero-art { display: none; }
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .list-title { font-size: clamp(32px, 9vw, 44px); }
  :is(html[data-theme="protoss"], html[data-theme="aiur"]) .cover-frame { border-radius: 2px; }
}

