/* ============ AI 工作室 Studio Terminal · 共用樣式 ============ */
:root{
  --bg-0:#06090f; --bg-1:#0a0f17; --bg-2:#0e141d; --bg-3:#131b27;
  --line:#1d2733; --line-2:#2a3a4f;
  --text:#f5f9ff; --text-dim:#c1cbdb; --text-faint:#7e8ea3;
  /* 3-color palette */
  --y:#ffffff;   /* primary - white (interface accent) */
  --y-2:#e6ebf2;
  --g:#39ff14;   /* good / up / positive */
  --r:#ff5252;   /* bad / down / negative */
  --glow-y:0 0 6px rgba(255,255,255,.42), 0 0 18px rgba(255,255,255,.16);
  --glow-g:none;   /* 綠色螢光取消 */
  --glow-r:0 0 6px rgba(255,82,82,.55), 0 0 18px rgba(255,82,82,.22);

  /* ── 滿版沉浸：iPhone 瀏海／home indicator 安全區（桌面與非瀏海裝置皆為 0，原樣不變） ── */
  --safe-top:env(safe-area-inset-top, 0px);
  --safe-bottom:env(safe-area-inset-bottom, 0px);
  --safe-left:env(safe-area-inset-left, 0px);
  --safe-right:env(safe-area-inset-right, 0px);
  --topbar-h:54px;
}

/* ───── 外觀設定：發光開關（settings → s-glow） ───── */
body.no-glow{
  --glow-y:none;
  --glow-g:none;
  --glow-r:none;
}
body.no-glow *{
  text-shadow:none !important;
  box-shadow:none !important;
}

/* ───── 外觀設定：主色 accent（settings → s-accent） ───── */
body[data-accent="g"]{
  --y:#39ff14;
  --y-2:#a3ff7a;
  --glow-y:0 0 6px rgba(57,255,20,.55), 0 0 18px rgba(57,255,20,.25);
}
body[data-accent="c"]{
  --y:#22d3ee;
  --y-2:#67e8f9;
  --glow-y:0 0 6px rgba(34,211,238,.55), 0 0 18px rgba(34,211,238,.25);
}
body.no-glow[data-accent="g"], body.no-glow[data-accent="c"]{
  --glow-y:none;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
html{overflow-x:hidden; -webkit-text-size-adjust:100%; text-size-adjust:100%; overscroll-behavior:none}   /* 防任何元素撐爆 viewport：手機不再水平捲動／內容被切；禁止 iOS 自動放大字級；去掉下拉回彈/重整手勢，像原生 App */
body{
  font-family:'Inter','PingFang TC','Microsoft JhengHei',sans-serif;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(255,255,255,.05), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(167,139,250,.04), transparent 60%),
    var(--bg-0);
  color:var(--text);-webkit-font-smoothing:antialiased;
  height:100vh;display:flex;flex-direction:column;overflow:hidden;
}
.mono{font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace}

/* ───── Top bar ───── */
.topbar{
  position:sticky;top:0;z-index:50;
  background:linear-gradient(180deg, rgba(10,15,23,.95), rgba(10,15,23,.75));
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
  height:calc(var(--topbar-h) + var(--safe-top));padding-top:var(--safe-top);
  display:flex;align-items:center;gap:18px;padding-left:calc(18px + var(--safe-left));padding-right:calc(18px + var(--safe-right));
}
/* 漢堡選單按鈕：桌機隱藏，手機顯示（開關側欄抽屜） */
.nav-toggle{display:none;background:transparent;border:1px solid var(--line);color:var(--text);
  border-radius:8px;width:38px;height:38px;font-size:18px;line-height:1;cursor:pointer;
  align-items:center;justify-content:center;flex-shrink:0}
