/* 燕语 FreeCoding：控制台认证页（登录 / 注册 / 忘记密码 / 重置密码 / 邮箱验证 / 第三方回调）。
   左：首页同款靛青夜空与燕子；右：浅色纸面上的表单。手机上夜空收成顶部一条，表单像一页纸叠在上面。
   全部规则挂在 html.yy-auth 下（auth.js 只在认证路由加这个 class），控制台其它页面不受影响。 */
@font-face{
  font-family:"YY Serif";
  src:url("/yy/fonts/yy-serif.woff2") format("woff2");
  font-weight:600 900;
  font-display:swap;
}
html.yy-auth{
  --yy-night:      #0c1d40;
  --yy-night-line: oklch(0.42 0.06 258 / .55);
  --yy-sky:        oklch(0.84 0.06 236);
  --yy-on-night:   oklch(0.97 0.008 250);
  --yy-on-night-2: oklch(0.82 0.03 250);
  --yy-ground:     oklch(0.975 0.005 250);
  --yy-ground-2:   oklch(0.945 0.009 250);
  --yy-field:      #fff;
  --yy-ink:        oklch(0.23 0.035 260);
  --yy-ink-2:      oklch(0.44 0.03 258);
  --yy-rule:       oklch(0.88 0.012 252);
  --yy-rule-hover: oklch(0.76 0.02 254);
  --yy-seal:       oklch(0.575 0.19 31);
  --yy-seal-hover: oklch(0.53 0.19 31);
  --yy-seal-soft:  oklch(0.575 0.19 31 / .16);
  --yy-seal-fill:       oklch(0.575 0.19 31);   /* 白字按钮底色，白字对比 ≥4.5:1 */
  --yy-seal-fill-hover: oklch(0.53 0.19 31);
  --yy-field-line:      oklch(0.66 0.02 254);   /* 输入框边界，对纸面约 3:1 */
  --yy-add:        oklch(0.82 0.13 160);
  --yy-serif:"YY Serif","Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif;
  --yy-sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Segoe UI",sans-serif;
  --yy-mono:ui-monospace,"SF Mono","Cascadia Code","JetBrains Mono",Consolas,"Liberation Mono",monospace;
  --yy-panel: clamp(400px, 42vw, 660px);
  --yy-ease: cubic-bezier(.22,1,.36,1);
  accent-color: var(--yy-seal);
  caret-color: var(--yy-seal);
  background: var(--yy-ground);
}
/* 深色：右侧换成比左侧夜空略浅的靛青纸面，表单字色跟着反转 */
html.yy-auth.dark{
  --yy-ground:     oklch(0.195 0.045 262);
  --yy-ground-2:   oklch(0.24 0.05 262);
  --yy-field:      oklch(0.235 0.05 262);
  --yy-ink:        oklch(0.96 0.01 250);
  --yy-ink-2:      oklch(0.80 0.03 250);
  --yy-rule:       oklch(0.36 0.05 258);
  --yy-rule-hover: oklch(0.48 0.05 256);
  --yy-seal:       oklch(0.64 0.18 31);
  --yy-seal-hover: oklch(0.60 0.18 31);
  --yy-seal-soft:  oklch(0.64 0.18 31 / .24);
  --yy-seal-fill:       oklch(0.575 0.19 31);   /* 深色下按钮仍用深一档的朱砂，白字才过 AA；亮朱砂只给下划线和焦点 */
  --yy-seal-fill-hover: oklch(0.53 0.19 31);
  --yy-field-line:      oklch(0.52 0.05 256);
}
html.yy-auth body{background:var(--yy-ground);color:var(--yy-ink);font-family:var(--yy-sans)}
html.yy-auth ::selection{background:oklch(0.84 0.06 236 / .55);color:var(--yy-ink)}
html.yy-auth .navigation-progress-bar{background:var(--yy-seal)!important}

/* ---------- 左侧夜空面板（在 #app 之外，由 auth.js 插入） ---------- */
#yy-auth-panel{display:none}
html.yy-auth #yy-auth-panel{
  position:fixed;inset:0 auto 0 0;width:var(--yy-panel);z-index:1;
  display:flex;flex-direction:column;justify-content:flex-start;gap:2rem;
  padding:clamp(1.75rem,3vw,3rem) clamp(1.75rem,3.4vw,3.5rem);
  padding-top:max(clamp(1.75rem,3vw,3rem), env(safe-area-inset-top,0px));
  background:var(--yy-night);color:var(--yy-on-night);overflow:hidden;isolation:isolate;
  font-family:var(--yy-sans);
}
/* 桌面竖幅：画面整体上提约一成，燕群留在上半幅，末尾的小燕子不压标语，右侧翅尖不贴分栏线 */
.yy-ap-art{position:absolute;left:0;top:-11%;z-index:-2;width:100%;height:113%;object-fit:cover;object-position:70% 0}
#yy-auth-panel::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(180deg, oklch(0.2 0.07 262 / .55) 0%, oklch(0.2 0.07 262 / 0) 22%),
    linear-gradient(0deg, var(--yy-night) 0%, oklch(0.22 0.07 262 / .88) 34%, oklch(0.22 0.07 262 / 0) 64%)}
