:root{
  --ink:#1A1A1A;--paper:#FAFAFA;--surface:#FFFFFF;--surface-2:#EFEFEF;--line:#E0E0E0;
  --muted:#767676;--accent:#D6316F;--accent-2:#A8235A;--accent-soft:#FCE3EC;--accent-soft-2:#F7BFD6;
  --success:#3E8F6C;--success-soft:#DEEFE5;--critical:#BE4438;--critical-soft:#F6DDD9;
  --radius:10px;--shadow:0 1px 2px rgba(0,0,0,.07),0 6px 18px rgba(0,0,0,.08);
  --font:"Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic","Noto Sans JP","Meiryo","Noto Sans TC","Segoe UI",sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#F2F2F2;--paper:#121212;--surface:#1C1C1E;--surface-2:#262626;--line:#383838;
    --muted:#9C9C9C;--accent:#F074A6;--accent-2:#F7ACCC;--accent-soft:#33202A;--accent-soft-2:#47283A;
    --success:#7FCBA6;--success-soft:#1D3128;--critical:#E38078;--critical-soft:#3A201F;
    --shadow:0 1px 2px rgba(0,0,0,.5),0 10px 26px rgba(0,0,0,.4);
  }
}
:root[data-theme="dark"]{
  --ink:#F2F2F2;--paper:#121212;--surface:#1C1C1E;--surface-2:#262626;--line:#383838;
  --muted:#9C9C9C;--accent:#F074A6;--accent-2:#F7ACCC;--accent-soft:#33202A;--accent-soft-2:#47283A;
  --success:#7FCBA6;--success-soft:#1D3128;--critical:#E38078;--critical-soft:#3A201F;
  --shadow:0 1px 2px rgba(0,0,0,.5),0 10px 26px rgba(0,0,0,.4);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:var(--font);background:var(--paper);color:var(--ink);font-size:14px;line-height:1.6;}
a{color:var(--accent-2);}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.muted{color:var(--muted);}

.app{display:flex;min-height:100vh;}
.sidebar{width:232px;flex:0 0 232px;background:var(--surface);border-right:1px solid var(--line);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;}
.brand{padding:22px 20px 16px;border-bottom:1px solid var(--line);}
.brand .mark{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15.5px;}
.brand .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);}
.brand .sub{margin-top:5px;font-size:11px;color:var(--muted);letter-spacing:.03em;}
.nav{flex:1;padding:14px 12px;display:flex;flex-direction:column;gap:3px;overflow-y:auto;}
.nav-section{margin:14px 12px 4px;font-size:10.5px;color:var(--muted);letter-spacing:.06em;}
.nav-item{display:block;padding:10px 12px;border-radius:8px;color:var(--muted);font-size:13.5px;
  font-weight:600;text-decoration:none;}
.nav-item:hover{background:var(--surface-2);color:var(--ink);}
.nav-item.active{background:var(--accent-soft);color:var(--accent-2);}
.sidebar-footer{padding:14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px;}
.account .name{font-size:12.5px;font-weight:700;word-break:break-all;}
.account .role{font-size:11px;color:var(--muted);}

.main{flex:1;min-width:0;display:flex;flex-direction:column;}
.topbar{padding:24px 34px 18px;border-bottom:1px solid var(--line);background:var(--paper);}
.topbar h1{margin:0;font-size:21px;font-weight:700;text-wrap:balance;}
.topbar p{margin:5px 0 0;color:var(--muted);font-size:12.5px;}
.panel{padding:26px 34px 60px;max-width:1180px;}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);}
.card--pad{padding:20px 22px;}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.field label{font-size:12.5px;font-weight:600;}
input,select{font:inherit;padding:9px 11px;border-radius:8px;border:1px solid var(--line);
  background:var(--surface);color:var(--ink);}
.btn{font:inherit;font-weight:600;padding:9px 16px;border-radius:8px;border:1px solid var(--line);
  background:var(--surface);color:var(--ink);cursor:pointer;}
.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff;}
.btn--primary:hover{background:var(--accent-2);}
.btn--ghost{background:transparent;}
.btn--danger{background:var(--critical);border-color:var(--critical);color:var(--paper);}
.btn--block{width:100%;}
.btn.is-busy{cursor:progress;opacity:.75;}
.btn.is-busy::after{content:"";display:inline-block;width:.9em;height:.9em;margin-left:.5em;
  vertical-align:-.1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;
  animation:btn-spin .8s linear infinite;}
