/* ================= SlideForge · 企业级编辑台 ================= */
:root{
  --bg:#EDF1F6;
  --bg-2:#F6F8FB;
  --surface:#FFFFFF;
  --surface-2:#F7F9FC;
  --ink:#0F1B2D;
  --ink-2:#3A4A60;
  --mut:#71808F;
  --line:#DCE3EC;
  --line-2:#E9EEF4;
  --accent:#1D4ED8;
  --accent-2:#3B82F6;
  --accent-soft:#E8EFFB;
  --ok:#0F766E;
  --err:#DC2626;
  --sans:"Inter","PingFang SC","Microsoft YaHei","Hiragino Sans GB",system-ui,-apple-system,sans-serif;
  --mono:"SFMono-Regular","JetBrains Mono",Consolas,"Liberation Mono",monospace;
  --r:8px;
  --r-lg:14px;
  --sh:0 1px 2px rgba(15,27,45,.05),0 10px 26px rgba(15,27,45,.07);
  --sh-2:0 2px 6px rgba(15,27,45,.08),0 20px 50px rgba(15,27,45,.13);
  --sh-3:0 30px 80px rgba(15,27,45,.22);
  --grad:linear-gradient(135deg,#2E6BF0 0%,#1D4ED8 55%,#1741B6 100%);
  --grad-soft:linear-gradient(180deg,#EFF3F9 0%,#E7EDF6 100%);
}

*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;background:var(--grad-soft) fixed;color:var(--ink);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;overflow:hidden;
}
::selection{background:rgba(29,78,216,.16);}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px;}
button{font-family:inherit;}
[hidden]{display:none !important;}

/* ---------- 顶栏 ---------- */
.bar{
  height:58px;display:flex;align-items:center;justify-content:space-between;
  padding:0 26px;border-bottom:1px solid var(--line);position:relative;z-index:20;
  background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(10px);
  box-shadow:0 1px 0 rgba(15,27,45,.03),0 6px 20px rgba(15,27,45,.045);
}
.brand{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.16em;font-weight:700;color:var(--ink);}
.brand .mark{width:9px;height:9px;border-radius:2px;background:var(--grad);display:block;box-shadow:0 0 0 4px var(--accent-soft),0 2px 6px rgba(29,78,216,.35);}
.bar-right{display:flex;align-items:center;gap:16px;}
.iconbtn{
  width:30px;height:30px;border:1px solid var(--line);background:var(--surface);color:var(--ink-2);
  cursor:pointer;display:grid;place-items:center;border-radius:var(--r);line-height:1;font-size:16px;
  transition:.16s;
}
.iconbtn:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}

/* ---------- 通用控件 ---------- */
.btn{
  height:38px;padding:0 18px;border:1px solid var(--line);background:var(--surface);color:var(--ink);
  font-size:13px;font-weight:600;letter-spacing:.01em;border-radius:var(--r);cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;transition:.16s;white-space:nowrap;
}
.btn:hover{border-color:#B9C6D8;background:var(--surface-2);}
.btn.solid{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 1px 2px rgba(29,78,216,.30),0 8px 20px rgba(29,78,216,.25);}
.btn.solid:hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:0 2px 4px rgba(29,78,216,.34),0 12px 26px rgba(29,78,216,.30);}
.btn.solid:active{transform:translateY(0);filter:brightness(.97);}
.btn:disabled{opacity:.45;cursor:not-allowed;}
.btn .arr{font-size:14px;transition:transform .2s;}
.btn:hover .arr{transform:translateX(3px);}
.btn.sm{height:32px;padding:0 13px;font-size:12px;}
.link{
  background:none;border:none;padding:0;color:var(--ink-2);font-size:12.5px;cursor:pointer;
  border-bottom:1px solid transparent;line-height:1.6;transition:.16s;
}
.link:hover{color:var(--accent);border-bottom-color:var(--accent);}

/* ---------- 屏幕 ---------- */
.screen{height:calc(100vh - 58px);}

