/* 「我现在的做法」章节：沿用米白 / 墨黑 / 朱红，左侧讲做法，右侧给案例 */
.chapter-grid{grid-template-columns:500px minmax(0,1fr);gap:56px}
.chapter-grid .inline-prompt{min-height:220px;flex-basis:220px}
.chapter-grid #example-prompt-text{min-height:120px;font-size:16px}
.chapter-grid h3{font:600 26px/1.3 var(--serif);margin:0}
.chapter-grid ul{margin:0;padding-left:1.1em}

/* slides：一句提示词对一屏网站 */
.site-shot{background:var(--ink)}
.site-shot>img{object-fit:cover;object-position:top}
.site-why{position:absolute;left:24px;bottom:24px;max-width:620px;background:var(--paper);padding:16px 20px;z-index:2;box-shadow:6px 6px 0 var(--red)}
.site-why q{display:block;font:600 22px/1.5 var(--serif);margin-bottom:6px}
.site-why p{font-size:18px;line-height:1.55;color:var(--muted)}
.prompt-chips{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;flex-shrink:0}
.prompt-chips button{width:100%;text-align:left;font-size:17px;line-height:1.4;padding:9px 12px;display:flex;gap:10px;align-items:baseline;border-color:var(--line)}
.prompt-chips small{font:600 14px var(--mono);color:var(--red)}
.prompt-chips button[aria-pressed=true] small{color:var(--paper)}