@keyframes btn-spin{to{transform:rotate(360deg);}}
@media (prefers-reduced-motion:reduce){.btn.is-busy::after{animation:none;}}
.btn--small{padding:5px 10px;font-size:12px;}
.flash{padding:10px 14px;border-radius:8px;margin:0 0 14px;}
.flash--ok{background:var(--success-soft);color:var(--success);}
.flash--error,.alert{background:var(--critical-soft);color:var(--critical);padding:10px 14px;border-radius:8px;}
.note,.hint{font-size:12.5px;color:var(--muted);}

.table-wrap{overflow-x:auto;}
table.list{width:100%;border-collapse:collapse;font-size:13px;}
table.list th,table.list td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;}
table.list th{font-size:11.5px;color:var(--muted);font-weight:600;}
.chip{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:600;}
.chip--ok{background:var(--success-soft);color:var(--success);}
.chip--off{background:var(--surface-2);color:var(--muted);}
.row-actions{display:flex;gap:6px;flex-wrap:wrap;}
.inline-form{display:inline-flex;gap:6px;align-items:center;}
.add-form{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:18px;}
.add-form .field{margin:0;min-width:240px;flex:1;}
textarea{font:inherit;padding:9px 11px;border-radius:8px;border:1px solid var(--line);
  background:var(--surface);color:var(--ink);width:100%;resize:vertical;}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:4px 18px;}
.form-actions{display:flex;gap:10px;align-items:center;margin-top:8px;}
.crumb{font-size:12px;color:var(--muted);margin:0 0 12px;}
.err-list{margin:6px 0 0;padding-left:18px;}
details.tree{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:10px;}
details.tree>summary{cursor:pointer;padding:12px 16px;font-weight:700;display:flex;gap:10px;align-items:center;}
details.tree>summary .count{margin-left:auto;font-size:11.5px;color:var(--muted);font-weight:600;}
.tree-body{padding:0 16px 14px;}
.cat-head{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin:14px 0 6px;}
.cat-head h3{margin:0;font-size:14px;}
.cmd{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;background:var(--surface-2);
  padding:8px 10px;border-radius:8px;overflow-x:auto;white-space:pre;}
.subtabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap;}
.subtab{padding:8px 14px;border-radius:8px;border:1px solid var(--line);text-decoration:none;
  color:var(--muted);font-weight:600;font-size:13px;}
.subtab.active{background:var(--accent-soft);color:var(--accent-2);border-color:var(--accent-soft-2);}
.sub-item{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 0;
  border-top:1px solid var(--line);}
.sub-item .meta{font-size:12px;color:var(--muted);}
details.sub-detail>summary{cursor:pointer;font-size:12.5px;color:var(--accent-2);font-weight:600;}
.detail-rows{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr);gap:6px 14px;padding:10px 12px;
  background:var(--surface-2);border-radius:8px;margin:6px 0 10px;font-size:13px;}
.detail-rows dt{color:var(--muted);font-weight:600;}
.detail-rows dd{margin:0;white-space:pre-wrap;}
/* 官網文字裡有 118 字元不斷行的英數字串（第二輪審查實測）：不加這行，行動版整頁橫向捲動 */
.detail-rows dd,.hp-copy-text,.cat-head .muted,table.list td{overflow-wrap:anywhere;}
.hp-copy{border:1px dashed var(--line);border-radius:8px;padding:10px 12px;margin:10px 0 4px;}
.hp-copy-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;}
.hp-copy-row{padding:8px 0;border-top:1px solid var(--line);}
.hp-copy-text{white-space:pre-wrap;font-size:13px;margin-top:4px;}
.tag-copy{font:inherit;display:inline-block;padding:3px 10px;border-radius:999px;background:var(--accent-soft);
  color:var(--accent-2);font-size:12px;font-weight:600;border:none;cursor:pointer;}
.copied{outline:2px solid var(--success);outline-offset:1px;}
.price-cell{display:flex;gap:6px;flex-wrap:wrap;}
.section-title{font-size:15px;margin:22px 0 8px;}
@media (max-width: 760px){ .detail-rows{grid-template-columns:1fr;} }

