/* 灵犀 AURORA 后台 · 样式
 * 依赖 tokens.css（契约 §10 同一套令牌），本文件不定义任何新颜色字面量，
 * 少量 rgba() 均为令牌色的透明度变体（与 public/css/base.css 同一手法）。
 * 断点统一 768px；hover 一律包在 (hover:hover) and (pointer:fine) 内。
 */

/* ============ 1. 基础 ============ */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  min-height:100vh;
  background:var(--bg-0);
  color:var(--tx-0);
  font:15px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}
/* 极光氛围底：两团柔光，固定不随滚动 */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(60vw 44vh at 12% -6%,rgba(109,94,252,.20),transparent 62%),
    radial-gradient(52vw 40vh at 92% 4%,rgba(47,184,255,.14),transparent 60%);
}
a{color:var(--aurora-2);text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:.2px}
p{margin:0}
input,select,textarea,button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--aurora-2);outline-offset:2px}
.au-sr{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
[hidden]{display:none !important}

/* ============ 2. 表单控件 ============ */
.au-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.au-label{font-size:12.5px;color:var(--tx-2);letter-spacing:.3px}
.au-input,.au-select,.au-textarea{
  width:100%;min-height:42px;padding:9px 12px;
  background:var(--bg-2);
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  color:var(--tx-0);
  transition:border-color .18s,box-shadow .18s;
}
.au-textarea{min-height:76px;resize:vertical}
.au-input::placeholder,.au-textarea::placeholder{color:var(--tx-3)}
.au-input:focus,.au-select:focus,.au-textarea:focus{
  outline:none;border-color:var(--aurora-1);
  box-shadow:0 0 0 3px rgba(109,94,252,.22);
}
.au-select{appearance:none;cursor:pointer;padding-right:32px;
  background-image:linear-gradient(45deg,transparent 50%,var(--tx-2) 50%),linear-gradient(135deg,var(--tx-2) 50%,transparent 50%);
  background-position:calc(100% - 17px) 19px,calc(100% - 12px) 19px;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
}
/* 日期选择器的原生图标在深色底下几乎不可见，反色处理 */
.au-input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.72);cursor:pointer}

/* ============ 3. 按钮 ============ */
.au-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  min-height:42px;padding:0 18px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:var(--glass);
  color:var(--tx-0);
  font-size:14px;font-weight:600;
  cursor:pointer;white-space:nowrap;
  transition:background .18s,border-color .18s,transform .12s,opacity .18s;
}
.au-btn:active{transform:translateY(1px)}
.au-btn[disabled]{opacity:.5;cursor:not-allowed}
.au-btn-primary{
  border-color:transparent;
  background:var(--grad-main);
  color:#080a16;
  box-shadow:var(--shadow-glow);
}
.au-btn-danger{border-color:rgba(255,95,162,.5);color:var(--aurora-4);background:rgba(255,95,162,.08)}
.au-btn-ghost{background:transparent}
.au-btn-sm{min-height:32px;padding:0 11px;font-size:13px;border-radius:8px}
.au-btn-block{width:100%}
@media (hover:hover) and (pointer:fine){
  .au-btn:not([disabled]):hover{background:var(--glass-2);border-color:rgba(255,255,255,.2)}
  .au-btn-primary:not([disabled]):hover{filter:brightness(1.08);background:var(--grad-main)}
  .au-btn-danger:not([disabled]):hover{background:rgba(255,95,162,.18);border-color:var(--aurora-4)}
}

/* ============ 4. 卡片 / 玻璃面 ============ */
.au-card{
  background:var(--glass);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  box-shadow:var(--shadow-1);
  backdrop-filter:blur(10px);
}

