/* 雨课堂式布局令牌。只借鉴布局与配色，不使用其标识。类名使用 y- 前缀。 */
:root{
  --brand:#5096F5; --brand-600:#2B6FD6; --brand-50:#EEF5FE; --brand-100:#DCEAFD;
  --ink:#32325D; --ink-2:#6B7C93; --ink-3:#6E7787; --line:#E5E8EE; --bg:#F5F7FA; --card:#FFFFFF;
  --ok:#1E9E68; --ok-ink:#17784F; --ok-50:#E8F7F0; --warn:#FF9F2E; --warn-ink:#9A5200; --warn-50:#FFF4E5;
  --star:#FFB400; --danger:#D93A2F; --danger-50:#FEECEB;
  --stage:#151527; --stage-2:#22223A;
  --r-sm:6px; --r:10px; --r-lg:16px; --r-pill:999px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px; --s10:40px;
  --f12:12px; --f14:14px; --f16:16px; --f18:18px; --f22:22px; --f28:28px; --f40:40px;
  --shadow:0 2px 8px rgba(50,50,93,.08); --shadow-lg:0 12px 32px rgba(50,50,93,.16);
  --font:-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif;
  --bg:#F5F7FA; --panel:#fff; --gold:#2B6FD6; --paper:#32325D; --muted:#6B7C93;
}
.y-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;height:40px;padding:0 18px;border-radius:var(--r-pill);border:1px solid var(--line);background:#fff;color:var(--ink);font-weight:500;text-decoration:none}
.y-btn.primary,.y-btn.y-primary{background:var(--brand-600);border-color:var(--brand-600);color:#fff}
.y-btn.y-danger{background:var(--danger);border-color:var(--danger);color:#fff}
.y-btn.y-ghost{color:var(--danger);border-color:#F9B5AF;background:#fff}
.y-btn.y-lg{height:48px;min-height:48px;font-size:var(--f16);padding:0 24px}
.y-btn.y-block{width:100%}
.y-card{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow)}
.y-tag{display:inline-flex;align-items:center;gap:4px;min-height:22px;padding:0 8px;border-radius:var(--r-pill);font-size:var(--f12);background:var(--brand-50);color:var(--brand-600)}
.y-tag.y-ok{background:var(--ok-50);color:var(--ok-ink)}
.y-tag.y-warn{background:var(--warn-50);color:var(--warn-ink)}
.y-tag.y-danger{background:var(--danger-50);color:var(--danger)}
.y-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);display:inline-block}
.y-faint{color:var(--ink-3)}
.y-switch{width:44px;height:26px;border-radius:13px;background:#D5DAE3;position:relative;flex:none;border:0;padding:0}
.y-switch:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003}
.y-switch.on{background:var(--ok)}
.y-switch.on:after{left:21px}
:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}