/* Single theme source for existing skins and new Studio components. */
:root[data-ielts-skin=day],:root[data-ielts-skin=night]{
  --radius:20px;--accent:#0065d6;--accent-ink:#fff;--ink:#192b45;--muted:#56667d;
  --line:rgba(78,111,158,.17);--paper:rgba(249,252,255,.66);--paper-strong:#f9fcff;
  --glass:rgba(249,252,255,.48);--glass-bright:rgba(255,255,255,.73);--glass-inset:rgba(226,237,251,.46);
  --glass-edge:rgba(255,255,255,.88);--glass-shadow:0 20px 60px -26px rgba(33,69,117,.3),inset 0 1px 0 var(--glass-edge);
  --control:rgba(255,255,255,.57);--hover:rgba(255,255,255,.92);--blue-soft:rgba(16,114,234,.10);
  --pink-soft:var(--glass-inset);--yellow:var(--blue-soft);--good:#237645;--bad:#b83444;
  --success-bg:#e6f5ec;--error-bg:#fff0f1;--shadow:var(--glass-shadow);
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
  color-scheme:light;
}
:root[data-ielts-skin=night]{
  --accent:#70b5ff;--accent-ink:#081727;--ink:#edf3ff;--muted:#a7b6ce;
  --line:rgba(158,188,232,.17);--paper:rgba(21,32,53,.72);--paper-strong:#273b58;
  --glass:rgba(24,38,62,.57);--glass-bright:rgba(43,61,88,.52);--glass-inset:rgba(9,21,39,.43);
  --glass-edge:rgba(194,218,255,.24);--glass-shadow:0 22px 70px -24px rgba(0,0,0,.6),inset 0 1px 0 var(--glass-edge);
  --control:rgba(66,88,119,.29);--hover:rgba(78,107,148,.42);--blue-soft:rgba(80,157,255,.18);
  --good:#83d9a3;--bad:#ff9ba5;--success-bg:#183d31;--error-bg:#482732;color-scheme:dark;
}
:root{
 --st-font-ui:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
 --st-font-reading:Georgia,'Times New Roman',serif;
 --st-font-caption:12px;--st-font-body:14px;--st-font-title:28px;--st-font-expression:34px;
 --st-space-1:4px;--st-space-2:8px;--st-space-3:12px;--st-space-4:16px;--st-space-5:20px;--st-space-6:24px;--st-space-8:32px;
 --st-control-height:44px;--st-content-max:1200px;
 --st-text:var(--ink);--st-muted:var(--muted);--st-border:var(--line);
 --st-surface:var(--paper);--st-inset:var(--glass-inset);--st-control:var(--control);--st-hover:var(--hover);
 --st-accent:var(--accent);--st-on-accent:var(--accent-ink);--st-accent-soft:var(--blue-soft);
 --st-border-width:1px;--st-radius-card:20px;--st-radius-control:12px;--st-radius-small:6px;
 --st-shadow:var(--glass-shadow);--st-success:var(--good);--st-error:var(--bad);
}
:root[data-ielts-skin=momonga]{
 --st-font-ui:'Segoe UI','Microsoft YaHei','PingFang SC',sans-serif;
 --st-text:#46342d;--st-muted:#7b6c65;--st-border:#ecd6c9;
 --st-surface:#fffefd;--st-inset:#fff9f0;--st-control:#fff9f0;--st-hover:#fff0f4;
 --st-accent:#754c3b;--st-on-accent:#fffefd;--st-accent-soft:#fff0f4;
 --st-border-width:2px;--st-radius-card:8px;--st-radius-control:8px;--st-radius-small:4px;
 --st-shadow:3px 4px 0 #ecd6c9;--st-success:#4f9f66;--st-error:#c95555;
 color-scheme:light;
}