/* ============ 5. 登录页 ============ */
.lg-wrap{
  position:relative;z-index:1;
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:24px 16px;
}
.lg-card{width:100%;max-width:390px;padding:30px 26px 26px}
.lg-brand{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.lg-logo{
  width:36px;height:36px;flex:0 0 auto;border-radius:11px;
  background:var(--grad-main);box-shadow:var(--shadow-glow);
  display:flex;align-items:center;justify-content:center;
  font-size:17px;font-weight:800;color:#080a16;
}
.lg-title{font-size:19px}
.lg-sub{margin:2px 0 22px;font-size:13px;color:var(--tx-2)}
.lg-form{display:flex;flex-direction:column;gap:14px}
.lg-tip{margin-top:16px;font-size:12px;color:var(--tx-3);line-height:1.6}

/* ============ 6. 后台骨架 ============ */
.au-shell{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column}

.au-top{
  position:sticky;top:0;z-index:30;
  height:var(--nav-h);flex:0 0 auto;
  display:flex;align-items:center;gap:14px;
  padding:0 18px;
  border-bottom:1px solid var(--line);
  background:rgba(13,16,32,.88);
  backdrop-filter:blur(12px);
}
.au-top .lg-logo{width:30px;height:30px;border-radius:9px;font-size:14px}
.au-top-name{font-size:15.5px;font-weight:700;white-space:nowrap}
.au-top-tag{
  padding:2px 8px;border-radius:999px;font-size:11px;
  border:1px solid var(--line);color:var(--tx-2);background:var(--glass);
  white-space:nowrap;
}
.au-top-right{margin-left:auto;display:flex;align-items:center;gap:10px;min-width:0}
.au-who{font-size:13px;color:var(--tx-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.au-body{flex:1 1 auto;display:flex;align-items:flex-start;min-height:0}

.au-side{
  position:sticky;top:var(--nav-h);
  flex:0 0 196px;width:196px;
  padding:16px 12px;
  border-right:1px solid var(--line);
}
.au-nav{display:flex;flex-direction:column;gap:4px}
.au-nav-btn{
  display:flex;align-items:center;gap:9px;
  width:100%;min-height:40px;padding:0 12px;
  border:1px solid transparent;border-radius:var(--r-sm);
  background:transparent;color:var(--tx-1);
  font-size:14px;font-weight:600;text-align:left;cursor:pointer;
  transition:background .16s,color .16s;
}
.au-nav-btn .ic{flex:0 0 auto;width:16px;text-align:center;opacity:.85}
.au-nav-btn[aria-current=page]{
  background:var(--glass-2);color:var(--tx-0);
  border-color:var(--line);
  box-shadow:inset 2px 0 0 var(--aurora-1);
}
@media (hover:hover) and (pointer:fine){
  .au-nav-btn:hover{background:var(--glass);color:var(--tx-0)}
}

.au-main{flex:1 1 auto;min-width:0;padding:22px 20px 56px}
.au-view{max-width:var(--maxw)}

.au-head{display:flex;align-items:flex-end;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.au-head h2{font-size:18px}
.au-head-sub{font-size:12.5px;color:var(--tx-2)}
.au-head-right{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}

/* ============ 7. 概览 ============ */
.au-stats{
  display:grid;gap:12px;margin-bottom:20px;
  grid-template-columns:repeat(auto-fill,minmax(158px,1fr));
}
.au-stat{padding:15px 16px}
.au-stat-k{font-size:12.5px;color:var(--tx-2)}
.au-stat-v{
  margin-top:5px;font-size:26px;font-weight:800;line-height:1.15;
  font-variant-numeric:tabular-nums;
  background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.au-stat-gold .au-stat-v{background:var(--grad-gold);-webkit-background-clip:text;background-clip:text}

.au-hot{padding:16px 18px}
.au-hot h3{font-size:15px;margin-bottom:12px}
.au-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:13px}
.au-bar-name{flex:0 0 92px;color:var(--tx-1)}
.au-bar-track{flex:1 1 auto;height:9px;border-radius:999px;background:var(--bg-2);overflow:hidden;min-width:40px}
.au-bar-fill{display:block;height:100%;border-radius:999px;background:var(--grad-main)}
.au-bar-n{flex:0 0 auto;min-width:34px;text-align:right;color:var(--tx-2);font-variant-numeric:tabular-nums}

/* ============ 8. 工具条 ============ */
.au-bar{
  display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;
  padding:14px 16px;margin-bottom:14px;
}
.au-bar .au-field{flex:0 1 auto;width:170px}
.au-bar .au-field-wide{width:230px}
.au-bar-acts{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}

/* ============ 9. 表格 ============ */
/* 窄屏横向滚动：滚动容器只包住表格，整页不溢出 */
.au-tablewrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid var(--line);
  border-radius:var(--r-md);
  background:var(--glass);
}
.au-table{width:100%;min-width:720px;border-collapse:collapse;font-size:13.5px}
.au-table th,.au-table td{
  padding:11px 13px;text-align:left;
  border-bottom:1px solid var(--line);
  vertical-align:middle;white-space:nowrap;
}
.au-table thead th{
  position:sticky;top:0;z-index:1;
  background:var(--bg-2);
  color:var(--tx-2);font-size:12px;font-weight:600;letter-spacing:.4px;
}
.au-table tbody tr:last-child td{border-bottom:0}
.au-table .col-acts{text-align:right}
.au-table .num{font-variant-numeric:tabular-nums}
.au-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.4px}
.au-wrapcell{white-space:normal;min-width:180px;max-width:320px}
/* 操作列：表格本身已可横向滚动，所以按钮不换行——
   换行只会把行高拉到 169px（375px 下实测），反而更难用 */
.au-acts{display:flex;gap:6px;justify-content:flex-end;flex-wrap:nowrap}
.au-table .col-acts{white-space:nowrap}
@media (hover:hover) and (pointer:fine){
  .au-table tbody tr:hover{background:var(--glass)}
}
.au-empty{padding:36px 16px;text-align:center;color:var(--tx-2);font-size:13.5px}

/* 徽标 */
.au-tag{
  display:inline-flex;align-items:center;
  padding:2px 8px;border-radius:999px;
  font-size:11.5px;font-weight:600;white-space:nowrap;
  border:1px solid var(--line);color:var(--tx-1);background:var(--glass);
}
.au-tag-ok{border-color:rgba(0,229,192,.45);color:var(--aurora-3);background:rgba(0,229,192,.09)}
.au-tag-gold{border-color:rgba(255,200,107,.5);color:var(--gold);background:rgba(255,200,107,.1)}
.au-tag-warn{border-color:rgba(255,95,162,.5);color:var(--aurora-4);background:rgba(255,95,162,.09)}
.au-tag-mute{color:var(--tx-3)}
.au-tag-info{border-color:rgba(47,184,255,.45);color:var(--aurora-2);background:rgba(47,184,255,.09)}

/* 分页 */
.au-pager{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:13px 2px 0;font-size:13px;color:var(--tx-2);
}
.au-pager-info{font-variant-numeric:tabular-nums}
.au-pager-acts{margin-left:auto;display:flex;gap:8px;align-items:center}
.au-note{
  margin:0 0 12px;padding:10px 13px;
  border:1px solid rgba(255,200,107,.32);border-radius:var(--r-sm);
  background:rgba(255,200,107,.07);
  color:var(--tx-1);font-size:12.5px;line-height:1.6;
}

/* ============ 10. 弹层（详情 / 确认 / 表单） ============ */
.au-modal{
  position:fixed;inset:0;z-index:200;
  display:flex;align-items:center;justify-content:center;
  padding:20px 14px;
  background:rgba(3,5,12,.72);
  backdrop-filter:blur(4px);
}
.au-modal-box{
  width:100%;max-width:520px;max-height:86vh;
  display:flex;flex-direction:column;
  background:var(--bg-1);
  border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-1);
  animation:au-pop .2s cubic-bezier(.2,.8,.3,1) both;
}
.au-modal-lg{max-width:760px}
@keyframes au-pop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.au-modal-hd{
  flex:0 0 auto;display:flex;align-items:center;gap:10px;
  padding:16px 18px;border-bottom:1px solid var(--line);
}
.au-modal-hd h3{font-size:16px}
.au-modal-x{
  margin-left:auto;width:30px;height:30px;flex:0 0 auto;
  border:0;border-radius:8px;background:transparent;color:var(--tx-2);
  font-size:19px;line-height:1;cursor:pointer;
}
.au-modal-bd{flex:1 1 auto;overflow:auto;padding:18px;font-size:14px;color:var(--tx-1);line-height:1.7}
.au-modal-ft{
  flex:0 0 auto;display:flex;justify-content:flex-end;gap:9px;flex-wrap:wrap;
  padding:14px 18px;border-top:1px solid var(--line);
}
@media (hover:hover) and (pointer:fine){
  .au-modal-x:hover{background:var(--glass-2);color:var(--tx-0)}
}
.au-form{display:flex;flex-direction:column;gap:14px}
.au-form-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.au-hint{font-size:12px;color:var(--tx-3);line-height:1.6}

/* 定义列表（用户详情） */
.au-dl{display:grid;grid-template-columns:104px 1fr;gap:9px 14px;margin:0;font-size:13.5px}
.au-dl dt{color:var(--tx-2)}
.au-dl dd{margin:0;color:var(--tx-0);word-break:break-word}
.au-sec-t{
  margin:20px 0 10px;padding-top:15px;border-top:1px solid var(--line);
  font-size:13px;color:var(--tx-2);letter-spacing:.4px;
}
.au-pre{
  margin:0;padding:11px 13px;
  background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-sm);
  font-size:13px;color:var(--tx-1);
  white-space:pre-wrap;word-break:break-word;
  max-height:200px;overflow:auto;
}
/* 明文密码 / 兑换码结果：需要一眼看清并可复制 */
.au-secret{
  display:block;padding:14px 16px;margin:12px 0;
  background:var(--bg-2);
  border:1px dashed rgba(255,200,107,.55);border-radius:var(--r-sm);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:20px;font-weight:700;letter-spacing:2px;
  color:var(--gold);text-align:center;
  user-select:all;word-break:break-all;
}
.au-warn-strong{color:var(--aurora-4);font-weight:700}
.au-codelist{
  margin:12px 0 0;padding:12px;
  background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-sm);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:13.5px;line-height:1.9;color:var(--tx-0);
  max-height:240px;overflow:auto;user-select:all;
}