.auth-page{min-height:100vh;display:flex;flex-direction:column;}
.auth-top{display:flex;justify-content:flex-end;padding:14px 16px;}
.auth-main{flex:1;display:flex;align-items:center;justify-content:center;padding:16px;}
.auth-card{width:100%;max-width:400px;padding:0 0 22px;}
.auth-card form,.auth-card .auth-title,.auth-card .note,.auth-card .hint,.auth-card .alert{margin-left:22px;margin-right:22px;}
.auth-title{font-size:18px;margin-top:18px;}

@media (max-width: 760px){
  .app{flex-direction:column;}
  .sidebar{width:auto;flex:none;height:auto;position:static;border-right:none;border-bottom:1px solid var(--line);}
  .nav{flex-direction:row;overflow-x:auto;padding:8px 12px;}
  .nav-section{display:none;}
  .nav-item{white-space:nowrap;}
  .sidebar-footer{flex-direction:row;flex-wrap:wrap;align-items:center;}
  .topbar{padding:16px;}
  .panel{padding:16px 16px 40px;}
}
/* ── 投稿作成（第 4 期）── */
.steps{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap;}
.step{padding:6px 12px;border-radius:999px;border:1px solid var(--line);text-decoration:none;
  color:var(--muted);font-size:13px;font-weight:600;}
.step.active{background:var(--accent-soft);color:var(--accent-2);border-color:var(--accent-soft-2);}
.theme-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;}
.theme-card h2{margin:0 0 6px;font-size:17px;}
.theme-switch{border:none;padding:0;margin:0 0 8px;display:flex;gap:16px;flex-wrap:wrap;align-items:center;}
.cp-group{border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:10px 0;min-width:0;}
.cp-group legend{font-weight:700;font-size:13.5px;padding:0 4px;}
.cp-all{font-size:12.5px;color:var(--muted);}
.cp-row{border-top:1px solid var(--line);padding:8px 0;}
.cp-pick{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;}
.cp-name{font-weight:600;overflow-wrap:anywhere;}
.cp-price{color:var(--accent-2);font-weight:700;font-size:13px;}
.cp-adjust>summary{cursor:pointer;font-size:12.5px;color:var(--accent-2);margin-top:4px;}
details.inline-confirm>summary{cursor:pointer;font-size:12.5px;color:var(--muted);}
.stepper{display:flex;gap:6px;align-items:center;}
.stepper input{width:72px;text-align:center;}
.slide-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.slide-item{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--surface);}
.slide-item.dragging{opacity:.5;}
.slide-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.slide-moves{margin-left:auto;display:flex;gap:4px;}
.drag-handle{cursor:grab;color:var(--muted);user-select:none;}
.slide-item .field{display:flex;flex-direction:column;gap:2px;margin:6px 0;}
.slide-item textarea,.slide-item input{width:100%;box-sizing:border-box;}
.slide-count-bar{align-items:center;flex-wrap:wrap;}
.slide-count{font-weight:700;font-variant-numeric:tabular-nums;}
@media (max-width: 760px){ .drag-handle{display:none;} }
@media (prefers-reduced-motion: reduce){*{transition:none !important;}}

.ref-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:8px 0;}
.ref-card{margin:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;}
.ref-card img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--surface-2);}
.ref-card figcaption{padding:8px;display:flex;flex-direction:column;gap:6px;font-size:12.5px;}
.ref-note,.ref-mood{margin:0;overflow-wrap:anywhere;}
.palette{display:flex;gap:4px;flex-wrap:wrap;}
.swatch{width:18px;height:18px;border-radius:4px;border:1px solid var(--line);}
.ref-upload input[type=file]{max-width:100%;}
.aspect-pick{border:none;padding:0;margin:0 0 8px;display:flex;gap:14px;flex-wrap:wrap;}
.proposal-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:10px;}
.proposal{border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:6px;}
.proposal.chosen{border-color:var(--accent-2);box-shadow:0 0 0 2px var(--accent-soft);}
.proposal p{margin:0;font-size:13px;overflow-wrap:anywhere;}
.proposal-head{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.wire-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin:10px 0;}
.wire-slide{position:relative;border:2px dashed var(--line);border-radius:8px;padding:10px;display:flex;
  flex-direction:column;justify-content:center;gap:6px;overflow:hidden;background:var(--surface-2);}