.nav-toggle:hover{border-color:var(--y);color:var(--y)}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.5px;text-decoration:none}
.brand .mark{
  width:28px;height:28px;border-radius:8px;position:relative;
  background:conic-gradient(from var(--ang,0deg),
    #ff2d55, #ff8a00, #ffd60a, #34d399, #22d3ee, #a78bfa, #ff2d55);
  animation: studio-spin 6s linear infinite;
  box-shadow:0 0 18px rgba(255,255,255,.25), 0 0 6px rgba(34,211,238,.25);
}
.brand .mark::after{
  content:"";position:absolute;inset:3px;border-radius:5px;
  background:var(--bg-0);
}
.brand .mark::before{
  content:"";position:absolute;inset:-3px;border-radius:11px;
  background:conic-gradient(from var(--ang,0deg),
    #ff2d55, #ff8a00, #ffd60a, #34d399, #22d3ee, #a78bfa, #ff2d55);
  filter:blur(10px);opacity:.55;z-index:-1;
  animation: studio-spin 6s linear infinite;
}
@keyframes studio-spin{ to { transform:rotate(360deg); } }
.brand .name{font-size:14px}
.brand .name b{
  background:linear-gradient(90deg,#ff2d55,#ffd60a,#22d3ee,#a78bfa);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 6px rgba(255,255,255,.18));
}
.brand .name span{color:var(--y);margin-left:6px;font-weight:600;letter-spacing:1.2px;text-shadow:var(--glow-y)}

.status-pill{
  display:flex;align-items:center;gap:8px;
  padding:6px 10px;border:1px solid var(--line);border-radius:999px;
  background:var(--bg-1);font-size:11px;color:var(--text-dim);
}
.dot{width:7px;height:7px;border-radius:50%;background:var(--g);
  animation:pulse 1.6s ease-in-out infinite}
/* 真實系統狀態：行情連線失敗時轉紅 */
.status-pill.err{border-color:rgba(255,82,82,.5);color:var(--r)}
.status-pill.err .dot{background:var(--r)}
@keyframes pulse{0%,100%{opacity:.55}50%{opacity:1}}

.spacer{flex:1}
.clock{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--text-dim);border-left:1px solid var(--line);padding-left:14px}
.clock b{color:#fff;letter-spacing:1px}

.search{
  display:flex;align-items:center;gap:8px;
  background:var(--bg-1);border:1px solid var(--line);border-radius:8px;
  padding:6px 10px;width:260px;position:relative;
  transition:border-color .2s cubic-bezier(.2,.8,.2,1);
}
.search:focus-within{border-color:var(--line-2)}
/* 搜尋結果下拉 */
.search-results{
  position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:60;
  background:var(--bg-2);border:1px solid var(--line-2);border-radius:10px;
  overflow:hidden;display:none;
  box-shadow:0 12px 40px rgba(0,0,0,.5);
}
.search-results.open{display:block}
.sr-item{
  display:flex;align-items:center;gap:10px;padding:9px 12px;
  color:var(--text-dim);text-decoration:none;font-size:13px;
  border-bottom:1px solid var(--line);
}
.sr-item:last-child{border-bottom:0}
.sr-item .ic{color:var(--y);font-family:'JetBrains Mono',monospace;font-size:12px;width:16px;text-align:center}
.sr-item .grp{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--text-faint);letter-spacing:1.5px}
.sr-item:hover,.sr-item.sel{background:var(--bg-3);color:#fff}
.sr-empty{padding:12px;text-align:center;color:var(--text-faint);font-size:12px;font-family:'JetBrains Mono',monospace}
.search input{flex:1;background:transparent;border:0;outline:0;color:var(--text);font-size:13px;font-family:inherit}
.search input::placeholder{color:var(--text-faint)}
.search .kbd{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--text-faint);border:1px solid var(--line);padding:1px 5px;border-radius:4px}

/* ───── Layout ───── */
.shell{display:grid;grid-template-columns:240px 1fr;gap:0;flex:1 1 auto;min-height:0;overflow:hidden}
.sidebar{border-right:1px solid var(--line);background:var(--bg-1);padding:18px 12px;overflow-y:auto}
.side-label{
  font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:2.2px;
  color:var(--y);padding:0 8px;margin:14px 0 6px;font-weight:700;
  text-shadow:0 0 6px rgba(255,255,255,.4);
}
.side-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:6px;color:#dde4ef;cursor:pointer;font-size:13.5px;border:1px solid transparent;transition:all .15s;text-decoration:none}
.side-item:hover{background:var(--bg-2);color:#fff;border-color:var(--line)}
.side-item.active{background:var(--bg-2);color:#fff;border-color:rgba(255,255,255,.35);box-shadow:inset 2px 0 0 var(--y), 0 0 12px rgba(255,255,255,.12)}
.side-item .ic{width:18px;height:18px;display:grid;place-items:center;color:var(--y);font-family:'JetBrains Mono',monospace;font-size:12px;text-shadow:var(--glow-y)}
.side-item .badge{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--g);font-weight:600}

.side-add{margin-top:10px;display:flex;align-items:center;justify-content:center;gap:8px;padding:9px;border:1px dashed var(--line-2);border-radius:6px;color:var(--text-faint);font-size:12px;cursor:pointer;transition:all .15s;text-decoration:none}
.side-add:hover{color:var(--y);border-color:var(--y)}

.main{padding:20px calc(24px + var(--safe-right)) calc(60px + var(--safe-bottom)) calc(24px + var(--safe-left));overflow-y:auto}

/* 整頁捲動：捲軸貼瀏覽器最右側、一條到底（IG / YT 式）。
   在 <body> 加 class="scroll-page" 啟用，未掛的頁面維持原本框內捲動。 */
body.scroll-page{ height:auto; min-height:100vh; overflow-y:scroll; overflow-x:hidden; overscroll-behavior-y:none; }  /* IG / YT 式：滿版、只上下滑、無左右、無回彈 */
body.scroll-page .shell{ overflow:visible; flex:0 0 auto; min-height:0; }
body.scroll-page .main{ overflow:visible; }
body.scroll-page .sidebar{ position:sticky; top:54px; align-self:start; height:calc(100vh - 54px); }
.crumbs{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--text-dim);letter-spacing:1.4px;margin-bottom:8px}
.crumbs b{color:var(--y);text-shadow:var(--glow-y)}
.page-title{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.page-title h1{font-size:24px;font-weight:700;letter-spacing:.3px;color:#fff}
.page-title h1 span{color:var(--y);text-shadow:0 0 8px rgba(255,255,255,.55), 0 0 22px rgba(255,255,255,.35)}
.page-title p{color:var(--text-dim);font-size:13.5px;margin-top:4px}

/* ───── KPI ───── */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
.kpi{background:var(--bg-1);border:1px solid var(--line);border-radius:10px;padding:14px 16px;position:relative;overflow:hidden}
.kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--y),transparent)}
.kpi .l{font-size:11px;color:var(--text-dim);letter-spacing:1.8px;text-transform:uppercase;font-weight:600}
.kpi .v{font-size:26px;font-weight:700;margin-top:6px;font-family:'JetBrains Mono',monospace;color:var(--y);text-shadow:var(--glow-y)}
.kpi .v.up{color:var(--g);text-shadow:var(--glow-g)}
.kpi .v.dn{color:var(--r);text-shadow:var(--glow-r)}
.kpi .d{font-size:11.5px;color:var(--text-dim);margin-top:4px;display:flex;gap:6px;align-items:center}
.kpi .d .up{color:var(--g);text-shadow:var(--glow-g)}
.kpi .d .dn{color:var(--r);text-shadow:var(--glow-r)}
.spark{position:absolute;right:10px;top:10px;opacity:.85}
/* BTC 推薦徽章（價格旁） */
.btc-rec{display:inline-flex;align-items:center;gap:4px;vertical-align:middle;margin-left:10px;
  font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.5px;
  line-height:1;padding:4px 8px;border-radius:999px;border:1px solid var(--line);
  color:var(--text-dim);text-shadow:none;cursor:default;transition:.2s}
.btc-rec.buy{color:var(--g);border-color:rgba(57,255,20,.5);background:rgba(57,255,20,.10)}
.btc-rec.hold{color:#ffd24d;border-color:rgba(255,210,77,.5);background:rgba(255,210,77,.10)}
.btc-rec.avoid{color:var(--r);border-color:rgba(255,82,82,.5);background:rgba(255,82,82,.10)}
.btc-rec.short{color:#fff;border-color:var(--r);background:var(--r);box-shadow:0 0 8px rgba(255,82,82,.45)}
/* 統一評級 v1 新增：🔵逢低布局 / 🟠減碼 */
.btc-rec.dip{color:#34d3ee;border-color:rgba(52,211,238,.5);background:rgba(52,211,238,.10)}
.btc-rec.reduce{color:#ff9a3c;border-color:rgba(255,154,60,.5);background:rgba(255,154,60,.10)}
/* 輕量評分（資料有限）外觀與一般一致，差異僅在滑鼠提示文字 */

/* 可點擊的 KPI 卡（點進去看推薦理由） */
.kpi.rec-clickable{cursor:pointer;transition:border-color .15s, transform .15s, box-shadow .15s}
.kpi.rec-clickable:hover{border-color:rgba(255,255,255,.35);transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.35)}
.kpi.rec-clickable::after{content:"點擊看理由 ›";position:absolute;right:12px;bottom:10px;font-size:10px;color:var(--text-faint);letter-spacing:.5px;opacity:0;transition:opacity .15s}
.kpi.rec-clickable:hover::after{opacity:.8}

/* 推薦理由詳情視窗 */
.rec-modal-backdrop{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.6);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:24px}
.rec-modal{position:relative;width:min(620px,94vw);max-height:88vh;overflow-y:auto;background:var(--bg-1);border:1px solid var(--line);border-radius:14px;padding:22px 24px;box-shadow:0 18px 50px rgba(0,0,0,.55)}
.rec-close{position:absolute;top:12px;right:14px;width:30px;height:30px;border-radius:8px;background:transparent;border:1px solid var(--line);color:var(--text-dim);font-size:18px;line-height:1;cursor:pointer}
.rec-close:hover{color:#fff;border-color:rgba(255,255,255,.4)}
.rd-head{display:flex;align-items:center;gap:12px;margin:0 0 6px;flex-wrap:wrap}
.rd-head h3{margin:0;font-size:18px;color:var(--y);text-shadow:var(--glow-y);font-family:'JetBrains Mono',monospace}
.rd-sec{margin-top:16px}
.rd-t{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--text-dim);font-weight:700;margin-bottom:6px;border-left:2px solid var(--y);padding-left:8px}
.rd-sec p{margin:0;font-size:13.5px;line-height:1.7;color:var(--text)}
.rd-tech{margin:0;padding-left:18px;font-size:13px;line-height:1.9}
.rd-tech b{color:#fff}
.rd-pos{color:var(--g);font-weight:700}
.rd-neg{color:var(--r);font-weight:700}
.rd-sum{margin-top:8px !important;font-size:12.5px !important;color:var(--text-dim) !important}
.rd-risk{margin:0;padding-left:18px;line-height:1.8;color:var(--text);font-size:12.5px}
.rd-src{display:flex;flex-direction:column;gap:5px}
.rd-src a{color:var(--y);font-size:12.5px;text-decoration:none}
.rd-src a:hover{text-decoration:underline}
.rd-muted{color:var(--text-faint);font-size:12.5px;margin:0}
.rd-pre{white-space:pre-wrap;font-size:12px;color:var(--text-dim);margin:6px 0 0;font-family:'JetBrains Mono',monospace}
.rd-foot{margin-top:18px;color:var(--text-faint);line-height:1.7;border-top:1px solid var(--line);padding-top:10px;font-size:12.5px}

/* ───── Section header ───── */
.sec-title{display:flex;align-items:center;gap:10px;margin:20px 0 10px}
.sec-title h2{font-size:14px;letter-spacing:2.2px;font-weight:700;text-transform:uppercase;color:var(--y);text-shadow:var(--glow-y)}
.sec-title .line{flex:1;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.35),transparent)}
.sec-title .tag{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--g);border:1px solid rgba(57,255,20,.4);padding:2px 6px;border-radius:4px;font-weight:600}

/* ───── Panel / Card ───── */
.panel{background:linear-gradient(180deg,var(--bg-2),var(--bg-1));border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin-bottom:14px}
.panel-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.panel-head h3{font-size:14px;letter-spacing:2.2px;font-weight:700;text-transform:uppercase;color:var(--y);text-shadow:var(--glow-y)}
.panel-head .tag{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--g);border:1px solid rgba(57,255,20,.4);padding:2px 6px;border-radius:4px;font-weight:600}
.panel-head .line{flex:1;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.3),transparent)}

