/* 南瓜GEO · Ember 后台整站样式（app/ 下所有页共用）
   奶油 #F9F7F2 底 · 墨绿 #213934 字 · 橙 #FD6F1D 唯一强调(≤10%) · 衬线大数字 · 商用级对比 */
:root{
  --o:#FD6F1D; --o2:#BD4A00; --ink:#213934; --cream:#F9F7F2; --band:#F1EEE7;
  --line:rgba(33,57,52,.10); --mut:rgba(33,57,52,.6); --mut2:rgba(33,57,52,.45);
  --card:#fefcf9;
}
*{ box-sizing:border-box; }
html,body{ margin:0; }
body{ color:var(--ink); background:var(--cream);
  font-family:"Inter","PingFang SC","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased; }
a{ color:inherit; text-decoration:none; }
code{ font-family:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace; background:var(--band); padding:2px 7px; border-radius:6px; font-size:12.5px; }

/* ===== shell ===== */
.app{ display:grid; grid-template-columns:252px 1fr; min-height:100vh; }
.side{ background:#fff; border-right:1px solid var(--line); padding:18px 14px; display:flex; flex-direction:column; gap:2px; overflow-y:auto; height:100vh; position:sticky; top:0; }
.side .brand{ display:block; padding:4px 8px 14px; }
.side .brand .logo{ height:26px; width:auto; display:block; }
.tenant{ display:flex; align-items:center; gap:10px; padding:10px 8px; margin-bottom:6px; border-bottom:1px solid var(--line); }
.tenant .ava{ width:34px;height:34px;border-radius:50%; background:linear-gradient(135deg,#fdc9a3,#fde9d8); display:grid;place-items:center; font-weight:800; color:var(--o2); font-size:14px; }
.tenant b{ font-size:14px; display:block; line-height:1.2; }
.tenant small{ font-size:11.5px; color:var(--mut); }
.grp{ display:flex; align-items:center; gap:8px; font-size:12px; font-weight:800; letter-spacing:.02em; color:var(--ink); padding:14px 10px 5px; }
.grp .gi{ color:var(--o); font-size:13px; width:16px; text-align:center; }
.navg{ list-style:none; margin:0 0 2px; padding:0; border-left:1px solid var(--line); margin-left:15px; }
.nav{ display:flex; align-items:center; gap:8px; padding:7px 10px 7px 12px; border-radius:9px; font-size:13px; color:rgba(33,57,52,.78); cursor:pointer; }
.nav:hover{ background:rgba(33,57,52,.05); color:var(--ink); }
.nav.on{ background:rgba(253,111,29,.10); color:var(--o2); font-weight:700; box-shadow:inset 2px 0 0 0 var(--o); }
.nav .t{ flex:1; }
.bdg{ font-size:10px; font-weight:700; padding:1px 6px; border-radius:999px; background:rgba(245,158,11,.18); color:#9a5a00; white-space:nowrap; }

/* ===== topbar / page head ===== */
.main{ padding:24px 30px 80px; max-width:1200px; }
.bar{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:18px; }
.bar h1{ font-size:clamp(24px,2.6vw,32px); font-weight:820; letter-spacing:-.03em; margin:0; }
.bar .sub{ color:var(--mut); font-size:13.5px; margin-top:4px; max-width:680px; line-height:1.5; }
.bar .sub .o,.o{ color:var(--o2); }
.tools{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.chip{ display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--line); border-radius:999px; padding:8px 14px; font-weight:650; font-size:13.5px; }
.chip .dot{ width:8px;height:8px;border-radius:50%; background:var(--o); }
.seg{ display:inline-flex; background:var(--band); border-radius:999px; padding:3px; }
.seg button{ border:0; background:transparent; padding:7px 13px; border-radius:999px; font-size:13px; color:var(--mut); cursor:pointer; font-weight:600; }
.seg button.on{ background:#fff; color:var(--ink); box-shadow:0 1px 4px rgba(16,24,40,.08); }
/* 金盏花橙 · 悬浮凹凸感主按钮(参考 fulingchen.me:顶内高光+底内阴影+彩色浮影+按压回弹) */
.cta{ background:linear-gradient(180deg,#FFB23E 0%,#FD922A 48%,#F4760E 100%); color:#fff; border:0; border-radius:14px; padding:11px 20px; font-weight:700; font-size:14px; cursor:pointer; display:inline-block; text-shadow:0 1px 1px rgba(150,55,0,.28);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.62), inset 0 -3px 5px rgba(176,71,10,.38), 0 8px 18px rgba(253,111,29,.34), 0 2px 5px rgba(176,71,10,.26);
  transition:transform .12s ease, box-shadow .12s ease; }
.cta:hover{ transform:translateY(-1.5px); box-shadow:inset 0 1.5px 0 rgba(255,255,255,.68), inset 0 -3px 5px rgba(176,71,10,.38), 0 13px 26px rgba(253,111,29,.42), 0 3px 7px rgba(176,71,10,.3); }
.cta:active{ transform:translateY(1px); box-shadow:inset 0 2px 6px rgba(140,55,0,.45), inset 0 1px 0 rgba(255,255,255,.3), 0 3px 8px rgba(253,111,29,.22); }
.ghost{ background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:11px; padding:9px 16px; font-weight:650; font-size:14px; cursor:pointer; }

/* ===== ask bar ===== */
.ask{ display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:14px 16px; margin-bottom:18px; }
.ask .spark{ color:var(--o); font-size:18px; }
.ask input{ border:0; outline:0; flex:1; font-size:15px; color:var(--ink); background:transparent; }
.ask .go{ background:linear-gradient(180deg,#FFB23E 0%,#FD922A 48%,#F4760E 100%); color:#fff; border:0; border-radius:12px; padding:9px 17px; font-weight:700; cursor:pointer; text-shadow:0 1px 1px rgba(150,55,0,.28);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.62), inset 0 -3px 5px rgba(176,71,10,.38), 0 7px 16px rgba(253,111,29,.32), 0 2px 4px rgba(176,71,10,.26);
  transition:transform .12s ease, box-shadow .12s ease; }
.ask .go:hover{ transform:translateY(-1.5px); box-shadow:inset 0 1.5px 0 rgba(255,255,255,.68), inset 0 -3px 5px rgba(176,71,10,.38), 0 11px 22px rgba(253,111,29,.4), 0 3px 6px rgba(176,71,10,.3); }
.ask .go:active{ transform:translateY(1px); box-shadow:inset 0 2px 6px rgba(140,55,0,.45), inset 0 1px 0 rgba(255,255,255,.3), 0 3px 7px rgba(253,111,29,.22); }

/* ===== grid / cards / kpi ===== */
.row{ display:grid; gap:14px; margin-bottom:14px; }
.r2{ grid-template-columns:1.6fr 1fr; } .r3{ grid-template-columns:repeat(3,1fr); } .r4{ grid-template-columns:repeat(4,1fr); }
.card{ background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px 20px; }
.card h3{ margin:0 0 2px; font-size:15px; }
.card .hint{ font-size:12px; color:var(--mut); margin-bottom:12px; }
.kpi{ background:var(--cream); border:1px solid rgba(33,57,52,.08); border-radius:18px; padding:18px; }
.kpi .lab{ font-size:11.5px; letter-spacing:.06em; color:var(--mut); font-weight:700; }
.kpi .num{ font-family:"JetBrains Mono",ui-monospace,monospace; font-weight:600; font-size:38px; line-height:1.06; letter-spacing:-.02em; font-variant-numeric:tabular-nums; margin-top:6px; }
.kpi .num .of{ font-size:20px; color:var(--mut2); }
.kpi .delta{ font-size:13px; font-weight:700; margin-top:4px; font-variant-numeric:tabular-nums; }
.kpi .delta.up{ color:var(--o2); } .kpi .delta.flat{ color:var(--mut2); }

/* ===== chart ===== */
.chart-wrap{ position:relative; }
.chart-wrap svg{ width:100%; height:200px; display:block; }
.cglow{ position:absolute; right:6%; top:-6%; width:44%; height:70%; background:radial-gradient(closest-side,rgba(253,111,29,.14),transparent 75%); filter:blur(4px); pointer-events:none; }

/* ===== bars ===== */
.brow{ display:grid; grid-template-columns:84px 1fr 44px; align-items:center; gap:10px; margin:11px 0; font-size:13px; }
.track{ height:8px; background:var(--band); border-radius:999px; overflow:hidden; }
.fill{ height:100%; border-radius:999px; background:linear-gradient(90deg,#fd6f1d,#fb8b3a); }
.brow.muted .fill{ background:rgba(33,57,52,.26); }
.brow .v{ text-align:right; font-variant-numeric:tabular-nums; color:rgba(33,57,52,.72); }

/* ===== table ===== */
.tbl{ width:100%; border-collapse:collapse; font-size:13.5px; }
.tbl th{ text-align:left; font-size:11px; letter-spacing:.04em; color:var(--mut); font-weight:700; padding:8px 10px; border-bottom:1px solid var(--line); }
.tbl th.n,.tbl td.n{ text-align:right; }
.tbl td{ padding:11px 10px; border-bottom:1px solid rgba(33,57,52,.06); font-variant-numeric:tabular-nums; }
.tbl tr:hover td{ background:rgba(253,111,29,.04); }
.win{ color:var(--o2); font-weight:700; }

/* ===== pills / chips ===== */
.pill{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:650; padding:3px 9px; border-radius:999px; }
.pill.good{ background:rgba(253,111,29,.10); color:var(--o2); }
.pill.neu{ background:var(--band); color:var(--mut); }
.pill.bad{ background:rgba(33,57,52,.06); color:var(--mut2); }
.act{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.chip-act{ border:1px solid rgba(253,111,29,.3); background:rgba(253,111,29,.06); color:var(--o2); border-radius:999px; padding:7px 13px; font-size:13px; font-weight:650; cursor:pointer; }
.chip-act:hover{ background:rgba(253,111,29,.12); }
.chip-act.sel{ border-width:1.5px; border-color:var(--o); background:rgba(253,111,29,.13); color:var(--ink); font-weight:700; }

/* ===== score ring ===== */
.score{ display:flex; align-items:center; gap:18px; margin-top:6px; }
.ring{ --p:0; width:104px;height:104px;border-radius:50%; background:conic-gradient(var(--o) calc(var(--p)*1%), var(--band) 0); display:grid;place-items:center; flex-shrink:0; }
.ring i{ width:78px;height:78px;border-radius:50%; background:#fff; display:grid;place-items:center; font-family:"JetBrains Mono",ui-monospace,monospace; font-size:28px; font-weight:600; font-variant-numeric:tabular-nums; }
.score-t{ font-weight:800; font-size:18px; }
.score-n{ color:var(--mut); font-size:13.5px; margin-top:6px; line-height:1.6; }

/* ===== feature cards grid ===== */
.cards{ display:grid; gap:12px; }
.cards.c2{ grid-template-columns:repeat(2,1fr); } .cards.c3{ grid-template-columns:repeat(3,1fr); } .cards.c4{ grid-template-columns:repeat(4,1fr); }
.fcard{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px; }
.fcard .ficon{ font-size:22px; }
.fcard b{ display:block; margin:8px 0 4px; font-size:14px; }
.fcard p{ margin:0; font-size:12.5px; color:var(--mut); line-height:1.55; }

/* ===== AI proposal (brand-asset) ===== */
.propose{ background:linear-gradient(135deg,#fff4ea,#fbf5ee); border:1px solid rgba(253,111,29,.22); margin-bottom:14px; }
.prow{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.pmain{ flex:1; min-width:280px; }
.quote{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 16px; font-size:15px; line-height:1.6; margin-top:8px; }
.pbtns{ display:flex; flex-direction:column; gap:8px; min-width:124px; }
.pbtns .cta{ text-align:center; }

/* ===== 12-dim grid ===== */
.dims{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.dim{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:14px 16px; position:relative; }
.dim.propose{ background:linear-gradient(135deg,#fff4ea,#fbf5ee); }
.dim .dt{ font-weight:700; font-size:14px; padding-right:52px; }
.dim .ds{ font-size:12.5px; color:var(--mut); margin-top:4px; line-height:1.5; }
.dim .tick{ position:absolute; top:14px; right:14px; font-size:11.5px; font-weight:700; }
.dim .tick.ok{ color:var(--o2); } .dim .tick.no{ color:var(--mut); }

/* ===== coming soon ===== */
.soon{ background:linear-gradient(135deg,#fff4ea,#fdfaf4); border:1px solid rgba(253,111,29,.2); border-radius:18px; padding:30px 28px; margin-bottom:14px; }
.soon-badge{ display:inline-block; background:rgba(245,158,11,.18); color:#9a5a00; font-weight:800; font-size:13px; padding:5px 12px; border-radius:999px; }
.soon h2{ font-size:22px; margin:14px 0 12px; letter-spacing:-.02em; }
.soon ul{ margin:0; padding-left:18px; color:var(--mut); line-height:1.9; font-size:14px; }

/* ===== editor / gen / canvas / states ===== */
.editor{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 16px; font-size:14px; line-height:1.6; color:var(--ink); min-height:120px; }
.editor.good{ border-color:rgba(253,111,29,.3); }
.gen{ background:linear-gradient(135deg,#fff7f0,#fdf9f3); border:1px solid rgba(253,111,29,.25); margin-bottom:14px; }
.picks{ display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; }
.okstate{ text-align:center; padding:24px 0; }
.okbig{ font-size:26px; font-weight:800; color:var(--o2); }
.canvas{ display:flex; flex-direction:column; align-items:center; gap:18px; padding:24px 0; }
.cnode{ background:var(--o); color:#fff; font-weight:800; padding:12px 24px; border-radius:14px; font-size:18px; box-shadow:0 12px 26px rgba(253,111,29,.28); }
.cmid{ color:var(--mut); font-size:13px; }
.cengines{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.ceng{ border:1px dashed var(--line); border-radius:999px; padding:8px 16px; font-size:13px; color:var(--mut); }
.ceng.lit{ border-style:solid; border-color:rgba(253,111,29,.4); background:rgba(253,111,29,.07); color:var(--o2); font-weight:700; }

@media(max-width:1080px){ .app{ grid-template-columns:1fr; } .side{ display:none; } .r2,.r3,.r4{ grid-template-columns:1fr; } .cards.c4{ grid-template-columns:repeat(2,1fr); } }