/* ============ 11. toast（契约 §11：ok/info 3 秒消失，err 手动关） ============ */
.au-toasts{
  position:fixed;z-index:999;
  left:50%;transform:translateX(-50%);
  top:calc(var(--nav-h) + 14px);
  width:min(440px,calc(100vw - 32px));
  display:flex;flex-direction:column;gap:10px;
  pointer-events:none;
}
.au-toast{
  pointer-events:auto;
  display:flex;align-items:flex-start;gap:10px;
  padding:13px 14px;
  border-radius:var(--r-md);
  border:1px solid var(--line);
  background:rgba(20,24,48,.96);
  box-shadow:var(--shadow-1);
  font-size:14px;color:var(--tx-0);
  animation:au-toast-in .28s cubic-bezier(.2,.8,.3,1) both;
}
.au-toast.is-out{animation:au-toast-out .22s ease forwards}
.au-toast-ico{
  flex:0 0 auto;width:20px;height:20px;margin-top:1px;
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;color:#080a16;
}
.au-toast-msg{flex:1 1 auto;min-width:0;word-break:break-word}
.au-toast-x{
  flex:0 0 auto;width:24px;height:24px;border-radius:7px;border:0;background:transparent;
  display:flex;align-items:center;justify-content:center;
  color:var(--tx-2);font-size:16px;line-height:1;cursor:pointer;
}
.au-toast-ok{border-color:rgba(0,229,192,.4)}
.au-toast-ok .au-toast-ico{background:var(--aurora-3)}
.au-toast-info{border-color:rgba(47,184,255,.4)}
.au-toast-info .au-toast-ico{background:var(--aurora-2)}
.au-toast-err{border-color:rgba(255,95,162,.55);background:rgba(48,16,34,.97)}
.au-toast-err .au-toast-ico{background:var(--aurora-4)}
@keyframes au-toast-in{from{opacity:0;transform:translateY(-12px) scale(.97)}to{opacity:1;transform:none}}
@keyframes au-toast-out{to{opacity:0;transform:translateY(-8px) scale(.97)}}
@media (hover:hover) and (pointer:fine){
  .au-toast-x:hover{color:var(--tx-0);background:var(--glass-2)}
}