/* ───── Holdings ───── */
.holdings{background:linear-gradient(180deg,var(--bg-2),var(--bg-1));border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin-bottom:18px}
.holdings .head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.holdings .head h3{font-size:14px;letter-spacing:2.2px;font-weight:700;text-transform:uppercase;color:var(--y);text-shadow:var(--glow-y)}
.holdings .head .tag{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--g);border:1px solid rgba(57,255,20,.4);padding:2px 6px;border-radius:4px;font-weight:600}
.holdings .head .line{flex:1;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.3),transparent)}
.holdings .head .price{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--text-dim)}
.holdings .head .price b{color:var(--y);text-shadow:var(--glow-y);font-weight:700;margin-left:6px}

.pos-form{display:grid;grid-template-columns:1.1fr 1fr 1.1fr auto;gap:10px;background:var(--bg-3);border:1px solid var(--line-2);border-radius:10px;padding:12px;margin-bottom:14px;align-items:end}
.pos-form .field label{display:block;color:var(--y);font-size:10px;letter-spacing:1.6px;text-transform:uppercase;margin-bottom:5px;font-family:'JetBrains Mono',monospace;font-weight:700;text-shadow:0 0 5px rgba(255,255,255,.4)}
.pos-form .field .inp{display:flex;align-items:center;background:var(--bg-0);border:1px solid var(--line-2);border-radius:8px;padding:0 12px;transition:border-color .15s}
.pos-form .field .inp:focus-within{border-color:var(--y);box-shadow:0 0 0 2px rgba(255,255,255,.12)}
.pos-form .field input{flex:1;background:transparent;border:0;outline:0;color:#fff;padding:10px 0;font-size:14px;font-family:'JetBrains Mono',monospace}
.pos-form .field input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.7) brightness(1.3)}
.pos-form .field .unit{color:var(--text-dim);font-size:11px;font-family:'JetBrains Mono',monospace;letter-spacing:1px;margin-left:6px}
.pos-form .add-btn{background:linear-gradient(180deg,var(--y),var(--y-2));color:#000;border:0;border-radius:8px;padding:11px 18px;font-weight:700;cursor:pointer;font-size:13px;letter-spacing:1px;box-shadow:0 0 18px rgba(255,255,255,.25);font-family:inherit}
.pos-form .add-btn:hover{filter:brightness(1.08)}
.pos-form .add-btn:disabled{opacity:.5;cursor:not-allowed}

.pos-table{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg-1)}
.pos-row{display:grid;grid-template-columns: 110px 110px 120px 120px 110px 120px 1fr 110px 36px;gap:10px;padding:11px 14px;align-items:center;border-bottom:1px solid var(--line);font-family:'JetBrains Mono',monospace;font-size:13px}
.pos-row:last-child{border-bottom:0}
.pos-row.head{background:var(--bg-3);color:var(--text-dim);font-size:10.5px;letter-spacing:1.6px;text-transform:uppercase;font-weight:700;padding:10px 14px}
.pos-row .v{color:#fff}
.pos-row .v.up{color:var(--g);text-shadow:var(--glow-g);font-weight:700}
.pos-row .v.dn{color:var(--r);text-shadow:var(--glow-r);font-weight:700}
.pos-row .v.muted{color:var(--text-dim)}
.pos-row .bar{position:relative;height:6px;background:var(--bg-3);border-radius:3px;overflow:hidden}
.pos-row .bar i{position:absolute;top:0;left:50%;height:100%;background:var(--g);box-shadow:0 0 8px var(--g);transition:width .3s, background .3s}
.pos-row .bar.dn i{background:var(--r);box-shadow:0 0 8px var(--r);right:50%;left:auto}
.pos-row .del{background:transparent;border:1px solid var(--line-2);color:var(--text-faint);border-radius:6px;width:28px;height:28px;cursor:pointer;font-size:13px;transition:all .15s}
.pos-row .del:hover{color:var(--r);border-color:var(--r)}
.pos-empty{padding:24px;text-align:center;color:var(--text-faint);font-size:13px;font-family:'JetBrains Mono',monospace;letter-spacing:1px}

.pos-sum{margin-top:12px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.pos-sum .cell{background:var(--bg-3);border:1px solid var(--line);border-radius:8px;padding:12px 14px}
.pos-sum .cell .l{font-size:10.5px;color:var(--text-dim);letter-spacing:1.6px;text-transform:uppercase;font-weight:600}
.pos-sum .cell .v{margin-top:4px;font-family:'JetBrains Mono',monospace;font-size:20px;font-weight:700;color:#fff}
.pos-sum .cell .v.up{color:var(--g);text-shadow:var(--glow-g)}
.pos-sum .cell .v.dn{color:var(--r);text-shadow:var(--glow-r)}
.pos-sum .cell .v.y{color:var(--y);text-shadow:var(--glow-y)}

/* ───── Module grid ───── */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.mod{
  background:linear-gradient(180deg,var(--bg-2),var(--bg-1));
  border:1px solid var(--line);border-radius:12px;padding:16px;
  position:relative;overflow:hidden;cursor:pointer;
  transition:transform .25s cubic-bezier(.2,.8,.2,1), border-color .25s;
  min-height:180px;display:flex;flex-direction:column;text-decoration:none;color:var(--text);
}
.mod::after{content:"";position:absolute;inset:0;border-radius:12px;pointer-events:none;box-shadow:0 0 0 1px transparent inset;transition:all .2s ease}
.mod:hover{transform:translateY(-2px);border-color:var(--line-2)}
.mod:hover::after{box-shadow:0 0 0 1px var(--y) inset, 0 12px 40px rgba(255,255,255,.08)}
.mod-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.mod-icon{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.22), transparent 60%), var(--bg-3);border:1px solid var(--line-2);color:var(--y);font-weight:700;font-family:'JetBrains Mono',monospace;font-size:14px;text-shadow:var(--glow-y)}
.mod-title{flex:1}
.mod-title b{display:block;font-size:16px;color:#fff;letter-spacing:.3px;text-shadow:0 0 8px rgba(255,255,255,.25)}
.mod-title small{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--y);letter-spacing:1.6px;text-shadow:0 0 6px rgba(255,255,255,.45);font-weight:600}
.mod-status{display:inline-flex;align-items:center;gap:6px;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--g);border:1px solid rgba(57,255,20,.35);padding:3px 8px;border-radius:999px;background:var(--bg-1);font-weight:700;letter-spacing:1.2px}
.mod-status .dot{width:6px;height:6px}
.mod-status.dev{color:var(--y);border-color:rgba(255,255,255,.35);text-shadow:0 0 5px rgba(255,255,255,.5)}
.mod-status.dev .dot{background:var(--y);box-shadow:0 0 6px var(--y)}
.mod-desc{color:#c9d3e2;font-size:13px;line-height:1.6;margin-bottom:12px}
.mod-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;border-top:1px dashed var(--line);padding-top:10px}
.metric .l{font-size:10.5px;color:var(--text-dim);letter-spacing:1.3px;text-transform:uppercase;font-weight:600}
.metric .v{font-family:'JetBrains Mono',monospace;font-size:15px;color:#fff;margin-top:2px;font-weight:600}
.metric .v.up{color:var(--g);text-shadow:var(--glow-g)}
.metric .v.dn{color:var(--r);text-shadow:var(--glow-r)}
.mod-foot{margin-top:auto;display:flex;align-items:center;gap:8px}
.mod-tag{position:absolute;top:14px;right:14px;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--y);letter-spacing:1.8px;font-weight:600;text-shadow:0 0 6px rgba(255,255,255,.5)}
.mod.add{border-style:dashed;background:transparent;align-items:center;justify-content:center;text-align:center;color:var(--text-faint)}
.mod.add:hover{color:var(--y);border-color:var(--y)}
.mod.add::after{display:none}
.mod.add .plus{font-size:32px;font-weight:300;line-height:1;margin-bottom:8px}
.mod.add small{display:block;color:var(--text-faint);margin-top:4px;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:1.5px}

