/* ════════════════════════════════════════════════════════════════════
   SymposiON — Home Revamp · INNER SCREENS styles (Synthesis language)
   Scoped under .dir-synthesis so they inherit fonts (--disp/--sans/--serif),
   --pad and the live theme tokens.
   ════════════════════════════════════════════════════════════════════ */
.dir-synthesis .sc-page { padding: clamp(18px,3.5vw,40px) var(--pad) clamp(34px,5vw,64px); }

/* shared header */
.sc-head { display:flex; flex-direction:column; gap:14px; padding-top:10px; margin-bottom:26px; }
.sc-head__row { display:flex; align-items:flex-end; gap:18px; flex-wrap:wrap; }
.sc-back { align-self:flex-start; display:inline-flex; align-items:center; gap:7px; background:var(--card); border:1px solid var(--line-bold); color:var(--fg); font-family:var(--sans); font-weight:600; font-size:13px; padding:9px 15px; border-radius:999px; cursor:pointer; transition:.16s; }
.sc-back:hover { border-color:var(--terra); color:var(--terra-dk); transform:translateX(-2px); }
.sc-head__main { flex:1; min-width:240px; }
.sc-eyebrow { display:flex; align-items:center; gap:9px; font-family:var(--disp); font-weight:500; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--ca,var(--terra-dk)); margin-bottom:8px; }
.sc-eyebrow__rom { font-weight:600; color:var(--ca,var(--terra)); }
.sc-title { font-family:var(--disp); font-weight:600; font-size:clamp(30px,4.4vw,52px); letter-spacing:.01em; text-transform:uppercase; line-height:1; margin:0; }
.sc-sub { font-family:var(--serif); font-size:16px; color:var(--fg-70); margin:10px 0 0; max-width:46em; }
.sc-head__act { margin-left:auto; display:flex; gap:10px; align-items:center; }

.sc-cta { font-family:var(--sans); font-weight:700; font-size:14px; cursor:pointer; display:inline-flex; align-items:center; gap:9px; padding:12px 22px; border-radius:999px; border:0; }
.sc-cta--solid { background:var(--terra-dk); color:#fff; box-shadow:0 8px 22px var(--terra-soft); transition:transform .16s, box-shadow .16s; will-change:transform; }
.sc-cta--solid:hover { box-shadow:0 14px 30px var(--terra-soft); }
.sc-cta__gl { width:18px; height:18px; color:#fff; } .sc-cta__gl svg { width:100%; height:100%; }

.sc-fils { display:flex; gap:9px; flex-wrap:wrap; margin-bottom:22px; }
.sc-fil { font-family:var(--sans); font-weight:600; font-size:13px; color:var(--fg-70); background:var(--card); border:1px solid var(--line); padding:8px 16px; border-radius:999px; cursor:pointer; transition:.15s; }
.sc-fil:hover { border-color:var(--line-bold); }
.sc-fil.active { background:var(--terra-soft); border-color:transparent; color:var(--terra-dk); }

.sc-pill { font-family:var(--sans); font-size:11px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--ca-ink); background:var(--ca-soft); padding:4px 10px; border-radius:999px; }
.sc-sec-lbl { font-family:var(--disp); font-weight:500; font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:30px 0 14px; }

/* stat tiles */
.sc-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; }
.sc-stats--4 { grid-template-columns:repeat(4,1fr); }
.sc-stat { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px 20px; border-left:3px solid var(--ca); }
.sc-stat__v { font-family:var(--disp); font-weight:600; font-size:30px; color:var(--fg); line-height:1; }
.sc-stat__l { font-size:12px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-top:6px; }

/* ── SUBJECT game cards ── */
/* grid-auto-rows:1fr makes every row the same height; the card then stretches
   into it and pins its footer to the bottom, so a 1-line and a 3-line title
   produce identical boxes (the Αρχαία-Γραμματική theory grid was ragged). */