.yy-ap-brand{display:inline-flex;align-items:center;gap:.6rem;align-self:flex-start;text-decoration:none;color:inherit;border-radius:8px}
.yy-ap-brand img{width:34px;height:34px;flex-shrink:0}
.yy-ap-word{font-family:var(--yy-serif);font-weight:800;font-size:1.22rem;letter-spacing:.06em;line-height:1}
.yy-ap-word small{font-family:var(--yy-sans);font-weight:600;font-size:.8rem;letter-spacing:.02em;color:var(--yy-on-night-2);margin-left:.35rem}
/* 文案压在面板下部的远山暗处：燕子留在上半幅，正文不和飞行轨迹打架 */
.yy-ap-copy{display:flex;flex-direction:column;gap:1.25rem;max-width:30rem;margin-top:auto}
.yy-ap-title{margin:0;font-family:var(--yy-serif);font-weight:900;font-size:clamp(2.5rem,3.3vw + .4rem,3.9rem);
  line-height:1.16;letter-spacing:.04em;text-wrap:balance}
.yy-ap-title span{display:block;color:var(--yy-sky)}
.yy-ap-lede{margin:0;font-size:1rem;line-height:1.9;color:var(--yy-on-night-2);max-width:26rem;text-wrap:pretty}
.yy-ap-ep{display:inline-flex;align-items:center;align-self:flex-start;max-width:100%;
  background:oklch(0.16 0.05 262 / .72);border:1px solid var(--yy-night-line);border-radius:12px;padding:.35rem .35rem .35rem .9rem}
.yy-ap-ep-label{font-size:.8rem;color:var(--yy-on-night-2);white-space:nowrap;margin-right:.7rem}
.yy-ap-ep code{font:600 .9rem/1 var(--yy-mono);color:var(--yy-add);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.yy-ap-copybtn{margin-left:.7rem;font:600 .8rem/1 var(--yy-sans);color:var(--yy-on-night);background:oklch(1 0 0 / .09);
  border:0;border-radius:8px;padding:.62rem .8rem;cursor:pointer;flex-shrink:0;transition:background .2s}
.yy-ap-copybtn:hover{background:oklch(1 0 0 / .16)}
.yy-ap-links{display:flex;flex-wrap:wrap;gap:.2rem 1.4rem;font-size:.88rem}
.yy-ap-links a{color:var(--yy-on-night-2);text-decoration:none;padding:.2rem 0;transition:color .2s}
.yy-ap-links a:hover{color:var(--yy-on-night)}
#yy-auth-panel :focus-visible{outline:2px solid var(--yy-sky);outline-offset:3px}

/* ---------- 右侧：认证布局本体（sub2api 的 AuthLayout） ---------- */
html.yy-auth #app > .min-h-screen{
  margin-left:var(--yy-panel);min-height:100vh;min-height:100dvh;
  background:var(--yy-ground);padding:clamp(2.5rem,6vw,5rem) clamp(1.5rem,5vw,4.5rem);
  border-left:1px solid var(--yy-rule);
}
html.yy-auth.dark #app > .min-h-screen{border-left-color:var(--yy-night-line)}
/* 原版的渐变底、发光圆斑、网格纹全部去掉 */
html.yy-auth #app > .min-h-screen > .absolute.inset-0,
html.yy-auth #app > .min-h-screen > .pointer-events-none.absolute{display:none}
html.yy-auth #app > .min-h-screen > .relative.z-10{max-width:400px}
/* 品牌已经在左侧面板里，右侧原来的 logo + 站名 + 副标题不再重复 */
html.yy-auth #app > .min-h-screen > .relative.z-10 > .mb-8.text-center:first-child{display:none}

/* 卡片：分栏里不需要再套一层玻璃卡，表单直接放在纸面上 */
html.yy-auth .card-glass{background:none!important;border:0!important;box-shadow:none!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;padding:0!important;border-radius:0}
html.yy-auth .card-glass > .space-y-6 > .text-center:first-child{text-align:left}
html.yy-auth .card-glass h2{font-family:var(--yy-serif);font-weight:800;font-size:2.05rem;line-height:1.25;
  letter-spacing:.04em;color:var(--yy-ink);text-wrap:balance}