.wire-no{position:absolute;top:6px;left:8px;font-size:11px;color:var(--muted);}
.wire-role{font-size:11px;color:var(--accent-2);font-weight:700;}
.wire-content{font-size:12.5px;font-weight:600;white-space:pre-wrap;overflow-wrap:anywhere;}
.chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center;border:1px solid var(--line);border-radius:8px;padding:6px;}
.chips input{border:none;flex:1;min-width:120px;outline:none;background:transparent;}
.chip-x{border:none;background:none;cursor:pointer;margin-left:4px;color:inherit;}
/* 第 5 期：生成結果・下載同意 */
.gen-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin:10px 0;}
.gen-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:12px;display:flex;flex-direction:column;gap:8px;min-width:0;}
.gen-head{display:flex;justify-content:space-between;align-items:center;gap:8px;}
.gen-img{display:block;width:100%;height:auto;border-radius:8px;object-fit:contain;background:var(--surface-2);}
.gen-checks{margin:0;font-size:13px;overflow-wrap:anywhere;}
.gen-checks dt{font-weight:600;margin-top:4px;}
.gen-checks dd{margin:0 0 4px;}
/* 內容檢查的提醒（使用者 2026-10-27：只提醒、不擋下載）：醒目但不是錯誤 */
.gen-notice{border-left:4px solid var(--critical);background:var(--critical-soft);padding:8px 10px;margin:8px 0 0;border-radius:6px;font-size:13px;overflow-wrap:anywhere;}
.gen-notice-title{margin:0 0 4px;font-weight:700;color:var(--critical);}
.gen-notice ul,.consent-notes ul{margin:0;padding-left:1.2em;}
.consent-notes{border:1px solid var(--critical);border-radius:6px;padding:10px 14px;margin:12px 0;overflow-wrap:anywhere;}
.consent-notes p{margin:0 0 6px;color:var(--critical);}
.gen-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;}
.gen-actions form{margin:0;}
.consent-text{white-space:pre-line;border-left:4px solid var(--critical);background:var(--critical-soft);padding:10px 14px;margin:12px 0;border-radius:6px;overflow-wrap:anywhere;}
.consent-agree{display:flex;gap:8px;align-items:flex-start;margin:10px 0;}
/* 生成中特效（A 卡片顯影＋C 開場與浮動膠囊；使用者 2026-10-16 選定）。特效用色固定（暗色模式也一樣是「發光」），版面色走 token */
@property --gen-ang{syntax:"<angle>";initial-value:0deg;inherits:false;}
@keyframes gen-spin{to{--gen-ang:360deg;}}
@keyframes gen-rot{to{transform:rotate(360deg);}}
@keyframes gen-flow{to{background-position:300% 0;}}
@keyframes gen-glint{from{transform:translateX(-100%);}to{transform:translateX(100%);}}
@keyframes gen-shimmer{to{background-position:-250% 0;}}
@keyframes gen-drift{to{transform:rotate(40deg) scale(1.25);}}
@keyframes gen-twinkle{0%,100%{opacity:0;transform:scale(.3);}50%{opacity:1;transform:scale(1.4);}}
@keyframes gen-scan{from{top:-70px;}to{top:100%;}}
@keyframes gen-ripple{from{transform:scale(.8);opacity:1;}to{transform:scale(1.45);opacity:0;}}
@keyframes gen-pulse{50%{transform:scale(1.18);}}
@keyframes gen-develop{from{filter:blur(18px) saturate(2) brightness(1.4);transform:scale(1.08);}to{filter:none;transform:none;}}
@keyframes gen-pop{from{transform:scale(.3);opacity:0;}}
@keyframes gen-stamp{from{transform:scale(2.4) rotate(-12deg);opacity:0;}}
@keyframes gen-burst{to{transform:translate(var(--x),var(--y)) rotate(540deg);opacity:0;}}
@keyframes gen-word{0%,100%{background:var(--surface-2);}50%{background:var(--accent-soft-2);color:var(--ink);}}
@keyframes gen-out{to{opacity:0;visibility:hidden;}}
@keyframes gen-chip-in{from{opacity:0;transform:scale(.6);}to{opacity:1;transform:none;}}
@keyframes gen-in{from{transform:translateY(140%);}}
.gen-bar{display:grid;gap:8px;margin:12px 0 16px;padding:14px 16px;border-radius:12px;background:linear-gradient(135deg,var(--accent-soft),var(--surface-2));}
.gen-bar-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;}
.gen-bar-row strong{font-size:15px;color:var(--accent-2);}
.gen-track{height:10px;border-radius:99px;background:var(--surface);overflow:hidden;}
.gen-fill{position:relative;height:100%;border-radius:99px;overflow:hidden;transition:width .8s ease;
  background:linear-gradient(90deg,#D6316F,#8B5CF6,#38BDF8,#D6316F);background-size:300% 100%;animation:gen-flow 2.4s linear infinite;}
.gen-fill::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.8),transparent);animation:gen-glint 1.6s ease-in-out infinite;}
.chip--live{background:var(--accent);color:#fff;}
.gen-card--live{border-color:transparent;box-shadow:0 0 22px rgba(214,49,111,.35);
  background:linear-gradient(var(--surface),var(--surface)) padding-box,conic-gradient(from var(--gen-ang),#D6316F,#8B5CF6,#38BDF8,#D6316F) border-box;
  border:2px solid transparent;animation:gen-spin 2.2s linear infinite;}
/* 五段步驟 */
.gen-pipe{display:flex;list-style:none;margin:0;padding:0;}
.gen-pipe li{flex:1;display:grid;justify-items:center;gap:3px;position:relative;font-size:10px;color:var(--muted);min-width:0;}
.gen-pipe li::before{content:"";position:absolute;top:10px;left:-50%;width:100%;height:3px;background:var(--line);z-index:0;}
.gen-pipe li:first-child::before{display:none;}
.gen-pipe li.is-done::before,.gen-pipe li.is-now::before{background:var(--accent);}
.gen-pipe b{position:relative;z-index:1;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11px;background:var(--surface-2);color:var(--muted);}
.gen-pipe li.is-done b{background:var(--accent);color:#fff;}
.gen-pipe li.is-done b::after{content:"✓";}
.gen-pipe li.is-now b{background:var(--surface);color:var(--accent);box-shadow:0 0 0 2px var(--accent),0 0 12px var(--accent);animation:gen-pulse 1s ease-in-out infinite;}
.gen-pipe li.is-now b::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);}
.gen-pipe li.is-now span{color:var(--accent);font-weight:700;}
[data-stage="queued"] .gen-pipe li.is-now b{animation:none;box-shadow:0 0 0 2px var(--line);}
[data-stage="queued"] .gen-pipe li.is-now b::after{background:var(--muted);}
[data-stage="queued"] .gen-pipe li.is-now span{color:var(--muted);font-weight:400;}
.gen-pipe span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;margin-top:4px;}
/* 圖框：各層預設隱藏，依 data-stage 打開 */
.gen-fx{position:relative;overflow:hidden;}
.gen-fx>*{position:absolute;inset:0;margin:0;}
.gen-fx-img{width:100%;height:100%;object-fit:cover;opacity:0;}
.gen-fx-img[src]{opacity:1;}
.gen-fx-img.is-developing{animation:gen-develop 1.4s ease-out both;}
.gen-fx-aurora,.gen-fx-sparks,.gen-fx-grid,.gen-fx-beam,.gen-fx-dim,.gen-fx-shield{display:none;}
.gen-fx-cap{top:auto;padding:10px;text-align:center;color:#fff;font-size:13px;background:linear-gradient(transparent,rgba(0,0,0,.55));text-shadow:0 1px 2px rgba(0,0,0,.4);z-index:3;}
.gen-fx-cap small{display:block;font-size:11px;opacity:.9;}
[data-stage="queued"] .gen-fx:not(.gen-fx--has-img){background:linear-gradient(110deg,var(--surface-2) 30%,var(--surface) 50%,var(--surface-2) 70%);background-size:250% 100%;animation:gen-shimmer 1.8s linear infinite;}
[data-stage="queued"] .gen-fx:not(.gen-fx--has-img) .gen-fx-cap{top:50%;bottom:auto;transform:translateY(-50%);background:none;color:var(--muted);text-shadow:none;}
[data-stage="drawing"] .gen-fx{background:#2A1030;}
[data-stage="drawing"] .gen-fx-aurora{display:block;inset:-30%;filter:blur(30px);animation:gen-drift 6s ease-in-out infinite alternate;background:
  radial-gradient(circle at 30% 30%,#FF7AB0 0 22%,transparent 40%),radial-gradient(circle at 70% 40%,#A78BFA 0 20%,transparent 42%),
  radial-gradient(circle at 45% 75%,#7DD3FC 0 22%,transparent 45%),radial-gradient(circle at 80% 85%,#FDBA74 0 15%,transparent 35%);}
[data-stage="drawing"] .gen-fx-sparks{display:block;}
.gen-fx-sparks i{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 8px #fff,0 0 16px #FF9AC4;animation:gen-twinkle 1.6s ease-in-out infinite;}
.gen-fx-sparks i:nth-child(1){left:12%;top:18%;}.gen-fx-sparks i:nth-child(2){left:78%;top:10%;animation-delay:.3s;}
.gen-fx-sparks i:nth-child(3){left:40%;top:34%;animation-delay:.7s;}.gen-fx-sparks i:nth-child(4){left:85%;top:46%;animation-delay:1.1s;}
.gen-fx-sparks i:nth-child(5){left:20%;top:58%;animation-delay:.5s;}.gen-fx-sparks i:nth-child(6){left:62%;top:66%;animation-delay:1.4s;}
.gen-fx-sparks i:nth-child(7){left:33%;top:80%;animation-delay:.9s;}.gen-fx-sparks i:nth-child(8){left:72%;top:86%;animation-delay:.2s;}
.gen-fx-sparks i:nth-child(9){left:52%;top:50%;animation-delay:1.2s;}.gen-fx-sparks i:nth-child(10){left:8%;top:90%;animation-delay:.6s;}
[data-stage="checking"] .gen-fx-grid{display:block;background-image:linear-gradient(rgba(56,189,248,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(56,189,248,.18) 1px,transparent 1px);background-size:18px 18px;}
[data-stage="checking"] .gen-fx-beam{display:block;bottom:auto;height:70px;background:linear-gradient(180deg,transparent,rgba(56,189,248,.35) 70%,rgba(56,189,248,.95) 96%,transparent);animation:gen-scan 1.6s linear infinite;mix-blend-mode:screen;}
[data-stage="reviewing"] .gen-fx-dim{display:block;background:rgba(40,10,40,.55);}
[data-stage="reviewing"] .gen-fx-shield{display:block;inset:auto;left:50%;top:40%;width:96px;height:96px;transform:translate(-50%,-50%);color:#fff;}
.gen-fx-shield>*{position:absolute;}
.gen-fx-radar{inset:0;border-radius:50%;border:2px solid rgba(255,255,255,.5);background:conic-gradient(from var(--gen-ang),transparent 70%,rgba(244,114,182,.9));animation:gen-spin 1.4s linear infinite;}
.gen-fx-ring{inset:-14px;border-radius:50%;border:2px solid rgba(244,114,182,.6);animation:gen-ripple 1.4s ease-out infinite;}
.gen-fx-shield svg{inset:24px;filter:drop-shadow(0 0 8px #fff);}
/* 文案比對 */
.gen-words{display:flex;flex-wrap:wrap;gap:4px;list-style:none;margin:0;padding:0;}
.gen-words li{font-size:11px;padding:2px 7px;border-radius:6px;background:var(--surface-2);color:var(--muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
[data-stage="checking"] .gen-words li{animation:gen-word 1.6s ease-in-out infinite;}
[data-stage="checking"] .gen-words li:nth-child(2n){animation-delay:.4s;}[data-stage="checking"] .gen-words li:nth-child(3n){animation-delay:.8s;}
.gen-words li.is-ok{background:var(--success-soft);color:var(--success);animation:gen-pop .35s cubic-bezier(.3,1.6,.5,1) both;}
.gen-words li.is-ok::before{content:"✓ ";font-weight:700;}
.gen-words li.is-miss{background:var(--critical-soft);color:var(--critical);}
.gen-words li.is-miss::before{content:"✗ ";font-weight:700;}
/* 剛完成 */
.gen-celebrate-host{position:relative;}
.gen-celebrate{position:absolute;inset:0;pointer-events:none;}
.gen-stamp{position:absolute;top:10px;right:10px;background:var(--success);color:#fff;font-weight:800;font-size:12px;padding:5px 10px;border-radius:99px;box-shadow:0 4px 12px rgba(0,0,0,.25);animation:gen-stamp .5s cubic-bezier(.3,1.8,.5,1) both;}
.gen-celebrate i{position:absolute;top:40%;left:50%;width:7px;height:11px;animation:gen-burst 1.1s ease-out both;}
/* 開場（C） */
.gen-intro{position:fixed;inset:0;z-index:50;display:grid;place-items:center;overflow:hidden;color:#fff;cursor:pointer;
  background:radial-gradient(circle at 50% 45%,#3B1240,#12061A 70%);animation:gen-out .6s ease 3.2s forwards;}
.gen-intro.is-leaving{animation:gen-out .6s ease forwards;}
.gen-intro canvas{position:absolute;inset:0;width:100%;height:100%;}
.gen-intro-core{position:relative;display:grid;justify-items:center;gap:14px;text-align:center;padding:16px;}
.gen-intro-frame{width:140px;max-height:250px;border-radius:14px;position:relative;overflow:hidden;
  background:conic-gradient(from 0deg,#FF7AB0,#A78BFA,#67E8F9,#FDBA74,#FF7AB0);box-shadow:0 0 60px rgba(255,95,162,.6);}
.gen-intro-frame::before{content:"";position:absolute;inset:-50%;background:inherit;filter:blur(30px);animation:gen-rot 3s linear infinite;}
.gen-intro-title{margin:0;font-size:26px;font-weight:800;letter-spacing:.06em;}
.gen-intro-seq{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin:0;font-size:12px;}
.gen-intro-seq span{padding:4px 10px;border-radius:99px;border:1px solid #FF5FA2;background:rgba(255,95,162,.2);animation:gen-chip-in .4s ease both;}
.gen-intro-seq span:nth-child(1){animation-delay:.4s;}.gen-intro-seq span:nth-child(2){animation-delay:1s;}
.gen-intro-seq span:nth-child(3){animation-delay:1.6s;}.gen-intro-seq span:nth-child(4){animation-delay:2.2s;}
.gen-intro-hint{margin:0;font-size:12px;opacity:.7;}
/* 浮動膠囊（C） */
.gen-pill{position:fixed;right:16px;bottom:16px;z-index:40;display:flex;align-items:center;gap:12px;max-width:calc(100vw - 32px);
  padding:10px 16px 10px 10px;border-radius:99px;background:rgba(23,11,31,.94);color:#fff;text-decoration:none;
  box-shadow:0 10px 30px rgba(0,0,0,.3),0 0 0 1px rgba(255,95,162,.45);animation:gen-in .6s cubic-bezier(.3,1.4,.5,1) both;}
.gen-pill[hidden],.gen-pill.is-away{display:none;}
.gen-pill--after-intro{animation-delay:3.4s;}
.gen-pill--done{background:var(--success);}
.gen-pill-ring{--p:0;flex:none;position:relative;width:44px;height:44px;border-radius:50%;background:conic-gradient(#FF5FA2 calc(var(--p)*1%),rgba(255,255,255,.14) 0);}
.gen-pill-ring::before{content:"";position:absolute;inset:5px;border-radius:50%;background:#170B1F;}
.gen-pill-ring::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid transparent;border-top-color:#fff;animation:gen-rot 1s linear infinite;}
.gen-pill--done .gen-pill-ring{display:none;}
.gen-pill-ring b{position:absolute;inset:0;display:grid;place-items:center;font-size:11px;}
.gen-pill-text{display:grid;line-height:1.35;min-width:0;}
.gen-pill-text strong{font-size:13px;}
.gen-pill-text small{font-size:11px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media (prefers-reduced-motion:reduce){
  .gen-fill,.gen-fill::after,.gen-card--live,[data-stage] .gen-fx,.gen-fx *,.gen-fx-img.is-developing,.gen-pipe b,.gen-words li,
  .gen-stamp,.gen-pill,.gen-pill-ring::after,.gen-intro-seq span{animation:none !important;}
  .gen-intro{display:none;}
}