/* Shared primitives. Works in document or ShadowRoot; tokens inherit from html. */
.st-card{background:var(--st-surface);border:var(--st-border-width) solid var(--st-border);border-radius:var(--st-radius-card);box-shadow:var(--st-shadow);padding:var(--st-space-6);color:var(--st-text)}
.st-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--st-space-2);min-height:var(--st-control-height);padding:var(--st-space-2) var(--st-space-4);border:var(--st-border-width) solid var(--st-border);border-radius:var(--st-radius-control);background:var(--st-control);color:var(--st-text);font:600 var(--st-font-body)/1.5 var(--st-font-ui);cursor:pointer}
.st-button:hover{background:var(--st-hover)}
.st-button[aria-pressed=true],.st-button.active{background:var(--st-accent-soft);color:var(--st-accent);border-color:var(--st-accent)}
.st-button--primary{background:var(--st-accent);color:var(--st-on-accent);border-color:var(--st-accent)}
.st-button--primary:hover{background:var(--st-accent);filter:brightness(1.08)}
.st-input{width:100%;min-height:var(--st-control-height);padding:var(--st-space-3);background:var(--st-inset);color:var(--st-text);border:var(--st-border-width) solid var(--st-border);border-radius:var(--st-radius-control);font:var(--st-font-body)/1.8 var(--st-font-ui)}
.st-badge{display:inline-flex;gap:var(--st-space-1);padding:var(--st-space-1) var(--st-space-2);border-radius:var(--st-radius-small);background:var(--st-accent-soft);color:var(--st-accent);font-size:var(--st-font-caption)}
.st-tabs{display:flex;gap:var(--st-space-4);border-bottom:var(--st-border-width) solid var(--st-border)}
.st-tabs [role=tab]{min-height:var(--st-control-height);border:0;border-bottom:2px solid transparent;background:transparent;color:var(--st-muted);font:600 var(--st-font-body)/1.5 var(--st-font-ui);cursor:pointer}
.st-tabs [aria-selected=true]{color:var(--st-accent);border-bottom-color:var(--st-accent)}
:where(.st-button,.st-input,.st-tabs [role=tab]):focus-visible{outline:3px solid var(--st-accent);outline-offset:3px}
.st-button:disabled{opacity:.5;cursor:not-allowed}
@media(prefers-reduced-motion:reduce){.st-button{transition:none}}

*{box-sizing:border-box}body{margin:0;background:var(--st-control,#fff);color:var(--st-text);font:14px/1.6 var(--st-font-ui);min-height:100vh;min-height:100svh}.invite-shell{width:min(100% - 48px,360px);margin:auto;padding:clamp(48px,15vh,144px) 0 36px}.brand{display:flex;align-items:baseline;gap:14px;padding-bottom:28px;border-bottom:1px solid var(--st-border);margin-bottom:40px}.brand a{font:700 46px/1 var(--st-font-ui);letter-spacing:-3px;text-decoration:none;color:var(--st-text)}.brand-dot{color:var(--st-accent)}.brand-caption{font-size:11px;letter-spacing:3px;color:var(--st-muted)}.invite-card{padding:0;background:none;border:0;box-shadow:none}h1{font-size:26px;font-weight:600;letter-spacing:-.5px;line-height:1.4;margin:0 0 8px}.intro{color:var(--st-muted);margin:0 0 32px}label{display:block;font-size:13px;font-weight:500;margin-bottom:10px}.input-wrap{display:flex;border:1px solid var(--st-border);border-radius:var(--st-radius-small);background:var(--st-inset)}.input-wrap:focus-within{border-color:var(--st-accent);outline:2px solid var(--st-accent);outline-offset:3px}.input-wrap input{min-width:0;flex:1;border:0;background:transparent;outline:0;font:15px/1.5 var(--st-font-ui);padding:14px 12px;color:var(--st-text);box-shadow:none}.input-wrap input::placeholder{color:var(--st-muted);opacity:.8}#visibility{border:0;background:none;color:var(--st-muted);font:12px var(--st-font-ui);padding:0 14px;min-height:48px;cursor:pointer}.hint{font-size:12px;color:var(--st-muted);margin:8px 0}#message{min-height:22px;color:var(--st-error);font-size:13px;margin:12px 0 8px}.submit{width:100%;min-height:48px;display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border:0;border-radius:var(--st-radius-small);background:var(--st-text);color:var(--st-on-accent);font:500 14px var(--st-font-ui);box-shadow:none;cursor:pointer}.submit:hover{background:var(--st-accent);color:var(--st-on-accent)}.submit span{font-size:19px;line-height:1}.submit:disabled{opacity:.6;cursor:wait}footer{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--st-border);margin-top:48px;padding-top:20px;color:var(--st-muted);font-size:11px}button:focus-visible,a:focus-visible{outline:2px solid var(--st-accent);outline-offset:4px}@media(max-width:480px){.invite-shell{padding-top:64px}.brand{margin-bottom:32px}.brand a{font-size:42px}h1{font-size:23px}footer{margin-top:40px}}
