/* ============================================================
    OA 外置样式 · 来源 views/auth/login.php 第 9-263 行（原 256 行）
    oa-kit T1 · 2026-09-20 · 内容逐字节复制，未做任何改写
    回滚：删除本文件，并把视图里的 Asset 调用换回原块（见 /opt/yike/backup/source-bak/）
/* ============================================================ */

  /* ==========================================================================
     登录页 · 1:1 对齐 Ardot 设计稿（yike-console-ui / desktop-login.html）
       桌面 1440 × 940：品牌区 640（深蓝斜向渐变）+ 登录区 800
       登录页控件比后台本体大一号：48（后台本体 32）
     ⚠️ 表单逻辑保持不变：$__csrf / View::e() / $error / POST /login
     ========================================================================== */
  :root{
    /* 品牌色 */
    --brand:#1B7BD6; --brand-hover:#1668B8; --brand-weak:#E8F2FC;
    /* 品牌四色：取自 logo 球体斜条纹 */
    --c-blue:#1B7BD6; --c-green:#6CBF3F; --c-yellow:#F5B921; --c-orange:#F5822B;
    /* 中性色 */
    --bg:#F4F6FA; --card:#FFFFFF; --border:#EFF2F7; --border-strong:#E4E9F0;
    --hover:#F5F7FB; --track:#F1F3F7;
    /* 文字三级灰阶 */
    --t1:#1A1F29; --t2:#5A6474; --t3:#8B94A6;
    /* 状态色 */
    --bad:#E5484D; --bad-bg:#FDECEC;
    /* 登录页专用（设计稿 file/726832349299011） */
    --grad-brand:linear-gradient(135deg,#0D2E57 0%,#175291 55%,#1C7AD6 100%);
    --on-dark-1:#9DBBE0; --on-dark-2:#A8C4E4; --on-dark-4:#7B9AC2;
    --on-dark-line:rgba(255,255,255,.16); --on-dark-panel:rgba(255,255,255,.08);
    --brand-glow:rgba(27,123,214,.07);
    --input-border:#DBE3ED; --input-ph:#A7B0BE;
    --h-ctl-lg:48px; --r-login-card:24px;
    /* 圆角 */
    --r-tag:6px; --r-ctl:8px; --r-card:12px;
    /* 字体 */
    --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",
           "Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
    --font-num:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",
           "Helvetica Neue",Arial,sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  body.is-login{
    font-family:var(--font);background:var(--card);color:var(--t1);
    -webkit-font-smoothing:antialiased;
  }
  button{font-family:inherit;cursor:pointer;border:0;background:none}
  a{text-decoration:none;color:inherit}
  img{display:block}

  .lg{display:flex;min-height:100vh}

  /* ============ 品牌区（640）============ */
  .lg-brand{
    position:relative;width:640px;flex:0 0 640px;padding:56px;
    background:var(--grad-brand);color:#fff;
    display:flex;flex-direction:column;justify-content:space-between;
    overflow:hidden;
  }
  /* 两枚光晕取自品牌四色，绝对定位、不参与 8pt 栅格流。
     ⚠️ 必须写 farthest-side：径向渐变默认 farthest-corner（方盒对角线），
     会把 100% 落点推到圆之外，被 border-radius 硬切出可见圆环。 */
  .lg-brand__glow{position:absolute;border-radius:50%;pointer-events:none}
  .lg-brand__glow--amber{
    width:420px;height:420px;left:280px;top:-60px;
    background:radial-gradient(circle farthest-side,rgba(245,185,33,.3) 0%,rgba(245,185,33,0) 100%);
  }
  .lg-brand__glow--orange{
    width:460px;height:460px;left:-150px;bottom:-140px;
    background:radial-gradient(circle farthest-side,rgba(245,130,43,.24) 0%,rgba(245,130,43,0) 100%);
  }

  .lg-brand__top{position:relative;display:flex;align-items:center;gap:12px}
  .lg-brand__logo{width:36px;height:36px;flex:0 0 36px}
  .lg-brand__text{display:flex;flex-direction:column;gap:2px;min-width:0}
  .lg-brand__name{font-size:17px;font-weight:600;line-height:24px;letter-spacing:.2px}
  .lg-brand__sub{
    font-family:var(--font-num);font-size:9px;line-height:12px;
    color:var(--on-dark-1);letter-spacing:.08em;white-space:nowrap;
  }

  /* ---- 主张区 ---- */
  .lg-hero{position:relative;display:flex;flex-direction:column;gap:28px}
  .lg-hero__stage{position:relative;width:280px;height:280px;flex:0 0 280px}
  .lg-hero__halo{
    position:absolute;inset:0;border-radius:50%;
    background:radial-gradient(circle farthest-side,rgba(255,255,255,.18) 0%,rgba(255,255,255,0) 100%);
  }
  .lg-hero__logo{position:absolute;left:52px;top:48px;width:176px;height:176px}
  .lg-hero__title{
    display:flex;flex-direction:column;gap:6px;
    font-size:38px;font-weight:700;line-height:1.25;letter-spacing:.5px;
  }
  .lg-hero__desc{font-size:13px;line-height:20px;color:var(--on-dark-2);max-width:460px}

  /* ---- 玻璃数据条 ---- */
  .lg-stats{
    position:relative;display:flex;align-items:center;height:80px;padding:0 16px;
    border-radius:var(--r-card);background:var(--on-dark-panel);
  }
  .lg-stat{
    flex:1;min-width:0;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:6px;
  }
  .lg-stat__cap{font-size:11px;line-height:15px;color:var(--on-dark-1);white-space:nowrap}
  .lg-stat__val{
    display:flex;align-items:baseline;gap:4px;
    font-size:22px;font-weight:700;line-height:28px;
    font-variant-numeric:tabular-nums;
  }
  /* 无数据时的占位符：降一档字重与透明度，不抢主张区的视觉 */
  .lg-stat__val.num:not(:has(i)){font-weight:600;color:var(--on-dark-2)}
  .lg-stat__val i{
    font-family:var(--font);font-size:11px;font-style:normal;
    font-weight:400;color:var(--on-dark-1);
  }
  .lg-stats__div{width:1px;height:32px;flex:0 0 1px;background:var(--on-dark-line)}
  .lg-brand__foot{position:relative;font-size:11px;line-height:16px;color:var(--on-dark-4)}

  /* ============ 登录区（800）============ */
  .lg-main{
    position:relative;flex:1;min-width:0;padding:48px 40px;background:var(--card);
    display:flex;align-items:center;justify-content:center;overflow:hidden;
  }
  .lg-main__glow{
    position:absolute;right:0;bottom:0;width:420px;height:420px;border-radius:50%;
    pointer-events:none;
    background:radial-gradient(circle farthest-side,var(--brand-glow) 0%,rgba(27,123,214,0) 100%);
  }
  /* 窄屏时补的品牌落款 */
  .lg-narrow-brand{display:none;align-items:center;gap:10px;color:#fff}
  .lg-narrow-brand img{width:32px;height:32px}
  .lg-narrow-brand b{font-size:16px;font-weight:600}

  /* ---- 表单卡 ---- */
  .lg-form{
    position:relative;width:376px;
    display:flex;flex-direction:column;gap:20px;
  }
  .lg-form__head{display:flex;flex-direction:column;gap:8px}
  .lg-form__h1{font-size:28px;font-weight:700;line-height:38px;color:var(--t1)}
  .lg-form__sub{font-size:13px;line-height:20px;color:var(--t2)}
  .lg-form__fields{display:flex;flex-direction:column;gap:16px}
  .lg-form__aux{display:flex;align-items:center;justify-content:space-between;gap:8px}
  .lg-form__foot{display:flex;flex-direction:column;align-items:center;gap:10px}
  .lg-form__foot .lg-first{font-size:11px}

  /* 错误提示（原有逻辑保留） */
  .lg-err{
    background:var(--bad-bg);border:1px solid #F7C1C1;color:#A32D2D;
    padding:11px 14px;border-radius:var(--r-ctl);font-size:13px;
    display:flex;gap:9px;align-items:center;
  }

  /* ---- 字段与控件 ---- */
  .lg-field{display:flex;flex-direction:column;gap:8px}
  .lg-field__label{font-size:12px;font-weight:500;line-height:17px;color:var(--t2)}
  .lg-input{
    display:flex;align-items:center;gap:10px;height:var(--h-ctl-lg);
    padding:0 14px;background:var(--card);
    border:1px solid var(--input-border);border-radius:var(--r-ctl);
    transition:border-color .15s ease,box-shadow .15s ease;
  }
  .lg-input:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-weak)}
  .lg-input > img{width:20px;height:20px;flex:0 0 20px}
  .lg-input input{
    flex:1;min-width:0;border:0;outline:0;background:none;
    font-size:13px;line-height:20px;color:var(--t1);font-family:inherit;
  }
  .lg-input input::placeholder{color:var(--input-ph)}

  /* 密码显隐 */
  .lg-eye{
    width:20px;height:20px;flex:0 0 20px;padding:0;
    display:grid;place-items:center;opacity:.75;transition:opacity .15s ease;
  }
  .lg-eye:hover{opacity:1}
  .lg-eye img{width:20px;height:20px}

  /* 链接 */
  .lg-link{font-size:12px;font-weight:500;line-height:18px;color:var(--brand);white-space:nowrap}
  .lg-link:hover{color:var(--brand-hover)}

  /* 记住我 */
  .lg-remember{
    position:relative;display:inline-flex;align-items:center;gap:8px;
    cursor:pointer;user-select:none;
  }
  .lg-remember input{position:absolute;width:0;height:0;opacity:0}
  .lg-remember__text{font-size:12px;line-height:17px;color:var(--t2)}
  .lg-check{
    width:16px;height:16px;flex:0 0 16px;border-radius:4px;
    border:1px solid var(--input-border);background:var(--card);
    display:grid;place-items:center;
    transition:background .15s ease,border-color .15s ease;
  }
  .lg-check svg{width:10px;height:10px;opacity:0;transition:opacity .12s ease}
  .lg-remember input:checked + .lg-check{background:var(--brand);border-color:var(--brand)}
  .lg-remember input:checked + .lg-check svg{opacity:1}
  .lg-remember input:focus-visible + .lg-check{box-shadow:0 0 0 3px var(--brand-weak)}

  /* 主按钮 */
  .lg-submit{
    width:100%;height:var(--h-ctl-lg);
    display:inline-flex;align-items:center;justify-content:center;
    background:var(--brand);color:#fff;
    font-size:15px;font-weight:600;letter-spacing:.04em;
    border-radius:var(--r-ctl);
    transition:background .15s ease,box-shadow .15s ease;
  }
  .lg-submit:hover{background:var(--brand-hover);box-shadow:0 6px 18px rgba(27,123,214,.28)}
  .lg-submit:disabled{opacity:.72;cursor:default;box-shadow:none}

  /* 分割行 */
  .lg-or{display:flex;align-items:center;gap:12px;height:20px}
  .lg-or__line{flex:1;height:1px;background:var(--border)}
  .lg-or__text{font-size:12px;line-height:18px;color:var(--t3);white-space:nowrap}

  /* 其他登录方式（老板 2026-09-17：保留但置灰） */
  .lg-alt{display:flex;gap:12px}
  .lg-alt__btn{
    flex:1;min-width:0;height:var(--h-ctl-lg);
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    background:var(--card);border:1px solid var(--input-border);
    border-radius:var(--r-ctl);font-size:13px;color:#3D4655;
    white-space:nowrap;transition:border-color .15s ease,background .15s ease;
  }
  a.lg-alt__btn{text-decoration:none;cursor:pointer}
  .lg-alt__btn:hover:not([disabled]){border-color:var(--brand);background:var(--brand-weak)}
  /* 置灰态：视觉保留、明确不可用 */
  .lg-alt__btn[disabled]{opacity:.5;cursor:not-allowed;color:var(--t3);background:var(--hover)}
  .lg-alt__btn img{width:20px;height:20px;flex:0 0 20px}
  .lg-alt__btn[disabled] img{opacity:.6}

  /* 页脚 */
  .lg-first{
    display:inline-flex;align-items:center;gap:4px;
    font-size:12px;line-height:18px;color:var(--t3);
  }
  .lg-first b{color:var(--brand);font-weight:500}
  .lg-first img{width:20px;height:20px;flex:0 0 20px}
  .lg-terms{font-size:11px;line-height:16px;color:var(--input-ph);text-align:center}

  /* ==========================================================================
     窄屏兜底（< 1000px）：收起品牌区，改渐变底 + 浮起表单卡
     ========================================================================== */
  @media (max-width:1000px){
    body.is-login{background:var(--grad-brand)}
    .lg{display:block;min-height:100vh}
    .lg-brand{display:none}
    .lg-main{
      min-height:100vh;padding:40px 20px;background:transparent;
      flex-direction:column;gap:18px;align-items:center;justify-content:center;
    }
    .lg-main__glow{display:none}
    .lg-narrow-brand{display:inline-flex}
    .lg-form{
      width:100%;max-width:400px;padding:28px 24px;
      background:var(--card);border-radius:20px;
      box-shadow:0 24px 60px rgba(6,22,44,.28);
    }
  }