.sc-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(248px,1fr)); grid-auto-rows:1fr; gap:15px; }
.sc-gcard { display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line); border-radius:20px; overflow:hidden; text-decoration:none; color:var(--fg); box-shadow:0 8px 24px var(--shadow); transition:transform .16s, box-shadow .16s, border-color .16s; }
.sc-gcard:hover { transform:translateY(-5px); box-shadow:0 20px 40px var(--shadow); border-color:var(--ca-mid); }
.sc-gcard__ban { position:relative; display:grid; place-items:center; height:128px; background:var(--ca-tint); }
.sc-gcard__ban::after { content:''; position:absolute; inset:0; background:radial-gradient(circle at 72% 18%, var(--ca-soft), transparent 60%); }
.sc-gcard__illu { width:64px; height:64px; color:var(--ca-ink); position:relative; z-index:1; } .sc-gcard__illu svg{ width:100%; height:100%; }
.sc-tag { position:absolute; top:12px; right:12px; z-index:2; font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#fff; background:var(--sage); padding:4px 9px; border-radius:999px; }
.sc-gcard__ban { flex:0 0 auto; }
.sc-gcard__b { padding:15px 16px 16px; flex:1 1 auto; display:flex; flex-direction:column; }
.sc-gcard__b .sc-gcard__f { margin-top:auto; }
.sc-gcard__t { font-family:var(--sans); font-weight:700; font-size:17px; margin:0 0 3px; }
.sc-gcard__m { font-size:12px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; color:var(--muted); margin:0 0 14px; }
.sc-gcard__f { display:flex; align-items:center; justify-content:space-between; }
.sc-gcard__play { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--ca); color:#fff; font-size:12px; padding-left:2px; box-shadow:0 6px 14px var(--ca-mid); }

/* ── subscription-gated (locked) cards ── */
.sc-gcard--locked .sc-gcard__ban { filter:grayscale(.4); }
.sc-tag--lock { left:12px; right:auto; background:linear-gradient(135deg,#b8862b,#8a5a18); display:inline-flex; align-items:center; gap:4px; }
.sc-pill--lock { color:#fff !important; background:linear-gradient(135deg,#b8862b,#8a5a18) !important; border:0 !important; display:inline-flex; align-items:center; gap:4px; }
.sc-gcard__play--locked { background:#9a8a73; box-shadow:none; }

/* ── MODE select ── */
.sc-modes { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); grid-auto-rows:1fr; gap:14px; }
.sc-mode__meta { margin-top:auto; }
.sc-mode { position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:8px; text-align:left; background:var(--card); border:1.5px solid var(--line); border-radius:22px; padding:24px; cursor:pointer; color:var(--fg); transition:transform .16s, box-shadow .16s, border-color .16s; }
.sc-mode:hover { transform:translateY(-4px); border-color:var(--ca); box-shadow:0 18px 38px var(--shadow); }
.sc-mode__ic { display:grid; place-items:center; width:56px; height:56px; border-radius:16px; background:var(--ca-soft); color:var(--ca-ink); margin-bottom:6px; }
.sc-mode__gl { width:34px; height:34px; } .sc-mode__gl svg{ width:100%; height:100%; }
.sc-mode__t { font-family:var(--disp); font-weight:600; font-size:21px; letter-spacing:.02em; text-transform:uppercase; }
.sc-mode__d { font-family:var(--serif); font-size:14.5px; color:var(--fg-70); }
.sc-mode__go { position:absolute; right:20px; bottom:22px; color:var(--ca-ink); font-size:18px; opacity:0; transform:translateX(-6px); transition:.18s; }
.sc-mode:hover .sc-mode__go { opacity:1; transform:none; }
.sc-mode--hot { border-color:var(--ca-mid); }
.sc-mode__badge { position:absolute; top:18px; right:18px; font-family:var(--disp); font-size:10px; font-weight:600; letter-spacing:.1em; color:#fff; background:var(--terra-dk); padding:4px 9px; border-radius:999px; }

/* ── LEVEL select ── */
.sc-prog { display:flex; align-items:center; gap:11px; }
.sc-prog__bar { width:160px; height:8px; border-radius:999px; background:var(--sink); overflow:hidden; }
.sc-prog__fill { display:block; height:100%; background:var(--ca); border-radius:999px; }
.sc-prog__t { font-family:var(--disp); font-weight:600; font-size:14px; color:var(--muted); }
.sc-levels { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:13px; }
.sc-lv { display:flex; align-items:center; gap:14px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px 18px; cursor:pointer; color:var(--fg); text-align:left; transition:transform .15s, border-color .15s; }
.sc-lv:hover { transform:translateX(3px); border-color:var(--ca-mid); }
.sc-lv__n { display:grid; place-items:center; width:42px; height:42px; flex:none; border-radius:12px; font-family:var(--disp); font-weight:600; font-size:17px; background:var(--ca-soft); color:var(--ca-ink); }
.sc-lv__t { flex:1; font-family:var(--sans); font-weight:700; font-size:15.5px; }
.sc-lv__stars { color:var(--gold); font-size:13px; letter-spacing:1px; }
.sc-lv__meta { font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); }
.sc-lv__go { color:var(--ca-ink); }
.sc-lv--now { border-color:var(--ca); box-shadow:0 8px 22px var(--ca-mid); }
.sc-lv--now .sc-lv__n { background:var(--ca); color:#fff; }
.sc-lv--lock { opacity:.6; cursor:not-allowed; }
.sc-lv--lock .sc-lv__n { background:var(--sink); }
.sc-lv--done .sc-lv__n { background:var(--sage); color:#fff; }
.sc-lv--boss .sc-lv__t::after { content:' ☼'; color:var(--terra); }

/* ── GAME PANEL ── */
.sc-eng-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:13px; }
.sc-upload { display:flex; align-items:center; gap:13px; background:var(--sink); border:2px dashed var(--line-bold); border-radius:18px; padding:18px; cursor:pointer; color:var(--fg); text-align:left; }
.sc-upload:hover { border-color:var(--terra); }
.sc-upload__ic { font-size:26px; color:var(--terra); }
.sc-upload__t { display:block; font-weight:700; font-size:15px; }
.sc-upload__s { display:block; font-size:11px; font-weight:600; letter-spacing:.08em; color:var(--muted); margin-top:2px; }
.sc-engc { display:flex; align-items:center; gap:13px; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:14px; text-decoration:none; color:var(--fg); transition:transform .15s, box-shadow .15s; }
.sc-engc:hover { transform:translateY(-3px); box-shadow:0 14px 30px var(--shadow); }
.sc-engc__ban { display:grid; place-items:center; width:54px; height:54px; flex:none; border-radius:14px; background:var(--ca-tint); }
.sc-engc__illu { width:34px; height:34px; color:var(--ca-ink); } .sc-engc__illu svg{ width:100%; height:100%; }
/* emoji fallback for Game-Panel engines that carry an icon but no vector illu */
.sc-engc__illu--emoji { display:grid; place-items:center; width:34px; height:34px; font-size:26px; line-height:1; }
.sc-eng-grid--list .sc-engc__illu--emoji { width:26px; height:26px; font-size:20px; }
.sc-engc__b { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.sc-engc__t { font-family:var(--disp); font-weight:500; font-size:16px; letter-spacing:.02em; }
.sc-engc__m { font-size:10.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
.sc-engc__go { color:var(--ca-ink); }

/* ── LIVE ARENA ── */
.sc-live { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.sc-live__join { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:24px; }
.sc-live__url { font-family:var(--serif); font-size:16px; color:var(--fg-70); margin-bottom:18px; }
.sc-live__url b { font-family:var(--sans); font-weight:800; color:var(--fg); font-size:19px; margin-left:6px; }
.sc-live__pinrow { display:flex; gap:18px; align-items:center; }
.sc-qr { width:120px; height:120px; flex:none; display:grid; grid-template-columns:repeat(8,1fr); grid-auto-rows:1fr; gap:2px; padding:8px; background:#fff; border-radius:12px; }
.sc-qr i { background:transparent; border-radius:1px; } .sc-qr i.on { background:#0c0d10; }
.sc-live__pinl { font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.sc-live__pin { font-family:var(--disp); font-weight:600; font-size:34px; letter-spacing:.18em; color:var(--terra-dk); margin:4px 0 12px; }
.sc-live__share { display:flex; gap:8px; }
.sc-mini { font-family:var(--sans); font-weight:600; font-size:12px; color:var(--fg); background:var(--sink); border:1px solid var(--line); padding:8px 13px; border-radius:9px; cursor:pointer; }
.sc-live__players { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:20px; }
.sc-live__phd { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; font-family:var(--disp); font-weight:500; letter-spacing:.06em; text-transform:uppercase; font-size:14px; }
.sc-live__phd .sc-gl { width:18px; height:18px; vertical-align:-3px; color:var(--terra); }
.sc-live__count { display:grid; place-items:center; min-width:30px; height:26px; padding:0 8px; border-radius:999px; background:var(--terra-soft); color:var(--terra-dk); font-weight:700; }
.sc-live__grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:9px; }
.sc-pl { display:flex; align-items:center; gap:8px; background:var(--sink); border:1px solid var(--line); border-radius:12px; padding:8px 11px; }
.sc-pl__av { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--terra-dk); color:#fff; font-weight:700; font-size:12px; }
.sc-pl__n { font-weight:600; font-size:13px; }

/* ── HERO PROFILE ── */
.sc-prof { background:var(--card); border:1px solid var(--line); border-radius:24px; padding:clamp(20px,3vw,32px); box-shadow:0 12px 34px var(--shadow); }
.sc-prof__hero { display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.sc-prof__ring { position:relative; width:96px; height:96px; flex:none; border-radius:50%; display:grid; place-items:center; background:conic-gradient(var(--ca) 68%, var(--sink) 0); }
.sc-prof__ring::after { content:''; position:absolute; inset:5px; border-radius:50%; background:var(--card); }
.sc-prof__av { position:relative; z-index:1; display:grid; place-items:center; width:78px; height:78px; border-radius:50%; background:var(--ca-soft); color:var(--ca-ink); font-family:var(--disp); font-weight:600; font-size:30px; }
.sc-prof__lvl { position:absolute; z-index:2; bottom:-2px; right:-2px; display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--ca); color:#fff; font-family:var(--disp); font-weight:600; font-size:14px; border:3px solid var(--card); }
.sc-prof__ring--btn { border:0; cursor:pointer; padding:0; }
.sc-prof__ring--btn:hover .sc-prof__edit { opacity:1; }
.sc-prof__seal { position:relative; z-index:1; display:grid; place-items:center; width:78px; height:78px; border-radius:50%; background:var(--ca-soft); color:var(--ca-ink); }
.sc-prof__seal svg { width:52px; height:52px; }
.sc-prof__edit { position:absolute; z-index:3; top:-2px; left:-2px; display:grid; place-items:center; width:26px; height:26px; border-radius:50%; background:var(--card); border:1px solid var(--line-bold); color:var(--fg); font-size:12px; opacity:0; transition:.15s; }

/* avatar picker (Hero's Agora) */
.av-lv { margin-left:auto; font-family:var(--disp); font-weight:600; font-size:13px; color:var(--gold); }
.av-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); gap:9px; padding:0 16px; }
.av-seal { display:flex; flex-direction:column; align-items:center; gap:7px; padding:14px 8px; background:var(--bg); border:1px solid var(--line); border-radius:14px; cursor:pointer; color:var(--fg); }
.av-seal:hover { border-color:var(--terra); }
.av-seal.eq { border-color:var(--gold); box-shadow:0 0 0 1px var(--gold); }
.av-seal.locked { opacity:.55; cursor:not-allowed; }
.av-seal__art { display:grid; place-items:center; width:54px; height:54px; border-radius:50%; background:var(--terra-soft); color:var(--terra-dk); }
.av-seal.locked .av-seal__art { background:var(--sink); color:var(--muted); filter:grayscale(.6); }
.av-seal__art svg { width:34px; height:34px; }
.av-seal__nm { font-size:11.5px; font-weight:600; text-align:center; line-height:1.15; }
.av-seal__lock { font-family:var(--disp); font-size:11px; font-weight:600; color:var(--muted); }

/* title picker + clickable title */
.sc-prof__title--btn { border:0; background:none; cursor:pointer; padding:0; position:relative; }
.sc-prof__title--btn:hover .sc-prof__tedit { opacity:1; }
.sc-prof__tedit { margin-left:6px; font-size:11px; color:var(--muted); opacity:0; transition:.15s; }
.ttl-list { display:flex; flex-direction:column; gap:7px; padding:8px 16px; }
.ttl-row { display:flex; align-items:center; gap:12px; background:var(--bg); border:1px solid var(--line); border-radius:13px; padding:12px 14px; cursor:pointer; color:var(--fg); text-align:left; }
.ttl-row:hover { border-color:var(--terra); }
.ttl-row.eq { border-color:var(--gold); box-shadow:0 0 0 1px var(--gold); }
.ttl-row.locked { opacity:.55; cursor:not-allowed; }
.ttl-row__ic { display:grid; place-items:center; width:40px; height:40px; flex:none; border-radius:11px; background:var(--terra-soft); color:var(--terra-dk); }
.ttl-row.locked .ttl-row__ic { background:var(--sink); color:var(--muted); }
.ttl-row__ic svg { width:24px; height:24px; }
.ttl-row__b { flex:1; min-width:0; }
.ttl-row__nm { display:block; font-family:var(--disp); font-weight:600; font-size:16px; letter-spacing:.01em; }
.ttl-row__en { display:block; font-size:12px; color:var(--muted); }
.ttl-row__lock { font-family:var(--disp); font-size:12px; font-weight:600; color:var(--muted); }
.ttl-row__on { color:var(--gold); font-weight:800; }
.ttl-row__use { font-family:var(--sans); font-weight:700; font-size:12px; color:var(--terra-dk); }
.sc-prof__id { flex:1; min-width:240px; }
.sc-prof__name { font-family:var(--disp); font-weight:600; font-size:clamp(26px,3vw,36px); margin:0; }
.sc-prof__title { display:inline-flex; align-items:center; gap:8px; font-family:var(--serif); font-style:italic; font-size:15px; color:var(--fg-70); margin:2px 0 12px; }
.sc-prof__title .sc-gl { width:20px; height:20px; color:var(--gold); }
.sc-xp { display:flex; align-items:center; gap:11px; }
.sc-xp__bar { flex:1; max-width:340px; height:10px; border-radius:999px; background:var(--sink); overflow:hidden; }
.sc-xp__fill { display:block; height:100%; background:linear-gradient(90deg,var(--ca),var(--gold)); border-radius:999px; }
.sc-xp__t { font-family:var(--disp); font-weight:500; font-size:12px; letter-spacing:.04em; color:var(--muted); }
.sc-prof__stats { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; margin-top:24px; }
.sc-badges { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:12px; }
.sc-badge { display:flex; flex-direction:column; align-items:center; gap:8px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:18px 12px; text-align:center; }
.sc-badge__gl { width:42px; height:42px; color:var(--ca,var(--gold)); } .sc-badge__gl svg{ width:100%; height:100%; }
.sc-badge__t { font-size:12px; font-weight:600; }
.sc-badge.locked { opacity:.4; filter:grayscale(.6); }

/* ── LEVEL UP ── */
.sc-lu { position:relative; min-height:calc(100vh - 130px); min-height:calc(100dvh - 130px); display:grid; place-items:center; overflow:hidden; padding:40px var(--pad); text-align:center; }
.sc-lu__close { position:absolute; top:18px; right:24px; z-index:5; background:var(--card); border:1px solid var(--line); color:var(--fg); width:38px; height:38px; border-radius:50%; font-size:20px; cursor:pointer; }
@media (pointer: coarse) {
  .sc-lu__close::before { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:44px; height:44px; }
}
.sc-lu__burst { position:absolute; left:50%; top:38%; width:0; height:0; }
.sc-spark { position:absolute; width:9px; height:9px; border-radius:50%; background:var(--ca); box-shadow:0 0 10px var(--ca); }
.sc-lu__in { position:relative; z-index:2; max-width:560px; }
.sc-lu__eyebrow { font-family:var(--disp); font-weight:600; font-size:14px; letter-spacing:.4em; color:var(--terra); margin-bottom:22px; }
.sc-lu__ring { position:relative; width:160px; height:160px; margin:0 auto 26px; border-radius:50%; display:grid; place-items:center; background:radial-gradient(circle, var(--ca-soft), transparent 70%); }
.sc-lu__wreath { position:absolute; inset:0; width:160px; height:160px; color:var(--ca); }
.sc-lu__wreath svg { width:100%; height:100%; }
.sc-lu__num { font-family:var(--disp); font-weight:700; font-size:64px; color:var(--fg); }
.sc-lu__ttl { font-family:var(--disp); font-weight:600; font-size:clamp(30px,4.5vw,48px); text-transform:uppercase; margin:0 0 8px; }
.sc-lu__sub { font-family:var(--serif); font-size:17px; color:var(--fg-70); margin:0 0 26px; }
.sc-lu__rewards { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:28px; }
.sc-lu__reward { display:inline-flex; align-items:center; gap:9px; background:var(--card); border:1px solid var(--ca-mid); border-radius:999px; padding:9px 17px; font-weight:600; font-size:13.5px; }
.sc-lu__ric { color:var(--ca); font-size:16px; }

/* ── TEMPLE ── */
.sc-temple { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:13px; }
.sc-acro { display:flex; flex-direction:column; align-items:center; gap:10px; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:22px 14px; cursor:pointer; color:var(--fg); transition:transform .15s, border-color .15s; }
.sc-acro:hover { transform:translateY(-4px); border-color:var(--ca); }
.sc-acro__art { display:grid; place-items:center; width:74px; height:74px; border-radius:16px; background:var(--ca-tint); color:var(--ca-ink); }
.sc-acro__gl { width:48px; height:48px; } .sc-acro__gl svg{ width:100%; height:100%; }
.sc-acro__t { font-family:var(--disp); font-weight:500; font-size:15px; letter-spacing:.02em; }
.sc-acro__st { font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ca-ink); }
.sc-acro.locked { opacity:.66; }
.sc-acro.locked .sc-acro__art { filter:grayscale(.7); }
.sc-acro.locked .sc-acro__st { color:var(--muted); }
.sc-acro.eq { border-color:var(--ca); box-shadow:0 0 0 1px var(--ca); }
.sc-acro.eq .sc-acro__art { background:var(--ca-mid,var(--ca-tint)); }
.sc-acro.shake { animation:acro-shake .4s; }
.sc-acro-intro { font-family:var(--serif); font-size:14.5px; color:var(--fg-70); margin:-6px 0 16px; max-width:62ch; text-wrap:pretty; }
.sc-slot__hint { display:block; font-family:var(--sans); font-weight:500; font-size:10.5px; line-height:1.3; letter-spacing:.01em; color:var(--muted); margin-top:3px; }

/* ── ANODOS ── */
.sc-anodos { position:relative; display:flex; flex-direction:column; gap:10px; max-width:680px; }
.sc-anodos::before { content:''; position:absolute; left:33px; top:30px; bottom:30px; width:2px; background:linear-gradient(var(--ca), var(--line)); }
.sc-tier { position:relative; display:flex; align-items:center; gap:16px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px 18px; }
.sc-tier__node { display:grid; place-items:center; width:48px; height:48px; flex:none; border-radius:50%; background:var(--sink); color:var(--muted); font-size:18px; border:2px solid var(--line-bold); z-index:1; }
.sc-tier__b { flex:1; }
.sc-tier__gr { display:block; font-family:var(--disp); font-weight:600; font-size:19px; letter-spacing:.02em; }
.sc-tier__en { display:block; font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.sc-tier__rk { font-family:var(--disp); color:var(--gold); letter-spacing:2px; }
.sc-tier--done .sc-tier__node { background:var(--sage); color:#fff; border-color:transparent; }
.sc-tier--now { border-color:var(--ca); box-shadow:0 10px 28px var(--ca-mid); }
.sc-tier--now .sc-tier__node { background:var(--ca); color:#fff; border-color:transparent; }
.sc-tier--lock { opacity:.6; }
.sc-tier__go { margin-left:auto; padding:9px 18px; font-size:13px; }

/* ── TARTARUS decks ── */
.sc-decks { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px; }
.sc-deck { display:flex; align-items:center; gap:13px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px 16px; text-decoration:none; color:var(--fg); transition:transform .15s, border-color .15s; }
.sc-deck:hover { transform:translateX(3px); border-color:var(--ca); }
.sc-deck__gl { display:grid; place-items:center; width:46px; height:46px; flex:none; border-radius:12px; background:var(--ca-soft); color:var(--ca-ink); }
.sc-deck__gl .sc-gl { width:28px; height:28px; } .sc-deck__gl .sc-gl svg{ width:100%; height:100%; }
.sc-deck__b { flex:1; }
.sc-deck__t { display:block; font-weight:700; font-size:14.5px; }
.sc-deck__m { display:block; font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
.sc-deck__due { display:grid; place-items:center; min-width:34px; height:30px; padding:0 9px; border-radius:9px; background:var(--ca); color:#fff; font-family:var(--disp); font-weight:600; }

/* ── TEACHER table ── */
.sc-table { background:var(--card); border:1px solid var(--line); border-radius:18px; overflow:hidden; }
.sc-tr { display:grid; grid-template-columns:2.2fr 1.4fr .9fr 1fr; gap:12px; align-items:center; padding:15px 20px; border-top:1px solid var(--line); font-size:13.5px; }
.sc-tr--h { border-top:0; background:var(--sink); font-family:var(--disp); font-weight:500; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.sc-tr__task { font-weight:700; }
.sc-badge2 { font-style:normal; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:4px 10px; border-radius:999px; }
.sc-badge2--open { background:var(--terra-soft); color:var(--terra-dk); }
.sc-badge2--done { background:color-mix(in srgb,var(--sage) 22%,transparent); color:var(--sage); }
.sc-badge2--late { background:color-mix(in srgb,#c23a2e 20%,transparent); color:#c23a2e; }

/* ── ADMIN ── */
.sc-admin { display:grid; grid-template-columns:1.3fr 1fr; gap:16px; }
.sc-panel { background:var(--card); border:1px solid var(--line); border-radius:20px; padding:20px; border-top:3px solid var(--ca); }
.sc-panel__h { font-family:var(--disp); font-weight:500; font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:14px; }
.sc-act { display:flex; align-items:center; gap:12px; padding:11px 0; border-top:1px solid var(--line); }
.sc-act:first-of-type { border-top:0; }
.sc-act__ic { display:grid; place-items:center; width:32px; height:32px; flex:none; border-radius:9px; background:var(--ca-soft); color:var(--ca-ink); }
.sc-act__t { flex:1; font-size:13.5px; font-weight:600; }
.sc-act__tm { font-size:12px; color:var(--muted); }
.sc-admin__grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.sc-admin__b { display:flex; align-items:center; gap:10px; background:var(--sink); border:1px solid var(--line); border-radius:12px; padding:13px 14px; cursor:pointer; color:var(--fg); font-weight:600; font-size:13.5px; transition:.15s; }
.sc-admin__b:hover { border-color:var(--ca); }
.sc-admin__bi { color:var(--ca-ink); font-size:16px; }

/* ── LOGIN ── */
.sc-login { position:relative; min-height:calc(100vh - 120px); min-height:calc(100dvh - 120px); display:grid; place-items:center; padding:40px var(--pad); }
.sc-login__art { position:absolute; right:8%; top:50%; transform:translateY(-50%); width:min(36vw,440px); color:var(--terra); opacity:.07; pointer-events:none; }
.sc-login__owl { display:block; width:100%; } .sc-login__owl svg{ width:100%; height:100%; }
.orn-subtle .sc-login__art { display:none; }
.sc-login__card { position:relative; width:min(100%,400px); background:var(--card); border:1px solid var(--line); border-radius:24px; padding:34px 30px; box-shadow:0 24px 60px var(--shadow); }
.sc-login__brand { display:flex; align-items:center; gap:10px; justify-content:center; margin-bottom:22px; }
.sc-login__mark { width:30px; height:30px; color:var(--fg); }
.sc-login__wm { font-family:var(--sans); font-weight:800; font-size:21px; } .sc-login__wm span { color:var(--terra); }
.sc-login__tabs { display:flex; gap:8px; justify-content:center; margin-bottom:20px; }
.sc-login__google { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; background:var(--sink); border:1px solid var(--line-bold); border-radius:12px; padding:12px; font-family:var(--sans); font-weight:600; font-size:14px; color:var(--fg); cursor:pointer; }
.sc-login__google:hover { border-color:var(--terra); }
.sc-login__g { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--fg); color:var(--card); font-weight:800; font-size:13px; }
.sc-login__or { text-align:center; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin:16px 0; position:relative; }
.sc-login__or::before, .sc-login__or::after { content:''; position:absolute; top:50%; width:38%; height:1px; background:var(--line); } .sc-login__or::before{left:0;} .sc-login__or::after{right:0;}
.sc-field { display:block; margin-bottom:14px; }
.sc-field__l { display:block; font-size:12px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
.sc-field__i { width:100%; box-sizing:border-box; font-family:var(--sans); font-size:15px; padding:12px 14px; border:1px solid var(--line-bold); border-radius:11px; background:var(--bg); color:var(--fg); }
.sc-field__i:focus { outline:none; border-color:var(--terra); }
.sc-login__go { width:100%; justify-content:center; margin-top:6px; }
.sc-login__back { display:block; width:100%; text-align:center; background:none; border:0; color:var(--muted); font-family:var(--sans); font-size:13px; cursor:pointer; margin-top:14px; }
.sc-login__back:hover { color:var(--terra-dk); }

/* ════════════════════════════════════════════════════════════════════
   REVIEW-2 additions: shared controls, subject tabs, showcase, live2,
   temple, anodos, tartarus, admin2, login sso
   ════════════════════════════════════════════════════════════════════ */
.sc-cta--sm { padding:9px 16px; font-size:13px; }

/* view bar + display toggle + favorites + edit */
.sc-viewbar { display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.sc-viewbar__sp { flex:1; }
.sc-count { font-family:var(--disp); font-weight:500; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.sc-disp { display:inline-flex; background:var(--sink); border:1px solid var(--line); border-radius:9px; padding:2px; gap:2px; }
.sc-disp button { border:0; background:transparent; color:var(--muted); font-size:15px; width:30px; height:28px; border-radius:7px; cursor:pointer; }
.sc-disp button.active { background:var(--card); color:var(--fg); }
.sc-editbtn { display:inline-flex; align-items:center; gap:6px; background:var(--card); border:1px solid var(--line-bold); color:var(--fg); font-family:var(--sans); font-weight:600; font-size:12.5px; padding:7px 12px; border-radius:9px; cursor:pointer; }
.sc-editbtn.on { background:var(--terra-soft); border-color:transparent; color:var(--terra-dk); }
.sc-editbtn__gl { width:14px; height:14px; } .sc-editbtn__gl svg{ width:100%; height:100%; }
.sc-fav { position:absolute; top:10px; left:10px; z-index:3; width:30px; height:30px; border-radius:50%; border:0; background:color-mix(in srgb, var(--bg) 70%, transparent); backdrop-filter:blur(4px); color:var(--muted); font-size:15px; cursor:pointer; transition:.15s; }
.sc-fav:hover { color:var(--gold); }
.sc-fav.on { color:var(--gold); background:color-mix(in srgb, var(--gold) 18%, var(--bg)); }
.sc-edit { outline:none; border-bottom:1.5px dashed var(--terra); cursor:text; }
.sc-draggable { cursor:grab; }
.sc-draggable.dragging { opacity:.5; }
.sc-gcard__drag, .sc-engc__drag { color:var(--muted); font-size:16px; cursor:grab; }
.sc-hint { font-size:12.5px; color:var(--muted); font-style:italic; margin-top:14px; }

/* subject tabs + panes */
.sc-subtabs { display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:18px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.sc-subtabs::-webkit-scrollbar { display:none; }
.sc-subtab { flex:0 0 auto; white-space:nowrap; border:0; background:none; color:var(--muted); font-family:var(--disp); font-weight:500; font-size:14px; letter-spacing:.04em; text-transform:uppercase; padding:11px 16px; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; }
.sc-subtab.active { color:var(--fg); border-color:var(--terra); }
.sc-cards__none { /* placeholder */ }
.sc-cards--list { grid-template-columns:1fr; }
.sc-cards--list .sc-gcard { flex-direction:row; align-items:center; }
.sc-cards--list .sc-gcard__ban { width:96px; height:74px; flex:none; }
.sc-cards--list .sc-gcard__illu { width:40px; height:40px; }
.sc-cards--list .sc-tag { display:none; }
/* compact + gallery display modes (global across subjects, grades, panel) */
.sc-cards--compact { grid-template-columns:repeat(auto-fill,minmax(168px,1fr)); gap:10px; }
.sc-cards--compact .sc-gcard__ban { height:74px; }
.sc-cards--compact .sc-gcard__illu { width:38px; height:38px; }
.sc-cards--gallery { grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:18px; }
.sc-cards--gallery .sc-gcard__ban { height:150px; }
.sc-gcard__eye, .sc-engc__eye { background:var(--sink); border:1px solid var(--line); color:var(--fg-70); width:30px; height:30px; border-radius:8px; cursor:pointer; font-size:13px; }
.sc-gcard__eye:hover, .sc-engc__eye:hover { border-color:var(--terra); color:var(--terra-dk); }
.sc-gcard__f { gap:8px; }

/* results table bits */
.sc-bar { display:inline-block; width:90px; height:7px; border-radius:4px; background:var(--sink); overflow:hidden; vertical-align:middle; }
.sc-bar__f { display:block; height:100%; background:var(--ca,var(--terra)); border-radius:4px; }
.sc-tr__acts { display:flex; gap:7px; flex-wrap:wrap; }
.sc-mini--accent { background:var(--terra-dk); color:#fff; border-color:transparent; }

/* students roster */
.sc-students__bar { display:flex; gap:10px; margin-bottom:16px; }
.sc-search { flex:1; font-family:var(--sans); font-size:14px; padding:11px 14px; border:1px solid var(--line-bold); border-radius:11px; background:var(--bg); color:var(--fg); }
.sc-search:focus { outline:none; border-color:var(--terra); }
.sc-roster { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:11px; }
.sc-rcard { display:flex; align-items:center; gap:11px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 14px; }
.sc-rcard__av { display:grid; place-items:center; width:38px; height:38px; flex:none; border-radius:50%; background:var(--ca,var(--terra-dk)); color:#fff; font-weight:700; }
.sc-rcard__b { flex:1; min-width:0; } .sc-rcard__n { display:block; font-weight:700; font-size:14px; } .sc-rcard__m { display:block; font-size:11.5px; color:var(--muted); }
.sc-rcard__badge { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:color-mix(in srgb,var(--sage) 22%,transparent); color:var(--sage); font-size:13px; }
.sc-rcard__badge.low { background:color-mix(in srgb,#c2553a 18%,transparent); color:#c2553a; }

/* level grammar showcase */
.sc-showcase { background:var(--card); border:1px solid var(--line); border-radius:20px; padding:clamp(16px,2.5vw,24px); margin-bottom:28px; box-shadow:0 10px 30px var(--shadow); }
.sc-showcase__hd { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:16px; }
.sc-showcase__lbl { font-family:var(--disp); font-weight:600; font-size:clamp(18px,2.2vw,24px); letter-spacing:.02em; text-transform:uppercase; }
.sc-showcase__sub { font-family:var(--serif); font-size:14px; color:var(--fg-70); margin:4px 0 0; max-width:34em; }
.sc-showcase__pick { display:flex; gap:6px; }
.sc-showpick { border:1px solid var(--line-bold); background:var(--bg); color:var(--fg-70); font-family:var(--sans); font-weight:600; font-size:12.5px; padding:7px 13px; border-radius:999px; cursor:pointer; }
.sc-showpick.active { background:var(--ca,var(--terra-soft)); border-color:transparent; color:#fff; }
.sc-showcase__frame { border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.sc-showcase__expand { display:inline-flex; align-items:center; gap:4px; margin-top:12px; background:none; border:0; color:var(--ca-ink,var(--terra-dk)); font-family:var(--sans); font-weight:700; font-size:13px; cursor:pointer; }

/* live host/join */
.sc-live2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.sc-host, .sc-join2 { display:flex; flex-direction:column; align-items:flex-start; gap:10px; background:var(--card); border:1.5px solid var(--line); border-radius:22px; padding:26px; text-align:left; color:var(--fg); cursor:pointer; }
.sc-host:hover { border-color:var(--ca,var(--terra)); transform:translateY(-3px); box-shadow:0 16px 34px var(--shadow); transition:.16s; }
.sc-host__ic { display:grid; place-items:center; width:56px; height:56px; border-radius:16px; background:var(--ca-soft,var(--terra-soft)); color:var(--ca-ink,var(--terra-dk)); }
.sc-host__ic .sc-gl { width:34px; height:34px; } .sc-host__ic .sc-gl svg{ width:100%; height:100%; }
.sc-host__t { font-family:var(--disp); font-weight:600; font-size:21px; letter-spacing:.02em; text-transform:uppercase; }
.sc-host__d { font-family:var(--serif); font-size:14px; color:var(--fg-70); }
.sc-join2 { cursor:default; }
.sc-join2__form { display:flex; gap:8px; width:100%; margin-top:4px; }
.sc-join2__pin { flex:1; min-width:0; font-family:var(--disp); font-weight:600; letter-spacing:.2em; text-align:center; text-transform:uppercase; font-size:16px; padding:11px; border:2px solid var(--line-bold); border-radius:12px; background:var(--bg); color:var(--fg); }
.sc-join2__pin:focus { outline:none; border-color:var(--terra); }

/* live config */
.sc-cfg { display:flex; flex-direction:column; gap:18px; max-width:620px; }
.sc-cfg__g { } .sc-cfg__l { font-family:var(--disp); font-weight:500; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:9px; }
.sc-cfg__opts { display:flex; gap:8px; flex-wrap:wrap; }
.sc-cfg__o { border:1.5px solid var(--line-bold); background:var(--card); color:var(--fg); font-family:var(--sans); font-weight:600; font-size:13.5px; padding:10px 18px; border-radius:12px; cursor:pointer; }
.sc-cfg__o.active { background:var(--ca,var(--terra-dk)); border-color:transparent; color:#fff; }
.sc-cfg__foot { display:flex; justify-content:space-between; gap:10px; margin-top:6px; }
.sc-cfg-recap { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:18px; }

/* ── TEMPLE ── */
.sc-kleos { display:inline-flex; align-items:center; gap:7px; background:var(--card); border:1px solid var(--gold); border-radius:999px; padding:8px 15px; font-size:13px; font-weight:600; color:var(--muted); }
.sc-kleos b { color:var(--gold); font-family:var(--disp); font-size:17px; }
.sc-kleos__gl { width:18px; height:18px; color:var(--gold); } .sc-kleos__gl svg{ width:100%; height:100%; }
.sc-altar { position:relative; display:grid; place-items:center; min-height:240px; border-radius:22px; overflow:hidden; background:radial-gradient(circle at 50% 40%, var(--ca-soft,transparent), transparent 60%), var(--card); border:1px solid var(--line); margin-bottom:8px; }
.sc-ritual { position:absolute; inset:0; display:grid; place-items:center; color:var(--ca,var(--gold)); opacity:.5; pointer-events:none; }
/* mouse-fx particle layer — sits over the stage, never blocks input */
#sym-mousefx { position:fixed; inset:0; z-index:9000; pointer-events:none; overflow:hidden; }
#sym-mousefx .mfx { position:fixed; left:0; top:0; will-change:transform,opacity; opacity:0; pointer-events:none; user-select:none; font-family:'Apple Color Emoji','Segoe UI Symbol',sans-serif; }
.sc-slot__ch { display:grid; place-items:center; font-size:22px; line-height:1; }
/* worn title badge on the altar */
.sc-altar__title { display:none; }
.sc-altar__title.on { display:inline-block; margin:0 auto 8px; padding:3px 13px; border-radius:999px; font-family:var(--serif,'Alegreya',Georgia,serif); font-weight:700; font-size:13.5px; letter-spacing:.02em; text-transform:none; color:var(--ca-ink,var(--gold)); border:1px solid color-mix(in srgb, var(--ca,var(--gold)) 46%, transparent); background:color-mix(in srgb, var(--ca,var(--gold)) 12%, transparent); }
/* titles grid */
.sc-titles { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px; margin-bottom:30px; }
.sc-title-card { display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:13px; row-gap:10px; align-items:center; padding:15px; border:1px solid var(--line-bold); border-radius:14px; background:var(--card); transition:border-color .16s, box-shadow .16s; }
.sc-title-card.eq { border-color:var(--ca); box-shadow:0 0 0 1px var(--ca); }
.sc-title-card.locked { opacity:.92; }
.sc-title-card__rk { grid-row:1 / span 2; width:42px; height:42px; display:grid; place-items:center; border-radius:11px; font-family:var(--disp,'Oswald',sans-serif); font-weight:700; font-size:15px; letter-spacing:.04em; color:var(--ca-ink,var(--gold)); background:color-mix(in srgb, var(--ca,var(--gold)) 13%, transparent); border:1px solid color-mix(in srgb, var(--ca,var(--gold)) 32%, transparent); }
.sc-title-card__b { grid-column:2; grid-row:1; min-width:0; }
.sc-title-card .sc-boon__btn { grid-column:2; grid-row:2; justify-self:start; }
/* oracle reward line */
.sc-oracle__reward { display:flex; align-items:center; gap:7px; margin:6px 0 0; font-family:var(--sans); font-weight:600; font-size:12.5px; color:var(--ca-ink,var(--gold)); }
.sc-oracle__rk { width:15px; height:15px; flex:none; color:var(--ca-ink,var(--gold)); }
.sc-ritual svg { width:min(90%,360px); height:auto; }
.sc-ritual .rr1 { transform-origin:150px 150px; animation:rr-spin 80s linear infinite; }
.sc-ritual .rr2 { transform-origin:150px 150px; animation:rr-spin 120s linear infinite reverse; }
@keyframes rr-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){ .sc-ritual .rr1,.sc-ritual .rr2{ animation:none; } }
.sc-altar__center { position:relative; z-index:1; text-align:center; }
.sc-altar__illu { display:block; width:86px; height:86px; margin:0 auto 10px; color:var(--ca-ink,var(--terra-dk)); } .sc-altar__illu svg{ width:100%; height:100%; }
.sc-altar__nm { font-family:var(--disp); font-weight:600; font-size:22px; letter-spacing:.02em; text-transform:uppercase; }
.sc-altar__sub { font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-top:2px; }

/* altar backdrop variants (driven by equipped backdrop cosmetic) */
.sc-altar--bd-embers { background:radial-gradient(circle at 50% 80%, color-mix(in srgb,var(--terra) 22%,transparent), transparent 55%), var(--card); }
.sc-altar--bd-frieze { background:repeating-linear-gradient(90deg, color-mix(in srgb,var(--ca) 7%,var(--card)) 0 18px, var(--card) 18px 22px); }
.sc-altar--bd-aether { background:radial-gradient(circle at 50% 30%, color-mix(in srgb,var(--ca) 20%,transparent), transparent 60%), linear-gradient(180deg, color-mix(in srgb,var(--ca) 8%,var(--card)), var(--card)); }
.sc-altar__corner { position:absolute; width:80px; height:80px; color:var(--ca); opacity:.12; pointer-events:none; }
.sc-altar__corner svg { width:100%; height:100%; }
.sc-altar__corner--l { left:16px; bottom:16px; }
.sc-altar__corner--r { right:16px; bottom:16px; transform:scaleX(-1); }
.orn-subtle .sc-altar__corner { display:none; }

/* sticky pillar nav */
.sc-tnav { position:sticky; top:60px; z-index:30; display:flex; gap:5px; flex-wrap:wrap; padding:8px; margin:14px 0 6px; background:color-mix(in srgb,var(--card) 88%,transparent); backdrop-filter:blur(10px); border:1px solid var(--line); border-radius:14px; }
.sc-tnav__b { flex:1; min-width:90px; border:0; background:none; color:var(--fg-70); font-family:var(--disp); font-weight:500; font-size:13px; letter-spacing:.04em; text-transform:uppercase; padding:9px 8px; border-radius:9px; cursor:pointer; }
.sc-tnav__b:hover { background:var(--sink); color:var(--fg); }
.sc-tnav__b.on { background:var(--terra-soft); color:var(--terra-dk); }

/* quest reroll + saga rite */
.sc-reroll { display:inline-flex; align-items:center; gap:5px; background:var(--card); border:1px solid var(--line-bold); color:var(--fg); font-family:var(--sans); font-weight:600; font-size:12.5px; padding:8px 13px; border-radius:999px; cursor:pointer; }
.sc-reroll:hover { border-color:var(--gold); color:var(--gold); }
.sc-rite-cta { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:14px; }
.sc-rite-cta__n { font-family:var(--serif); font-style:italic; font-size:14px; color:var(--fg-70); }
.sc-slots { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:11px; }
.sc-slot { display:flex; align-items:center; gap:12px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px; cursor:pointer; color:var(--fg); text-align:left; transition:.15s; }
.sc-slot:hover { border-color:var(--ca,var(--terra)); }
.sc-slot__art { display:grid; place-items:center; width:46px; height:46px; flex:none; border-radius:12px; background:var(--ca-soft,var(--terra-soft)); color:var(--ca-ink,var(--terra-dk)); }
.sc-slot__gl { width:28px; height:28px; } .sc-slot__gl svg{ width:100%; height:100%; }
.sc-slot__b { flex:1; } .sc-slot__l { display:block; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); } .sc-slot__v { display:block; font-family:var(--disp); font-weight:600; font-size:15px; }
.sc-slot__edit { color:var(--muted); }
.sc-quests { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:11px; }
.sc-quest { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:15px; }
.sc-quest.done { border-color:var(--sage); }
.sc-quest__kind { font-family:var(--disp); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--ca-ink,var(--terra-dk)); }
.sc-quest__t { font-weight:700; font-size:14.5px; margin:5px 0 10px; }
.sc-quest__bar { height:7px; border-radius:4px; background:var(--sink); overflow:hidden; }
.sc-quest__fill { display:block; height:100%; background:var(--ca,var(--terra)); }
.sc-quest__foot { display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.sc-quest__p { font-family:var(--disp); font-weight:600; font-size:13px; color:var(--muted); }
.sc-quest__claim { font-family:var(--sans); font-weight:700; font-size:12px; padding:6px 12px; border-radius:999px; border:0; background:var(--gold); color:#1a1407; cursor:pointer; }
.sc-quest__claim.off { background:var(--sink); color:var(--muted); cursor:not-allowed; }
.sc-saga { display:flex; gap:8px; flex-wrap:wrap; }
.sc-sagac { display:flex; align-items:center; gap:8px; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:10px 14px; }
.sc-sagac__n { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:var(--sink); color:var(--muted); font-size:12px; }
.sc-sagac__t { font-family:var(--disp); font-weight:500; font-size:14px; letter-spacing:.02em; }
.sc-sagac--done .sc-sagac__n { background:var(--sage); color:#fff; }
.sc-sagac--now { border-color:var(--ca,var(--terra)); } .sc-sagac--now .sc-sagac__n { background:var(--ca,var(--terra)); color:#fff; }
.sc-sagac--lock { opacity:.6; }
.sc-saga__bar { position:relative; height:10px; border-radius:6px; background:var(--sink); margin-top:12px; overflow:visible; }
.sc-saga__fill { display:block; height:100%; border-radius:6px; background:linear-gradient(90deg,var(--ca,var(--terra)),var(--gold)); }
.sc-saga__t { position:absolute; right:0; top:14px; font-family:var(--disp); font-size:11px; letter-spacing:.06em; color:var(--muted); }

/* Temple — boons · consumables · achievements · oracles */
.sc-templ-hd { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:30px 0 14px; }
.sc-loadout { font-family:var(--disp); font-weight:500; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.sc-loadout b { color:var(--gold); }
.sc-boons { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:11px; }
.sc-boons.shake { animation:acro-shake .4s; }
.sc-boon { display:flex; flex-direction:column; gap:9px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:15px; }
.sc-boon.slotted { border-color:var(--gold); box-shadow:0 0 0 1px var(--gold); }
.sc-boon__top { display:flex; align-items:center; gap:11px; }
.sc-boon__ic { display:grid; place-items:center; width:42px; height:42px; flex:none; border-radius:12px; background:var(--ca-soft,var(--terra-soft)); color:var(--ca-ink,var(--terra-dk)); }
.sc-boon__ic .sc-gl { width:26px; height:26px; } .sc-boon__ic .sc-gl svg{ width:100%; height:100%; }
.sc-boon__nm { font-family:var(--disp); font-weight:600; font-size:16px; letter-spacing:.01em; margin:0; }
.sc-boon__en { font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
.sc-boon__eff { font-family:var(--serif); font-size:13.5px; color:var(--fg-70); margin:0; line-height:1.35; }
.sc-boon__btn { align-self:flex-start; display:inline-flex; align-items:center; gap:6px; font-family:var(--sans); font-weight:700; font-size:12.5px; padding:8px 14px; border-radius:999px; border:1px solid var(--line-bold); background:var(--card); color:var(--fg); cursor:pointer; }
.sc-boon__btn.on { background:var(--gold); border-color:transparent; color:#1a1407; }
.sc-boon__btn.buy { background:var(--terra-dk); border-color:transparent; color:#fff; }
.sc-boon__btn.off { opacity:.5; cursor:not-allowed; }
.sc-boon__k { width:14px; height:14px; } .sc-boon__k svg{ width:100%; height:100%; }
.sc-cons { display:flex; flex-direction:column; gap:8px; }
.sc-charge { display:flex; align-items:center; gap:13px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 16px; }
.sc-charge__b { flex:1; min-width:0; }
.sc-charge__have { display:grid; place-items:center; min-width:34px; height:34px; border-radius:9px; background:var(--sink); font-family:var(--disp); font-weight:600; font-size:16px; color:var(--gold); }
.sc-charge__act { display:flex; gap:7px; }
.sc-tstats { display:grid; grid-template-columns:repeat(5,1fr); gap:11px; }
.sc-tstat { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px; text-align:center; }
.sc-tstat.gold { border-color:var(--gold); }
.sc-tstat__v { font-family:var(--disp); font-weight:600; font-size:26px; }
.sc-tstat.gold .sc-tstat__v { color:var(--gold); }
.sc-tstat__l { font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-top:4px; }
.sc-medals { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:11px; }
.sc-medal { display:flex; align-items:center; gap:14px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px; }
.sc-medal.earned { border-color:var(--ca,var(--gold)); }
.sc-medal__ring { position:relative; display:grid; place-items:center; width:54px; height:54px; flex:none; border-radius:50%; }
.sc-medal__ring::after { content:''; position:absolute; inset:5px; border-radius:50%; background:var(--card); }
.sc-medal__ic { position:relative; z-index:1; width:26px; height:26px; color:var(--ca-ink,var(--terra-dk)); } .sc-medal__ic svg{ width:100%; height:100%; }
.sc-medal__b { flex:1; min-width:0; }
.sc-medal__p { display:block; font-family:var(--disp); font-weight:500; font-size:11px; letter-spacing:.04em; color:var(--muted); margin-top:4px; }
.sc-oracles { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:11px; }
.sc-oracles.shake { animation:acro-shake .4s; }
.sc-oracle { display:flex; flex-direction:column; align-items:flex-start; gap:8px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px; }
.sc-oracle.eq { border-color:var(--gold); box-shadow:0 0 0 1px var(--gold); }
.sc-oracle__ic { display:grid; place-items:center; width:46px; height:46px; border-radius:13px; background:var(--ca-soft,var(--terra-soft)); color:var(--ca-ink,var(--terra-dk)); }
.sc-oracle__ic .sc-gl { width:28px; height:28px; } .sc-oracle__ic .sc-gl svg{ width:100%; height:100%; }
@media (max-width:820px){ .sc-tstats { grid-template-columns:repeat(2,1fr); } }

/* admin — messaging, subscriptions, hero slides, about, feedback */
.sc-textarea { width:100%; box-sizing:border-box; font-family:var(--sans); font-size:14px; line-height:1.5; padding:11px 13px; border:1px solid var(--line-bold); border-radius:11px; background:var(--bg); color:var(--fg); resize:vertical; }
.sc-textarea:focus { outline:none; border-color:var(--terra); }
.sc-msg { margin-bottom:18px; display:flex; flex-direction:column; gap:7px; }
.sc-msg__foot { display:flex; gap:8px; }
.sc-bundles { display:flex; gap:9px; flex-wrap:wrap; }
.sc-bundle { position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:2px; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:12px 16px; min-width:110px; }
.sc-bundle b { font-family:var(--disp); font-weight:600; font-size:15px; }
.sc-bundle__off { font-size:12px; font-weight:700; color:var(--sage); }
.sc-bundle__x { position:absolute; top:5px; right:7px; border:0; background:none; color:#c2553a; font-size:14px; cursor:pointer; }
.sc-bundle--add { border-style:dashed; color:var(--terra-dk); font-weight:600; font-size:13px; cursor:pointer; justify-content:center; align-items:center; }
.sc-slides { display:flex; flex-direction:column; gap:9px; }
.sc-slide { display:flex; align-items:flex-start; gap:10px; background:var(--card); border:1px solid var(--line); border-radius:13px; padding:11px; }
.sc-slide__ic { display:grid; place-items:center; width:46px; height:46px; flex:none; border-radius:11px; background:var(--terra-soft); color:var(--terra-dk); cursor:pointer; }
.sc-slide__ic .sc-gl { width:28px; height:28px; } .sc-slide__ic .sc-gl svg{ width:100%; height:100%; }
.sc-slide__b { flex:1; min-width:0; display:flex; flex-direction:column; gap:7px; }
.sc-slide__del { border:0; background:var(--sink); color:#c2553a; width:30px; height:30px; border-radius:8px; font-size:16px; cursor:pointer; flex:none; }
.sc-slide__foot { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.sc-fbs { display:flex; flex-direction:column; gap:9px; }
.sc-fb { background:var(--card); border:1px solid var(--line); border-radius:13px; padding:14px 16px; }
.sc-fb.new { border-color:var(--ca,var(--terra)); }
.sc-fb__hd { display:flex; align-items:center; gap:9px; margin-bottom:6px; }
.sc-fb__n { font-weight:700; font-size:14px; }
.sc-fb__stars { color:var(--gold); font-size:13px; letter-spacing:1px; }
.sc-fb__new { margin-left:auto; font-family:var(--disp); font-size:9px; font-weight:700; letter-spacing:.08em; color:#fff; background:var(--terra-dk); padding:3px 7px; border-radius:5px; }
.sc-fb__t { font-family:var(--serif); font-size:14px; color:var(--fg-70); margin:0 0 9px; line-height:1.4; }
.sc-fb__act { display:flex; gap:7px; }
.sc-fb__kind { font-family:var(--disp); font-size:9px; font-weight:700; letter-spacing:.08em; color:var(--sage); background:color-mix(in srgb,var(--sage) 16%,transparent); padding:3px 8px; border-radius:5px; }
.sc-fb__kind--bug { color:#c2553a; background:color-mix(in srgb,#c2553a 14%,transparent); }
.sc-fb__kind--contact { color:var(--terra-dk); background:var(--terra-soft); }
.sc-fb--bug { border-left:3px solid #c2553a; }
.sc-fb__ref { font-family:var(--disp); font-size:11.5px; font-weight:600; color:var(--muted); margin:0 0 9px; letter-spacing:.02em; }

/* admin · guides editor */
.sc-guides { display:flex; flex-direction:column; gap:14px; }
.sc-guide { border:1px solid var(--line-bold); border-radius:14px; padding:14px; background:var(--bg); display:flex; flex-direction:column; gap:9px; }
.sc-guide__hd { display:flex; align-items:center; gap:10px; }
.sc-guide__no { font-family:var(--disp); font-weight:700; font-size:13px; color:var(--muted); flex:none; }
.sc-guide__hl { flex:1; font-family:var(--disp); font-weight:700; font-size:15px; }
.sc-guide__in { width:100%; padding:9px 11px; border-radius:9px; border:1.5px solid var(--line-bold); background:var(--card); color:var(--fg); font-family:var(--sans); font-size:13.5px; }
.sc-guide__in:focus { outline:none; border-color:var(--ca, var(--terra)); }
.sc-guide__ta { resize:vertical; line-height:1.5; }
.sc-guide__row { display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; }
.sc-guide__sl { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--muted); white-space:nowrap; }
.sc-guide__sel { padding:8px 10px; border-radius:9px; border:1.5px solid var(--line-bold); background:var(--card); color:var(--fg); font-family:var(--sans); font-size:13px; }

/* subscribe / pricing (customer-facing) */
.sub-types { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:11px; margin-bottom:16px; }
.sub-type { display:flex; flex-direction:column; align-items:flex-start; gap:4px; background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:16px; cursor:pointer; color:var(--fg); text-align:left; transition:.15s; }
.sub-type.on { border-color:var(--terra); background:color-mix(in srgb,var(--terra) 7%,var(--card)); }
.sub-type__ic { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:var(--terra-soft); color:var(--terra-dk); margin-bottom:4px; }
.sub-type__ic .sc-gl { width:26px; height:26px; } .sub-type__ic .sc-gl svg{ width:100%; height:100%; }
.sub-type__t { font-family:var(--disp); font-weight:600; font-size:18px; letter-spacing:.01em; text-transform:uppercase; }
.sub-type__d { font-family:var(--serif); font-size:13.5px; color:var(--fg-70); }
.sub-cls { display:flex; flex-direction:column; gap:6px; max-width:380px; margin-bottom:18px; }
.sub-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:11px; margin-bottom:8px; }
.sub-card { position:relative; display:flex; flex-direction:column; align-items:center; gap:3px; background:var(--card); border:1.5px solid var(--line); border-radius:18px; padding:22px 14px 16px; cursor:pointer; color:var(--fg); transition:.15s; }
.sub-card:hover { border-color:var(--line-bold); }
.sub-card.on { border-color:var(--ca,var(--terra)); box-shadow:0 8px 24px var(--shadow); }
.sub-card.pop { border-color:var(--gold); }
.sub-card__tag { position:absolute; top:-10px; left:50%; transform:translateX(-50%); font-family:var(--disp); font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#1a1407; background:var(--gold); padding:4px 11px; border-radius:999px; white-space:nowrap; }
.sub-card__save { position:absolute; top:10px; right:10px; font-size:11px; font-weight:700; color:var(--sage); }
.sub-card__dur { font-family:var(--disp); font-weight:500; font-size:14px; letter-spacing:.02em; text-transform:uppercase; color:var(--muted); }
.sub-card__price { font-family:var(--disp); font-weight:600; font-size:30px; color:var(--fg); }
.sub-card__per { font-size:12px; color:var(--muted); }
.sub-card__chk { display:grid; place-items:center; width:24px; height:24px; margin-top:8px; border-radius:50%; border:1.5px solid var(--line-bold); color:transparent; font-size:13px; font-weight:800; }
.sub-card__chk.on { background:var(--ca,var(--terra)); border-color:transparent; color:#fff; }
.sub-feats { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:11px; }
.sub-feat { display:flex; align-items:flex-start; gap:12px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px; }
.sub-feat__ic { display:grid; place-items:center; width:40px; height:40px; flex:none; border-radius:11px; background:var(--gold-soft); color:var(--gold); }
.sub-feat__ic .sc-gl { width:24px; height:24px; } .sub-feat__ic .sc-gl svg{ width:100%; height:100%; }
.sub-feat__t { font-weight:700; font-size:14.5px; }
.sub-feat__d { font-size:12.5px; color:var(--muted); }
.sub-bar { position:sticky; bottom:14px; z-index:20; display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:24px; padding:14px 18px; background:color-mix(in srgb,var(--card) 92%,transparent); backdrop-filter:blur(12px); border:1px solid var(--line-bold); border-radius:18px; box-shadow:0 16px 40px var(--shadow); }
.sub-bar__sum { flex:1; min-width:160px; }
.sub-bar__plan { font-size:12px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; color:var(--muted); }
.sub-bar__price { font-family:var(--disp); font-weight:600; font-size:26px; }
.sub-bar__cyc { font-size:13px; color:var(--muted); font-family:var(--sans); font-weight:600; }
.sub-bar__go { white-space:nowrap; }
.sub-co { width:min(420px,94vw); background:var(--card); border:1px solid var(--line-bold); border-radius:18px; padding:18px; box-shadow:0 40px 90px rgba(0,0,0,.5); display:flex; flex-direction:column; gap:11px; }
.sub-co__sum { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; background:var(--sink); border-radius:11px; font-family:var(--disp); }
.sub-co__sum b { font-size:20px; color:var(--terra-dk); }

/* account / billing */
.acc-plan { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px; border-left:4px solid var(--ca); margin-bottom:8px; }
.acc-plan__l { display:flex; align-items:center; gap:14px; }
.acc-plan__badge { display:grid; place-items:center; min-width:54px; height:54px; padding:0 12px; border-radius:13px; background:var(--gold); color:#1a1407; font-family:var(--disp); font-weight:600; font-size:18px; letter-spacing:.04em; }
.acc-plan__nm { font-family:var(--disp); font-weight:600; font-size:19px; letter-spacing:.01em; }
.acc-plan__sub { font-size:13px; color:var(--muted); margin-top:2px; }
.acc-plan__act { display:flex; gap:8px; }
.acc-pay { display:flex; align-items:center; gap:13px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px 16px; flex-wrap:wrap; }
.acc-pay__card { font-family:var(--disp); font-weight:700; font-size:13px; letter-spacing:.06em; color:#1a3a8f; background:#e8eefc; padding:5px 10px; border-radius:6px; }
.acc-pay__no { font-family:var(--disp); letter-spacing:.1em; font-size:15px; }
.acc-pay__exp { font-size:13px; color:var(--muted); }
.acc-rcpt { width:min(380px,94vw); background:var(--card); border:1px solid var(--line-bold); border-radius:18px; padding:20px; box-shadow:0 40px 90px rgba(0,0,0,.5); }
.acc-rcpt__hd { display:flex; align-items:center; gap:9px; margin-bottom:16px; }
.acc-rcpt__mark { width:26px; height:26px; color:var(--fg); }
.acc-rcpt__wm { font-family:var(--sans); font-weight:800; font-size:18px; } .acc-rcpt__wm span { color:var(--terra); }
.acc-rcpt__ttl { font-family:var(--disp); font-weight:600; font-size:16px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-bottom:12px; }
.acc-rcpt__rows { display:flex; flex-direction:column; gap:9px; }
.acc-rcpt__row { display:flex; align-items:center; justify-content:space-between; font-size:14px; }
.acc-rcpt__row span { color:var(--muted); }
.acc-rcpt__total { display:flex; align-items:center; justify-content:space-between; margin-top:14px; padding-top:12px; border-top:1px solid var(--line); font-family:var(--disp); }
.acc-rcpt__total b { font-size:22px; color:var(--terra-dk); }

/* ── ANODOS ── */
.sc-rite { position:relative; display:grid; place-items:center; min-height:220px; border-radius:22px; overflow:hidden; background:radial-gradient(circle at 50% 35%, var(--ca-soft,transparent), transparent 62%), var(--card); border:1px solid var(--line); margin-bottom:22px; }
.sc-rite__in { position:relative; z-index:1; text-align:center; max-width:480px; padding:24px; }
.sc-rite__eyebrow { font-family:var(--disp); font-weight:600; font-size:11px; letter-spacing:.3em; color:var(--ca-ink,var(--terra)); margin-bottom:12px; }
.sc-rite__q { font-family:var(--serif); font-size:21px; font-weight:600; line-height:1.35; margin-bottom:16px; }
.sc-rite__opts { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.sc-rite__o { font-family:var(--serif); font-size:17px; padding:9px 18px; border-radius:12px; border:1.5px solid var(--line-bold); background:var(--card); color:var(--fg); cursor:pointer; }
.sc-rite__o.ok { background:var(--sage); border-color:transparent; color:#fff; }
.sc-rite__o.no { background:color-mix(in srgb,#c2553a 18%,var(--card)); border-color:#c2553a; }
.sc-anodos__hd { display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.sc-anodos__run { font-family:var(--disp); font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }

/* ── TARTARUS ── */
.sc-cat { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
.sc-cat__l { font-family:var(--disp); font-weight:500; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.sc-cat .sc-fils { margin-bottom:0; }
.sc-mistakes { display:flex; flex-direction:column; gap:9px; }
.sc-mis { display:flex; align-items:center; gap:13px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:13px 16px; }
.sc-mis__n { display:grid; place-items:center; min-width:42px; height:34px; border-radius:9px; background:color-mix(in srgb,var(--ca) 14%,var(--card)); color:var(--ca-ink); font-family:var(--disp); font-weight:600; }
.sc-mis__b { flex:1; min-width:0; } .sc-mis__q { font-weight:700; font-size:14.5px; }
.sc-mis__ans { display:flex; gap:14px; font-family:var(--serif); font-size:14px; margin-top:3px; }
.sc-mis__wrong { color:#c2553a; text-decoration:line-through; opacity:.8; }
.sc-mis__right { color:var(--sage); font-weight:600; }
.sc-tartbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:30px 0 14px; flex-wrap:wrap; }
.sc-clear { display:inline-flex; align-items:center; gap:7px; background:none; border:1px solid var(--line-bold); color:var(--muted); font-family:var(--sans); font-weight:600; font-size:13px; padding:9px 15px; border-radius:999px; cursor:pointer; }
.sc-clear:hover { border-color:#c2553a; color:#c2553a; }
.sc-clear.confirm { border-color:#c2553a; color:#c2553a; background:color-mix(in srgb,#c2553a 12%,transparent); }
.sc-clear.done { border-color:var(--sage); color:var(--sage); }

/* share modal */
.sc-share { width:min(440px,94vw); background:var(--card); border:1px solid var(--line-bold); border-radius:18px; overflow:hidden; box-shadow:0 40px 90px rgba(0,0,0,.5); }
.sc-share__hd { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--line); font-family:var(--disp); font-weight:600; letter-spacing:.02em; }
.sc-share__sub { font-family:var(--serif); font-size:14px; color:var(--fg-70); padding:14px 16px 6px; margin:0; }
.sc-share__to { display:flex; align-items:center; gap:10px; margin:8px 16px; padding:11px 13px; background:var(--sink); border-radius:12px; }
.sc-share__cls { color:var(--muted); }
.sc-share__opts { padding:6px 16px 0; display:flex; flex-direction:column; gap:8px; }
.sc-share__opt { display:flex; align-items:center; gap:9px; font-size:13.5px; }
.sc-share__foot { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:16px; }
.sc-share__done { display:flex; flex-direction:column; align-items:center; gap:10px; padding:40px 20px; font-family:var(--disp); font-weight:600; font-size:18px; }
.sc-share__check { display:grid; place-items:center; width:54px; height:54px; border-radius:50%; background:var(--sage); color:#fff; font-size:26px; }

/* ── ADMIN 2 ── */
.sc-admin2 { display:grid; grid-template-columns:208px 1fr; gap:16px; }
.sc-admin2__rail { display:flex; flex-direction:column; gap:3px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:8px; align-content:start; }
.sc-admin2__nav { display:flex; align-items:center; gap:10px; padding:10px 12px; border:0; background:none; color:var(--fg-70); font-family:var(--sans); font-weight:600; font-size:13.5px; border-radius:10px; cursor:pointer; text-align:left; }
.sc-admin2__nav:hover { background:var(--sink); }
.sc-admin2__nav.active { background:var(--ca-soft,var(--terra-soft)); color:var(--ca-ink,var(--terra-dk)); }
.sc-admin2__ic { width:20px; text-align:center; color:var(--ca-ink,var(--terra)); }
.sc-admin2__pane { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:18px; min-height:300px; }
.sc-adrow { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 2px; border-top:1px solid var(--line); font-size:14px; }
.sc-adrow:first-of-type { border-top:0; }
.sc-toggle { width:42px; height:24px; border-radius:999px; border:0; background:var(--sink); position:relative; cursor:pointer; transition:.16s; }
.sc-toggle.on { background:var(--sage); }
.sc-toggle__k { position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; transition:.16s; }
.sc-toggle.on .sc-toggle__k { left:21px; }
.sc-admin__games { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:9px; margin-top:10px; }
.sc-admin__game { position:relative; display:flex; flex-direction:column; align-items:center; gap:8px; padding:16px 10px; background:var(--bg); border:1px solid var(--line); border-radius:14px; cursor:pointer; color:var(--fg); font-size:12.5px; font-weight:600; text-align:center; }
.sc-admin__game:hover { border-color:var(--ca,var(--terra)); }
.sc-admin__gicon { width:38px; height:38px; color:var(--ca-ink,var(--terra-dk)); } .sc-admin__gicon svg{ width:100%; height:100%; }
.sc-admin__qa { position:absolute; top:7px; right:7px; font-family:var(--disp); font-size:9px; font-weight:700; letter-spacing:.08em; color:var(--gold); border:1px solid var(--gold); padding:2px 5px; border-radius:5px; }
.sc-editor { display:flex; flex-direction:column; gap:9px; }
.sc-editor__row, .sc-editor__opt { display:flex; align-items:center; gap:9px; }
.sc-editor__l { width:80px; font-size:12px; color:var(--muted); }
.sc-editor__opt .sc-field__i { flex:1; }
.sc-editor__foot { display:flex; justify-content:flex-end; gap:8px; margin-top:8px; }

/* login sso */
.sc-login__sso { display:flex; flex-direction:column; gap:8px; }
.sc-sso { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; background:var(--sink); border:1px solid var(--line-bold); border-radius:12px; padding:11px; font-family:var(--sans); font-weight:600; font-size:14px; color:var(--fg); cursor:pointer; }
.sc-sso:hover { border-color:var(--terra); }
.sc-sso__g { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; color:#fff; font-weight:800; font-size:13px; }
.sc-sso__g--google { background:#4285F4; }
.sc-sso__g--ms { background:#0078D4; }
.sc-login__h { font-family:var(--disp); font-weight:600; font-size:22px; text-align:center; margin:0 0 6px; }
.sc-login__p { font-family:var(--serif); font-size:14px; color:var(--fg-70); text-align:center; margin:0 0 16px; }
.sc-login__forgot { position:absolute; right:0; top:0; background:none; border:0; color:var(--terra-dk); font-family:var(--sans); font-weight:600; font-size:12px; cursor:pointer; }
.sc-field { position:relative; }

@media (max-width:820px){
  .sc-stats, .sc-prof__stats { grid-template-columns:repeat(2,1fr); }
  .sc-live, .sc-live2 { grid-template-columns:minmax(0,1fr); }
  .sc-admin, .sc-admin2 { grid-template-columns:1fr; }
  .sc-admin2__rail { flex-direction:row; flex-wrap:wrap; }
  /* wrap the page-header action row (class picker + CTAs) so it never forces a
     horizontal overflow / browser zoom-out on narrow phones. */
  .sc-head__act { margin-left:0; width:100%; flex-wrap:wrap; }
}

/* ════════════════════════════════════════════════════════════════════
   REVIEW-3 additions: level (deployed look) · live config controls ·
   game-mode bar · login sso brands
   ════════════════════════════════════════════════════════════════════ */
.lv-share { display:inline-flex; align-items:center; gap:8px; background:var(--card); border:1px solid var(--terra); color:var(--terra-dk); font-family:var(--disp); font-weight:500; font-size:12px; letter-spacing:.08em; text-transform:uppercase; padding:9px 15px; border-radius:8px; cursor:pointer; }
.lv-share:hover { background:var(--terra-soft); }
.lv-share__gl { width:15px; height:15px; } .lv-share__gl svg{ width:100%; height:100%; }

/* ── bottom "share to class" action (replaces the old header lv-share) ── */
.lv-sharebtn { display:flex; align-items:center; gap:14px; width:100%; margin-top:18px; padding:16px 20px; background:linear-gradient(180deg, var(--ca-tint,var(--card)), var(--card)); border:1px solid var(--line); border-radius:16px; cursor:pointer; color:var(--fg); text-align:left; transition:.16s; }
.lv-sharebtn:hover { border-color:var(--ca,var(--terra)); transform:translateY(-2px); box-shadow:0 12px 28px var(--shadow); }
.lv-sharebtn__gl { display:grid; place-items:center; width:42px; height:42px; flex:none; border-radius:12px; background:var(--ca,var(--terra)); color:#fff; }
.lv-sharebtn__gl svg { width:22px; height:22px; }
.lv-sharebtn__b { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.lv-sharebtn__t { font-family:var(--disp); font-weight:600; font-size:16px; letter-spacing:.02em; text-transform:uppercase; }
.lv-sharebtn__d { font-size:12.5px; color:var(--muted); }
.lv-sharebtn__qr { flex:none; font-size:30px; line-height:1; color:var(--ca-ink,var(--terra-dk)); opacity:.9; }

.lv-progress { display:flex; align-items:center; gap:13px; margin-bottom:18px; }
.lv-progress__bar { flex:1; height:4px; border-radius:3px; background:var(--sink); overflow:hidden; }
.lv-progress__fill { display:block; height:100%; background:var(--ca,var(--terra)); }
.lv-progress__t { font-size:12px; font-weight:600; letter-spacing:.04em; color:var(--muted); white-space:nowrap; }

.lv-shell { display:grid; grid-template-columns:230px 1fr; gap:16px; }
.lv-cats { display:flex; flex-direction:column; gap:7px; align-content:start; }
.lv-cats__hd { font-family:var(--disp); font-weight:500; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); padding:0 4px 4px; }
/* Categories — non-active rails read as quiet-but-legible tabs, the active
   one gets a clear accent spine + tint so the selection is obvious. */
.lv-cat { display:flex; align-items:center; gap:10px; background:var(--raise,var(--card)); border:1px solid var(--line); border-left:3px solid transparent; border-radius:12px; padding:13px 14px; cursor:pointer; color:var(--fg); text-align:left; transition:.14s; }
.lv-cat:hover { border-color:var(--line-bold); border-left-color:var(--ca-mid,var(--line-bold)); background:var(--card); }
.lv-cat.active { border-color:var(--ca-mid,var(--line-bold)); border-left-color:var(--ca,var(--terra)); background:color-mix(in srgb,var(--ca) 10%,var(--card)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ca) 22%,transparent); }
.lv-cat__b { flex:1; min-width:0; }
.lv-cat__t { display:block; font-family:var(--disp); font-weight:600; font-size:15px; letter-spacing:.01em; color:var(--fg); }
.lv-cat.active .lv-cat__t { color:var(--ca-ink,var(--terra-dk)); }
.lv-cat__m { display:block; font-size:11px; color:var(--fg-70,var(--muted)); margin-top:2px; }
.lv-cat__n { display:grid; place-items:center; width:24px; height:24px; flex:none; border-radius:50%; background:color-mix(in srgb,var(--fg) 9%,var(--card)); color:var(--fg-70,var(--muted)); font-family:var(--disp); font-weight:600; font-size:12px; }
.lv-cat.active .lv-cat__n { background:var(--ca-mid,var(--sink)); color:var(--ca-ink,var(--fg)); }
.lv-cat__n.full { background:var(--ca,var(--terra)); color:#fff; }
.lv-cat--custom { border-left-color:var(--gold); margin-top:6px; }
.lv-cat--custom .lv-cat__t { color:var(--gold); }
/* Mix / Συνδυαστικό — combined-levels category, visually set apart */
.lv-cat--mix { border-left-color:var(--gold); background:color-mix(in srgb,var(--gold) 6%,var(--card)); }
.lv-cat--mix .lv-cat__t { color:var(--gold); }
.lv-cat--mix .lv-cat__n { background:var(--gold); color:#fff; }

.lv-list { display:flex; flex-direction:column; gap:9px; }
.lv-list__hd { display:flex; align-items:baseline; gap:10px; padding:2px 2px 6px; }
.lv-list__ttl { font-family:var(--disp); font-weight:600; font-size:clamp(18px,2.2vw,24px); letter-spacing:.04em; text-transform:uppercase; color:var(--ca-ink,var(--terra-dk)); }
.lv-list__ct { font-size:12px; color:var(--muted); }
/* Level rows — a not-yet-done row is a confident, playable card (not greyed
   out); the number badge carries the accent so "available" reads clearly.
   Done rows are tinted with a sage check; hover lifts toward the accent. */
.lv-row { display:flex; align-items:center; gap:14px; background:var(--card); border:1px solid var(--line); border-radius:13px; padding:15px 18px; cursor:pointer; color:var(--fg); text-align:left; transition:.14s; }
.lv-row:hover { border-color:var(--ca,var(--terra)); transform:translateX(2px); box-shadow:0 6px 18px var(--shadow); }
.lv-row.now { border-color:var(--ca,var(--terra)); box-shadow:0 0 0 1px var(--ca,var(--terra)); }
.lv-row__n { display:grid; place-items:center; width:34px; height:34px; flex:none; border-radius:9px; background:var(--ca-soft,var(--sink)); color:var(--ca-ink,var(--terra-dk)); font-family:var(--disp); font-weight:700; font-size:15px; }
.lv-row.done { background:color-mix(in srgb,var(--sage) 7%,var(--card)); border-color:color-mix(in srgb,var(--sage) 30%,var(--line)); }
.lv-row.done .lv-row__n { background:var(--sage); color:#fff; }
.lv-row.now .lv-row__n { background:var(--ca,var(--terra)); color:#fff; }
.lv-row__t { flex:1; font-size:15px; font-weight:500; color:var(--fg); }
.lv-row__sec { font-weight:600; color:var(--fg-70,var(--muted)); letter-spacing:.01em; }
.lv-row__go { font-family:var(--disp); font-weight:600; font-size:12.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--ca-ink,var(--terra-dk)); opacity:.72; }
.lv-row:hover .lv-row__go { opacity:1; }
.lv-row.done .lv-row__go { color:var(--sage); opacity:.85; }

/* ── Phase 2 · multi-select content mixing (engine setup screen) ──────── */
.syn-mix { display:flex; flex-direction:column; gap:10px; }
.syn-mix__lbl { font-family:var(--disp); font-weight:500; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-top:6px; }
/* material picker — pill chips */
.syn-mix__mats { display:flex; flex-wrap:wrap; gap:8px; }
.syn-mat { font-family:var(--sans); font-weight:600; font-size:13px; color:var(--fg-70,var(--muted)); background:var(--card); border:1px solid var(--line); padding:9px 15px; border-radius:999px; cursor:pointer; transition:.14s; }
.syn-mat:hover { border-color:var(--line-bold); }
.syn-mat.active { color:var(--ca-ink,var(--terra-dk)); border-color:var(--ca-mid,var(--line-bold)); background:color-mix(in srgb,var(--ca) 12%,var(--card)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ca) 26%,transparent); }
/* ── universal "Διάλεξε ύλη" picker (Ver1 ecx) ── */
.syn-mix__search { width:100%; box-sizing:border-box; font-family:var(--sans); font-size:14px; color:var(--fg); background:var(--card); border:1px solid var(--line); border-radius:12px; padding:12px 16px; margin:2px 0 4px; transition:.14s; }
.syn-mix__search:focus { outline:none; border-color:var(--ca-mid,var(--line-bold)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ca) 26%,transparent); }
.syn-mix__cats { display:flex; flex-direction:column; gap:6px; }
.syn-ds-cat { font-family:var(--sans); font-weight:700; font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin:14px 2px 4px; }
.syn-ds-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:10px; }
.syn-ds { display:flex; align-items:center; gap:12px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 14px; transition:.14s; }
.syn-ds:hover { border-color:var(--line-bold); }
.syn-ds.on { border-color:var(--ca-mid,var(--line-bold)); background:color-mix(in srgb,var(--ca) 9%,var(--card)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ca) 26%,transparent); }
.syn-ds.locked { opacity:.5; }
.syn-ds__ic { display:grid; place-items:center; width:42px; height:42px; flex:none; border-radius:11px; background:var(--ca-tint,var(--sink)); font-size:21px; line-height:1; }
.syn-ds__info { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.syn-ds__name { font-family:var(--disp); font-weight:600; font-size:15px; color:var(--fg); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.syn-ds__meta { font-family:var(--sans); font-size:11px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.syn-ds__mix { flex:none; font-family:var(--sans); font-weight:700; font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--ca-ink,var(--terra-dk)); background:var(--sink); border:1px dashed var(--ca-mid,var(--line-bold)); padding:7px 12px; border-radius:999px; cursor:pointer; transition:.14s; }
.syn-ds__mix:hover { background:color-mix(in srgb,var(--ca) 12%,var(--card)); }
/* selected/active toggles use a fixed green (the engine --ca accent can be too
   light for white text → "in mix" / "select all" were unreadable). */
.syn-ds__mix.on { color:#fff; background:#2e9e4f; border-style:solid; border-color:#2e9e4f; }
.syn-ds__flag { flex:none; font-family:var(--sans); font-weight:700; font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); background:var(--sink); border:1px solid var(--line); padding:6px 10px; border-radius:999px; }
/* "Δικό μου ερωτηματολόγιο" — teacher's own-questionnaire upload card (top of picker) */
.syn-ds-upload { display:flex; align-items:center; gap:12px; background:color-mix(in srgb,var(--ca) 5%,var(--card)); border:1.5px dashed var(--ca-mid,var(--terra)); border-radius:14px; padding:12px 14px; cursor:pointer; transition:.14s; margin:2px 0 4px; }
.syn-ds-upload:hover { border-color:var(--ca,var(--terra)); background:color-mix(in srgb,var(--ca) 10%,var(--card)); }
.syn-ds-upload.on { border-style:solid; border-color:var(--ca,var(--terra)); background:color-mix(in srgb,var(--ca) 9%,var(--card)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ca) 26%,transparent); }
.syn-ds-upload.locked { cursor:default; opacity:.72; border-style:solid; }
.syn-ds-upload__ic { display:grid; place-items:center; width:42px; height:42px; flex:none; border-radius:11px; background:var(--ca-tint,var(--sink)); font-size:21px; line-height:1; }
.syn-ds-upload__info { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.syn-ds-upload__name { font-family:var(--disp); font-weight:600; font-size:15px; color:var(--fg); }
.syn-ds-upload__meta { font-family:var(--sans); font-size:11px; color:var(--muted); }
.syn-ds-upload__pills { display:flex; flex-wrap:wrap; gap:5px; margin-top:1px; }
.syn-ds-upload__pill { font-family:var(--sans); font-weight:700; font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--ca-ink,var(--terra-dk)); background:var(--sink); border:1px solid var(--line); padding:3px 7px; border-radius:999px; }
.syn-ds-upload__cta { flex:none; font-family:var(--sans); font-weight:700; font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--ca-ink,var(--terra-dk)); background:var(--sink); border:1px dashed var(--ca-mid,var(--line-bold)); padding:7px 12px; border-radius:999px; }
.syn-ds-upload.on .syn-ds-upload__cta { color:#fff; background:var(--ca,var(--terra)); border-style:solid; border-color:var(--ca,var(--terra)); }
.syn-ds-upload__flag { flex:none; font-family:var(--sans); font-weight:700; font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); background:var(--sink); border:1px solid var(--line); padding:6px 10px; border-radius:999px; white-space:nowrap; }
.syn-ds-upload__ok { font-family:var(--sans); font-weight:700; font-size:11.5px; color:#1f8a4c; background:color-mix(in srgb,#2faa5e 14%,var(--card)); border:1px solid color-mix(in srgb,#2faa5e 40%,var(--line)); border-radius:10px; padding:8px 12px; margin:0 0 4px; display:flex; align-items:center; gap:8px; }
.syn-ds-upload__ok button { font-family:var(--sans); font-weight:700; font-size:10.5px; color:var(--muted); background:transparent; border:1px solid var(--line); border-radius:999px; padding:3px 9px; cursor:pointer; margin-left:auto; }
.syn-ds-upload__ok button:hover { color:var(--fg); border-color:var(--line-bold); }
.syn-ds-upload__err { font-family:var(--sans); font-weight:600; font-size:11.5px; color:#c0392b; margin:0 0 4px; }
/* subject-tag filter row */
.syn-mix__tags { display:flex; flex-wrap:wrap; gap:7px; margin:2px 0; }
.syn-tagchip { font-family:var(--sans); font-weight:600; font-size:12px; color:var(--fg-70,var(--muted)); background:var(--card); border:1px solid var(--line); padding:7px 13px; border-radius:999px; cursor:pointer; transition:.14s; }
.syn-tagchip:hover { border-color:var(--line-bold); color:var(--fg); }
.syn-tagchip.on { color:#fff; background:#2e9e4f; border-color:#2e9e4f; }
/* per-source level picker (spans the full grid width under a selected leveled card).
   Each level shows its full description inline (no hover needed). */
.syn-ds-levels { grid-column:1 / -1; display:flex; flex-direction:column; align-items:stretch; gap:5px; padding:14px; margin:-2px 0 6px; background:color-mix(in srgb,var(--ca) 9%,var(--card)); border:2px solid var(--ca-mid,var(--line-bold)); border-radius:14px; box-shadow:0 6px 18px var(--shadow); }
/* ── Level list: hide/unhide header (universal across every picker) ── */
.syn-lv-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:-2px 0 2px; }
.syn-lv-head__t { display:inline-flex; align-items:center; gap:8px; font-family:var(--sans); font-weight:800; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-70,var(--muted)); }
.syn-lv-head__c { font-family:var(--disp); font-weight:700; font-size:11px; letter-spacing:0; color:var(--muted); background:var(--sink); border:1px solid var(--line); padding:1px 8px; border-radius:999px; }
.syn-lv-head__c.on { color:#fff; background:#2e9e4f; border-color:#2e9e4f; }
.syn-lv-fold { display:inline-flex; align-items:center; gap:6px; font-family:var(--sans); font-weight:700; font-size:9.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--fg-70,var(--muted)); background:var(--card); border:1px solid var(--line); padding:3px 10px; border-radius:999px; cursor:pointer; transition:.12s; }
.syn-lv-fold:hover { border-color:var(--line-bold); color:var(--fg); }
.syn-lv-fold__chev { font-size:9px; line-height:1; transition:transform .18s ease; }
.syn-lv-fold.folded .syn-lv-fold__chev { transform:rotate(-90deg); }
.syn-lvgrp { font-family:var(--sans); font-weight:700; font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
/* per-category fold chevron */
.syn-lvgrp-fold { flex:none; width:18px; height:18px; display:grid; place-items:center; font-size:9px; line-height:1; color:var(--muted); background:var(--sink); border:1px solid var(--line); border-radius:6px; cursor:pointer; transition:.16s; }
.syn-lvgrp-fold:hover { border-color:var(--line-bold); color:var(--fg); }
.syn-lvgrp-row.folded .syn-lvgrp-fold { transform:rotate(-90deg); }
.syn-lvgrp-row.folded .syn-lvgrp { color:var(--fg-70,var(--muted)); }
/* group header row with a per-category select-all toggle */
.syn-lvgrp-row { display:flex; align-items:center; gap:8px; margin:8px 2px 1px; }
.syn-lvgrp-row .syn-lvgrp { margin:0; flex:1; }
.syn-lvgrp-all { font-family:var(--sans); font-weight:700; font-size:9.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--fg-70,var(--muted)); background:var(--sink); border:1px solid var(--line); padding:3px 9px; border-radius:999px; cursor:pointer; transition:.12s; }
.syn-lvgrp-all:hover { border-color:var(--line-bold); color:var(--fg); }
.syn-lvgrp-all.on { color:#fff; background:#2e9e4f; border-color:#2e9e4f; }
/* "Select all levels" pill at the top */
.syn-lvpill--all { align-self:flex-start; font-family:var(--sans); font-weight:700; font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--fg-70,var(--muted)); background:var(--card); border:1px solid var(--line); padding:6px 12px; border-radius:999px; cursor:pointer; transition:.12s; }
.syn-lvpill--all:hover { border-color:var(--line-bold); }
.syn-lvpill--all.on { color:#fff; background:#2e9e4f; border-color:#2e9e4f; }
/* level row — checkbox + number badge + full description */
.syn-lvrowpill { display:flex; align-items:center; gap:11px; width:100%; text-align:left; font-family:var(--sans); font-size:13px; color:var(--fg); background:var(--card); border:1.5px solid var(--line); border-left:4px solid transparent; padding:9px 12px; border-radius:10px; cursor:pointer; transition:.12s; }
.syn-lvrowpill:hover { border-color:var(--line-bold); background:var(--sink); }
.syn-lvrowpill.on { background:color-mix(in srgb,var(--ca) 16%,var(--card)); border-color:var(--ca,var(--terra)); box-shadow:inset 0 0 0 1px var(--ca,var(--terra)); }
.syn-lvpill__box { flex:none; width:21px; height:21px; display:grid; place-items:center; border:2px solid var(--line-bold); border-radius:6px; background:var(--card); color:#fff; font-size:13px; font-weight:800; line-height:1; transition:.12s; }
/* selected check: clear green so it stands out from the terra row tint */
.syn-lvrowpill.on .syn-lvpill__box { background:#2e9e4f; border-color:#2e9e4f; color:#fff; }
.syn-lvpill__n { flex:none; font-family:var(--disp); font-weight:700; font-size:12px; color:var(--muted); min-width:20px; }
.syn-lvrowpill.on .syn-lvpill__n { color:var(--ca-ink,var(--terra-dk)); }
.syn-lvrowpill.on .syn-lvpill__t { font-weight:600; }
.syn-lvpill__t { flex:1; min-width:0; line-height:1.3; }
.syn-lvpill__sec { font-weight:600; color:var(--fg-70,var(--muted)); }
.syn-lvpill--lgreen { border-left-color:var(--sage,#6f8f4f); }
.syn-lvpill--lyellow { border-left-color:var(--gold,#A2862F); }
.syn-lvpill--lred { border-left-color:var(--terra,#C5572F); }
.syn-lvpill--lpurple { border-left-color:#7C5AC2; }

/* ── Live Arena match setup: mode grid + config ── */
.syn-setup-back { align-self:flex-start; font-family:var(--sans); font-weight:600; font-size:12px; color:var(--fg-70,var(--muted)); background:var(--card); border:1px solid var(--line); border-radius:999px; padding:7px 14px; margin:0 0 4px; cursor:pointer; transition:.14s; }
.syn-setup-back:hover { border-color:var(--line-bold); color:var(--fg); }
.syn-modegrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; margin:2px 0 6px; }
.syn-modecard { display:flex; align-items:center; gap:12px; text-align:left; background:var(--card); border:1px solid var(--line); border-left:4px solid var(--mc,var(--terra)); border-radius:14px; padding:12px 14px; cursor:pointer; transition:.14s; }
.syn-modecard:hover { border-color:var(--line-bold); transform:translateY(-2px); box-shadow:0 10px 24px var(--shadow); }
.syn-modecard.on { background:color-mix(in srgb,var(--mc,var(--terra)) 12%,var(--card)); border-color:var(--mc,var(--terra)); box-shadow:inset 0 0 0 1px var(--mc,var(--terra)); }
.syn-modecard.soon { opacity:.55; cursor:default; }
.syn-modecard.soon:hover { transform:none; box-shadow:none; border-color:var(--line); }
.syn-modecard__g { flex:none; display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:color-mix(in srgb,var(--mc,var(--terra)) 16%,var(--card)); color:var(--mc,var(--terra)); font-size:22px; font-weight:700; }
.syn-modecard__b { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.syn-modecard__t { font-family:var(--disp); font-weight:700; font-size:14px; letter-spacing:.02em; color:var(--fg); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.syn-modecard__d { font-family:var(--sans); font-size:11px; color:var(--muted); line-height:1.3; }
.syn-modecard__chk { flex:none; width:20px; text-align:center; font-weight:800; color:var(--mc,var(--terra)); }
.syn-modecard__soon { flex:none; font-family:var(--sans); font-weight:700; font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); background:var(--sink); border:1px solid var(--line); padding:3px 8px; border-radius:999px; }
.syn-cfg { display:flex; flex-direction:column; gap:10px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px 16px; margin:2px 0 6px; }
.syn-cfg__row { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.syn-cfg__lbl { flex:none; width:130px; font-family:var(--sans); font-weight:700; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.syn-cfg__val { font-family:var(--disp); font-weight:700; font-size:14px; color:var(--ca-ink,var(--terra-dk)); min-width:42px; }
.syn-cfg__num { font-family:var(--disp); font-weight:700; font-size:14px; color:var(--fg); background:var(--sink); border:1px solid var(--line-bold); border-radius:9px; padding:7px 12px; width:110px; }
.syn-cfg__toggles { display:flex; gap:7px; flex-wrap:wrap; }
.syn-seg { display:inline-flex; background:var(--sink); border:1px solid var(--line); border-radius:999px; padding:2px; gap:2px; }
.syn-seg__b { font-family:var(--sans); font-weight:600; font-size:12px; color:var(--fg-70,var(--muted)); background:transparent; border:none; padding:7px 14px; border-radius:999px; cursor:pointer; transition:.14s; }
.syn-seg__b.on { color:#fff; background:#2e9e4f; }
.syn-slider { flex:1; min-width:160px; accent-color:#2e9e4f; height:6px; cursor:pointer; }

/* grouped level checkbox grid */
.syn-mix__levels { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px; }
.syn-cat { display:flex; flex-direction:column; gap:6px; background:var(--raise,var(--card)); border:1px solid var(--line); border-radius:14px; padding:12px; }
.syn-cat__hd { display:flex; align-items:center; gap:8px; padding:0 2px 4px; }
.syn-cat__t { flex:1; min-width:0; font-family:var(--disp); font-weight:600; font-size:14px; letter-spacing:.02em; color:var(--ca-ink,var(--terra-dk)); }
.syn-cat__all { font-family:var(--sans); font-weight:700; font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--fg-70,var(--muted)); background:var(--sink); border:1px solid var(--line); padding:4px 9px; border-radius:999px; cursor:pointer; transition:.14s; }
.syn-cat__all:hover { border-color:var(--line-bold); color:var(--fg); }
.syn-cat__all.on { color:#fff; background:var(--ca,var(--terra)); border-color:var(--ca,var(--terra)); }
.syn-lvrow { display:flex; align-items:flex-start; gap:10px; background:var(--card); border:1px solid var(--line); border-left:3px solid transparent; border-radius:11px; padding:10px 12px; cursor:pointer; color:var(--fg); text-align:left; transition:.13s; }
.syn-lvrow:hover { border-color:var(--line-bold); }
.syn-lvrow.on { border-color:var(--ca-mid,var(--line-bold)); background:color-mix(in srgb,var(--ca) 9%,var(--card)); }
.syn-lvrow__chk { display:grid; place-items:center; width:22px; height:22px; flex:none; border-radius:7px; border:1.5px solid var(--line-bold); background:var(--card); color:#fff; font-size:13px; font-weight:800; transition:.13s; }
.syn-lvrow.on .syn-lvrow__chk { background:var(--ca,var(--terra)); border-color:var(--ca,var(--terra)); }
.syn-lvrow__t { flex:1; font-size:13.5px; font-weight:500; line-height:1.35; color:var(--fg); }
.syn-lvrow__sec { font-weight:600; color:var(--fg-70,var(--muted)); }
.syn-lvrow--lgreen  { border-left-color:var(--sage,#6f8f4f); }
.syn-lvrow--lyellow { border-left-color:var(--gold,#A2862F); }
.syn-lvrow--lred    { border-left-color:var(--terra,#C5572F); }
.syn-lvrow--lpurple { border-left-color:#7C5AC2; }
/* sticky "N selected" action bar */
.syn-mix__bar { position:sticky; bottom:10px; z-index:4; display:flex; align-items:center; gap:10px; margin-top:6px; padding:12px 14px; background:color-mix(in srgb,var(--card) 92%,transparent); backdrop-filter:blur(8px); border:1px solid var(--line-bold); border-radius:16px; box-shadow:0 10px 30px var(--shadow); }
.syn-mix__count { font-family:var(--sans); font-weight:700; font-size:13px; color:var(--fg); }
.syn-mix__sp { flex:1; }
.syn-mix__allbtn, .syn-mix__share { font-family:var(--sans); font-weight:600; font-size:13px; color:var(--fg); background:var(--sink); border:1px solid var(--line-bold); padding:9px 14px; border-radius:10px; cursor:pointer; transition:.14s; }
.syn-mix__allbtn:hover, .syn-mix__share:hover { border-color:var(--ca-mid,var(--line-bold)); color:var(--ca-ink,var(--terra-dk)); }
.syn-mix__share[disabled] { opacity:.45; cursor:not-allowed; }
.syn-mix__start { font-family:var(--disp); font-weight:600; font-size:14px; letter-spacing:.02em; text-transform:uppercase; color:#fff; background:var(--ca,var(--terra)); border:1px solid var(--ca,var(--terra)); padding:11px 20px; border-radius:11px; cursor:pointer; transition:.14s; box-shadow:0 8px 20px var(--ca-mid,var(--shadow)); }
.syn-mix__start:hover { transform:translateY(-1px); }
.syn-mix__start.is-off, .syn-mix__start[disabled] { background:var(--sink); color:var(--muted); border-color:var(--line-bold); box-shadow:none; cursor:not-allowed; transform:none; }
@media (max-width:560px){
  .syn-mix__levels { grid-template-columns:1fr; }
  .syn-mix__bar { flex-wrap:wrap; }
  .syn-mix__sp { flex-basis:100%; height:0; }
}

/* ── STEP 2 · play-mode screen (Μόνος / VS-με-QR) ─────────────────────── */
.syn-mode { animation:sc-mode-in .28s ease; }
@keyframes sc-mode-in { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.syn-mode__back { display:inline-flex; align-items:center; gap:8px; background:none; border:none; color:var(--muted); font-family:var(--sans); font-weight:600; font-size:14px; cursor:pointer; padding:2px 0; margin-bottom:14px; transition:.14s; }
.syn-mode__back:hover { color:var(--fg); }
.syn-mode__backic { font-size:17px; }
.syn-mode__hd { margin-bottom:14px; }
.syn-mode__ttl { font-family:var(--disp); font-weight:700; font-size:26px; line-height:1.1; color:var(--fg); margin:0; }
.syn-mode__sub { font-family:var(--sans); font-size:14px; color:var(--muted); margin:4px 0 0; }
.syn-mode__sum { display:flex; align-items:center; gap:13px; flex-wrap:wrap; padding:14px 16px; margin-bottom:18px; border-radius:15px;
  background:color-mix(in srgb,var(--ca) 10%,var(--card)); border:1px solid var(--ca-mid,var(--line-bold)); }
.syn-mode__sumic { flex:none; width:40px; height:40px; border-radius:11px; display:grid; place-items:center; font-size:20px; color:#fff;
  background:conic-gradient(from 130deg,#7c83f0,#4bc2d6,var(--ca,var(--terra)),var(--gold,#e6b85f),#ec7ba0,#7c83f0); }
.syn-mode__sumb { flex:1; min-width:170px; }
.syn-mode__sumt { font-family:var(--disp); font-weight:600; font-size:15px; color:var(--fg); display:block; }
.syn-mode__chips { display:flex; gap:6px; flex-wrap:wrap; margin-top:5px; }
.syn-mode__chip { font-family:var(--sans); font-weight:600; font-size:11.5px; color:var(--fg); background:var(--sink); border:1px solid var(--line); border-radius:999px; padding:2px 10px; }
.syn-mode__chg { flex:none; font-family:var(--sans); font-weight:700; font-size:13px; color:var(--fg); background:var(--card); border:1px solid var(--line-bold); border-radius:10px; padding:8px 13px; cursor:pointer; transition:.14s; }
.syn-mode__chg:hover { border-color:var(--ca,var(--terra)); color:var(--ca-ink,var(--terra-dk)); }
.syn-mode__duel { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:600px){ .syn-mode__duel { grid-template-columns:1fr; } }
.syn-mode__card { position:relative; text-align:left; border:1px solid var(--line); background:linear-gradient(180deg,var(--ca-tint,var(--card)),var(--card)); border-radius:18px; padding:20px; cursor:pointer; transition:.18s; color:var(--fg); }
.syn-mode__card:hover { transform:translateY(-3px); box-shadow:0 18px 40px -22px var(--shadow); }
.syn-mode__card.is-disabled { opacity:.5; cursor:not-allowed; }
.syn-mode__card.is-disabled:hover { transform:none; box-shadow:none; }
.syn-mode__card.is-solo.on { border-color:var(--ca,var(--terra)); box-shadow:0 0 0 1px var(--ca,var(--terra)); }
.syn-mode__card.is-vs.on { border-color:var(--mg,#ec5f88); box-shadow:0 0 0 1px var(--mg,#ec5f88); }
.syn-mode__cardic { display:grid; place-items:center; width:50px; height:50px; border-radius:14px; margin-bottom:12px; }
.syn-mode__card.is-solo .syn-mode__cardic { background:color-mix(in srgb,var(--ca) 16%,transparent); color:var(--ca,var(--terra)); }
.syn-mode__card.is-vs .syn-mode__cardic { background:color-mix(in srgb,var(--mg,#ec5f88) 16%,transparent); color:var(--mg,#ec5f88); }
.syn-mode__cardic svg { width:26px; height:26px; }
.syn-mode__card h3 { font-family:var(--disp); font-weight:700; font-size:20px; margin:0; color:var(--fg); }
.syn-mode__card p { font-family:var(--sans); font-size:13.5px; color:var(--muted); margin:4px 0 0; }
.syn-mode__sela { position:absolute; top:15px; right:15px; width:24px; height:24px; border-radius:50%; border:2px solid var(--line); display:grid; place-items:center; font-size:13px; color:transparent; transition:.14s; }
.syn-mode__card.is-solo.on .syn-mode__sela { color:var(--ca,var(--terra)); border-color:var(--ca,var(--terra)); }
.syn-mode__card.is-vs.on .syn-mode__sela { color:var(--mg,#ec5f88); border-color:var(--mg,#ec5f88); }
.syn-mode__vs { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:16px; padding:18px 20px; border-radius:18px;
  background:color-mix(in srgb,var(--mg,#ec5f88) 8%,var(--card)); border:1px solid color-mix(in srgb,var(--mg,#ec5f88) 35%,var(--line)); animation:sc-mode-in .3s ease; }
.syn-mode__vsic { flex:none; width:46px; height:46px; border-radius:12px; display:grid; place-items:center; font-size:24px; color:var(--mg,#ec5f88); background:color-mix(in srgb,var(--mg,#ec5f88) 14%,transparent); }
.syn-mode__vsb { flex:1; min-width:200px; }
.syn-mode__vsb h3 { font-family:var(--disp); font-weight:700; font-size:18px; margin:0; color:var(--mg,#ec5f88); }
.syn-mode__vsb p { font-family:var(--sans); font-size:13.5px; color:var(--muted); margin:4px 0 12px; }
.syn-mode__vsshare { display:inline-flex; align-items:center; gap:8px; font-family:var(--sans); font-weight:700; font-size:13.5px; color:#fff;
  background:linear-gradient(180deg,var(--mg2,#ff85a8),var(--mg,#ec5f88)); border:none; border-radius:11px; padding:10px 16px; cursor:pointer; transition:.15s; }
.syn-mode__vsshare:hover { filter:brightness(1.06); transform:translateY(-1px); }
.syn-mode__startbar { display:flex; margin-top:18px; }
.syn-mode__start { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; border:none; border-radius:13px; padding:13px 18px; cursor:pointer; transition:.18s; color:#fff; }
.syn-mode__start b { font-family:var(--disp); font-weight:700; font-size:17px; }
.syn-mode__start small { font-family:var(--sans); font-weight:600; font-size:11.5px; opacity:.85; }
.syn-mode__start.is-solo { background:var(--ca,var(--terra)); box-shadow:0 10px 26px -10px var(--ca-mid,var(--shadow)); }
.syn-mode__start.is-vs { background:linear-gradient(90deg,var(--mg,#ec5f88),#a067e0); box-shadow:0 10px 26px -10px rgba(160,103,224,.5); }
.syn-mode__start:hover { transform:translateY(-2px); filter:brightness(1.05); }

/* live config controls */
.sc-gmode { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px; }
.sc-gmode__o { display:flex; flex-direction:column; gap:3px; align-items:flex-start; text-align:left; background:var(--card); border:1.5px solid var(--line); border-radius:14px; padding:14px 16px; cursor:pointer; color:var(--fg); }
.sc-gmode__o.active { border-color:var(--ca,var(--terra)); background:color-mix(in srgb,var(--ca) 8%,var(--card)); }
.sc-gmode__t { font-family:var(--disp); font-weight:600; font-size:16px; letter-spacing:.02em; text-transform:uppercase; }
.sc-gmode__d { font-size:12.5px; color:var(--muted); }
.sc-stepper { display:inline-flex; align-items:center; gap:4px; margin-left:6px; }
.sc-stepper.off { display:none; }
.sc-stepper__b { width:34px; height:38px; border:1.5px solid var(--line-bold); background:var(--card); color:var(--fg); border-radius:10px; font-size:18px; cursor:pointer; }
.sc-stepper__v { font-family:var(--sans); font-weight:700; font-size:14px; padding:0 6px; } .sc-stepper__v small { color:var(--muted); font-weight:600; }
.sc-cfg__val { margin-left:auto; font-family:var(--disp); font-weight:600; color:var(--ca-ink,var(--terra-dk)); }
.sc-cfg__l { display:flex; align-items:center; gap:8px; }
.sc-cfg__hint { font-size:11px; font-weight:500; color:var(--muted); text-transform:none; letter-spacing:0; }
.sc-slider { -webkit-appearance:none; appearance:none; width:100%; height:8px; border-radius:6px; background:var(--sink); outline:none; cursor:pointer; }
.sc-slider::-webkit-slider-thumb { -webkit-appearance:none; width:22px; height:22px; border-radius:50%; background:var(--ca,var(--terra)); border:3px solid var(--card); box-shadow:0 2px 8px var(--shadow); cursor:grab; }
.sc-slider::-moz-range-thumb { width:18px; height:18px; border-radius:50%; background:var(--ca,var(--terra)); border:3px solid var(--card); cursor:grab; }
.sc-cfg__o--multi { padding-left:12px; }
.sc-cfg__chk { display:inline-grid; place-items:center; width:16px; height:16px; margin-right:7px; border:1.5px solid var(--line-bold); border-radius:5px; vertical-align:-3px; }
.sc-cfg__o--multi.active .sc-cfg__chk { background:#fff; border-color:#fff; }
.sc-cfg__o--multi.active .sc-cfg__chk::after { content:'✓'; color:var(--ca,var(--terra-dk)); font-size:11px; font-weight:800; }
.sc-upl { display:flex; gap:9px; margin-top:12px; flex-wrap:wrap; }
.sc-upl__b { display:inline-flex; align-items:center; gap:6px; background:var(--terra-dk); color:#fff; border:0; font-family:var(--sans); font-weight:700; font-size:13px; padding:10px 16px; border-radius:10px; cursor:pointer; }
.sc-upl__b--ghost { background:var(--card); border:1px solid var(--line-bold); color:var(--fg); }

/* game panel mode bar */
.sc-pmodes { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:11px; margin-bottom:8px; }
.sc-pmode { display:flex; align-items:center; gap:12px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px; cursor:pointer; color:var(--fg); text-align:left; transition:.15s; }
.sc-pmode:hover { transform:translateY(-3px); border-color:var(--terra); box-shadow:0 12px 28px var(--shadow); }
.sc-pmode__ic { display:grid; place-items:center; width:46px; height:46px; flex:none; border-radius:13px; background:var(--terra-soft); color:var(--terra-dk); }
.sc-pmode__gl { width:28px; height:28px; } .sc-pmode__gl svg{ width:100%; height:100%; }
.sc-pmode__t { display:block; font-family:var(--disp); font-weight:600; font-size:16px; letter-spacing:.02em; text-transform:uppercase; }
.sc-pmode__d { display:block; font-size:12px; color:var(--muted); }

@media (max-width:760px){
  .lv-shell { grid-template-columns:1fr; }
  .lv-cats { flex-direction:row; overflow-x:auto; }
  .lv-cat { min-width:170px; }
}

/* ── Share-QR modal (window.showQR) — theme-adaptive, --sym-* tokens ── */
/* Share/QR modal. It is opened FROM INSIDE game overlays (z-index 8500), the
   theory overlay (1200) and the admin takeover (9600), so it has to out-stack
   every one of them — at 1000 it opened *behind* the game and only became
   visible after backing out. Keep it above the update nudge (10040) too. */
.qrm { position:fixed; inset:0; z-index:10090; display:grid; place-items:center; padding:20px; background:color-mix(in srgb,var(--sym-ink,#000) 58%,transparent); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); animation:qrm-fade .14s ease both; }
@keyframes qrm-fade { from{opacity:0} to{opacity:1} }
.qrm__card { position:relative; width:min(360px,92vw); background:var(--card); color:var(--fg); border:1px solid var(--line); border-radius:20px; padding:26px 24px 22px; box-shadow:0 30px 70px var(--shadow); text-align:center; animation:qrm-rise .18s cubic-bezier(.2,.7,.3,1) both; }
@keyframes qrm-rise { from{opacity:0; transform:translateY(12px) scale(.98)} to{opacity:1; transform:none} }
.qrm__x { position:absolute; top:12px; right:12px; width:32px; height:32px; display:grid; place-items:center; border:0; background:var(--sink); color:var(--muted); border-radius:9px; font-size:20px; line-height:1; cursor:pointer; transition:.14s; }
.qrm__x:hover { background:var(--terra-soft); color:var(--terra-dk); }
.qrm__title { margin:0 24px 4px; font-family:var(--disp); font-weight:600; font-size:20px; letter-spacing:.02em; color:var(--fg); }
.qrm__sub { margin:0 0 18px; font-size:12.5px; color:var(--muted); }
.qrm__qr { display:grid; place-items:center; width:216px; height:216px; margin:0 auto 16px; padding:8px; background:#fff; border:1px solid var(--line); border-radius:14px; }
.qrm__qr img, .qrm__qr canvas { display:block; }
.qrm__qr.is-empty { background:var(--sink); color:var(--muted); font-size:12.5px; padding:18px; }
.qrm__link { font-family:var(--sans); font-size:12.5px; color:var(--fg-70,var(--muted)); background:var(--sink); border:1px solid var(--line); border-radius:9px; padding:9px 11px; margin-bottom:14px; word-break:break-all; user-select:all; }
.qrm__acts { display:flex; gap:9px; }
.qrm__btn { flex:1; font-family:var(--sans); font-weight:700; font-size:13px; padding:11px 14px; border:1px solid var(--line-bold); background:var(--card); color:var(--fg); border-radius:11px; cursor:pointer; transition:.14s; }
.qrm__btn:hover { border-color:var(--terra); }
.qrm__btn--primary { background:var(--terra-dk); border-color:transparent; color:#fff; }
.qrm__btn--primary:hover { filter:brightness(1.06); }
.qrm__btn--primary.is-done { background:var(--sage); }

/* admin extra panes */
.sc-crumbs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.sc-crumb { font-size:12px; color:var(--muted); padding:4px 9px; background:var(--sink); border-radius:7px; }
.sc-crumb.on { background:var(--terra-soft); color:var(--terra-dk); font-weight:600; }
.sc-crumb:not(:last-child)::after { content:' ›'; }
.sc-form { display:flex; flex-direction:column; gap:11px; max-width:380px; }
.sc-select { appearance:auto; cursor:pointer; }
.sc-pill2-row { display:flex; gap:5px; }
.sc-pill2 { font-family:var(--sans); font-weight:600; font-size:12px; padding:6px 13px; border-radius:999px; border:1px solid var(--line-bold); background:var(--card); color:var(--muted); cursor:pointer; }
.sc-pill2.on { background:var(--sage); border-color:transparent; color:#fff; }
.sc-pill2:last-child.on { background:var(--terra-dk); }
.sc-price { width:80px; font-family:var(--disp); font-weight:600; font-size:15px; text-align:center; padding:7px; border:1px solid var(--line-bold); border-radius:8px; background:var(--bg); color:var(--fg); }
.sc-realm { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:9px; }
.sc-realm__c { display:flex; flex-direction:column; align-items:center; gap:3px; padding:16px 10px; background:var(--bg); border:1px solid var(--line); border-radius:13px; cursor:pointer; color:var(--fg); }
.sc-realm__c:hover { border-color:var(--ca,var(--terra)); }
.sc-realm__ic { font-size:22px; }
.sc-realm__c b { font-size:13px; } .sc-realm__c small { font-size:11px; color:var(--muted); }
.sc-atlas { display:flex; flex-direction:column; margin-top:10px; }
.sc-admin2__railfoot { display:flex; flex-direction:column; gap:3px; margin-top:6px; padding-top:8px; border-top:1px solid var(--line); }
.sc-admin2__add { display:flex; align-items:center; gap:10px; padding:9px 12px; border:0; background:none; color:var(--terra-dk); font-family:var(--sans); font-weight:600; font-size:13px; border-radius:10px; cursor:pointer; text-align:left; }
.sc-admin2__add:hover { background:var(--terra-soft); }
.sc-admin2__nav.editing { position:relative; }
.sc-admin2__del { margin-left:auto; color:#c2553a; font-size:16px; cursor:pointer; }
.lv-cat--admin { border-left-color:var(--sage); margin-top:4px; }
.lv-cat--admin .lv-cat__t { color:var(--sage); }
.sc-forecast { display:flex; align-items:flex-end; gap:10px; height:130px; padding:14px 16px; background:var(--card); border:1px solid var(--line); border-radius:16px; }
.sc-fc { flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; height:100%; }
.sc-fc__n { font-family:var(--disp); font-weight:600; font-size:13px; color:var(--fg-70); }
.sc-fc__barwrap { flex:1; width:100%; display:flex; align-items:flex-end; justify-content:center; }
.sc-fc__bar { width:60%; max-width:34px; border-radius:6px 6px 0 0; background:color-mix(in srgb,var(--ca) 40%,transparent); }
.sc-fc__bar.today { background:var(--ca,var(--terra)); }
.sc-fc__d { font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }

/* teacher console */
.sc-classsel { display:flex; align-items:center; gap:8px; }
.sc-classsel__l { font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.sc-classsel__s { width:auto; padding:9px 12px; }
.sc-seats { display:flex; align-items:center; gap:16px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px 18px; margin-bottom:18px; }
.sc-seats__b { flex:1; }
.sc-seats__l { font-size:12px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
.sc-seats__bar { height:8px; border-radius:5px; background:var(--sink); overflow:hidden; margin-top:6px; }
.sc-seats__fill { display:block; height:100%; background:linear-gradient(90deg,var(--ca),var(--gold)); }
.sc-seats__t { font-family:var(--disp); font-weight:600; font-size:14px; color:var(--fg-70); white-space:nowrap; }
.sc-heat { overflow-x:auto; }
.sc-heat__row { display:grid; grid-template-columns:90px repeat(6,1fr); gap:5px; margin-bottom:5px; align-items:center; }
.sc-heat__row--h .sc-heat__th { font-size:11px; font-weight:600; color:var(--muted); text-align:center; transform:rotate(-0deg); }
.sc-heat__name { font-size:13px; font-weight:600; }
.sc-heat__c { display:grid; place-items:center; height:42px; border-radius:8px; font-family:var(--disp); font-weight:600; font-size:13px; color:var(--fg); cursor:pointer; border:1px solid var(--line); }
.sc-heat__c:hover { outline:2px solid var(--ca); }

/* assignment wizard */
.sc-wiz { width:min(480px,94vw); background:var(--card); border:1px solid var(--line-bold); border-radius:18px; padding:18px; box-shadow:0 40px 90px rgba(0,0,0,.5); }
.sc-wiz__bar { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.sc-wiz__steps { display:flex; gap:6px; }
.sc-wiz__dot { width:28px; height:5px; border-radius:3px; background:var(--sink); }
.sc-wiz__dot.on { background:var(--terra); }
.sc-wiz__ttl { font-family:var(--disp); font-weight:600; font-size:20px; text-transform:uppercase; letter-spacing:.02em; margin-bottom:14px; }
.sc-wiz__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.sc-wiz__pick { display:flex; flex-direction:column; align-items:center; gap:7px; padding:14px 8px; background:var(--bg); border:1px solid var(--line); border-radius:12px; cursor:pointer; color:var(--fg); font-size:12px; font-weight:600; text-align:center; }
.sc-wiz__pick:hover { border-color:var(--terra); }
.sc-wiz__gl { width:34px; height:34px; color:var(--terra-dk); } .sc-wiz__gl svg{ width:100%; height:100%; }
.sc-wiz__list { display:flex; flex-direction:column; gap:8px; }
.sc-wiz__row { padding:14px 16px; background:var(--bg); border:1px solid var(--line); border-radius:11px; cursor:pointer; color:var(--fg); font-weight:600; text-align:left; }
.sc-wiz__row:hover { border-color:var(--terra); }
.sc-wiz__cfg { text-align:center; padding:10px 0; } .sc-wiz__cfg p { color:var(--fg-70); margin:0 0 14px; }

/* live config: game picker + content navigator + game-panel popup */
.sc-gpick { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:9px; }
.sc-gpick__o { display:flex; align-items:center; gap:9px; background:var(--card); border:1.5px solid var(--line); border-radius:13px; padding:11px 13px; cursor:pointer; color:var(--fg); text-align:left; }
.sc-gpick__o.active { border-color:var(--ca,var(--terra)); background:color-mix(in srgb,var(--ca) 8%,var(--card)); }
.sc-gpick__o--more { border-style:dashed; color:var(--muted); }
.sc-gpick__ic { display:grid; place-items:center; width:30px; height:30px; flex:none; color:var(--ca-ink,var(--terra-dk)); font-size:16px; } .sc-gpick__ic svg{ width:100%; height:100%; }
.sc-gpick__t { font-family:var(--disp); font-weight:600; font-size:14px; letter-spacing:.01em; }
.sc-content { margin-top:10px; }
.sc-nav-steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
.sc-nav-step { display:flex; flex-direction:column; gap:5px; }
.sc-nav-step__l { font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.sc-nav-bc { display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin-top:12px; padding:10px 14px; background:var(--sink); border-radius:10px; }
.sc-nav-bc__c { font-family:var(--disp); font-weight:600; font-size:13px; color:var(--ca-ink,var(--terra-dk)); }
.sc-nav-bc__sep { color:var(--muted); }
.sc-gpop { width:min(560px,94vw); max-height:84vh; overflow:auto; background:var(--card); border:1px solid var(--line-bold); border-radius:18px; padding:16px; box-shadow:0 40px 90px rgba(0,0,0,.5); }
.sc-gpop__bar { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; font-family:var(--disp); font-weight:600; letter-spacing:.02em; }
.sc-gpop .sc-search { margin-bottom:12px; }
.sc-gpop__grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:9px; }
.sc-gpop__c { display:flex; flex-direction:column; align-items:center; gap:7px; padding:14px 8px; background:var(--bg); border:1px solid var(--line); border-radius:12px; cursor:pointer; color:var(--fg); font-size:12px; font-weight:600; text-align:center; }
.sc-gpop__c:hover { border-color:var(--terra); }
.sc-gpop__ic { width:32px; height:32px; color:var(--terra-dk); } .sc-gpop__ic svg{ width:100%; height:100%; }

/* live config — selected-level card + level popup */
.sc-lvlsel { display:flex; align-items:center; gap:14px; margin-top:10px; padding:14px 16px; background:var(--sink); border:1px solid var(--line); border-radius:14px; }
.sc-lvlsel__b { flex:1; min-width:0; }
.sc-lvlsel__bc { font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
.sc-lvlsel__lv { font-family:var(--disp); font-weight:600; font-size:18px; color:var(--ca-ink,var(--terra-dk)); margin-top:2px; }
.sc-lvlsel__ex { font-family:var(--serif); font-size:13.5px; color:var(--fg-70); margin-top:2px; }
.sc-lvpop { width:min(540px,94vw); max-height:84vh; overflow:auto; background:var(--card); border:1px solid var(--line-bold); border-radius:18px; padding:16px; box-shadow:0 40px 90px rgba(0,0,0,.5); }
.sc-lvpop__bar { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; font-family:var(--disp); font-weight:600; letter-spacing:.02em; }
.sc-lvpop__nav { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:14px; }
.sc-lvpop__hd { font-family:var(--disp); font-weight:500; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:9px; }
.sc-lvpop__list { display:flex; flex-direction:column; gap:8px; }
.sc-lvpop__row { display:flex; align-items:center; gap:13px; padding:13px 15px; background:var(--bg); border:1px solid var(--line); border-radius:12px; cursor:pointer; color:var(--fg); text-align:left; }
.sc-lvpop__row:hover { border-color:var(--terra); }
.sc-lvpop__row.on { border-color:var(--terra); box-shadow:0 0 0 1px var(--terra); }
.sc-lvpop__n { display:grid; place-items:center; width:30px; height:30px; flex:none; border-radius:8px; background:var(--terra-soft); color:var(--terra-dk); font-family:var(--disp); font-weight:600; }
.sc-lvpop__t { flex:1; display:flex; flex-direction:column; }
.sc-lvpop__t b { font-family:var(--disp); font-weight:600; font-size:15px; }
.sc-lvpop__e { font-family:var(--serif); font-size:13px; color:var(--fg-70); }
.sc-lvpop__go { color:var(--muted); font-size:15px; padding:6px; }
.sc-lvpop__go:hover { color:var(--terra-dk); }

/* admin icon editing */
.sc-iconedit { display:flex; align-items:flex-end; gap:12px; margin-bottom:14px; }
.sc-iconedit__l { flex:1; display:flex; flex-direction:column; gap:5px; }
.sc-iconedit__lab { font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.sc-iconedit__cur { display:flex; align-items:center; gap:6px; padding:9px 12px; background:var(--sink); border:1px solid var(--line-bold); border-radius:11px; cursor:pointer; color:var(--fg); }
.sc-iconedit__cur:hover { border-color:var(--terra); }
.sc-iconedit__gl { width:28px; height:28px; color:var(--terra-dk); } .sc-iconedit__gl svg{ width:100%; height:100%; }
.sc-iconpop { width:min(420px,94vw); background:var(--card); border:1px solid var(--line-bold); border-radius:18px; padding:16px; box-shadow:0 40px 90px rgba(0,0,0,.5); }
.sc-iconpop__grid { display:grid; grid-template-columns:repeat(6,1fr); gap:8px; }
.sc-iconpop__c { display:grid; place-items:center; aspect-ratio:1; background:var(--bg); border:1px solid var(--line); border-radius:11px; cursor:pointer; color:var(--fg-70); }
.sc-iconpop__c:hover { border-color:var(--terra); color:var(--terra-dk); }
.sc-iconpop__c.on { border-color:var(--terra); background:var(--terra-soft); color:var(--terra-dk); }
.sc-iconpop__gl { width:28px; height:28px; } .sc-iconpop__gl svg{ width:100%; height:100%; }

/* Game Panel — LIST view */
.sc-eng-grid--list { grid-template-columns:1fr; }
.sc-eng-grid--list .sc-upload { grid-column:auto; }
.sc-eng-grid--list .sc-engc { padding:10px 14px; }
.sc-eng-grid--list .sc-engc__ban { width:42px; height:42px; }
.sc-eng-grid--list .sc-engc__illu { width:26px; height:26px; }
.sc-eng-grid--compact { grid-template-columns:repeat(auto-fill,minmax(156px,1fr)); gap:9px; }
.sc-eng-grid--gallery { grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:16px; }

/* ── Hero Profile · Ζωφόρος (voyage literature) progress ── */
.sc-voyworks { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:8px; }
.sc-voywork { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:12px; border:1px solid var(--line); background:var(--card); cursor:pointer; text-align:left; font-family:inherit; color:var(--fg); transition:.16s; }
.sc-voywork:hover { border-color:var(--ca,var(--terra)); transform:translateY(-1px); }
.sc-voywork.on { border-color:color-mix(in srgb,var(--ca,var(--terra)) 55%,transparent); background:color-mix(in srgb,var(--ca,var(--terra)) 7%,var(--card)); }
.sc-voywork__ic { width:30px; height:30px; flex:none; color:var(--ca,var(--terra)); opacity:.9; }
.sc-voywork__b { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.sc-voywork__nm { font-family:var(--serif,'Cormorant Garamond',serif); font-size:16px; font-weight:600; line-height:1.05; }
.sc-voywork__m { font-size:10.5px; color:var(--fg-50); letter-spacing:.02em; }
.sc-voywork__go { color:var(--ca,var(--terra)); opacity:.7; font-size:14px; }

/* ══════════════════════════════════════════════════════════════════════
   ΕΚΘΕΣΗ — list bar (search + favourites filter + count) and the lesson
   tag that sits on a theory card's banner. The tag was previously
   unstyled and inherited whatever the banner gave it.
   ══════════════════════════════════════════════════════════════════════ */
.sc-listbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:4px 0 18px; }
.sc-listbar .sc-search { flex:1 1 240px; min-width:0; }
.sc-listbar__n { font-family:var(--sans); font-size:12.5px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; color:var(--muted); white-space:nowrap; }

.sc-theory-tag {
  position:absolute; top:12px; left:12px; z-index:2;
  font-family:var(--sans); font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ca-ink,var(--terra-dk)); background:color-mix(in srgb, var(--card) 82%, transparent);
  border:1px solid color-mix(in srgb, var(--ca,var(--terra)) 30%, transparent);
  padding:4px 9px; border-radius:999px;
}
/* the favourite star sits opposite the tag so the two never collide */
.sc-gcard--theory > .sc-fav { top:10px; right:10px; left:auto; }
