/* ══════════════════════════════════════════════════════════════════
   医驿 · PC 端平台工作台 · 登录页样式
   ──────────────────────────────────────────────────────────────────
   ⚠ 这是**独立的桌面版式**，不复用 entry.css 的手机壳。
     原因：手机上「上下堆叠、单列表单」是唯一合理解；到了 PC 上，
     把手机布局居中拉宽会得到一条又长又空的窄栏 —— 那是「能打开」，
     不是「为 PC 设计过」。桌面版式用左右分栏：左侧叙事、右侧表单。

   视觉依据：千里江山图色系。左栏用石绿深底做品牌区（禁纯白），
   右栏蛤白表单区。
   ══════════════════════════════════════════════════════════════════ */
:root{
  --zhejuan:#EFE8D8; --geba:#F7F3E9; --fb:#F7F4EC; --juanshen:#E4DAC6; --juanxian:#D6CAB0;
  --lv1:#1D4A38; --lv2:#2E6B4F; --lv3:#5C9478; --lv4:#A8C7B4; --lvr:#E3EDE4;
  --mo:#26251F; --moh:#6A665C; --mod:#9A958A;
  --q1:#1B3A5C; --q2:#2B5A82; --q3:#7BA0C0; --qr:#E2EAF1;
  --th:#C08A28; --zhu:#B23A2E; --zhuq:#F9E2DD; --zs:#A3603F; --zsq:#F6E3D6;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%}
body{
  font-family:"Noto Serif SC","Source Han Serif SC","Songti SC",serif;
  background:var(--zhejuan); color:var(--mo);
  font-size:15px; line-height:1.6; -webkit-font-smoothing:antialiased;
  overflow:hidden;
}

.stage{display:flex; height:100%}

/* ── 左：品牌叙事区 ─────────────────────────────────────────── */
.aside{
  flex:0 0 46%; min-width:420px; position:relative; overflow:hidden;
  background:linear-gradient(158deg,#245741 0%,var(--lv1) 58%,#16372A 100%);
  color:#EFEDE2;
  display:flex; flex-direction:column; justify-content:space-between;
  padding:56px 60px 46px;
}
/* 绢纹：极淡的对角线，避免大面积纯色显得廉价 */
.aside::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(58deg, rgba(255,255,255,.030) 0 1px, transparent 1px 9px);
}
.aside::after{
  content:""; position:absolute; right:-160px; bottom:-190px; width:620px; height:620px;
  border-radius:50%; pointer-events:none;
  background:radial-gradient(circle, rgba(168,199,180,.16), transparent 66%);
}
.aside > *{position:relative; z-index:1}

.abrand{display:flex; align-items:center; gap:16px}
.aseal{
  width:56px; height:56px; border-radius:15px; flex:0 0 auto;
  background:linear-gradient(155deg, rgba(247,243,233,.20), rgba(247,243,233,.07));
  border:1px solid rgba(247,243,233,.28);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 26px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.16);
}
.aseal span{font-size:24px; font-weight:600; color:#F2EFE4; letter-spacing:1px}
.aname{font-size:22px; font-weight:600; letter-spacing:6px; color:#F2EFE4; margin:0}
.arole{font-size:12px; letter-spacing:2px; color:rgba(242,239,228,.62); margin:3px 0 0}

.alead{margin:0}
.alead h2{
  font-size:34px; font-weight:600; letter-spacing:2px; line-height:1.4;
  margin:0 0 16px; color:#F5F2E7;
}
.alead h2 em{font-style:normal; color:#B9D7C4}
.alead p{font-size:14px; color:rgba(242,239,228,.70); letter-spacing:.8px; margin:0; max-width:26em; line-height:1.9}

/* 能力清单：把「这个入口能做什么」在登录前就说清楚 */
.afeat{display:flex; flex-wrap:wrap; gap:9px; margin-top:30px}
.afeat .f{
  font-size:12.5px; letter-spacing:.5px; padding:6px 13px; border-radius:20px;
  background:rgba(247,243,233,.10); border:1px solid rgba(247,243,233,.18);
  color:rgba(242,239,228,.86);
}
.afoot{font-size:11.5px; color:rgba(242,239,228,.42); letter-spacing:.8px}

/* ── 右：表单区 ─────────────────────────────────────────────── */
.main{
  flex:1; min-width:0; display:flex; align-items:center; justify-content:center;
  overflow-y:auto; padding:40px 40px;
}
.panel{width:100%; max-width:412px}

.phd{margin:0 0 30px}
.phd h1{font-size:21px; font-weight:600; color:var(--lv1); letter-spacing:2px; margin:0 0 8px}
.phd p{font-size:12.5px; color:var(--moh); letter-spacing:.6px; margin:0}

.label{font-size:12.5px; color:var(--moh); margin:0 0 8px; letter-spacing:.6px; display:block}
.field{
  display:flex; align-items:center;
  background:var(--fb); border:1px solid var(--juanxian); border-radius:11px;
  padding:0 14px; height:50px; transition:.16s;
}
.field:focus-within{border-color:var(--lv3); box-shadow:0 0 0 3px rgba(92,148,120,.13)}
.field input{
  flex:1; border:none; outline:none; background:transparent;
  font-size:15.5px; color:var(--mo); font-family:inherit; letter-spacing:.5px; min-width:0;
}
.field input::placeholder{color:var(--mod); font-size:14px; letter-spacing:0}
.code-box{display:flex; gap:10px; margin-top:14px}
.code-box .field{flex:1; min-width:0}
.send{
  flex:0 0 auto; width:112px; height:50px; border-radius:11px;
  border:1px solid var(--lv3); background:var(--lvr); color:var(--lv1);
  font-size:13px; font-family:inherit; letter-spacing:.5px; cursor:pointer; transition:.16s;
}
.send:hover:not(:disabled){background:#D9E8DC}
.send:disabled{opacity:.5; cursor:not-allowed; border-color:var(--juanxian); background:var(--fb); color:var(--mod)}
.err{font-size:12.5px; color:var(--zhu); margin:9px 2px 0; min-height:18px; letter-spacing:.4px}
.hint{
  font-size:12px; color:var(--moh); background:var(--zsq);
  border-left:3px solid var(--zs); border-radius:0 8px 8px 0;
  padding:9px 12px; margin-top:6px; line-height:1.6;
}
.btn{
  width:100%; height:50px; margin-top:20px; border-radius:11px; border:none;
  background:linear-gradient(150deg,var(--lv2),var(--lv1)); color:#F2EFE4;
  font-size:15.5px; font-family:inherit; letter-spacing:2px; font-weight:600;
  cursor:pointer; box-shadow:0 6px 18px rgba(29,74,56,.20); transition:.16s;
}
.btn:hover:not(:disabled){box-shadow:0 9px 24px rgba(29,74,56,.26)}
.btn:disabled{opacity:.55; box-shadow:none; cursor:not-allowed}

.demo{margin-top:30px}
.demo-hd{
  display:flex; align-items:center; gap:10px; margin:0 0 12px;
  font-size:11.5px; color:var(--moh); letter-spacing:.8px;
}
.demo-hd::before,.demo-hd::after{content:""; flex:1; height:1px; background:var(--juanxian)}
.demo-hd::before{flex:0 0 12px}
.acc{
  display:flex; align-items:center; gap:12px; padding:11px 14px;
  background:var(--fb); border:1px solid var(--juanxian); border-radius:10px;
  margin-bottom:7px; cursor:pointer; transition:.15s;
}
.acc:hover{background:var(--lvr); border-color:var(--lv4)}
.acc .dot{width:9px; height:9px; border-radius:50%; flex:0 0 auto; background:var(--lv3)}
.acc .info{flex:1; min-width:0}
.acc .nm{font-size:13.5px; color:var(--mo); letter-spacing:.3px}
.acc .sub{font-size:11.5px; color:var(--mod); letter-spacing:.4px; margin-top:1px}
.acc .role{
  flex:0 0 auto; font-size:11px; padding:3px 9px; border-radius:20px;
  background:var(--lvr); color:var(--lv1); letter-spacing:.4px;
}
.ph{text-align:center; color:var(--mod); font-size:12.5px; padding:14px}

/* ── 已登录态 ───────────────────────────────────────────────── */
.done{
  background:var(--fb); border:1px solid var(--juanxian); border-radius:16px;
  padding:34px 32px; text-align:center;
}
.done .aseal{
  margin:0 auto 20px;
  background:linear-gradient(155deg,var(--lv2),var(--lv1));
  border:none;
}
.done h2{font-size:19px; font-weight:600; color:var(--lv1); margin:0 0 8px; letter-spacing:2px}
.done .who{font-size:13px; color:var(--moh); margin:0 0 24px; letter-spacing:.5px}
.scope{
  text-align:left; background:var(--geba); border:1px solid var(--juanxian);
  border-radius:11px; padding:15px 17px; margin-bottom:12px;
}
.scope h3{font-size:11.5px; color:var(--moh); margin:0 0 9px; letter-spacing:1px; font-weight:400}
.scope .row{
  display:flex; gap:10px; font-size:12.5px; padding:5px 0;
  border-bottom:1px dashed var(--juanshen); letter-spacing:.3px;
}
.scope .row:last-child{border-bottom:none}
.scope .k{flex:0 0 88px; color:var(--moh)}
.scope .v{flex:1; color:var(--mo)}
.link{color:var(--q2); font-size:13px; letter-spacing:.5px; cursor:pointer; background:none; border:none; font-family:inherit}

/* 窄屏兜底：PC 版式在窄窗口退化为单列，但仍然是「为桌面设计过」的那一版 */
@media (max-width:900px){
  .stage{flex-direction:column; height:auto; min-height:100%}
  body{overflow:auto}
  .aside{flex:0 0 auto; min-width:0; padding:36px 30px 30px}
  .alead h2{font-size:25px}
  .afeat{display:none}
  .main{padding:30px 24px 50px}
}

.toast{
  position:fixed; left:50%; bottom:32px; transform:translateX(-50%) translateY(14px);
  background:rgba(38,37,31,.94); color:#F2EFE4; font-size:13px;
  padding:11px 20px; border-radius:22px; letter-spacing:.5px;
  opacity:0; pointer-events:none; transition:.24s; z-index:99; max-width:70vw;
  text-align:center; font-family:inherit;
}
.toast.on{opacity:1; transform:translateX(-50%) translateY(0)}