html.yy-auth .card-glass h2 + p{margin-top:.55rem;font-size:.97rem;color:var(--yy-ink-2);text-wrap:pretty}
html.yy-auth .card-glass .space-y-6 > :not([hidden]) ~ :not([hidden]){margin-top:2rem}

/* 字段 */
html.yy-auth .input-label{font-size:.9rem;font-weight:600;color:var(--yy-ink);margin-bottom:.45rem}
html.yy-auth .input-label .text-gray-400{color:var(--yy-ink-2)}
html.yy-auth .input{height:3rem;padding-top:0;padding-bottom:0;font-size:.97rem;color:var(--yy-ink);
  background:var(--yy-field);border:1px solid var(--yy-field-line);border-radius:10px;box-shadow:none;
  transition:border-color .2s,box-shadow .2s var(--yy-ease)}
html.yy-auth .input::placeholder{color:var(--yy-ink-2);opacity:.85}
html.yy-auth .input:hover{border-color:var(--yy-ink-2)}
html.yy-auth .input:focus,
html.yy-auth .input:focus-visible{outline:none;border-color:var(--yy-seal);box-shadow:0 0 0 3px var(--yy-seal-soft)}
html.yy-auth .input:disabled{background:var(--yy-ground-2);cursor:not-allowed;opacity:1;color:var(--yy-ink-2)}
html.yy-auth .input:-webkit-autofill{-webkit-text-fill-color:var(--yy-ink);-webkit-box-shadow:0 0 0 1000px var(--yy-field) inset;caret-color:var(--yy-seal)}
html.yy-auth form .pointer-events-none.absolute svg,
html.yy-auth form .relative > button.absolute{color:var(--yy-ink-2)}
html.yy-auth form .relative > button.absolute:hover{color:var(--yy-ink)}
html.yy-auth .input-hint{font-size:.82rem;color:var(--yy-ink-2);margin-top:.4rem;text-wrap:pretty}

/* 主按钮：朱砂印 */
html.yy-auth .btn-primary{background-image:none!important;background-color:var(--yy-seal-fill)!important;color:#fff!important;
  border:0;height:3.1rem;border-radius:10px;font-weight:600;font-size:1rem;letter-spacing:.04em;
  box-shadow:0 12px 24px -16px oklch(0.575 0.19 31 / .9);transition:background-color .2s,transform .2s var(--yy-ease),box-shadow .2s}
html.yy-auth .btn-primary:hover:not(:disabled){background-color:var(--yy-seal-fill-hover)!important}
html.yy-auth .btn-primary:active:not(:disabled){transform:translateY(1px)}
html.yy-auth .btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}
html.yy-auth .btn-primary:focus-visible{outline:2px solid var(--yy-seal);outline-offset:3px}
/* 次要按钮（第三方登录、发送验证码等） */
html.yy-auth .card-glass .btn-secondary,
html.yy-auth .card-glass .btn-outline{background:var(--yy-field)!important;color:var(--yy-ink)!important;
  border:1px solid var(--yy-rule)!important;border-radius:10px;box-shadow:none}
html.yy-auth .card-glass .btn-secondary:hover,
html.yy-auth .card-glass .btn-outline:hover{border-color:var(--yy-rule-hover)!important;background:var(--yy-ground-2)!important}

/* 「需要先同意条款」提示条：纸面上的一张便签，不再是青绿色块 */
html.yy-auth form .rounded-lg.border{background:var(--yy-ground-2)!important;border-color:var(--yy-rule)!important;color:var(--yy-ink)!important;border-radius:10px}
html.yy-auth form .rounded-lg.border p{color:var(--yy-ink)!important}
html.yy-auth form .rounded-lg.border p + p{color:var(--yy-ink-2)!important}
html.yy-auth form .rounded-lg.border svg{color:var(--yy-seal)!important}

/* sub2api 用的青绿主色（primary）在认证页统一换成朱砂 */
html.yy-auth .bg-primary-600{background-color:var(--yy-seal-fill)!important}
html.yy-auth .hover\:bg-primary-700:hover,
html.yy-auth .hover\:bg-primary-500:hover{background-color:var(--yy-seal-fill-hover)!important}
html.yy-auth .text-primary-600,html.yy-auth .text-primary-500,html.yy-auth .text-primary-400,html.yy-auth .text-primary-700{color:var(--yy-seal)!important}
html.yy-auth .bg-primary-50{background-color:var(--yy-ground-2)!important}
html.yy-auth [class*="ring-primary"]{--tw-ring-color:var(--yy-rule)!important}
html.yy-auth [class*="shadow-primary"]{--tw-shadow-color:transparent!important}

