/* ============================================================
   desktop.css —— 电脑桌面 UI 适配层
   移动端完全不受影响；只在 >=1080px 生效并逐档增强
   ============================================================ */

/* ---------- 1080px：进入桌面布局 ---------- */
@media (min-width:1080px){
  :root{
    --sb-w:248px;
    --content-max:1160px;
  }
  html,body{overflow-y:scroll;}
  /* 滚动条统一，避免 Windows 上丑陋的默认条 */
  ::-webkit-scrollbar{width:10px;height:10px;}
  ::-webkit-scrollbar-track{background:transparent;}
  ::-webkit-scrollbar-thumb{
    background:rgba(20,30,60,.16);
    border-radius:8px;
    border:2px solid transparent;
    background-clip:content-box;
  }
  ::-webkit-scrollbar-thumb:hover{background:rgba(20,30,60,.3);background-clip:content-box;}

  .content{
    padding:32px 40px 64px;
    max-width:var(--content-max);
    margin:0 auto;
  }
  .topbar{
    height:60px;
    padding:0 40px;
  }
  .page-head{margin-bottom:24px;}
  .page-head h1{font-size:24px;}
  .page-desc{font-size:13.5px;}

  /* 卡片栅格：桌面三列，间距更舒展 */
  .card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}

  /* 表单在桌面上不要拉满整行 */
  .token-form{flex-wrap:nowrap;}
  .token-form .input{min-width:180px;}

  /* 聊天区限宽，长行更易读 */
  .chat-box > *{max-width:940px;margin-left:auto;margin-right:auto;}
  .composer > *{max-width:940px;margin-left:auto;margin-right:auto;}
}

/* ---------- 1280px：主流笔记本 ---------- */
@media (min-width:1280px){
  :root{
    --sb-w:260px;
    --content-max:1240px;
  }
  .content{padding:36px 52px 72px;}
  .topbar{padding:0 52px;height:62px;}
  .card-grid{gap:20px;}
  .page-head h1{font-size:25px;}
  /* 侧边栏更从容 */
  .sb-item{height:42px;}
  .sb-brand{padding:22px 18px 16px;}
  .sb-logo{width:36px;height:36px;font-size:17px;}
  .sb-name{font-size:15.5px;}
}

/* ---------- 1600px：大屏 ---------- */
@media (min-width:1600px){
  :root{
    --sb-w:272px;
    --content-max:1400px;
  }
  .content{padding:40px 64px 80px;}
  .topbar{padding:0 64px;}
  .card-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px;
  }
  .page-head h1{font-size:27px;}
  /* 大屏下给主内容一点纵向节奏 */
  .panel{margin-bottom:20px;}
}

/* ---------- 鼠标设备：hover 才有的反馈 ---------- */
@media (hover:hover) and (pointer:fine){
  .panel{
    transition:box-shadow .22s cubic-bezier(.22,.7,.28,1),
               transform .22s cubic-bezier(.22,.7,.28,1);
  }
  .panel:hover{
    box-shadow:0 2px 4px rgba(16,24,40,.05),0 12px 32px -8px rgba(16,24,40,.12);
  }
  .stat-card{
    transition:transform .22s cubic-bezier(.34,1.56,.64,1),
               box-shadow .22s cubic-bezier(.22,.7,.28,1);
  }
  .stat-card:hover{
    transform:translateY(-3px);
    box-shadow:0 2px 4px rgba(16,24,40,.05),0 14px 30px -10px rgba(16,24,40,.14);
  }
  .sb-item{transition:background .14s,color .14s,transform .16s cubic-bezier(.34,1.56,.64,1);}
  .sb-item:hover{transform:translateX(2px);}
  .btn{transition:background .15s,border-color .15s,transform .12s cubic-bezier(.34,1.56,.64,1),box-shadow .18s;}
}

/* ---------- 桌面端：键盘可达性 ---------- */
@media (min-width:1080px){
  .btn:focus-visible,
  .input:focus-visible,
  .sb-item:focus-visible,
  .gate-input:focus-visible{
    outline:2px solid rgba(37,99,235,.6);
    outline-offset:2px;
  }
}

/* ---------- 窄桌面 / 分屏：保持可用 ---------- */
@media (min-width:1080px) and (max-width:1180px){
  .content{padding:28px 28px 56px;}
  .topbar{padding:0 28px;}
}