/* 文旅片：左讲做法，右成片 + 章节轴 */
.film-stage{display:flex;flex-direction:column;gap:12px;min-height:0;min-width:0}
.film-video{flex:1;min-height:0;position:relative;background:var(--ink)}
.film-video:before{content:"";position:absolute;left:0;top:-14px;width:96px;border-top:8px solid var(--red)}
.film-video video{width:100%;height:100%;object-fit:contain}
.film-marks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));border-top:2px solid var(--ink);flex-shrink:0}
.film-marks button{width:100%;border:0;border-right:1px solid var(--line);padding:8px 6px;font-size:15px;line-height:1.35;text-align:left;display:flex;flex-direction:column;gap:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.film-marks small,.vo-lines small{font:600 13px var(--mono);color:var(--red)}
.film-marks button.active{background:var(--ink);color:var(--paper)}
.film-now{min-height:30px;font-size:19px;color:var(--muted);flex-shrink:0}
.film-tabs button{padding:8px 14px;font-size:18px}
.rev-table{width:100%;border-collapse:collapse;font-size:17px;line-height:1.5}
.rev-table th,.rev-table td{border-bottom:1px solid var(--line);padding:9px 8px 9px 0;vertical-align:top;text-align:left}
.rev-table th{width:84px;font-weight:400;color:var(--red);font-size:15px}
.rev-table q{display:block;color:var(--ink)}
.rev-table span{display:block;color:var(--muted)}
.rev-table.compare thead td{font-size:15px;color:var(--muted)}
.brief{font-size:17px!important;line-height:1.6;border-left:4px solid var(--red);padding-left:14px}
.shot-prompt{background:var(--ink);color:var(--paper)!important;padding:18px 20px;font-size:18px!important;line-height:1.7}
.vo-lines{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.vo-lines button{width:100%;border:0;border-bottom:1px solid var(--line);text-align:left;padding:9px 0;font-size:17px;line-height:1.45;display:flex;gap:12px;align-items:baseline}
.vo-lines button.active{background:none;color:var(--red)}

/* 文旅片的标准 */
.city-test{border-top:2px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.city-test .eyebrow{margin:0}
.city-line{font:600 26px/1.5 var(--serif);color:var(--muted)!important;text-decoration:line-through;text-decoration-color:var(--red)}
.city-line.good{color:var(--ink)!important;text-decoration:none}
.standard-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;min-height:0}
.standard-col{display:flex;flex-direction:column;gap:12px;min-height:0;border-top:2px solid var(--ink);padding-top:16px}
.standard-col figure{margin:0;aspect-ratio:16/9;overflow:hidden;background:var(--ink)}
.standard-col figure img{width:100%;object-fit:cover}
.standard-col .step-num{font:600 18px var(--mono);color:var(--red)}
.standard-col ul{font-size:18px;line-height:1.55}
.standard-col li{margin-bottom:6px}
.standard-case{margin-top:auto!important;font-size:16px;line-height:1.6;color:var(--muted);border-left:4px solid var(--red);padding-left:12px}

/* 豆包脸：上排懒提示词，下排写清长相 */
.face-intro{grid-template-columns:440px minmax(0,1fr) 380px;gap:40px}
.why-list,.fix-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.why-list li{border-bottom:1px solid var(--line);padding:10px 0;font-size:17px;line-height:1.55;color:var(--muted)}
.why-list b{display:block;color:var(--ink);font-size:19px}
.face-compare{display:flex;flex-direction:column;gap:8px;min-height:0;min-width:0}
.row-label{font-size:18px;display:flex;justify-content:space-between;border-bottom:2px solid var(--ink);padding-bottom:4px}
.row-label span{color:var(--muted);font-size:15px}
.face-row{flex:1;min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.face-cell{margin:0;display:flex;flex-direction:column;gap:6px;min-height:0}
.face-cell img{flex:1;min-height:0;width:100%;object-fit:cover;object-position:top}
.face-cell figcaption{font-size:14px;line-height:1.4;color:var(--muted);min-height:2.8em}
.face-cell figcaption b{color:var(--ink);font-weight:400}
.face-fix{display:flex;flex-direction:column;gap:16px;min-height:0;overflow:auto}
.fix-list li{display:flex;gap:12px;border-bottom:1px solid var(--line);padding:9px 0}
.fix-list b{font-size:19px}
.fix-list p{font-size:16px;line-height:1.5;color:var(--muted)}
.majic{background:var(--paper-2);padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.majic .eyebrow{margin:0;font-size:15px}
.majic p{font-size:16px;line-height:1.6}

/* 众生相：悬停翻面并放大，背面是完整提示词 */
.faces-grid-layout{grid-template-columns:400px minmax(0,1fr)}
.face-wall{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));grid-auto-rows:1fr;gap:10px;min-height:0}
.face-card{position:relative;padding:0;border:0;background:none;perspective:900px;min-height:0;z-index:1}
.face-card:hover,.face-card:focus-visible,.face-card.flipped{z-index:10;background:none}
/* 外层按所在边缘放大，内层绕卡片中心翻转，边缘的卡片不会翻出画面 */
.face-inner{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:var(--ox) var(--oy);transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.face-flip{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.face-card:hover .face-inner,.face-card:focus-visible .face-inner,.face-card.flipped .face-inner{transform:scale(2.8)}
.face-card:hover .face-flip,.face-card:focus-visible .face-flip,.face-card.flipped .face-flip{transform:rotateY(180deg)}
.face-front,.face-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.face-front img{width:100%;height:100%;object-fit:cover;object-position:top}
.face-label{position:absolute;left:0;right:0;bottom:0;padding:16px 6px 5px;font-size:13px;line-height:1.3;color:var(--paper);background:linear-gradient(transparent,#20231fd9);text-align:left}
.face-back{transform:rotateY(180deg);background:var(--ink);color:var(--paper);padding:6px 7px;font-size:6px;line-height:1.5;text-align:left;box-shadow:0 0 0 .5px var(--red)}
.face-back b{display:block;color:#e8a08f;font-weight:400;font-size:7px;margin-bottom:3px}
.face-card:focus-visible{outline:none}
.face-card:focus-visible .face-back{box-shadow:0 0 0 1px var(--red)}
@media (prefers-reduced-motion:reduce){.face-inner,.face-flip{transition:none}}

/* Agent 三件套 */
.port-note{font-size:19px!important;line-height:1.6;border-left:4px solid var(--red);padding-left:14px}
.stack-main{display:flex;flex-direction:column;gap:20px;min-height:0;min-width:0}
.stack-assets{flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.stack-assets article{display:flex;flex-direction:column;gap:8px;min-height:0;border-top:2px solid var(--ink);padding-top:12px}
.stack-assets figure{margin:0;aspect-ratio:16/9;overflow:hidden;background:var(--ink);flex-shrink:0}
.stack-assets figure img{width:100%;object-fit:cover}
.stack-assets .step-num{font:600 16px var(--mono);color:var(--red)}
.stack-assets .what{font-size:17px;color:var(--muted)}
.stack-assets ul{font-size:17px;line-height:1.55}
.stack-loop{flex-shrink:0;display:flex;flex-direction:column;gap:10px}
.stack-loop ol{list-style:none;margin:0;padding:0;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.stack-loop li{display:flex;align-items:center}
.stack-loop button{font-size:18px;padding:8px 14px;display:flex;gap:8px;align-items:baseline}
.stack-loop small{font:600 13px var(--mono);color:var(--red)}
.stack-loop button[aria-pressed=true] small{color:var(--paper)}
.stack-loop li:not(.loop-back)+li:not(.loop-back):before{content:"→";margin-right:6px;color:var(--muted)}
.loop-back{font-size:16px;color:var(--red);margin-left:8px}
.stack-detail{font-size:20px;background:var(--paper-2);padding:12px 18px}

/* 模型分工 + 技巧 */
.toolkit-main{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;min-height:0}
.model-table{width:100%;border-collapse:collapse;font-size:17px;line-height:1.45;align-self:start}
.model-table thead th{font-size:15px;color:var(--muted);font-weight:400;border-bottom:2px solid var(--ink);text-align:left;padding:6px 8px 6px 0}
.model-table tbody th,.model-table td{border-bottom:1px solid var(--line);padding:11px 10px 11px 0;text-align:left;vertical-align:top}
.model-table tbody th{font-weight:600;width:150px}
.model-table td:last-child{color:var(--muted);font-size:16px}
.tip-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink);overflow:auto;min-height:0}
.tip-list li{display:flex;gap:14px;border-bottom:1px solid var(--line);padding:6px 0;font-size:16px;line-height:1.45;color:var(--muted)}
.tip-list li>span{font:600 14px var(--mono);color:var(--red);padding-top:3px}
.tip-list b{display:block;color:var(--ink);font-size:17px}

/* 代码动画放映厅：整块深色放映台 */
.slide.code-motion{gap:22px}
.code-show{--night:#0e0f11;--paper-dim:#9b958a;--hair:#ffffff1c;flex:1;min-height:0;display:grid;grid-template-columns:440px minmax(0,1fr);background:radial-gradient(120% 90% at 70% 40%,#1a1c20 0%,var(--night) 60%);color:var(--paper);position:relative;overflow:hidden;box-shadow:0 30px 60px -30px #20231f80}
.code-show:before{content:"";position:absolute;left:0;top:0;width:96px;border-top:8px solid var(--red);z-index:3}
.code-rail{padding:28px 26px 22px;border-right:1px solid var(--hair);gap:16px!important}
.code-rail h2{font:600 30px/1.35 var(--serif);color:var(--paper);letter-spacing:-.5px}
.code-rail .red{color:#e2735e;display:block}
.code-rail h2 small{display:block;font:500 13px var(--mono);letter-spacing:.14em;color:var(--paper-dim);margin-bottom:6px}
.code-rail .inline-prompt{min-height:200px;flex-basis:200px}
.code-rail .prompt-head b{color:var(--paper);font-size:20px}
.code-rail .prompt-head button,.code-rail .example-prompt-picker select{color:var(--paper);border-color:#ffffff40;background:transparent}
.code-rail .example-prompt-picker{color:var(--paper-dim)}
.code-rail .example-prompt-picker select option{color:var(--ink)}
.code-rail #example-prompt-text{background:#ffffff0a;box-shadow:inset 0 0 0 1px var(--hair);font-size:15px;min-height:110px}
.code-rail .example-prompt-note{color:var(--paper-dim)!important;font-size:13px!important;line-height:1.4}
.code-picks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.code-pick{width:100%;display:flex;gap:14px;align-items:center;padding:8px;border:1px solid var(--hair);background:#ffffff05;color:var(--paper);text-align:left;transition:border-color .3s,background .3s}
.code-pick:hover{border-color:#e2735e99;color:var(--paper);background:#ffffff0a}
.code-pick[aria-pressed=true]{background:#bf402c1f;border-color:var(--red);color:var(--paper)}
.pick-thumb{width:128px;aspect-ratio:16/9;overflow:hidden;flex-shrink:0;background:#000}
.pick-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.code-pick:hover .pick-thumb img{transform:scale(1.08)}
.pick-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.pick-text small{font:500 12px var(--mono);letter-spacing:.12em;color:#e2735e}
.pick-text b{font:600 19px/1.3 var(--serif)}
.pick-tags{display:flex;flex-wrap:wrap;gap:4px}
.pick-tags i{font:normal 11px/1 var(--mono);color:var(--paper-dim);border:1px solid var(--hair);padding:3px 6px}
.code-stage{position:relative;min-width:0;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:10px;padding:18px 30px 14px}
.crop{position:absolute;width:18px;height:18px;border:0 solid #e2735e;opacity:.8}
.crop.tl{left:12px;top:12px;border-left-width:1.5px;border-top-width:1.5px}.crop.tr{right:12px;top:12px;border-right-width:1.5px;border-top-width:1.5px}
.crop.bl{left:12px;bottom:12px;border-left-width:1.5px;border-bottom-width:1.5px}.crop.br{right:12px;bottom:12px;border-right-width:1.5px;border-bottom-width:1.5px}
.code-hud{display:flex;align-items:center;gap:22px;font:500 13px var(--mono);letter-spacing:.12em;color:var(--paper-dim);padding:0 6px}
.code-hud .live{display:flex;align-items:center;gap:8px;color:#e2735e}
.code-hud .live i{width:8px;height:8px;border-radius:50%;background:#e2735e;box-shadow:0 0 0 0 #e2735e99;animation:live 1.6s infinite}
@keyframes live{0%{box-shadow:0 0 0 0 #e2735e99}70%{box-shadow:0 0 0 10px #e2735e00}100%{box-shadow:0 0 0 0 #e2735e00}}
.code-hud.paused .live i{animation:none;background:var(--paper-dim)}
.code-chapter-now{font:500 15px var(--sans);letter-spacing:.04em;color:var(--paper)}
.code-clock b{font:600 18px var(--mono);color:var(--paper);font-variant-numeric:tabular-nums;letter-spacing:0}
.code-clock em{font-style:normal}
.code-controls{margin-left:auto;display:flex;gap:6px}
.code-controls button,.code-controls button[aria-pressed]{font:500 13px var(--sans);letter-spacing:.06em;padding:5px 12px;border:1px solid #ffffff38;color:var(--paper);background:transparent}
.code-controls button:hover{border-color:#e2735e;color:#e2735e}
.code-screen{min-height:0;display:flex;align-items:center;justify-content:center}
.code-screen iframe{height:100%;max-width:100%;aspect-ratio:16/9;border:0;background:#000;box-shadow:0 40px 90px -20px #000,0 0 0 1px #ffffff14}
.code-timeline{position:relative;cursor:pointer;padding:8px 6px 0}
.code-track{position:relative;height:3px;background:#ffffff1f}
.code-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:#e2735e;box-shadow:0 0 14px #e2735e}
.code-fill:after{content:"";position:absolute;right:-5px;top:-4px;width:11px;height:11px;border-radius:50%;background:var(--paper);box-shadow:0 0 0 3px #e2735e66}
.code-chapters{list-style:none;margin:0;padding:0;position:relative;height:38px}
.code-chapters li{position:absolute;top:0;height:100%}
.code-chapters button{width:100%;height:100%;border:0;border-left:1px solid #ffffff2e;padding:6px 8px 0;text-align:left;font:13px/1.25 var(--sans);color:#8d877b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;flex-direction:column}
.code-chapters button small{font:500 11px var(--mono);color:#6e695f}
.code-chapters li.done button{color:#c9c2b4}
.code-chapters li.active button{color:var(--paper)}
.code-chapters li.active button small{color:#e2735e}
.code-chapters button:hover{color:var(--paper);background:#ffffff08}
.code-foot{display:flex;gap:26px;font-size:13px!important;color:#7d776c!important;padding:0 6px;margin:0}
.code-foot span:before{content:"/ ";color:#e2735e}
.code-stage:fullscreen{background:#08090a;padding:28px 40px 20px}
@media (prefers-reduced-motion:reduce){.code-hud .live i{animation:none}.pick-thumb img{transition:none}}