/* ================= 01 起点 ================= */
#screen-brief{display:flex;justify-content:center;overflow-y:auto;}
.brief{width:min(760px,calc(100% - 64px));padding:8vh 0 90px;position:relative;}
.brief::before{
  content:"";position:absolute;right:-180px;top:-140px;width:540px;height:540px;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(29,78,216,.10),rgba(29,78,216,0) 68%);
}
.eyebrow{font-size:11px;letter-spacing:.18em;color:var(--mut);text-transform:uppercase;font-weight:600;}
.eyebrow span{color:var(--accent);margin-right:6px;}
.display{
  font-size:clamp(34px,4.4vw,50px);line-height:1.16;letter-spacing:-.025em;
  margin:18px 0 20px;font-weight:800;color:var(--ink);
}
.lede{font-size:14.5px;line-height:1.95;color:var(--ink-2);max-width:600px;margin:0;}
.composer{
  margin-top:34px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);
  box-shadow:var(--sh);overflow:hidden;transition:border-color .2s,box-shadow .25s,transform .25s;
}
.composer:hover{box-shadow:var(--sh-2);transform:translateY(-1px);}
.composer:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px rgba(29,78,216,.10),var(--sh-2);transform:translateY(-1px);}
.composer textarea{
  width:100%;border:none;outline:none;background:transparent;resize:none;
  padding:22px 24px;font-family:inherit;font-size:15.5px;line-height:1.8;color:var(--ink);min-height:112px;
}
.composer textarea::placeholder{color:#A3AEBE;}
.composer-foot{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 14px;border-top:1px solid var(--line-2);background:var(--surface-2);
}
.examples{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:16px;}
.examples-label{font-size:11px;color:var(--mut);letter-spacing:.04em;font-weight:600;}
.chip{
  border:1px solid var(--line);background:var(--surface);color:var(--ink-2);
  padding:6px 12px;font-size:11.5px;border-radius:999px;cursor:pointer;transition:.16s;
}
.chip:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);transform:translateY(-1px);}
.notes{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:52px;}
.notes>div{
  border:1px solid var(--line);border-radius:var(--r);background:var(--surface);
  padding:16px 16px 15px;box-shadow:var(--sh);transition:.2s;
}
.notes>div:hover{transform:translateY(-2px);box-shadow:var(--sh-2);border-color:#CBD7E8;}
.notes b{display:block;font-size:13px;font-weight:700;margin-bottom:7px;}
.notes b::before{content:"";display:inline-block;width:6px;height:6px;border-radius:2px;background:var(--grad);margin-right:8px;vertical-align:1px;}
.notes span{font-size:11.5px;line-height:1.8;color:var(--mut);}

/* ================= 02 策划案 ================= */
.subbar{
  height:54px;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:0 30px;border-bottom:1px solid var(--line);background:var(--surface);
}
.subbar-right{display:flex;align-items:center;gap:10px;}
.cost{font-size:11px;color:var(--mut);letter-spacing:.03em;margin-right:6px;font-weight:600;}

.plan-body{display:grid;grid-template-columns:380px minmax(0,1fr);height:calc(100vh - 112px);}
.plan-aside{
  border-right:1px solid var(--line);background:var(--surface-2);
  padding:28px 26px 44px;overflow-y:auto;
}
.pblock+.pblock{margin-top:26px;padding-top:22px;border-top:1px solid var(--line);}
.plabel{font-size:10px;letter-spacing:.16em;color:var(--mut);margin-bottom:12px;text-transform:uppercase;font-weight:700;}
.understanding{font-size:14px;line-height:1.95;margin:0;color:var(--ink);}
.promise{margin:12px 0 0;font-size:12.5px;line-height:1.85;color:var(--accent);font-weight:600;}
.styles{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.style-item{
  display:flex;align-items:center;gap:9px;padding:9px 10px;border:1px solid var(--line);
  background:var(--surface);cursor:pointer;font-size:12.5px;color:var(--ink-2);border-radius:var(--r);transition:.16s;
}
.style-item i{width:13px;height:13px;display:block;flex:none;border-radius:3px;}
.style-item.active{border-color:var(--accent);color:var(--accent);font-weight:700;background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent) inset;}
.style-item:hover{border-color:#B9C6D8;}
.artdir{font-size:11px;line-height:1.9;color:var(--mut);margin:12px 0 0;}
.meta{display:grid;gap:9px;font-size:12.5px;}
.meta .row{display:flex;justify-content:space-between;border-bottom:1px dotted var(--line);padding-bottom:7px;}
.meta .row b{font-weight:700;}

.plan-main{overflow-y:auto;padding:34px 44px 110px;}
.deck-title h2{
  font-size:34px;line-height:1.3;font-weight:800;margin:0 0 10px;outline:none;letter-spacing:-.02em;
  border-radius:var(--r);padding:2px 4px;
}
.deck-title h2:focus{background:#fff;box-shadow:0 0 0 3px var(--accent-soft);}
.deck-title p{font-size:14px;color:var(--ink-2);margin:0;outline:none;line-height:1.8;border-radius:var(--r);padding:2px 4px;}
.deck-title p:focus{background:#fff;box-shadow:0 0 0 3px var(--accent-soft);}

.page-row{
  display:grid;grid-template-columns:104px minmax(0,1fr);gap:22px;
  padding:24px 0;border-bottom:1px solid var(--line-2);position:relative;
}
.page-row:first-child{border-top:1px solid var(--line);margin-top:26px;}
.layout-tag{
  font-size:10px;letter-spacing:.06em;color:var(--ink-2);
  border:1px solid var(--line);padding:4px 7px;display:inline-block;background:var(--surface);border-radius:999px;font-weight:600;
}
.page-row .imgs{margin-top:9px;font-size:10px;color:var(--mut);}
.page-row h3{
  font-size:17px;line-height:1.6;font-weight:700;margin:0 0 8px;outline:none;border-radius:var(--r);padding:2px 4px;
}
.page-row h3:focus{background:#fff;box-shadow:0 0 0 3px var(--accent-soft);}
.pr-intro{
  width:100%;border:1px solid var(--line-2);background:var(--surface-2);border-radius:var(--r);
  font-family:inherit;font-size:12.5px;line-height:1.9;color:var(--ink-2);padding:9px 11px;resize:none;outline:none;
  margin-bottom:8px;transition:.16s;
}
.pr-intro:focus{border-color:var(--accent);background:#fff;box-shadow:0 0 0 3px var(--accent-soft);}
.page-row textarea.pr-points{
  width:100%;border:none;background:transparent;resize:none;outline:none;
  font-family:inherit;font-size:13px;line-height:1.95;color:var(--ink-2);padding:2px 4px;border-radius:var(--r);
}
.page-row textarea.pr-points:focus{background:#fff;box-shadow:0 0 0 3px var(--accent-soft);}
.visuals{margin-top:10px;display:flex;flex-direction:column;gap:6px;}
.visual{display:flex;gap:8px;font-size:11.5px;color:var(--mut);line-height:1.7;}
.visual em{font-style:normal;color:var(--accent);flex:none;font-weight:700;}
.page-tools{position:absolute;right:0;top:20px;display:flex;gap:6px;opacity:0;transition:.16s;}
.page-row:hover .page-tools{opacity:1;}
.tool{
  width:26px;height:26px;border:1px solid var(--line);background:var(--surface);cursor:pointer;
  font-size:12px;color:var(--ink-2);display:grid;place-items:center;border-radius:var(--r);transition:.16s;
}
.tool:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}

/* ================= 03 成稿 ================= */
.deck-body{
  display:grid;grid-template-columns:214px minmax(0,1fr) 320px;
  height:calc(100vh - 112px);overflow:hidden;
}
.rail{
  border-right:1px solid var(--line);background:var(--surface-2);overflow-y:auto;
  padding:14px 12px 40px;display:flex;flex-direction:column;gap:10px;
}
.rail-item{position:relative;border:1px solid var(--line);border-radius:var(--r);padding:3px;cursor:pointer;background:#fff;transition:.16s;}
.rail-item:hover{border-color:#B9C6D8;transform:translateY(-2px);box-shadow:var(--sh);}
.rail-item.active{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.rail-item .n{
  position:absolute;left:8px;top:8px;z-index:3;font-size:9px;
  background:rgba(15,27,45,.7);color:#fff;padding:1px 5px;letter-spacing:.05em;border-radius:3px;
}
.stage{
  display:grid;place-items:center;padding:26px;overflow:hidden;position:relative;
  background:var(--bg);
  background-image:radial-gradient(rgba(15,27,45,.055) 1px,transparent 1px);
  background-size:22px 22px;
}
.slide-holder{background:#fff;box-shadow:var(--sh-3);position:relative;border-radius:6px;overflow:hidden;}
.inspector{border-left:1px solid var(--line);background:var(--surface);padding:22px 18px 44px;overflow-y:auto;}
.ins-label{font-size:10px;letter-spacing:.16em;color:var(--mut);margin-bottom:9px;text-transform:uppercase;font-weight:700;}
.inspector .field{margin-bottom:16px;}
.inspector input[type=text],.inspector textarea{
  width:100%;border:1px solid var(--line);background:var(--surface);padding:10px 11px;border-radius:var(--r);
  font-family:inherit;font-size:12.5px;line-height:1.8;color:var(--ink);outline:none;resize:vertical;transition:.16s;
}
.inspector input:focus,.inspector textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.ins-images{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:2px;}
.ins-img{border:1px solid var(--line);background:#fff;position:relative;border-radius:var(--r);overflow:hidden;}
.ins-img img{width:100%;display:block;aspect-ratio:1/1;object-fit:cover;}
.ins-img .ph{
  aspect-ratio:1/1;display:grid;place-items:center;background:repeating-linear-gradient(45deg,#F1F5FA,#F1F5FA 6px,#E8EEF6 6px,#E8EEF6 12px);
  font-size:9.5px;color:var(--mut);text-align:center;padding:6px;
}
.ins-img .redo{
  position:absolute;right:5px;bottom:5px;border:none;background:rgba(15,27,45,.78);color:#fff;
  font-size:10px;padding:3px 8px;cursor:pointer;border-radius:4px;transition:.16s;
}
.ins-img .redo:hover{background:var(--accent);}
.ins-note{font-size:11px;color:var(--mut);line-height:1.9;margin:14px 0 0;}

.genbar{
  position:fixed;left:0;right:0;bottom:0;height:44px;background:var(--ink);color:#EAF1FB;
  display:flex;align-items:center;gap:14px;padding:0 24px;z-index:30;
  font-size:11px;letter-spacing:.06em;
}
.g-track{flex:1;height:3px;border-radius:2px;background:rgba(234,241,251,.2);overflow:hidden;}
.g-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent-2),#93C5FD);transition:width .4s ease;}
.g-count{opacity:.85;}

/* ================= 幻灯片 1280×720 ================= */
.slide{
  position:absolute;top:0;left:0;width:1280px;height:720px;transform-origin:top left;
  overflow:hidden;background:var(--s-bg);color:var(--s-ink);
  font-family:"Microsoft YaHei","PingFang SC",var(--sans);
}
.slide .bg{position:absolute;inset:0;background-size:cover;background-position:center;background-color:var(--s-scrim);}
.slide .scrim{
  position:absolute;inset:0;background:var(--s-scrim);
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.32) 0%,rgba(0,0,0,.58) 44%,rgba(0,0,0,.94) 100%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.32) 0%,rgba(0,0,0,.58) 44%,rgba(0,0,0,.94) 100%);
}
.slide .ph{
  position:absolute;background:var(--s-soft);border:1px solid var(--s-line);
  display:grid;place-items:center;font-size:13px;color:var(--s-sub);letter-spacing:.1em;
}
.slide .frame{position:absolute;border:1px solid var(--s-line);}

/* 封面 */
.s-cover .rule{position:absolute;left:88px;top:338px;width:56px;height:5px;background:var(--s-accent);border-radius:2px;}
.s-cover h1{
  position:absolute;left:88px;top:360px;width:940px;height:160px;margin:0;
  display:flex;align-items:flex-end;font-size:64px;line-height:1.12;font-weight:800;color:#fff;letter-spacing:.4px;
}
.s-cover .sub{
  position:absolute;left:88px;top:544px;width:860px;height:76px;margin:0;
  font-size:23px;line-height:1.4;color:#D6DEE9;font-weight:400;
}
.s-cover .date{
  position:absolute;left:88px;top:636px;font-size:13px;color:#A9B4C2;letter-spacing:1.5px;
}

/* 通用正文元素 */
.knum{position:absolute;font-size:13.3px;font-weight:700;color:var(--s-accent);letter-spacing:1.5px;}
.kline{position:absolute;width:34px;height:1px;background:var(--s-line);}
.s-intro{position:absolute;margin:0;color:var(--s-sub);}
.slide .rule{position:absolute;width:44px;height:4px;background:var(--s-accent);border-radius:2px;}
.slide ol{margin:0;padding:0;list-style:none;}
.slide ol li{display:flex;gap:34px;align-items:flex-start;}
.slide ol li .n{font-size:12.7px;font-weight:700;color:var(--s-accent);letter-spacing:1px;padding-top:4px;flex:none;}
.slide ol li p{margin:0;line-height:1.45;color:var(--s-ink);}

/* 左文右图 */
.s-split .visual{position:absolute;width:526px;height:592px;top:64px;object-fit:cover;}
.s-split h2{position:absolute;height:96px;margin:0;display:flex;align-items:flex-end;line-height:1.22;font-weight:800;color:var(--s-ink);}
.s-split .s-intro{line-height:1.6;font-size:14.5px;}
.s-split ol{position:absolute;}

/* 双图 */
.s-duo .visual{position:absolute;width:544px;height:270px;object-fit:cover;}
.s-duo h2{position:absolute;height:92px;margin:0;display:flex;align-items:flex-end;line-height:1.22;font-weight:800;color:var(--s-ink);}
.s-duo .s-intro{line-height:1.6;font-size:14px;}
.s-duo ol{position:absolute;}

/* 图片注释条 */
.s-split .s-cap,.s-duo .s-cap{
  position:absolute;bottom:64px;height:38px;display:flex;align-items:center;
  padding:0 16px;font-size:11.5px;letter-spacing:.02em;color:#EAF1FB;
  background:linear-gradient(to top,rgba(10,16,26,.78),rgba(10,16,26,0));
}

/* 三图 */
.s-triptych h2{position:absolute;margin:0;font-weight:800;line-height:1.2;color:var(--s-ink);}
.s-triptych .s-intro{line-height:1.55;font-size:13.5px;}
.s-triptych .cell{position:absolute;width:352px;}
.s-triptych .cell .visual{width:352px;height:232px;object-fit:cover;display:block;}
.s-triptych .cell .ph{position:absolute;top:0;left:0;width:352px;height:232px;}
.s-triptych .cell .cap{display:flex;gap:12px;margin-top:14px;}
.s-triptych .cell .cap .n{font-size:12px;font-weight:700;color:var(--s-accent);padding-top:4px;}
.s-triptych .cell .cap p{margin:0;font-size:13px;line-height:1.45;color:var(--s-ink);}

/* 金句 */
.s-quote .scrim,.s-end .scrim{
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.60) 0%,rgba(0,0,0,.48) 52%,rgba(0,0,0,.74) 100%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.60) 0%,rgba(0,0,0,.48) 52%,rgba(0,0,0,.74) 100%);
}
.s-quote .rule{left:618px;top:258px;}
.s-quote h2{
  position:absolute;left:180px;top:288px;width:920px;margin:0;
  line-height:1.32;font-weight:800;color:#fff;text-align:center;
}
.s-quote .s-intro{position:absolute;left:280px;width:720px;text-align:center;color:#D6DEE9;font-size:15px;line-height:1.6;}

/* 整页大图压字 */
.s-hero .scrim{
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.62) 0%,rgba(0,0,0,.5) 50%,rgba(0,0,0,.78) 100%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.62) 0%,rgba(0,0,0,.5) 50%,rgba(0,0,0,.78) 100%);
}
.s-hero h2{position:absolute;margin:0;font-weight:800;line-height:1.22;color:#fff;}
.s-hero .s-intro{white-space:pre-line;line-height:1.6;color:#D6DEE9;font-size:15px;}

/* 结尾 */
.s-end .rule{left:616px;top:266px;width:48px;}
.s-end h2{
  position:absolute;left:200px;top:294px;width:880px;height:120px;margin:0;
  display:flex;align-items:center;justify-content:center;
  font-size:61.3px;font-weight:800;color:#fff;letter-spacing:1px;
}
.s-end p{
  position:absolute;left:240px;top:424px;width:800px;margin:0;
  font-size:21.3px;line-height:1.4;color:#CCD5E0;text-align:center;
}

/* 页脚 */
.s-foot{position:absolute;left:88px;right:88px;top:664px;height:1px;background:var(--s-line);}
.s-foot-l{position:absolute;left:88px;top:672px;font-size:11.3px;color:var(--s-sub);letter-spacing:.5px;}
.s-foot-r{
  position:absolute;right:88px;top:672px;font-size:11.3px;
  color:var(--s-sub);letter-spacing:1px;
}

/* 纯图模式幻灯片 */
.s-flat .flatimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.s-flat .flatph{
  position:absolute;inset:0;display:grid;place-items:center;text-align:center;
  background:repeating-linear-gradient(45deg,#F1F5FA,#F1F5FA 8px,#E8EEF6 8px,#E8EEF6 16px);
  font-size:13px;color:#8E9AA9;letter-spacing:.1em;line-height:2;
}

/* 生成中遮罩 */
.slide .busy{
  position:absolute;inset:0;background:rgba(15,27,45,.5);display:grid;place-items:center;
  color:#fff;font-size:13px;letter-spacing:.1em;z-index:5;backdrop-filter:blur(2px);
}
.slide .busy::before{
  content:"";width:26px;height:26px;border-radius:50%;
  border:2px solid rgba(255,255,255,.25);border-top-color:#fff;
  position:absolute;animation:spin .8s linear infinite;margin-top:-52px;
}

/* ================= 弹窗 / 提示 ================= */
.modal{position:fixed;inset:0;background:rgba(15,27,45,.42);display:grid;place-items:center;z-index:60;padding:20px;backdrop-filter:blur(3px);}
.modal-card{width:min(440px,100%);background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:24px;box-shadow:var(--sh-2);}
.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;}
.modal-head h3{font-size:19px;font-weight:800;margin:0;letter-spacing:-.01em;}
.modal-note{font-size:12px;line-height:1.85;color:var(--mut);margin:0 0 18px;}
.modal-card .field{display:block;margin-bottom:14px;}
.modal-card .field span{display:block;font-size:11.5px;color:var(--ink-2);margin-bottom:6px;font-weight:600;}
.modal-card .field input{
  width:100%;border:1px solid var(--line);background:var(--surface);padding:10px 11px;font-size:13px;outline:none;border-radius:var(--r);transition:.16s;
}
.modal-card .field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.modal-foot{display:flex;align-items:center;justify-content:space-between;margin-top:10px;}

.toasts{position:fixed;right:22px;bottom:62px;display:flex;flex-direction:column;gap:8px;z-index:80;align-items:flex-end;}
.toast{
  background:var(--ink);color:#EAF1FB;font-size:12.5px;line-height:1.6;padding:11px 14px;border-radius:var(--r);
  max-width:360px;box-shadow:var(--sh-2);
}
.toast.err{background:var(--err);}

/* ================= 进场与过渡 ================= */
@keyframes fadeUp{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes popIn{from{opacity:0;transform:translateY(14px) scale(.985);}to{opacity:1;transform:none;}}
@keyframes shake{
  0%,100%{transform:translateX(0);}
  20%{transform:translateX(-6px);}
  40%{transform:translateX(5px);}
  60%{transform:translateX(-3px);}
  80%{transform:translateX(2px);}
}
@keyframes shimmer{from{background-position:-200% 0;}to{background-position:200% 0;}}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.45;}}

body.booting main,body.booting .bar{opacity:0;}
body main,body .bar{transition:opacity .4s ease;}

.screen.in{animation:fadeUp .32s cubic-bezier(.22,.8,.3,1) both;}
.page-row{animation:fadeUp .34s cubic-bezier(.22,.8,.3,1) both;}
.rail-item{animation:fadeIn .3s ease both;}
.slide-holder{animation:popIn .34s cubic-bezier(.22,.8,.3,1) both;}
.pane{animation:fadeIn .2s ease both;}

/* ================= 顶栏账号 ================= */
.account{
  display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);
  height:30px;padding:0 11px 0 5px;border-radius:999px;cursor:pointer;color:var(--ink-2);font-size:12px;
  transition:.16s;
}
.account:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}
.avatar{
  width:20px;height:20px;display:grid;place-items:center;background:var(--line);color:var(--ink);
  font-size:10px;font-weight:700;border-radius:50%;
}
.avatar.on{background:var(--accent);color:#fff;}
.aname{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* ================= 起点：来源切换 ================= */
.source-tabs{position:relative;display:inline-flex;gap:2px;margin-top:32px;border-bottom:1px solid var(--line);}
.stab{
  background:none;border:none;padding:10px 18px;font-size:13.5px;color:var(--mut);cursor:pointer;
  letter-spacing:.01em;transition:color .18s;
}
.stab:hover{color:var(--ink-2);}
.stab.active{color:var(--accent);font-weight:700;}
.stab-ink{position:absolute;left:8px;bottom:-1px;height:2px;background:var(--accent);width:60px;border-radius:2px;transition:transform .28s cubic-bezier(.22,.8,.3,1),width .28s cubic-bezier(.22,.8,.3,1);}
.composer{margin-top:18px;}

/* ================= 起点：上传区 ================= */
.drop{
  display:flex;align-items:center;gap:16px;padding:26px 24px;cursor:pointer;
  border:1px dashed var(--line);background:var(--surface-2);border-radius:var(--r);transition:.18s;
}
.drop:hover{border-color:#B9C6D8;background:var(--surface);}
.drop.over{border-color:var(--accent);background:var(--accent-soft);}
.drop.busy{opacity:.7;pointer-events:none;animation:pulse 1.2s ease infinite;}
.dropicon{width:34px;height:34px;flex:none;color:var(--accent);}
.drop-main{flex:1;min-width:0;}
.drop-main b{display:block;font-size:13.5px;font-weight:700;margin-bottom:5px;}
.drop-main span{font-size:11px;color:var(--mut);letter-spacing:.03em;}
.docinfo{padding:16px 20px;}
.docrow{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.docname{font-size:13px;font-weight:700;}
.docchars{font-size:10.5px;color:var(--mut);letter-spacing:.03em;}
.docrow .link{margin-left:auto;}
.docpreview{
  margin:0;max-height:132px;overflow:hidden;font-size:11.5px;line-height:1.9;
  color:var(--ink-2);white-space:pre-wrap;border-left:2px solid var(--accent);padding-left:12px;
  mask-image:linear-gradient(to bottom,#000 62%,transparent);
  -webkit-mask-image:linear-gradient(to bottom,#000 62%,transparent);
}

/* ================= 起点：模式 ================= */
.composer-foot{align-items:flex-end;}
.modes{display:flex;gap:8px;}
.mode{
  border:1px solid var(--line);background:var(--surface);padding:8px 12px;cursor:pointer;text-align:left;
  border-radius:var(--r);transition:.16s;line-height:1.3;
}
.mode b{display:block;font-size:12px;font-weight:700;color:var(--ink-2);}
.mode span{display:block;font-size:10px;color:var(--mut);margin-top:3px;}
.mode:hover{border-color:#B9C6D8;}
.mode.active{border-color:var(--accent);background:var(--accent-soft);}
.mode.active b{color:var(--accent);}
.modehint{margin:12px 0 0;font-size:11px;line-height:1.8;color:var(--mut);transition:color .2s;}
.modehint.warn{color:var(--err);}

/* ================= 策划案补充 ================= */
.layout-tag.flat{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-soft);}
.sourcetag{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--mut);line-height:1.8;margin-top:16px;}
.sourcetag .pill{
  font-size:9.5px;letter-spacing:.1em;background:var(--accent);color:#fff;
  padding:2px 7px;border-radius:999px;font-weight:700;
}
.saved{font-size:10.5px;color:var(--mut);letter-spacing:.03em;margin-right:4px;}
.ins-tip{font-size:11px;line-height:1.8;color:var(--ink-2);background:var(--surface-2);border-left:2px solid var(--accent);padding:10px 12px;margin:0 0 14px;border-radius:0 var(--r) var(--r) 0;}

/* ================= 账号弹层 ================= */
.auth-card{width:min(400px,100%);animation:popIn .26s cubic-bezier(.22,.8,.3,1) both;}
.auth-card.shake{animation:shake .38s ease;}
.auth-err{min-height:16px;margin:2px 0 0;font-size:11.5px;color:var(--err);}
#nameField{animation:fadeUp .22s ease both;}

/* ================= 我的作品 ================= */
.decks-card{width:min(640px,100%);animation:popIn .26s cubic-bezier(.22,.8,.3,1) both;max-height:min(78vh,700px);display:flex;flex-direction:column;}
.decklist{overflow-y:auto;margin-top:14px;display:flex;flex-direction:column;gap:10px;padding-right:4px;}
.decks-empty{padding:34px 0;text-align:center;font-size:12.5px;color:var(--mut);line-height:1.9;}
.deckcard{
  display:grid;grid-template-columns:104px minmax(0,1fr) auto auto;align-items:center;gap:14px;
  border:1px solid var(--line);background:var(--surface-2);padding:10px;cursor:pointer;transition:.16s;border-radius:var(--r);
}
.deckcard:hover{border-color:var(--accent);background:var(--surface);transform:translateY(-1px);box-shadow:var(--sh);}
.deckcard .thumb{width:104px;aspect-ratio:16/9;background:var(--line-2);overflow:hidden;border-radius:4px;}
.deckcard .thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.deckcard .dmeta{min-width:0;}
.deckcard .dmeta b{display:block;font-size:13px;margin-bottom:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.deckcard .dmeta span{display:block;font-size:11px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.deckcard .dmeta em{display:block;font-size:10px;color:var(--mut);font-style:normal;margin-top:5px;letter-spacing:.03em;}
.dopendeck{
  border:1px solid var(--line);background:var(--surface);font-size:11.5px;padding:6px 12px;cursor:pointer;border-radius:var(--r);transition:.16s;font-weight:600;
}
.dopendeck:hover{border-color:var(--accent);background:var(--accent);color:#fff;}
.ddel{border:none;background:none;color:var(--mut);font-size:16px;cursor:pointer;padding:0 4px;line-height:1;transition:.16s;}
.ddel:hover{color:var(--err);}

/* ================= Toast ================= */
.toast{animation:popIn .22s cubic-bezier(.22,.8,.3,1) both;transition:opacity .25s,transform .25s;}
.toast.out{opacity:0;transform:translateY(6px);}

/* ================= 顶部进度条 ================= */
.top-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:120;overflow:hidden;background:rgba(29,78,216,.10);}
.top-progress i{display:block;height:100%;width:28%;background:linear-gradient(90deg,#93C5FD,#1D4ED8);animation:slidebar 1.05s cubic-bezier(.5,.1,.5,.9) infinite;}
@keyframes slidebar{0%{transform:translateX(-110%);}100%{transform:translateX(420%);}}

/* ================= 全屏拖拽上传层 ================= */
.dropoverlay{position:fixed;inset:0;z-index:110;display:grid;place-items:center;background:rgba(11,22,38,.55);backdrop-filter:blur(6px);animation:fadeIn .16s ease both;}
.do-card{
  display:grid;justify-items:center;gap:4px;padding:46px 64px;border-radius:20px;
  border:2px dashed rgba(255,255,255,.5);background:rgba(255,255,255,.10);color:#fff;
  box-shadow:0 40px 90px rgba(7,15,31,.45);animation:popIn .22s cubic-bezier(.22,.8,.3,1) both;
}
.do-card svg{width:54px;height:54px;color:#BFDBFE;margin-bottom:10px;}
.do-card b{font-size:20px;letter-spacing:.02em;}
.do-card span{font-size:12.5px;color:#CBD9EC;letter-spacing:.03em;}

/* ================= 缩略图状态徽标 ================= */
.rail-badge{
  position:absolute;right:7px;top:7px;z-index:4;font-size:9px;line-height:1.7;
  padding:1px 7px;border-radius:999px;color:#fff;letter-spacing:.02em;font-weight:600;
}
.rail-badge.running{background:var(--accent);animation:pulse 1.3s ease infinite;}
.rail-badge.queued{background:rgba(15,27,45,.58);}
.rail-badge.failed{background:var(--err);}

/* ================= 响应式 ================= */
@media (max-width:1120px){
  .plan-body{grid-template-columns:330px minmax(0,1fr);}
  .deck-body{grid-template-columns:180px minmax(0,1fr);}
  .inspector{display:none;}
}
@media (max-width:860px){
  .notes{grid-template-columns:1fr;gap:14px;}
  .plan-body{grid-template-columns:1fr;height:auto;overflow:visible;}
  .plan-aside{border-right:none;border-bottom:1px solid var(--line);}
  .screen{height:auto;overflow-y:auto;}
  .deck-body{grid-template-columns:1fr;}
  .rail{flex-direction:row;overflow-x:auto;height:112px;}
  .rail-item{flex:none;width:150px;}
}