/* ───── Buttons ───── */
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:6px;font-size:12.5px;font-weight:600;border:1px solid var(--line-2);background:var(--bg-3);color:var(--text);cursor:pointer;transition:all .15s;text-decoration:none;font-family:inherit}
.btn:hover{border-color:var(--y);color:var(--y)}
.btn.primary{background:linear-gradient(180deg,var(--y),var(--y-2));color:#000;border-color:transparent;font-weight:700}
.btn.primary:hover{filter:brightness(1.08)}
.btn.danger{background:var(--bg-3);color:var(--r);border-color:rgba(255,82,82,.5)}
.btn.danger:hover{background:rgba(255,82,82,.1);color:#fff;border-color:var(--r)}
.btn.ghost{background:transparent}

/* ───── Table ───── */
.tbl{width:100%;border-collapse:separate;border-spacing:0;font-family:'JetBrains Mono',monospace;font-size:13px;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.tbl th,.tbl td{padding:10px 14px;text-align:left;border-bottom:1px solid var(--line)}
.tbl thead th{background:var(--bg-3);color:var(--text-dim);font-size:10.5px;letter-spacing:1.6px;text-transform:uppercase;font-weight:700}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl tbody tr:hover{background:var(--bg-2)}
.tbl td .up{color:var(--g);text-shadow:var(--glow-g);font-weight:700}
.tbl td .dn{color:var(--r);text-shadow:var(--glow-r);font-weight:700}
.tbl td .sym{color:var(--y);font-weight:700;text-shadow:var(--glow-y)}

/* ───── Code block ───── */
.code{background:#04080d;border:1px solid var(--line-2);border-radius:10px;padding:16px;font-family:'JetBrains Mono',monospace;font-size:12.5px;line-height:1.7;color:#cfe7ff;overflow:auto;white-space:pre-wrap}
.code .c{color:#7b8b9c}
.code .k{color:var(--y);text-shadow:var(--glow-y)}
.code .s{color:var(--g)}
.code .n{color:#ffd2a8}

/* ───── KV list ───── */
.kv{display:grid;grid-template-columns:160px 1fr;gap:8px 18px;font-size:13.5px}
.kv .k{color:var(--y);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:1.6px;text-transform:uppercase;font-weight:700;text-shadow:0 0 5px rgba(255,255,255,.4)}
.kv .v{color:#e8eef8;font-family:'JetBrains Mono',monospace;font-size:13px}

/* ───── Form fields ───── */
.fset{display:grid;gap:14px}
.fset .field label{display:block;color:var(--y);font-size:10.5px;letter-spacing:1.6px;text-transform:uppercase;margin-bottom:5px;font-family:'JetBrains Mono',monospace;font-weight:700;text-shadow:0 0 5px rgba(255,255,255,.4)}
.fset .field .help{color:var(--text-faint);font-size:11px;margin-top:4px;font-family:'JetBrains Mono',monospace;letter-spacing:.5px}
.fset input[type=text],.fset input[type=number],.fset input[type=url],.fset input[type=password],.fset select,.fset textarea{
  width:100%;background:var(--bg-3);border:1px solid var(--line-2);border-radius:8px;color:#fff;padding:10px 12px;font-size:13.5px;font-family:'JetBrains Mono',monospace;outline:none;transition:border-color .15s;
}
.fset input:focus,.fset select:focus,.fset textarea:focus{border-color:var(--y);box-shadow:0 0 0 2px rgba(255,255,255,.12)}
.fset textarea{resize:vertical;min-height:90px}

/* ───── Switch ───── */
.switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.switch input{display:none}
.switch .track{width:38px;height:22px;background:var(--bg-3);border:1px solid var(--line-2);border-radius:999px;position:relative;transition:all .2s}
.switch .track::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:var(--text-faint);transition:all .2s}
.switch input:checked + .track{background:rgba(255,255,255,.15);border-color:var(--y)}
.switch input:checked + .track::after{left:18px;background:var(--y);box-shadow:0 0 8px var(--y)}

/* ───── Logs viewer ───── */
.log-view{background:#04080d;border:1px solid var(--line-2);border-radius:10px;padding:0;font-family:'JetBrains Mono',monospace;font-size:12.5px;overflow:hidden}
.log-row{display:grid;grid-template-columns:160px 70px 1fr;gap:14px;padding:6px 14px;border-bottom:1px dashed var(--line);align-items:start}
.log-row:last-child{border-bottom:0}
.log-row:hover{background:rgba(255,255,255,.02)}
.log-row .t{color:var(--text-dim)}
.log-row .lv{font-weight:700;letter-spacing:1px}
.log-row .lv.ok,.log-row .lv.info{color:var(--y);text-shadow:var(--glow-y)}
.log-row .lv.warn{color:var(--y-2);text-shadow:var(--glow-y)}
.log-row .lv.err{color:var(--r);text-shadow:var(--glow-r)}
.log-row .msg{color:#cdd6e4}

/* ───── Footer ───── */
.foot{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:space-between;align-items:center;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--text-dim);margin-top:18px;padding-top:14px;border-top:1px solid var(--line);letter-spacing:1.2px}
.foot b{color:var(--y);text-shadow:0 0 5px rgba(255,255,255,.45)}

/* ───── SpaceX 觀察區 ───── */
.sx-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:14px;margin-bottom:18px}
.sx-note{
  background:linear-gradient(180deg,var(--bg-2),var(--bg-1));
  border:1px solid var(--line);border-radius:12px;padding:16px 18px;
  font-size:13px;line-height:1.7;color:var(--text-dim);
}
.sx-note-title{color:var(--y);font-weight:700;font-size:13.5px;margin-bottom:8px;text-shadow:var(--glow-y)}
.sx-note p{margin-bottom:8px}
.sx-note b{color:#fff}
.sx-note ul{padding-left:18px;display:grid;gap:4px}
.sx-banner{
  background:linear-gradient(180deg,var(--bg-2),var(--bg-1));
  border:1px solid var(--line);border-left:3px solid var(--y);
  border-radius:10px;padding:12px 16px;margin-bottom:14px;
  font-size:12.5px;line-height:1.7;color:var(--text-dim);
}
.sx-banner b{color:#fff}
.sx-banner a{color:var(--y)}

.stock-card{
  background:linear-gradient(180deg,var(--bg-2),var(--bg-1));
  border:1px solid var(--line);border-radius:12px;padding:16px 18px;
  display:flex;flex-direction:column;gap:4px;
  transition:transform .25s cubic-bezier(.2,.8,.2,1), border-color .25s;
}
.stock-card:hover{transform:translateY(-2px);border-color:var(--line-2)}
.stock-card .sc-head{display:flex;align-items:center;justify-content:space-between}
.stock-card .sc-sym{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:14px;color:var(--y);letter-spacing:1.5px;text-shadow:var(--glow-y)}
.stock-card .sc-state{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--text-faint);border:1px solid var(--line);padding:2px 8px;border-radius:999px;letter-spacing:1px}
.stock-card .sc-name{font-size:12px;color:var(--text-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stock-card .sc-price{font-family:'JetBrains Mono',monospace;font-size:30px;font-weight:700;margin-top:6px;color:#fff}
.stock-card .sc-price.up{color:var(--g);text-shadow:var(--glow-g)}
.stock-card .sc-price.dn{color:var(--r);text-shadow:var(--glow-r)}
.stock-card .sc-chg{font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:600}
.stock-card .sc-chg.up{color:var(--g)}
.stock-card .sc-chg.dn{color:var(--r)}
.stock-card .sc-range{font-size:11px;color:var(--text-faint);margin-top:auto;padding-top:8px}

/* ───── 資產配置甜甜圈 ───── */
.alloc{display:grid;grid-template-columns:240px 1fr;gap:28px;align-items:center;
  background:var(--bg-1);border:1px solid var(--line);border-radius:12px;padding:24px 26px;margin-bottom:18px}
.alloc-chart{position:relative;width:220px;height:220px;margin:0 auto;cursor:grab;touch-action:none;user-select:none}
.alloc-chart.grabbing{cursor:grabbing}
.alloc-chart .donut{width:100%;height:100%;overflow:visible}
.alloc-chart .donut .seg{transition:none}
.donut-pct{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;paint-order:stroke;stroke:var(--bg-1);stroke-width:2.4px}
.alloc-chart .donut circle{fill:none;stroke-width:24}
.alloc-chart .donut .track{stroke:var(--bg-3)}
.alloc-chart .donut .seg{transition:stroke-dasharray .6s ease, stroke-dashoffset .6s ease;stroke-linecap:butt}
.alloc-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none}
.alloc-center .l{font-size:11px;color:var(--text-faint);letter-spacing:1.5px}
.alloc-center .v{font-size:25px;font-weight:700;font-family:'JetBrains Mono',monospace;margin-top:2px}
.alloc-list{display:flex;flex-direction:column}
.alloc-row{display:grid;grid-template-columns:34px 1fr auto 54px;align-items:center;gap:13px;
  padding:11px 6px;border-bottom:1px solid var(--line)}
.alloc-row:last-child{border-bottom:none}
.alloc-row .ico{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  font-family:'JetBrains Mono',monospace;font-size:14px;font-weight:700;color:#06090f}
.alloc-row .nm{display:flex;flex-direction:column;gap:1px;min-width:0}
.alloc-row .nm b{font-size:14px}
.alloc-row .nm small{font-size:11px;color:var(--text-faint);display:flex;align-items:center;gap:7px}
.alloc-row .amt{font-family:'JetBrains Mono',monospace;font-size:14px;font-weight:600}
.alloc-row .pct{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--text-faint);text-align:right}
.alloc-row.total{border-top:1px solid var(--line-2);border-bottom:none;margin-top:5px;padding-top:13px}
.alloc-row.total .amt,.alloc-row.total .pct{color:var(--text)}
.alloc-set{background:none;border:1px dashed var(--line-2);color:var(--text-faint);
  border-radius:5px;font-size:10.5px;padding:2px 7px;cursor:pointer;font-family:inherit}
.alloc-set:hover{color:var(--text);border-color:var(--text-faint)}

/* ───── 質押 / Earn 活動 ───── */
.staking{background:var(--bg-1);border:1px solid var(--line);border-radius:12px;padding:8px 10px 10px;margin-bottom:18px}
.stk-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:8px 10px 10px;font-size:12px;color:var(--text-dim);border-bottom:1px solid var(--line);margin-bottom:4px}
.stk-bar b{font-weight:700}
.stk-links{display:flex;gap:12px;flex-shrink:0}
.stk-links a{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--text-faint);text-decoration:none}
.stk-links a:hover{color:var(--y);text-shadow:var(--glow-y)}
.stk-list{display:flex;flex-direction:column}
.stk-row{display:grid;grid-template-columns:78px 1fr auto auto;align-items:center;gap:12px;
  padding:11px 10px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--text-dim);
  transition:background .18s, color .18s}
.stk-row:last-child{border-bottom:none}
.stk-row:hover{background:var(--bg-2);color:var(--text)}
.stk-ex{font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:700;letter-spacing:.5px;
  text-align:center;color:var(--exc);border:1px solid var(--exc);border-radius:4px;padding:3px 0;
  opacity:.92;white-space:nowrap}
.stk-title{font-size:13px;line-height:1.45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stk-row:hover .stk-title{white-space:normal}
.stk-new{font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:700;letter-spacing:1px;
  color:#06090f;background:var(--y);border-radius:3px;padding:2px 5px;box-shadow:var(--glow-y)}
.stk-time{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--text-faint);white-space:nowrap}
.stk-row.is-new{background:linear-gradient(90deg,rgba(57,255,20,.06),transparent)}
.stk-row.is-new .stk-title{color:var(--text);font-weight:600}
.stk-empty{padding:22px 10px;text-align:center;font-size:12.5px;color:var(--text-faint)}

/* ───── Responsive ───── */
@media (max-width: 1280px){
  .pos-row{grid-template-columns: 95px 95px 105px 105px 95px 105px 1fr 95px 32px;font-size:12px}
  .pos-row.head{font-size:9.5px}
}
@media (max-width: 1100px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .sx-grid{grid-template-columns:1fr 1fr}
  .sx-note{grid-column:1/-1}
  .pos-sum{grid-template-columns:repeat(2,1fr)}
  .pos-form{grid-template-columns:1fr 1fr}
  .pos-form .add-btn{grid-column:1/-1}
  .pos-row{grid-template-columns:1fr 1fr;gap:6px}
  .pos-row.head{display:none}
  .pos-row .bar{grid-column:1/-1}
}
@media (max-width: 760px){
  .shell{grid-template-columns:1fr}
  .grid,.kpis,.sx-grid{grid-template-columns:1fr}
  .alloc{grid-template-columns:1fr;gap:18px}
  .search{display:none}

  /* topbar 手機精簡：原本子項（logo＋兩個狀態膠囊＋完整時鐘）最小寬度加總會撐爆螢幕，
     造成整頁可水平捲動、左緣（含漢堡鈕、卡片邊、標題首字）被切到畫面外。 */
  .topbar{ gap:10px; padding-left:calc(12px + var(--safe-left)); padding-right:calc(12px + var(--safe-right)); }
  .topbar .status-pill.mono{ display:none; }   /* 版本號 v0.4.0 · main 手機收起 */
  .topbar #sys-status{ min-width:0; }          /* 連線狀態允許壓縮，不硬撐 */
  .topbar #sys-status #sys-status-txt{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
  .clock{ font-size:11px; padding-left:10px; border-left:none }
  .clock #date{ display:none }                 /* 只留時間，日期收起 */
  .brand .name b{ white-space:nowrap }

  /* 手機顯示漢堡按鈕 */
  .nav-toggle{display:inline-flex}

  /* 側欄改為可滑入的抽屜（取代原本 display:none），點漢堡開、點連結或遮罩關 */
  .sidebar{
    display:block !important;
    position:fixed; top:calc(var(--topbar-h) + var(--safe-top)); left:0; bottom:0; width:248px; max-width:82vw; z-index:60;
    transform:translateX(-100%); transition:transform .25s ease;
    overflow-y:auto; box-shadow:2px 0 18px rgba(0,0,0,.5);
    padding-left:var(--safe-left); padding-bottom:var(--safe-bottom);
  }
  body.nav-open .sidebar{ transform:translateX(0) }
  /* 半透明遮罩 */
  body.nav-open::after{
    content:""; position:fixed; inset:calc(var(--topbar-h) + var(--safe-top)) 0 0 0; background:rgba(0,0,0,.5); z-index:55;
  }
  /* scroll-page 下側欄原本 sticky，手機抽屜需固定定位覆蓋 */
  body.scroll-page .sidebar{ position:fixed; height:auto; align-self:auto; top:calc(var(--topbar-h) + var(--safe-top)) }
}

/* ───── 即時行情（markets）行動版：寬表格 → TradingView 風格卡片 ─────
   觸發：手機／小視窗（≤900px），或任何「觸控且無滑鼠」裝置（iPhone / iPad，
   涵蓋 iPad 直向 1024px 與橫向 1024～1366px）。桌機（有滑鼠 hover）即使視窗較窄
   仍維持原本表格。先前只用 ≤900px → iPad 超過斷點仍是 7 欄寬表格，後面欄位被
   overflow-x 截掉看不到，這裡一併修正。
   佈局（仿 TradingView 行情列表，每列一張卡）：
     · 第一行：代號（左）＋ 最新價（右、大白字）
     · 第二行：漲跌 %（右側紅綠膠囊）＋ 底線分隔
     · 其後：名稱／24h 高低／成交量／狀態 逐行（左標籤、右值）
     · 末行：交易所連結滿版按鈕
   刻意用 flex order + flex-basis 排版（非 Grid 自動定位，避開 iOS Safari 易讓
   欄位重疊／消失的問題），保證每一格都看得到。只作用於 markets 頁。 */
@media (max-width: 900px), (hover: none) and (pointer: coarse) and (max-width: 1400px){
  body[data-page="markets"] .panel{overflow-x:visible;-webkit-overflow-scrolling:auto}
  body[data-page="markets"] .tbl{display:block;border:0;background:transparent}
  body[data-page="markets"] .tbl thead{display:none}
  body[data-page="markets"] .tbl tbody{display:block}

  /* 每列 = 一張卡，內部 flex 換行排版 */
  body[data-page="markets"] .tbl tr{
    display:flex;flex-wrap:wrap;align-items:baseline;
    padding:13px 15px;margin:0 0 10px;
    background:var(--bg-1);border:1px solid var(--line);border-radius:12px;
  }
  body[data-page="markets"] .tbl tbody tr:hover{background:var(--bg-1)}

  /* 預設：帶 data-th 的明細格，獨佔一行（左標籤、右值） */
  body[data-page="markets"] .tbl td{
    order:5;flex:0 0 100%;display:flex;justify-content:space-between;align-items:baseline;gap:14px;
    border:0;padding:4px 0;text-align:right !important;font-size:13px;color:var(--text-dim);
  }
  body[data-page="markets"] .tbl td[data-th]::before{
    content:attr(data-th);color:var(--text-faint);font-weight:600;font-size:12px;
    text-align:left;white-space:nowrap;
  }

  /* 第一行左：代號（大字、置左、不獨佔整行） */
  body[data-page="markets"] .tbl td.c-sym{
    order:1;flex:1 1 auto;justify-content:flex-start;gap:6px;align-items:baseline;
    font-size:17px;font-weight:700;padding:0 0 2px;
  }
  body[data-page="markets"] .tbl td.c-sym .sym{font-size:17px}

  /* 第一行右：最新價（大白字，推到最右、與代號同一行） */
  body[data-page="markets"] .tbl td.c-price{
    order:2;flex:0 0 auto;margin-left:auto;justify-content:flex-end;
    font-size:19px;font-weight:700;color:#fff;font-family:'JetBrains Mono',monospace;
  }
  body[data-page="markets"] .tbl td.c-price::before{content:none}

  /* 第二行：漲跌 % 紅綠膠囊，靠右，底線分隔 */
  body[data-page="markets"] .tbl td.c-chg{
    order:3;flex:0 0 100%;justify-content:flex-end;
    padding:2px 0 9px;margin-bottom:7px;border-bottom:1px solid var(--line);
  }
  body[data-page="markets"] .tbl td.c-chg::before{content:none}
  body[data-page="markets"] .tbl td.c-chg .up,
  body[data-page="markets"] .tbl td.c-chg .dn{
    display:inline-block;padding:3px 11px;border-radius:7px;font-weight:700;font-size:14px;
  }
  body[data-page="markets"] .tbl td.c-chg .up{background:rgba(57,255,20,.15)}
  body[data-page="markets"] .tbl td.c-chg .dn{background:rgba(255,77,79,.16)}

  /* 美股名稱：排在明細最前，手機完整顯示（覆蓋桌機截斷的 inline style） */
  body[data-page="markets"] #st-table td.c-name{
    order:4;color:var(--text-dim);
    max-width:none !important;white-space:normal !important;overflow:visible !important;
  }
  body[data-page="markets"] #st-table td.c-name::before{
    content:"名稱";color:var(--text-faint);font-weight:600;font-size:12px;white-space:nowrap;
  }

  /* 交易所連結：末行滿版按鈕 */
  body[data-page="markets"] .tbl td.c-act{
    order:9;display:block;flex:0 0 100%;padding:0;margin-top:11px;
  }
  body[data-page="markets"] .tbl td.c-act .btn{display:block;width:100%;text-align:center;padding:11px}
}

/* ════════════════════════════════════════════════════════════════
   翻滾貓咪 · rolling cat（layout.js 全頁注入的小夥伴）
   一隻橘貓蜷成毛球，沿著畫面底部一邊奔跑一邊翻滾
   ════════════════════════════════════════════════════════════════ */
.rolling-cat{
  position:fixed;left:0;bottom:calc(10px + var(--safe-bottom));width:100%;height:74px;
  pointer-events:none;z-index:45;overflow:hidden;
}
.rc-runner{
  position:absolute;bottom:8px;left:0;width:60px;height:60px;
  animation:rc-run 15s linear infinite;
}
@keyframes rc-run{
  from{transform:translateX(-100px)}
  to{transform:translateX(calc(100vw + 40px))}
}
/* 貼地的影子（不旋轉，隨步伐微微縮放） */
.rc-shadow{
  position:absolute;left:50%;bottom:-5px;width:46px;height:10px;
  transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(0,0,0,.5),transparent 70%);
  animation:rc-shadow .65s ease-in-out infinite;
}
@keyframes rc-shadow{50%{width:36px;opacity:.65}}
/* 整隻貓不停翻滾 */
.rc-cat{
  position:absolute;inset:0;width:58px;height:58px;
  transform-origin:50% 50%;
  animation:rc-roll 1.3s linear infinite;
}
@keyframes rc-roll{to{transform:rotate(360deg)}}

/* 身體：橘色毛球 */
.rc-body{
  position:absolute;inset:0;border-radius:50%;overflow:hidden;z-index:2;
  background:radial-gradient(circle at 36% 30%,#ffce82,#ff9f43 52%,#ef8521 100%);
  border:2px solid #d9741a;
  box-shadow:inset -5px -6px 10px rgba(170,80,10,.5),
             inset 3px 3px 7px rgba(255,225,170,.45),
             0 3px 8px rgba(0,0,0,.3);
}
.rc-stripe{position:absolute;background:#e07c1e;border-radius:40%;opacity:.85}
.rc-stripe.s1{width:34px;height:7px;top:12px;left:13px;transform:rotate(-12deg)}
.rc-stripe.s2{width:30px;height:7px;top:24px;left:16px;transform:rotate(-10deg)}
.rc-stripe.s3{width:22px;height:6px;top:36px;left:20px;transform:rotate(-8deg)}

/* 耳朵 */
.rc-ear{position:absolute;top:-3px;width:0;height:0;z-index:3;
  border-left:9px solid transparent;border-right:9px solid transparent;
  border-bottom:15px solid #ff9f43}
.rc-ear::after{content:"";position:absolute;left:-4px;top:6px;
  border-left:4px solid transparent;border-right:4px solid transparent;
  border-bottom:7px solid #ff8aa3}
.rc-ear.l{left:9px;transform:rotate(-20deg)}
.rc-ear.r{right:9px;transform:rotate(20deg)}

/* 臉 */
.rc-face{position:absolute;inset:0;z-index:4}
.rc-eye{position:absolute;top:24px;width:8px;height:11px;border-radius:50%;
  background:#3a260f}
.rc-eye::after{content:"";position:absolute;top:1px;left:1.5px;width:3px;height:3px;
  border-radius:50%;background:#fff}
.rc-eye.l{left:16px}
.rc-eye.r{right:16px}
.rc-nose{position:absolute;top:33px;left:50%;width:6px;height:4px;
  transform:translateX(-50%);border-radius:0 0 50% 50%;background:#ff6f8d}
.rc-blush{position:absolute;top:31px;width:7px;height:4px;border-radius:50%;
  background:#ff8f6b;opacity:.55}
.rc-blush.l{left:9px}
.rc-blush.r{right:9px}

/* 尾巴 */
.rc-tail{position:absolute;right:-11px;top:27px;width:24px;height:9px;z-index:1;
  border-radius:6px;transform:rotate(-22deg);
  background:linear-gradient(90deg,#ff9f43,#ef8521 65%,#d9741a)}

/* 尊重使用者「減少動態」偏好：停在右下角不滾動 */
@media (prefers-reduced-motion: reduce){
  .rc-runner,.rc-cat,.rc-shadow{animation:none}
  .rolling-cat{left:auto;right:20px;width:90px}
}