/* ============================================
   摸鱼大仓鼠 · 自定义样式（从 index.html 拆出）
   内含：鼠标指针 / 呼吸光环 / 打字机 / 编辑器样式
   @theme(Tailwind变量) 保留在 index.html 内联，勿移走
   ============================================ */

  /* 专属科幻机能鼠标指针（可用变量切换样式） */
  :root {
    --cursor-body: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpolygon points='2,2 22,9 13,13 9,22' fill='%2338BDF8' stroke='%230284C7' stroke-width='1.5'/%3E%3Ccircle cx='13' cy='13' r='2' fill='%23FFFFFF'/%3E%3C/svg%3E"), auto;
    --cursor-click: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpolygon points='2,2 22,9 13,13 9,22' fill='%23FFB03A' stroke='%23E08A1A' stroke-width='1.5'/%3E%3Ccircle cx='13' cy='13' r='2.5' fill='%23FFFFFF'/%3E%3C/svg%3E"), pointer;
  }
  html, body {
    cursor: var(--cursor-body);
    scrollbar-color: #37404F #101216;
    scroll-behavior: smooth;
  }
  button, a, input, select, textarea, [onclick] {
    cursor: var(--cursor-click) !important;
  }

  /* 机能呼吸变色霓虹全屏光环（青→蓝→紫 三色循环呼吸） */
  @keyframes glow-breath {
    0%, 100% { box-shadow: inset 0 0 16px rgba(55,211,180,.22), 0 0 10px rgba(55,211,180,.18); border-color: rgba(55,211,180,.42); }
    33% { box-shadow: inset 0 0 26px rgba(56,189,248,.34), 0 0 18px rgba(56,189,248,.30); border-color: rgba(56,189,248,.58); }
    66% { box-shadow: inset 0 0 26px rgba(167,139,250,.30), 0 0 18px rgba(167,139,250,.26); border-color: rgba(167,139,250,.52); }
  }
  #page-viewport {
    min-height: 100vh;
    border: 1.5px solid rgba(55,211,180,0.4);
    animation: glow-breath 5s ease-in-out infinite;
  }

  /* 打字机光标闪烁 */
  @keyframes blink-caret { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
  #brandCaret { animation: blink-caret .85s step-end infinite; }

  /* 鼠标跟随光晕 */
  #cursor-halo {
    position: fixed; left: -100px; top: -100px; width: 46px; height: 46px; border-radius: 9999px;
    pointer-events: none; z-index: 60; transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(255,176,58,.18), rgba(56,189,248,.10) 45%, transparent 70%);
    transition: opacity .25s;
  }

  body { background:#101216 radial-gradient(1100px 560px at 50% -120px, rgba(255,176,58,.06), transparent 62%) fixed; background-size: cover; background-position: center; }
  body.custom-bg { background-image: var(--user-bg) !important; background-attachment: fixed !important; background-size: cover !important; }
  button { -webkit-tap-highlight-color:transparent; }
  ::selection { background:rgba(255,176,58,.30); }
  mark { background:rgba(255,176,58,.18); color:#FFB03A; padding:0 3px; border-radius:3px; font-weight:600; }
  .note-h { display:block; color:#FFB03A; font-weight:700; margin:.5em 0 .2em; font-size:1.05em; }
  @keyframes rise { from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }
  .anim-rise { animation: rise .2s ease-out; }
  @media (min-width:1024px){ .colL{width:28%;} .colM{width:44%;} .colR{width:28%;} }
  ::-webkit-scrollbar{ width:8px; height:8px; } ::-webkit-scrollbar-thumb{ background:#37404F; border-radius:4px; } ::-webkit-scrollbar-track{ background:#101216; }
  
  .ed-label{ display:block; font-size:11px; color:#8F9AA8; margin-bottom:4px; font-weight:600; }
  .ed-field{ width:100%; border-radius:7px; background:#161920; border:1px solid #2B3240; padding:6px 9px; font-size:12px; color:#EAEDF2; outline:none; transition:border-color .15s; }
  .ed-field:focus{ border-color:#FFB03A; }
  .ed-sub{ height:26px; padding:0 8px; border-radius:6px; border:1px solid #2B3240; color:#8F9AA8; font-size:11px; background:transparent; cursor:pointer; }
  .ed-sub:hover{ color:#EAEDF2; border-color:#FFB03A; }
  .ed-sub.danger:hover{ color:#F87171; border-color:rgba(248,113,113,.5); }