/* =========================================================
   Sourgen · 扩展样式（AI 助手 / 安装应用）
   ========================================================= */

.navlinks .navai{
  font-family:var(--mono); font-size:13.5px; font-weight:600;
  color:var(--on-ink); background:var(--ink);
  padding:5px 12px; border-radius:999px; letter-spacing:.01em;
}
.navlinks .navai:hover{background:#D6DBE2}

/* ---------- 悬浮入口 ---------- */
.ai-fab{
  position:fixed; right:22px; bottom:22px; z-index:45;
  width:52px; height:52px; border-radius:50%;
  background:var(--ink); color:var(--on-ink);
  font-family:var(--mono); font-size:15px; font-weight:600;
  box-shadow:0 8px 24px rgba(0,0,0,.55);
}
.ai-fab:hover{transform:translateY(-1px); box-shadow:0 12px 28px rgba(0,0,0,.65)}
body.ai-open .ai-fab{display:none}

/* ---------- AI 视图 ---------- */
.ai-view{
  position:fixed; inset:0; z-index:70; display:none;
  background:var(--paper);
}
.ai-view.on{display:block; animation:aifade .16s ease-out}
@keyframes aifade{from{opacity:0}to{opacity:1}}
.ai-wrap{
  max-width:820px; margin:0 auto; height:100%;
  display:flex; flex-direction:column; padding:0 20px;
}
.ai-top{
  display:flex; align-items:center; justify-content:space-between;
  height:60px; border-bottom:1px solid var(--line); flex:0 0 auto;
}
.ai-top-l{display:flex; align-items:center; gap:10px}
.ai-top-l b{font-family:var(--mono); font-size:15px}
.ai-dot{width:8px; height:8px; border-radius:50%; background:var(--py)}
.ai-ver{font-family:var(--mono); font-size:11.5px; color:var(--soft); border:1px solid var(--line-hard); border-radius:999px; padding:1px 8px}
.ai-x{font-size:13.5px; color:var(--soft)}
.ai-x:hover{color:var(--ink)}

.ai-tabs{display:flex; gap:8px; padding-top:16px; flex:0 0 auto}
.ai-tab{
  font-size:14px; padding:7px 14px; border-radius:8px;
  border:1px solid var(--line-hard); color:var(--soft); background:var(--surface);
}
.ai-tab.on{background:var(--ink); color:var(--on-ink); border-color:var(--ink)}
.ai-hint{font-size:13px; color:var(--soft); padding:10px 2px 0; flex:0 0 auto}

.ai-out{
  flex:1 1 auto; overflow-y:auto; margin:14px 0 0;
  padding:18px; background:var(--surface);
  border:1px solid var(--line); border-radius:12px;
  font-size:15px; line-height:1.75;
}
.ai-empty,.ai-wait,.ai-err{color:var(--soft); font-size:14px}
.ai-err{color:var(--no); font-family:var(--mono); font-size:13px}
.ai-meta{
  font-family:var(--mono); font-size:11.5px; color:var(--soft);
  padding-bottom:10px; margin-bottom:12px; border-bottom:1px dashed var(--line);
}
.ai-body p{margin:0 0 10px}
.ai-body ul,.ai-body ol{margin:0 0 12px; padding-left:22px}
.ai-body li{margin:0 0 5px}
.ai-h3{font-size:16px; margin:16px 0 8px}
.ai-h4{font-size:14.5px; margin:14px 0 6px; color:var(--soft)}
.ai-ic{
  font-family:var(--mono); font-size:13px; background:var(--surface2);
  border:1px solid var(--line); border-radius:4px; padding:1px 5px;
}
.ai-code{background:var(--code-bg); border-radius:10px; overflow:hidden; margin:12px 0}
.ai-code-bar{
  display:flex; align-items:center; justify-content:space-between;
  padding:7px 12px; background:rgba(255,255,255,.05);
  font-family:var(--mono); font-size:11.5px; color:#93A0B2;
}
.ai-copy{font-size:11.5px; color:#93A0B2; font-family:var(--mono)}
.ai-copy:hover{color:#fff}
.ai-code pre{
  margin:0; padding:14px; overflow-x:auto;
  font-family:var(--mono); font-size:13px; line-height:1.65;
  color:var(--code-fg); white-space:pre;
}

.ai-samples{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:12px 0 0; font-size:13px; color:var(--soft); flex:0 0 auto;
}
.ai-sample{
  font-size:12.5px; border:1px solid var(--line-hard); border-radius:999px;
  padding:3px 11px; color:var(--soft); background:var(--surface);
}
.ai-sample:hover{color:var(--ink); border-color:var(--ink)}

.ai-inputbar{flex:0 0 auto; padding:12px 0 20px}
.ai-inputbar textarea{
  width:100%; resize:none; font:inherit; font-size:15px; line-height:1.6;
  padding:12px 14px; border:1px solid var(--line-hard); border-radius:10px;
  background:var(--surface); color:var(--ink); min-height:64px;
}
.ai-inputbar textarea:focus{outline:2px solid var(--ink); outline-offset:0; border-color:var(--ink)}
.ai-actions{display:flex; justify-content:flex-end; gap:10px; margin-top:10px}
.ai-mini{padding:8px 16px; font-size:14px}

/* 题目里的「问 AI」 */
.askai{
  font-family:var(--mono); font-size:12.5px; color:var(--py);
  border:1px solid var(--py); border-radius:999px; padding:3px 11px;
  margin-left:auto;
}
.askai:hover{background:var(--py); color:#fff}

/* =========================================================
   Sourgen · 账号样式（注册 / 登录）
   ========================================================= */

.navauth{
  font-family:var(--mono); font-size:13px; font-weight:600;
  color:var(--ink); background:var(--surface);
  border:1px solid var(--line-hard); border-radius:999px;
  padding:5px 13px; white-space:nowrap; max-width:150px;
  overflow:hidden; text-overflow:ellipsis;
}
.navauth:hover{border-color:var(--ink)}
.navauth.on{color:var(--soft); background:transparent}

body.locked{overflow:hidden}

.auth-view{
  position:fixed; inset:0; z-index:70; display:none;
  background:var(--paper); overflow-y:auto;
}
.auth-view.on{display:block; animation:aifade .16s ease-out}
.auth-wrap{
  max-width:430px; margin:0 auto; min-height:100%;
  display:flex; flex-direction:column; padding:0 20px 40px;
}
.auth-top{
  display:flex; align-items:center; justify-content:space-between;
  height:60px; flex:0 0 auto;
}
.auth-top .brand{text-decoration:none}

.auth-tabs{
  display:flex; gap:6px; margin:14px 0 0;
  border-bottom:1px solid var(--line); flex:0 0 auto;
}
.auth-tab{
  font-size:15px; font-weight:600; color:var(--soft);
  padding:9px 14px 11px; margin-bottom:-1px;
  border-bottom:2px solid transparent;
}
.auth-tab.on{color:var(--ink); border-bottom-color:var(--ink)}

.auth-pane{display:none; padding-top:22px}
.auth-pane.on{display:block}

.auth-subtabs{display:flex; gap:8px; margin-bottom:18px}
.auth-sub{
  font-size:13px; padding:6px 13px; border-radius:999px;
  border:1px solid var(--line-hard); color:var(--soft); background:var(--surface);
}
.auth-sub.on{background:var(--ink); color:var(--on-ink); border-color:var(--ink)}

.auth-form{display:flex; flex-direction:column; gap:14px}
.auth-form[hidden]{display:none}   /* flex 会盖掉 UA 的 [hidden]，必须显式声明 */
.field{display:flex; flex-direction:column; gap:6px}
.field > span{font-family:var(--mono); font-size:12px; color:var(--soft)}
.field input{
  font:inherit; font-size:15px; padding:11px 13px;
  border:1px solid var(--line-hard); border-radius:8px;
  background:var(--surface); color:var(--ink); width:100%;
}
.field input:focus{outline:2px solid var(--ink); outline-offset:0; border-color:var(--ink)}
.field input::placeholder{color:#6B7482}

.btn.wide{width:100%; justify-content:center; border-radius:8px}
.auth-form .btn.ghost{background:var(--surface); color:var(--ink); border-color:var(--line-hard)}
.auth-form .btn.ghost:hover{border-color:var(--ink)}
.auth-form .btn.solid{border-radius:8px}

.auth-msg{
  min-height:22px; margin-top:16px; font-size:13.5px;
  color:var(--soft); line-height:1.6;
}
.auth-msg.err{color:var(--no)}
.auth-msg.ok{color:var(--ok)}
.auth-note{
  margin-top:auto; padding-top:26px;
  font-size:12.5px; color:var(--soft); border-top:1px dashed var(--line);
}

@media (max-width:760px){
  .navauth{font-size:12.5px; padding:4px 10px; max-width:104px}
  .auth-wrap{padding:0 16px 32px}
  .auth-tabs .auth-tab{font-size:14.5px}
  .field input{font-size:16px}   /* 避免 iOS 聚焦缩放 */
}
/* 窄屏导航链接隐藏后，账号入口自行靠右 */
@media (max-width:720px){
  .navauth{margin-left:auto}
}

@media (max-width:760px){
  .ai-wrap{padding:0 14px}
  .ai-out{padding:14px; font-size:14.5px}
  .ai-fab{right:16px; bottom:16px; width:48px; height:48px}
  .navlinks .navai{font-size:12.5px; padding:4px 10px}
}

/* =========================================================
   Sourgen · 账号样式 v2 增量（登录墙 / 配置面板 / 忘记密码）
   ========================================================= */

.auth-hero{margin:18px 0 4px}
.auth-hero h2{font-size:23px; line-height:1.22; margin:0 0 8px}
.auth-hero p{margin:0; font-size:14px; line-height:1.6; color:var(--soft)}

.auth-cfg{
  margin:16px 0 0; border:1px solid var(--line); border-radius:10px;
  background:var(--surface); padding:0 14px;
}
.auth-cfg[open]{padding-bottom:14px}
.auth-cfg summary{
  font-family:var(--mono); font-size:12.5px; color:var(--soft);
  padding:11px 0; cursor:pointer; list-style:none;
}
.auth-cfg summary::-webkit-details-marker{display:none}
.auth-cfg summary:before{content:"▸ "; font-family:var(--mono)}
.auth-cfg[open] summary:before{content:"▾ "}
.auth-cfg-tip{font-size:12.5px; color:var(--soft); line-height:1.6; margin:0 0 12px}
.auth-cfg .field{margin-bottom:10px}
.auth-cfg .btn{margin-top:2px}

.auth-links{display:flex; justify-content:flex-end; margin-top:2px}
.auth-link{font-size:13px; color:var(--soft); text-decoration:underline; text-underline-offset:3px}
.auth-link:hover{color:var(--ink)}

/* 未登录：受限入口置灰，账号视图常驻 */
body.auth-locked a[href="#learn"],
body.auth-locked a[href="#levels"],
body.auth-locked a[href="#progress"],
body.auth-locked #nav-ai,
body.auth-locked #hero-ai,
body.auth-locked #hero-ai-fab{opacity:.5}
body.auth-locked .auth-view{display:block}

@media (max-width:760px){
  .auth-hero h2{font-size:20px}
  .auth-hero p{font-size:13.5px}
}

/* ===== AI 拍照答疑：题图预览（输入区）与会话里的题图 ===== */
.ai-photo{
  display:flex; align-items:center; gap:10px;
  padding:8px 10px; margin-bottom:8px;
  border:1px solid var(--line, #2E3339); border-radius:12px;
  background:rgba(255,255,255,.05);
}
.ai-photo img{
  width:56px; height:56px; object-fit:cover; border-radius:9px;
  border:1px solid var(--line, #2E3339);
}
.ai-photo-tip{ flex:1; font-size:12.5px; opacity:.72; line-height:1.5; }
.ai-photo-x{
  border:1px solid var(--line, #2E3339); background:transparent; cursor:pointer;
  border-radius:8px; padding:5px 10px; font-size:12.5px; color:#F0604F;
}
.ai-shot{ margin:10px 0 4px; }
.ai-shot img{
  display:block; max-width:min(320px, 72%); border-radius:12px;
  border:1px solid var(--line, #2E3339);
}