/* 表单下方「还没有账户？注册」与版权 */
html.yy-auth #app > .min-h-screen > .relative.z-10 > .mt-6{text-align:left;margin-top:1.6rem}
html.yy-auth #app > .min-h-screen > .relative.z-10 > .mt-6 p{color:var(--yy-ink-2)!important;font-size:.93rem}
html.yy-auth #app > .min-h-screen > .relative.z-10 > .mt-6 a{color:var(--yy-ink)!important;font-weight:600;
  text-decoration:underline;text-decoration-color:var(--yy-seal);text-decoration-thickness:1.5px;text-underline-offset:4px;margin-left:.15rem}
html.yy-auth #app > .min-h-screen > .relative.z-10 > .mt-6 a:hover{color:var(--yy-seal)!important}
html.yy-auth #app > .min-h-screen > .relative.z-10 > .mt-8{text-align:left;margin-top:3rem;color:var(--yy-ink-2)!important;font-size:.78rem}
html.yy-auth .card-glass a:not(.btn){color:var(--yy-ink);text-decoration-color:var(--yy-seal);text-underline-offset:3px}
html.yy-auth .card-glass a:not(.btn):hover{color:var(--yy-seal)}

/* 右上角提示（toast，挂在 body 上）：去掉 4px 红色侧条，用纸面与细边，红色只留给图标和进度条 */
html.yy-auth body > div.fixed.right-4.top-4 > div{border-left-width:1px!important;border-color:var(--yy-rule)!important;
  background:var(--yy-field)!important;border-radius:10px!important;box-shadow:0 18px 40px -22px oklch(0.15 0.05 262 / .55)!important}
html.yy-auth body > div.fixed.right-4.top-4 > div p{color:var(--yy-ink)!important}
html.yy-auth body > div.fixed.right-4.top-4 > div button{color:var(--yy-ink-2)!important}
html.yy-auth body > div.fixed.right-4.top-4 > div button:hover{background:var(--yy-ground-2)!important;color:var(--yy-ink)!important}
html.yy-auth body > div.fixed.right-4.top-4 > div > .h-1{background:var(--yy-ground-2)!important}
.yy-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 条款弹窗（挂在 body 上） */
html.yy-auth body > .fixed.inset-0{background:oklch(0.16 0.05 262 / .62)!important}
html.yy-auth body > .fixed.inset-0 > div{border-radius:14px!important;box-shadow:0 30px 70px -28px oklch(0.12 0.05 262 / .7)!important}
html.yy-auth body > .fixed.inset-0 h2{font-family:var(--yy-serif);font-weight:800;letter-spacing:.03em}
html.yy-auth body > .fixed.inset-0 a.group:hover{border-color:var(--yy-rule-hover)!important}

/* ---------- 手机 / 窄屏：夜空收成顶部一条，表单像纸页叠在上面 ---------- */
@media (max-width: 960px){
  html.yy-auth #yy-auth-panel{position:relative;inset:auto;width:auto;min-height:clamp(210px,34vh,290px);
    padding:max(1.1rem, env(safe-area-inset-top,0px)) 1.25rem 2.6rem;gap:1rem}
  .yy-ap-art{top:0;height:100%;object-position:62% 30%}
  #yy-auth-panel::after{background:linear-gradient(0deg, var(--yy-night) 0%, oklch(0.22 0.07 262 / .7) 38%, oklch(0.22 0.07 262 / .1) 80%)}
  .yy-ap-title{font-size:clamp(1.9rem,7.4vw,2.5rem)}
  .yy-ap-lede,.yy-ap-ep,.yy-ap-links{display:none}
  html.yy-auth #app > .min-h-screen{margin-left:0;margin-top:-1.25rem;min-height:auto;position:relative;z-index:2;
    align-items:flex-start;border-left:0;border-radius:18px 18px 0 0;
    padding:2rem 1.25rem max(2.5rem, env(safe-area-inset-bottom,0px))}
  html.yy-auth .card-glass h2{font-size:1.75rem}
}
@media (min-width: 961px) and (max-height: 640px){
  .yy-ap-lede{display:none}
}

@media (prefers-reduced-motion: no-preference){
  html.yy-auth .yy-ap-art{animation:yy-drift 2.4s var(--yy-ease) both}
  @keyframes yy-drift{from{transform:scale(1.04) translateX(1.5%)}to{transform:none}}
}