/* ============================================================
   溯源 · 白色玻璃主题（覆盖 app.css，加载顺序在 app.css 之后）
   只改皮，不动 app.js 的任何逻辑
   ============================================================ */
:root{
  --bg:#F5F5F7; --card:rgba(255,255,255,.76); --text:#1D1D1F; --muted:#6E6E73;
  --line:rgba(0,0,0,.08); --brand:#1D1D1F; --brand-soft:rgba(0,0,0,.05);
  --danger:#1D1D1F; --danger-soft:rgba(255,59,48,.10);
  --warn:#E0A800; --radius:14px;
  --shadow:0 12px 32px -26px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.9);
}
body{
  background:
    radial-gradient(1200px 800px at 50% -8%, #FFFFFF 0%, rgba(255,255,255,0) 60%),
    radial-gradient(900px 700px at 12% 8%, rgba(255,249,240,.85), rgba(255,249,240,0) 62%),
    linear-gradient(180deg,#FBFBFD 0%,#F5F5F7 100%);
  background-attachment:fixed;
  color:var(--text); font-size:14px;
}
/* 顶栏 */
.topbar{
  background:rgba(255,255,255,.62); backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  border-bottom:1px solid var(--line); box-shadow:0 1px 0 rgba(255,255,255,.9);
  padding:9px 16px;
}
.brand{font-weight:600;font-size:15px;letter-spacing:.02em}
.brand .logo{font-size:15px;margin-right:2px;filter:saturate(.6)}
.nav a{font-size:13px;padding:6px 11px;border-radius:999px;color:#5C6169}
.nav a:hover{background:rgba(255,255,255,.7)}
.nav a.active{background:#fff;color:#15171B;font-weight:600;box-shadow:0 6px 18px -14px rgba(30,42,60,.6),0 0 0 1px rgba(21,23,27,.05)}
/* 主体 */
main{max-width:1040px;padding:20px 16px 96px}
.page-head{margin-bottom:14px}
.page-head h1{font-size:21px;font-weight:600;letter-spacing:-.3px}
.sub{font-size:12px;color:var(--muted)}
.card{
  background:var(--card); border:1px solid rgba(255,255,255,.9); border-radius:var(--radius);
  box-shadow:var(--shadow); backdrop-filter:blur(20px) saturate(160%); -webkit-backdrop-filter:blur(20px) saturate(160%);
  padding:16px;
}
.card h2{font-size:14px;font-weight:600;letter-spacing:.01em;margin:0 0 10px}
/* 按钮 */
.btn{border-radius:10px;font-size:13px;padding:8px 14px;background:rgba(255,255,255,.7);border:1px solid rgba(21,23,27,.08);color:#2A3037}
.btn:hover{background:#fff}
.btn.primary{background:#15171B;color:#F7F7F5;border-color:#15171B}
.btn.primary:hover{filter:brightness(1.15)}
.btn.ghost{background:rgba(255,255,255,.72);border:1px solid rgba(21,23,27,.08)}
.btn.danger{background:rgba(255,59,48,.10);color:#B34434;border-color:rgba(255,59,48,.18)}
.btn.small{font-size:12px;padding:5px 10px;border-radius:8px}
/* 表单 */
.field label{font-size:11.5px;color:var(--muted);letter-spacing:.02em}
input,select,textarea{background:rgba(255,255,255,.8);border:1px solid rgba(21,23,27,.10);border-radius:10px;font-size:13.5px;padding:9px 11px}
input:focus,select:focus,textarea:focus{border-color:rgba(0,0,0,.22);background:#fff;box-shadow:0 0 0 3px rgba(0,0,0,.055)}
/* 标签 */
.chip{background:rgba(255,255,255,.7);border:1px solid rgba(21,23,27,.07);color:#5C6169;font-size:11.5px;padding:3px 9px}
.chip.green{background:rgba(0,0,0,.055);color:#1F7A4F;border-color:rgba(0,0,0,.08)}
.chip.red{background:rgba(255,59,48,.10);color:#B34434;border-color:rgba(255,59,48,.18)}
.chip.amber{background:rgba(224,168,0,.12);color:#8F6210;border-color:rgba(224,168,0,.22)}
.hint,.tagline{font-size:11.5px;color:#7A828C}
/* 卡片里的条目 */
.item{padding:13px 14px}
.item-top{font-size:11.5px;color:#7A828C}
.stem{font-size:13.5px;line-height:1.75}
.stat{background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.9);border-radius:12px;box-shadow:var(--shadow)}
.stat .k{font-size:10px;letter-spacing:.14em;color:#9AA0A9;text-transform:uppercase}
.stat .v{font-size:26px;font-weight:600;letter-spacing:-.6px}
.bar-row{font-size:12px}
.bar-row .bar{height:3px;background:rgba(21,23,27,.08);border-radius:2px}
.bar-row .bar>i{background:linear-gradient(90deg,rgba(29,29,31,.35),rgba(29,29,31,.8))}
/* 知识树 / 台账小卡 */
.tree-minor{background:rgba(255,255,255,.72);border:1px solid rgba(21,23,27,.07);border-radius:999px;font-size:12px;padding:6px 12px}
.tree-minor:hover{border-color:rgba(52,199,89,.5);color:#1F7A4F}
.tree-minor b{color:#1F7A4F}
/* 表格 */
.table-wrap{background:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.9);border-radius:12px}
th{background:rgba(255,255,255,.7);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#9AA0A9}
td{font-size:12.5px;border-bottom:1px solid rgba(21,23,27,.06)}
/* 录题 */
.dropzone{background:rgba(255,255,255,.55);border:1px dashed rgba(0,0,0,.22);border-radius:14px;padding:34px 18px;color:#7A828C;font-size:13px}
.dropzone:hover,.dropzone.drag{background:rgba(255,255,255,.85);border-color:rgba(52,199,89,.75);color:#1F7A4F}
.preview img{border-radius:12px;border:1px solid rgba(255,255,255,.9)}
/* 弹层 */
.modal{background:rgba(20,28,38,.32);backdrop-filter:blur(6px)}
.modal-box{background:rgba(255,255,255,.92);backdrop-filter:blur(30px);border:1px solid rgba(255,255,255,.9);border-radius:18px;box-shadow:0 40px 80px -50px rgba(20,30,40,.6)}
.toast{background:rgba(21,23,27,.92);border-radius:12px;font-size:13px}
.kbd{background:rgba(21,23,27,.05)}
.md pre,.md code{background:rgba(21,23,27,.04)}

/* ---------------- 手机端 ---------------- */
@media (max-width: 640px){
  body{padding-bottom:66px}
  .topbar{position:fixed;left:0;right:0;bottom:0;top:auto;height:60px;padding:5px 4px;
    border-top:1px solid rgba(21,23,27,.08);border-bottom:0;background:rgba(255,255,255,.95);
    box-shadow:0 -8px 24px -20px rgba(20,30,40,.5);z-index:40}
  .brand{display:none}
  .nav{justify-content:space-around;gap:0;overflow:visible;flex:1}
  .nav a{font-size:10.5px;padding:5px 6px;border-radius:10px;text-align:center}
  .nav a.active{background:rgba(0,0,0,.055);color:#1F7A4F;box-shadow:none}
  #quickAdd{position:fixed;right:16px;bottom:76px;width:50px;height:50px;border-radius:50%;
    padding:0;font-size:0;z-index:41;background:#15171B;color:#fff;
    box-shadow:0 14px 30px -14px rgba(20,30,40,.7)}
  #quickAdd::after{content:"＋";font-size:22px;line-height:50px}
  main{max-width:none;padding:14px 12px 24px}
  .page-head h1{font-size:19px}
  .grid2,.stat-grid{grid-template-columns:1fr}
  .stat-grid{grid-template-columns:1fr 1fr;gap:10px}
  .card{padding:14px;border-radius:14px}
  .card{margin-bottom:10px}
  .filters{gap:8px}
  .filters select,.filters input{min-width:0;flex:1}
  table{min-width:480px}
  .bar-row .name{width:120px}
  .stem{font-size:13px}
  .btn{font-size:12.5px}
}


/* 知识树 */
.tree-card{padding:10px 12px 12px}
.tree-wrap{width:100%}
.tree-svg{width:100%;height:auto;display:block;overflow:visible}
.tree-svg .leaf{cursor:pointer}
.tree-svg .leaf:hover{filter:drop-shadow(0 0 6px rgba(0,0,0,.22))}
.tree-legend{display:flex;align-items:center;gap:14px;font-size:11.5px;color:#5C6169;padding:6px 4px 2px;flex-wrap:wrap}
.tree-legend span{display:inline-flex;align-items:center;gap:6px}
.tree-legend i{width:9px;height:9px;border-radius:50%;display:inline-block}
.tree-legend .lg-y{background:rgba(255,255,255,.95);border:2.5px solid #E0A800}
.tree-legend .lg-g{background:#3E8E5A}
.tree-legend .lg-r{background:#1D1D1F}
.tree-legend .lg-tip{margin-left:auto;color:#9AA0A9}
.td-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid rgba(21,23,27,.06);font-size:12.5px}
.td-row:last-of-type{border-bottom:0}
.td-stem{flex:1;color:#2A3037;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:640px){
  .tree-legend{gap:10px;font-size:11px}
  .tree-legend .lg-tip{display:none}
  .tree-card{padding:6px 6px 8px}
}

/* 手机端：藤蔓列表（可读优先） */
.tv-list{display:flex;flex-direction:column;gap:2px;padding:2px 2px 6px}
.tv-row{padding:11px 4px;border-bottom:1px solid rgba(21,23,27,.07)}
.tv-row:last-of-type{border-bottom:0}
.tv-head{display:flex;align-items:center;gap:8px;font-size:13px;color:#232830}
.tv-head b{font-weight:600;letter-spacing:.01em}
.tv-dot{width:9px;height:9px;border-radius:50%;flex:none}
.tv-dot.y{background:rgba(255,255,255,.95);border:2.5px solid #E0A800;width:10px;height:10px}
.tv-dot.g{background:#3E8E5A}
.tv-dot.r{background:#1D1D1F}
.tv-dot.n{background:rgba(21,23,27,.14)}
.tv-n{margin-left:auto;font-size:11.5px;color:#8A9199;font-variant-numeric:tabular-nums}
.tv-minors{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tv-chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:#3B424B;
  background:rgba(255,255,255,.8);border:1px solid rgba(21,23,27,.08);border-radius:999px;padding:5px 9px}
.tv-chip em{font-style:normal;color:#8A9199;font-size:10px}
.tv-md{width:7px;height:7px;border-radius:50%;flex:none}
.tv-md.y{background:#fff;border:2px solid #E0A800;width:8px;height:8px}
.tv-md.g{background:#3E8E5A}
.tv-md.r{background:#1D1D1F}
.tv-md.n{background:rgba(21,23,27,.16)}
.tv-chip.r{border-color:rgba(255,59,48,.35);background:rgba(255,59,48,.06)}
.tv-chip.y{border-color:rgba(224,168,0,.30)}
.tv-foot{font-size:10.5px;color:#9AA0A9;padding:8px 4px 2px}
@media (max-width:640px){
  .tv-head{font-size:13.5px}
  .tv-chip{font-size:11.5px;padding:6px 10px}
}

@media (max-width:640px){
  main{padding-bottom:124px}
  .tv-head{font-size:14px}
  .tv-chip{font-size:13px;padding:7px 11px;gap:6px}
  .tv-md{width:9px;height:9px}
  .tv-md.y{width:10px;height:10px}
  .tv-foot{font-size:12px;color:#8A9199}
  .page-head .sub{font-size:12.5px;line-height:1.7}
  #quickAdd{bottom:84px}
}

/* 照片树 */
.tp-stage{position:relative;width:100%;max-width:calc(62vh * 1.123);margin:0 auto;aspect-ratio:1900/1692;border-radius:14px;overflow:hidden;
  background:radial-gradient(120% 100% at 50% 110%, #EFEFE9 0%, #F7F7F4 46%, #FCFCFB 100%);
  border:1px solid rgba(255,255,255,.9)}
.tp-frame{position:absolute;inset:0;width:100%;height:100%;border:0;
  filter:saturate(.46) brightness(1.06) contrast(.95) sepia(.08)}
.tp-stage::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;
  background:linear-gradient(180deg,rgba(255,255,255,.52) 0%,rgba(255,253,248,.36) 34%,rgba(255,253,248,.34) 64%,rgba(255,255,255,.52) 100%),
             radial-gradient(120% 100% at 50% 0%,rgba(255,255,255,.26),rgba(255,255,255,0) 60%)}
.tp-nodes{position:absolute;inset:0;z-index:3}
.tp-node{position:absolute;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;padding:0;cursor:pointer;
  opacity:0;animation:tpIn .5s ease-out forwards;border:0;
  box-shadow:0 0 0 2.5px rgba(255,255,255,.98),0 5px 14px -3px rgba(20,30,40,.32)}
.tp-node em{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-style:normal;
  font-size:9px;font-weight:600;color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.25)}
.tp-node.y{background:#fff;border:3px solid #E0A800;box-shadow:0 0 0 2.5px #fff,0 0 0 3.5px rgba(20,30,40,.16)}
.tp-node.y em{color:#8F6210;text-shadow:none}
.tp-node.g{background:#3E8E5A}
.tp-node.r{background:#1D1D1F;box-shadow:0 0 0 2.5px #fff,0 0 0 7px rgba(255,59,48,.16),0 5px 14px -3px rgba(20,30,40,.32)}
.tp-node.n{width:9px;height:9px;margin:-4.5px 0 0 -4.5px;background:rgba(21,23,27,.16);box-shadow:0 0 0 2px rgba(255,255,255,.9)}
.tp-lab{position:absolute;transform:translate(14px,-50%);display:inline-flex;align-items:center;gap:6px;
  padding:4px 9px;border-radius:999px;font-size:10.5px;color:#1F242B;white-space:nowrap;opacity:0;
  animation:tpIn .45s ease-out forwards;background:rgba(255,255,255,.92);border:1px solid #fff;
  box-shadow:0 8px 20px -18px rgba(30,42,60,.7)}
.tp-lab.flip{transform:translate(calc(-100% - 14px),-50%)}
.tp-lab b{font-weight:600}
.tp-lab span{color:#8A9199;font-size:9.5px}
.tp-lab i{width:6px;height:6px;border-radius:50%}
.tp-lab .tp-d.y{background:#fff;border:2px solid #E0A800;width:8px;height:8px}
.tp-lab .tp-d.g{background:#3E8E5A}
.tp-lab .tp-d.r{background:#1D1D1F}
.tp-lab .tp-d.n{background:rgba(21,23,27,.2)}
.tp-cap{position:absolute;left:14px;bottom:12px;z-index:4;font-size:9.5px;letter-spacing:.12em;color:#5F6670;
  background:rgba(255,255,255,.9);border:1px solid #fff;padding:4px 9px;border-radius:999px}
@keyframes tpIn{from{opacity:0;transform:translate(var(--tx,0),var(--ty,0)) scale(.7)}to{opacity:1}}
.tp-lab{--tx:0;--ty:-50%}
@media (max-width:640px){
  .tp-node{width:14px;height:14px;margin:-7px 0 0 -7px}
  .tp-node.n{width:8px;height:8px;margin:-4px 0 0 -4px}
  .tp-lab{display:none}
  .tp-cap{font-size:8.5px;left:10px;bottom:8px}
}

/* ===== 照片树 v2（覆盖旧规则）===== */
.tp-stage{position:relative;width:100%;max-width:calc(64vh*1.123);margin:0 auto;aspect-ratio:1900/1692;
  border-radius:16px;overflow:hidden;background:#F5F5F7;border:1px solid rgba(0,0,0,.06);box-shadow:0 20px 50px -40px rgba(0,0,0,.4)}
.tp-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(.42) brightness(1.14) contrast(.82) sepia(.06);animation:tpZoom 6s ease-out both}
.tp-veil{position:absolute;inset:0;pointer-events:none;z-index:2;
  background:linear-gradient(180deg,rgba(255,255,255,.62) 0%,rgba(255,252,246,.34) 36%,rgba(255,252,246,.30) 66%,rgba(255,255,255,.55) 100%)}
.tp-curtain{position:absolute;left:0;right:0;bottom:0;height:100%;z-index:3;pointer-events:none;
  background:linear-gradient(180deg,#FFFFFF 0%,#FFFDF9 100%);
  transform-origin:bottom center;animation:tpRise 1.5s cubic-bezier(.22,.7,.2,1) .15s both}
.tp-nodes{position:absolute;inset:0;z-index:4}
.tp-node{position:absolute;width:17px;height:17px;margin:-8.5px 0 0 -8.5px;border-radius:50%;padding:0;cursor:pointer;
  opacity:0;border:0;animation:tpIn2 .45s ease-out forwards;
  box-shadow:0 0 0 2.5px rgba(255,255,255,.98),0 6px 16px -4px rgba(0,0,0,.28)}
.tp-node em{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:9.5px;font-weight:600;color:#fff}
.tp-node.y{background:#fff;border:3px solid #E0A800;box-shadow:0 0 0 2.5px #fff,0 0 0 3.5px rgba(0,0,0,.14)}
.tp-node.y em{color:#8A6400}
.tp-node.g{background:#3E8E5A}
.tp-node.r{background:#1D1D1F;box-shadow:0 0 0 2.5px #fff,0 0 0 8px rgba(255,59,48,.14),0 6px 16px -4px rgba(0,0,0,.28)}
.tp-node.n{width:10px;height:10px;margin:-5px 0 0 -5px;background:rgba(0,0,0,.14);box-shadow:0 0 0 2px rgba(255,255,255,.85)}
.tp-lab{position:absolute;transform:translate(15px,-50%);display:inline-flex;align-items:center;gap:6px;
  padding:4px 10px;border-radius:999px;font-size:11px;color:#1D1D1F;white-space:nowrap;opacity:0;
  animation:tpLabIn .4s ease-out forwards;background:rgba(255,255,255,.95);border:1px solid rgba(0,0,0,.05);
  box-shadow:0 10px 24px -20px rgba(0,0,0,.5)}
.tp-lab.flip{transform:translate(calc(-100% - 15px),-50%)}
.tp-lab b{font-weight:600}
.tp-lab span{color:#8A8A8E;font-size:10px}
.tp-lab i{width:7px;height:7px;border-radius:50%}
.tp-lab .tp-d.y{background:#fff;border:2px solid #E0A800;width:9px;height:9px}
.tp-lab .tp-d.g{background:#3E8E5A}
.tp-lab .tp-d.r{background:#1D1D1F}
.tp-lab .tp-d.n{background:rgba(0,0,0,.18)}
.tp-cap{position:absolute;left:14px;bottom:12px;z-index:5;font-size:9.5px;letter-spacing:.1em;color:#6E6E73;
  background:rgba(255,255,255,.92);border:1px solid rgba(0,0,0,.04);padding:4px 9px;border-radius:999px}
@keyframes tpZoom{from{transform:scale(1.07)}to{transform:scale(1)}}
@keyframes tpRise{from{transform:translateY(0)}to{transform:translateY(-101%)}}
@keyframes tpIn2{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
@keyframes tpLabIn{from{opacity:0}to{opacity:1}}
@media (max-width:640px){
  .tp-node{width:15px;height:15px;margin:-7.5px 0 0 -7.5px}
  .tp-node.n{width:8px;height:8px;margin:-4px 0 0 -4px}
  .tp-lab{display:none}
  .tp-cap{font-size:8.5px;left:10px;bottom:8px}
}


/* 首页球体 */
.orb-hero{display:flex;justify-content:center;margin:2px 0 14px}
.orb-stage{position:relative;width:100%;max-width:430px;aspect-ratio:1.32;border-radius:22px;
  background:radial-gradient(120% 120% at 50% 18%,#FFFFFF 0%,#F7F7F9 55%,#F0F0F3 100%);
  border:1px solid rgba(0,0,0,.05);overflow:hidden;box-shadow:0 24px 60px -50px rgba(0,0,0,.45)}
.orb-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:33%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 34% 26%,#FFFFFF 0%,#F1F5FD 36%,#DCE6F7 66%,#C7D4EC 100%);
  box-shadow:0 20px 44px -20px rgba(90,120,180,.5),inset 0 2px 8px rgba(255,255,255,.95),inset 0 -10px 20px rgba(140,165,210,.35);
  display:flex;flex-direction:column;align-items:center;justify-content:center;animation:orbBreathe 6s ease-in-out infinite}
.orb-core b{font-size:27px;font-weight:600;color:#1D1D1F;letter-spacing:-.5px;line-height:1}
.orb-core span{font-size:8.5px;color:#6E6E73;letter-spacing:.14em;margin-top:6px}
.orb-ring{position:absolute;left:50%;top:50%;border-radius:50%;border:1px dashed rgba(0,0,0,.09);transform:translate(-50%,-50%)}
.orb-ring.r1{width:58%;aspect-ratio:1;animation:orbSpin 46s linear infinite}
.orb-ring.r2{width:84%;aspect-ratio:1;animation:orbSpin 78s linear infinite reverse}
.orb-sat{position:absolute;transform:translate(-50%,-50%);font-size:10.5px;color:#6E6E73;
  background:rgba(255,255,255,.92);border:1px solid rgba(0,0,0,.06);border-radius:999px;padding:5px 10px;
  box-shadow:0 10px 22px -18px rgba(0,0,0,.55);animation:orbFloat 7s ease-in-out infinite}
.orb-sat.on{background:#1D1D1F;color:#fff;border-color:#1D1D1F}
@keyframes orbBreathe{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.035)}}
@keyframes orbSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes orbFloat{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-60%)}}
/* 折叠卡：备用解析 */
.fold-body{display:none}
details.fold[open] .fold-body{display:block}
details.fold summary{cursor:pointer;font-size:12px;color:#6E6E73;list-style:none}
details.fold summary::-webkit-details-marker{display:none}
details.fold summary::before{content:"▸ ";color:#9AA0A9}
details.fold[open] summary::before{content:"▾ "}
@media (max-width:640px){
  .orb-stage{max-width:100%;aspect-ratio:1.25}
  .orb-sat{font-size:10px;padding:4px 8px}
  .orb-core b{font-size:24px}
}

/* ===== 统一暖白（v2 收口）：全站去掉绿色 UI，只留暖灰 + 墨 ===== */
:root{
  --bg:#FAF8F4; --card:rgba(255,255,255,.82); --text:#1D1D1F; --muted:#6E6E73;
  --line:rgba(60,50,40,.09);
}
body{
  background:
    radial-gradient(1200px 800px at 50% -10%, #FFFFFF 0%, rgba(255,255,255,0) 62%),
    radial-gradient(900px 700px at 10% 6%, rgba(255,246,230,.9), rgba(255,246,230,0) 64%),
    radial-gradient(800px 600px at 92% 90%, rgba(248,242,232,.9), rgba(248,242,232,0) 62%),
    linear-gradient(180deg,#FDFCFA 0%,#F6F4EF 100%);
  background-attachment:fixed;
}
/* 标签：一律暖灰，不再是绿 */
.chip,.chip.green,.chip.amber{
  background:#F3F1EA; color:#6E6E73; border:1px solid rgba(60,50,40,.07); font-weight:500;
}
.chip.red{background:#F8F0ED; color:#9A5B52; border-color:rgba(154,91,82,.16)}
/* 按钮：墨 = 唯一强调；危险动作只留暖砖色描边，不铺色 */
.btn{background:rgba(255,255,255,.9); border:1px solid rgba(60,50,40,.10); color:#2A2A2C}
.btn:hover{background:#fff; border-color:rgba(60,50,40,.18)}
.btn.primary,.btn.small.primary{background:#1D1D1F; color:#FBFAF7; border-color:#1D1D1F}
.btn.danger,.btn.small.danger{background:transparent; color:#9A5B52; border:1px solid rgba(154,91,82,.26)}
.btn.small{font-size:12px; padding:6px 11px}
/* 卡片：白偏暖 */
.card{background:rgba(255,255,255,.82); border:1px solid rgba(255,255,255,.95);
  box-shadow:0 10px 30px -26px rgba(80,60,30,.35), inset 0 1px 0 rgba(255,255,255,.95)}
.card h2{color:#1D1D1F}
.item-top{color:#8B8580}
.stem{color:#232326}
/* 顶栏 / 导航 */
.topbar{background:rgba(255,255,255,.7); border-bottom:1px solid rgba(60,50,40,.07)}
.nav a{color:#6E6E73}
.nav a.active{background:#fff; color:#1D1D1F; box-shadow:0 6px 16px -14px rgba(80,60,30,.5), 0 0 0 1px rgba(60,50,40,.06)}
/* 统计条不再用绿 */
.bar-row .bar>i{background:linear-gradient(90deg,#D9D2C4,#8C8578)}
/* 输入 */
input,select,textarea{background:rgba(255,255,255,.92); border:1px solid rgba(60,50,40,.10)}
input:focus,select:focus,textarea:focus{border-color:rgba(60,50,40,.24); box-shadow:0 0 0 3px rgba(60,50,40,.05)}
/* 球体：暖一点的高光 */
.orb-stage{background:radial-gradient(120% 120% at 50% 16%,#FFFFFF 0%,#FBF8F2 52%,#F3EFE6 100%)}
.orb-core{background:radial-gradient(circle at 34% 26%,#FFFFFF 0%,#FBF7F0 34%,#EDE6D9 66%,#DCD3C2 100%);
  box-shadow:0 20px 44px -22px rgba(120,95,55,.42), inset 0 2px 8px rgba(255,255,255,.95), inset 0 -10px 20px rgba(150,130,95,.28)}
.orb-sat.on{background:#1D1D1F; color:#FBFAF7; border-color:#1D1D1F}
/* 今日卡片里的分类小胶囊（5.1 这种）也统一 */
.item .chip, .item-top .chip{background:#F4F2EC; color:#6E6E73}


/* ===== iOS 设置页口径（收口）：中性浅灰底 + 纯白卡片 + 系统色只用在点上 ===== */
:root{
  --bg:#F2F2F7; --card:#FFFFFF; --text:#000000; --muted:#8E8E93;
  --line:rgba(60,60,67,.18); --blue:#1D1D1F; --red:#1D1D1F; --green:#3E8E5A; --orange:#FF9F0A;
}
body{
  background:#F2F2F7 !important;
  color:#000;
}
body::before{display:none}
.card{background:#fff;border:1px solid rgba(60,60,67,.10);border-radius:12px;
  box-shadow:0 1px 2px rgba(0,0,0,.03);backdrop-filter:none;-webkit-backdrop-filter:none}
.card h2{font-size:17px;font-weight:600;letter-spacing:-.2px;color:#000}
.topbar{background:rgba(249,249,249,.94);border-bottom:1px solid rgba(60,60,67,.16);
  backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}
.brand{font-weight:600;font-size:17px;color:#000}
.brand .logo{filter:none}
.nav a{color:#8E8E93;font-size:13px;padding:6px 10px}
.nav a:hover{background:rgba(120,120,128,.08)}
.nav a.active{background:#fff;color:#000;box-shadow:0 0 0 1px rgba(60,60,67,.10)}
main{max-width:720px}
.page-head{margin-bottom:12px}
.page-head h1{font-size:31px;font-weight:700;letter-spacing:-.7px;color:#000}
.page-head .sub{font-size:13px;color:#8E8E93;letter-spacing:0}

/* 分组卡片里的行 */
.chip,.chip.green,.chip.amber{background:#EFEFF4;color:#3C3C43;border:0;border-radius:6px;
  font-size:12px;padding:3px 8px;font-weight:500}
.chip.red{background:rgba(255,59,48,.10);color:#1D1D1F}

/* 按钮：白底 + 系统色文字，像 iOS 的 cell 操作 */
.btn{background:#fff;border:1px solid rgba(60,60,67,.16);color:#1D1D1F;border-radius:10px;font-size:14px}
.btn:hover{background:#FAFAFC}
.btn.primary{background:#1D1D1F;border-color:#1D1D1F;color:#fff}
.btn.primary:hover{filter:none;background:#0A6FE0}
.btn.ghost{background:#fff;border:1px solid rgba(60,60,67,.16);color:#1D1D1F}
.btn.danger{background:#fff;border:1px solid rgba(255,59,48,.22);color:#1D1D1F}
.btn.small{font-size:13px;padding:6px 10px;border-radius:8px}

/* 今日题目卡：操作变成一行文字按钮（iOS 风格） */
.item{padding:12px 14px}
.item-top{color:#8E8E93;font-size:12px;gap:8px}
.stem{color:#000;font-size:15px;line-height:1.6}
.item .btn.small{background:transparent;border:0;padding:6px 2px;color:#1D1D1F;font-weight:500}
.item .btn.small.danger{color:#1D1D1F}
.item .btn.small.ghost{color:#8E8E93}
.item .row.gap.wrap{gap:18px;border-top:1px solid rgba(60,60,67,.10);margin-top:10px;padding-top:8px}

/* 表单 */
input,select,textarea{background:#fff;border:1px solid rgba(60,60,67,.18);border-radius:10px;font-size:15px}
input:focus,select:focus,textarea:focus{border-color:#1D1D1F;box-shadow:0 0 0 3px rgba(29,29,31,.12)}
.field label{font-size:13px;color:#8E8E93}
.hint,.tagline{font-size:12.5px;color:#8E8E93}

/* 统计条：中性 */
.bar-row .bar>i{background:#1D1D1F;opacity:.85}
.bar-row .bar{background:#EFEFF4}

/* 球体：中性白，不要奶油色 */
.orb-stage{background:#F2F2F7;border:1px solid rgba(60,60,67,.10);box-shadow:none}
.orb-core{background:radial-gradient(circle at 34% 26%,#FFFFFF 0%,#F8F8FB 38%,#ECECF2 68%,#DFDFE7 100%);
  box-shadow:0 18px 38px -20px rgba(0,0,0,.28), inset 0 2px 6px rgba(255,255,255,.95), inset 0 -10px 18px rgba(0,0,0,.05)}
.orb-core b{color:#000}
.orb-core span{color:#8E8E93}
.orb-ring{border-color:rgba(60,60,67,.14)}
.orb-sat{background:#fff;border:1px solid rgba(60,60,67,.14);color:#3C3C43;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.orb-sat.on{background:#1D1D1F;border-color:#1D1D1F;color:#fff}
/* 树：状态色用系统色 */
.tp-node.y{border-color:#FF9F0A}
.tp-lab .tp-d.y{border-color:#FF9F0A}
/* 底部 tab（手机） */
@media (max-width:640px){
  .topbar{background:rgba(249,249,249,.96)}
  .nav a.active{background:rgba(29,29,31,.10);color:#1D1D1F;box-shadow:none}
}


/* ===== 参考图口径：暖白白底 + 3D 球体 + 陶土红点缀，去掉蓝色 ===== */
.nav a.active{
  background:#F8F4F0; color:#3A2E28;
  box-shadow: inset 0 2px 5px rgba(90,60,45,.16), inset 0 -1px 0 rgba(255,255,255,.95);
  transform:translateY(.5px);
}
.nav a.active:hover{background:#F6F1EC}
/* 可点文字统一中性，不再用蓝 */
.btn,.btn.ghost{color:#3C3C43}
.btn.primary{background:#1D1D1F;border-color:#1D1D1F;color:#FBFAF7}
.item .btn.small{color:#6E6E73}
.item .btn.small.primary{color:#1D1D1F;background:transparent;border:0}
.item .btn.small.danger{color:#A0523C}
.btn.danger{color:#A0523C;border-color:rgba(160,82,60,.28)}
input:focus,select:focus,textarea:focus{border-color:rgba(160,82,60,.5);box-shadow:0 0 0 3px rgba(160,82,60,.10)}
.bar-row .bar>i{background:linear-gradient(90deg,#E4B7A6,#1D1D1F)}
/* 球体舞台 */
.orb-stage{aspect-ratio:1.5;overflow:visible;background:transparent;border:0;box-shadow:none}
.orb-links{position:absolute;inset:0;width:100%;height:100%}
.orb-links path{fill:none;stroke:rgba(160,82,60,.30);stroke-width:.45;vector-effect:non-scaling-stroke}
.orb-core{
  left:50%;top:50%;width:34%;aspect-ratio:1;
  background:radial-gradient(circle at 36% 30%,#FFFFFF 0%,#FFF3EC 16%,#F6D8CA 44%,#DE9C84 72%,#B4614A 100%);
  box-shadow:
    inset -12px -16px 30px rgba(140,60,40,.38),
    inset 10px 12px 26px rgba(255,255,255,.95),
    0 30px 60px -26px rgba(150,70,45,.55);
  animation:orbBreathe 7s ease-in-out infinite;
}
.orb-glow{position:absolute;inset:14%;border-radius:50%;
  background:radial-gradient(circle, rgba(255,150,110,.95) 0%, rgba(230,110,70,.55) 42%, rgba(200,80,50,0) 72%);
  filter:blur(9px);animation:orbPulse 5s ease-in-out infinite}
.orb-num{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%}
.orb-num b{font-size:30px;font-weight:600;color:#3A2A24;letter-spacing:-.8px;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.orb-num span{font-size:8.5px;letter-spacing:.16em;color:rgba(58,42,36,.65);margin-top:5px}
.orb-sat{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:7px;
  background:none;border:0;padding:0;cursor:pointer}
.orb-ball{width:52px;height:52px;border-radius:50%;display:block;
  background:radial-gradient(circle at 36% 30%,#FFFFFF 0%,#FCF4EF 20%,#F0DAD0 56%,#D8B0A0 100%);
  box-shadow:
    inset -7px -9px 16px rgba(150,90,70,.30),
    inset 6px 7px 14px rgba(255,255,255,.95),
    0 14px 26px -14px rgba(120,70,50,.55);
  transition:transform .25s ease}
.orb-sat:hover .orb-ball{transform:translateY(-2px)}
.orb-sat.on .orb-ball{
  background:radial-gradient(circle at 36% 30%,#FFF0E8 0%,#F7C3AE 26%,#CE5F41 74%,#A23B24 100%);
  box-shadow:
    inset -7px -9px 18px rgba(110,35,18,.45),
    inset 6px 7px 16px rgba(255,225,210,.85),
    0 18px 34px -16px rgba(160,60,35,.65)}
.orb-lab{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:#3C3532;
  background:rgba(255,255,255,.95);border:1px solid rgba(0,0,0,.05);border-radius:9px;padding:4px 9px;
  box-shadow:0 10px 22px -18px rgba(0,0,0,.6);white-space:nowrap}
.orb-lab em{font-style:normal;color:#A0523C;font-weight:600;font-size:11px}
@keyframes orbBreathe{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.025)}}
@keyframes orbPulse{0%,100%{opacity:.85}50%{opacity:1}}
/* 手机端球体缩小 */
@media (max-width:640px){
  .orb-stage{aspect-ratio:1.35}
  .orb-ball{width:42px;height:42px}
  .orb-num b{font-size:26px}
  .orb-lab{font-size:10px;padding:3px 7px}
}


/* ===== 玻璃版球体（替换 3D 实心球）：半透明 + 背景模糊 + 白边高光 ===== */
.orb-stage{
  position:relative; aspect-ratio:1.5; border-radius:24px; overflow:hidden;
  background:
    radial-gradient(58% 58% at 50% 42%, rgba(255,238,226,.85) 0%, rgba(255,238,226,0) 72%),
    radial-gradient(40% 40% at 82% 18%, rgba(226,232,240,.55) 0%, rgba(226,232,240,0) 70%),
    linear-gradient(160deg,#FFFDFB 0%,#F4F1EC 100%);
  border:1px solid rgba(255,255,255,.92);
  box-shadow: inset 0 1px 0 rgba(255,255,255,1), 0 30px 60px -52px rgba(90,70,50,.55);
}
.orb-stage::before,.orb-stage::after{
  content:""; position:absolute; border-radius:50%; filter:blur(28px); pointer-events:none;
}
.orb-stage::before{width:160px;height:160px;left:8%;top:14%;background:rgba(255,206,180,.55)}
.orb-stage::after{width:200px;height:200px;right:6%;bottom:8%;background:rgba(214,226,240,.55)}

/* 中央：一块玻璃镜片 */
.orb-core{
  left:50%; top:50%; width:37%; aspect-ratio:1;
  background:rgba(255,255,255,.30);
  -webkit-backdrop-filter:blur(18px) saturate(180%);
  backdrop-filter:blur(18px) saturate(180%);
  border:1px solid rgba(255,255,255,.9);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    inset 0 -20px 34px rgba(140,100,75,.10),
    inset 0 0 0 1px rgba(255,255,255,.35),
    0 26px 50px -26px rgba(90,60,40,.35);
  animation:orbBreathe 8s ease-in-out infinite;
}
.orb-glow{
  inset:22%;
  background:radial-gradient(circle, rgba(255,196,168,.55) 0%, rgba(255,170,140,.22) 45%, rgba(255,170,140,0) 74%);
  filter:blur(16px); animation:orbPulse 6s ease-in-out infinite;
}
.orb-num b{font-size:32px;font-weight:600;color:#2E2A27;letter-spacing:-1px;text-shadow:0 1px 0 rgba(255,255,255,.85)}
.orb-num span{font-size:8.5px;letter-spacing:.18em;color:rgba(60,50,44,.55);margin-top:6px}

/* 外围：六颗玻璃珠 + 纯文字标签 */
.orb-sat{gap:8px}
.orb-ball{
  width:44px;height:44px;border-radius:50%;
  background:rgba(255,255,255,.34);
  -webkit-backdrop-filter:blur(10px) saturate(170%);
  backdrop-filter:blur(10px) saturate(170%);
  border:1px solid rgba(255,255,255,.95);
  box-shadow: inset 0 1px 0 rgba(255,255,255,1), inset 0 -8px 14px rgba(140,100,75,.08),
              0 10px 22px -14px rgba(90,60,40,.40);
  transition:transform .3s ease, box-shadow .3s ease;
}
.orb-sat:hover .orb-ball{transform:translateY(-2px) scale(1.03)}
.orb-sat.on .orb-ball{
  background:rgba(255,255,255,.52);
  border-color:#fff;
  box-shadow: inset 0 1px 0 #fff, 0 0 0 4px rgba(29,29,31,.10), 0 14px 26px -14px rgba(150,80,55,.45);
}
.orb-lab{
  font-size:11px;letter-spacing:.02em;color:#6E6E73;
  background:none;border:0;box-shadow:none;padding:0;
}
.orb-lab em{color:#1D1D1F;font-weight:600;font-size:10.5px;margin-left:4px}
/* 连线：一根极淡的线，不做彩色 */
.orb-links path{stroke:rgba(120,100,85,.16);stroke-width:.5}
/* 手机 */
@media (max-width:640px){
  .orb-stage{aspect-ratio:1.4;border-radius:18px}
  .orb-ball{width:36px;height:36px}
  .orb-num b{font-size:27px}
  .orb-lab{font-size:10px}
}


/* ===== 六科玻璃瓦片（替代球体） ===== */
.gl-hero{display:flex;justify-content:center;margin:0 0 14px}
.gl-board{
  position:relative; width:100%; max-width:560px; padding:18px 18px 16px; border-radius:22px; overflow:hidden;
  background:
    radial-gradient(60% 60% at 22% 12%, rgba(255,235,222,.75) 0%, rgba(255,235,222,0) 70%),
    radial-gradient(50% 50% at 84% 88%, rgba(216,226,238,.6) 0%, rgba(216,226,238,0) 70%),
    linear-gradient(160deg, rgba(255,255,255,.86), rgba(246,243,238,.78));
  border:1px solid rgba(255,255,255,.95);
  box-shadow: inset 0 1px 0 #fff, 0 26px 54px -48px rgba(80,60,40,.55);
  -webkit-backdrop-filter:blur(18px) saturate(170%);
  backdrop-filter:blur(18px) saturate(170%);
}
.gl-blob{position:absolute;border-radius:50%;filter:blur(26px);pointer-events:none;opacity:.9}
.gl-blob.a{width:150px;height:150px;left:-30px;top:-40px;background:rgba(255,206,184,.55)}
.gl-blob.b{width:190px;height:190px;right:-50px;bottom:-70px;background:rgba(212,224,238,.55)}
.gl-head{position:relative;display:flex;align-items:baseline;gap:8px;padding:2px 4px 14px}
.gl-head span{font-size:10px;letter-spacing:.18em;color:#8A857E}
.gl-head b{font-size:26px;font-weight:600;letter-spacing:-.6px;color:#1D1D1F;margin-left:auto}
.gl-grid{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.gl-tile{
  position:relative; display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:12px 4px 9px; border-radius:14px; cursor:pointer; overflow:hidden;
  background:rgba(255,255,255,.34);
  -webkit-backdrop-filter:blur(12px) saturate(170%);
  backdrop-filter:blur(12px) saturate(170%);
  border:1px solid rgba(255,255,255,.9);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), inset 0 -10px 18px rgba(130,100,80,.06), 0 10px 20px -18px rgba(80,60,40,.5);
  transition:transform .25s ease, background .25s ease, box-shadow .25s ease;
}
.gl-tile:hover{transform:translateY(-2px);background:rgba(255,255,255,.55)}
.gl-tile.on{
  background:rgba(255,255,255,.92);
  border-color:#fff;
  box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(29,29,31,.06), 0 16px 30px -20px rgba(60,50,40,.45);
  transform:translateY(-2px);
}
.gl-char{font-style:normal;font-size:26px;line-height:1;color:#1D1D1F;opacity:.9;
  font-weight:600;letter-spacing:-1px}
.gl-tile:not(.on) .gl-char{opacity:.45}
.gl-name{font-size:10.5px;color:#6E6E73;letter-spacing:.02em}
.gl-tile.on .gl-name{color:#1D1D1F;font-weight:600}
.gl-n{font-size:10px;color:#9A948C;font-variant-numeric:tabular-nums;margin-top:1px}
.gl-tile.on .gl-n{color:#1D1D1F}
@media (max-width:640px){
  .gl-board{max-width:100%;padding:14px 12px}
  .gl-grid{grid-template-columns:repeat(3,1fr);gap:7px}
  .gl-char{font-size:22px}
  .gl-head b{font-size:22px}
}