/* ============ 12. 移动端（契约 §10 统一断点 768px） ============ */
@media (max-width:768px){
  .au-top{gap:9px;padding:0 12px}
  .au-top-tag{display:none}
  .au-who{display:none}
  .au-body{flex-direction:column;align-items:stretch}
  /* align-items 必须在竖排时改回 stretch：桌面版的 flex-start 是为了让侧栏
     不被拉满高度，但 flex-direction 变 column 后它作用在横轴上，
     会把 .au-main 压缩成内容宽度（实测 375px 下只有 263px）。 */
  /* 侧栏变顶部横向标签条，自身横向滚动，不撑破页面 */
  .au-side{
    position:static;width:100%;flex:0 0 auto;
    padding:10px 12px;
    border-right:0;border-bottom:1px solid var(--line);
    overflow-x:auto;-webkit-overflow-scrolling:touch;
  }
  .au-nav{flex-direction:row;gap:6px;width:max-content}
  .au-nav-btn{min-height:36px;padding:0 12px;font-size:13.5px;white-space:nowrap}
  .au-nav-btn[aria-current=page]{box-shadow:inset 0 -2px 0 var(--aurora-1)}
  .au-nav-btn .ic{display:none}
  .au-main{padding:16px 12px 44px}
  .au-stats{grid-template-columns:repeat(auto-fill,minmax(134px,1fr));gap:10px}
  .au-stat-v{font-size:22px}
  .au-bar{padding:12px}
  .au-bar .au-field,.au-bar .au-field-wide{width:100%;flex:1 1 140px}
  .au-bar-acts{width:100%;margin-left:0}
  .au-bar-acts .au-btn{flex:1 1 auto}
  .au-form-2{grid-template-columns:1fr}
  .au-dl{grid-template-columns:88px 1fr;gap:8px 10px;font-size:13px}
  .au-toasts{top:auto;bottom:16px;width:calc(100vw - 24px)}
  .au-modal{padding:12px 10px}
  .au-modal-box{max-height:90vh}
  .au-bar-name{flex-basis:74px}
  .au-secret{font-size:17px;letter-spacing:1px}
}