[data-puxin-product-case08]{--paper:#f7f4ee;--bright:#fffdf8;--well:#efe8dc;--line:#d8c8ae;--gold:#b79255;--darkgold:#7f633d;--ink:#453f38;--muted:#766b5d;--serif:"Noto Serif SC","Songti SC","SimSun",serif;color-scheme:light;background:var(--paper);color:var(--ink);font:14px/1.65 "Noto Sans SC","Microsoft YaHei",sans-serif;border:1px solid var(--line);border-radius:14px;overflow:hidden;width:100%}
[data-puxin-product-case08] *{box-sizing:border-box}[data-puxin-product-case08] [hidden]{display:none!important}[data-puxin-product-case08] h2,[data-puxin-product-case08] h3,[data-puxin-product-case08] h4,[data-puxin-product-case08] p,[data-puxin-product-case08] figure{margin:0}[data-puxin-product-case08] h2,[data-puxin-product-case08] h3,[data-puxin-product-case08] h4{font-family:var(--serif);font-weight:500}[data-puxin-product-case08] h2{font-size:25px}[data-puxin-product-case08] h3{font-size:19px}[data-puxin-product-case08] h4{font-size:16px;margin:10px 0 5px}[data-puxin-product-case08] button{font:inherit;color:var(--ink);background:var(--bright);border:1px solid var(--line);border-radius:7px;min-height:44px;padding:9px 12px;text-align:left;cursor:pointer;touch-action:manipulation}[data-puxin-product-case08] button:hover{border-color:var(--gold);background:#f6efe0}[data-puxin-product-case08] button[aria-pressed=true],[data-puxin-product-case08] button[aria-expanded=true]{background:#eee0c5;border-color:var(--darkgold)}[data-puxin-product-case08] button.primary{background:var(--ink);color:var(--bright);border-color:var(--ink)}[data-puxin-product-case08] button:disabled{opacity:.55;cursor:default}[data-puxin-product-case08] .muted,[data-puxin-product-case08] figcaption{font-size:12px;color:var(--muted)}[data-puxin-product-case08] .kicker{font-size:11px;color:var(--darkgold);letter-spacing:.1em}[data-puxin-product-case08] header{padding:18px 22px 12px;display:flex;gap:14px;justify-content:space-between;align-items:center}[data-puxin-product-case08] .tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:0 22px 12px}[data-puxin-product-case08] .tools p{flex:1;min-width:160px;font-size:12px;color:var(--muted)}[data-puxin-product-case08] #c8-storage-status[data-failed=true]{color:#914d40}[data-puxin-product-case08] nav{display:flex;flex-wrap:wrap;gap:6px;padding:0 22px 14px;border-bottom:1px solid var(--line)}[data-puxin-product-case08] nav button{font-size:12px}[data-puxin-product-case08] .panel{padding:18px 22px;border-bottom:1px solid var(--gold);background:var(--bright)}[data-puxin-product-case08] .panel-head,[data-puxin-product-case08] .work-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}[data-puxin-product-case08] .panel p{margin:7px 0}[data-puxin-product-case08] .panel ul{padding-left:20px}[data-puxin-product-case08] .home{padding:22px;display:grid;grid-template-columns:.8fr 1.2fr;gap:24px;align-items:center}[data-puxin-product-case08] .home h3{font-size:25px;margin:10px 0}[data-puxin-product-case08] figure img{display:block;width:100%;border-radius:7px}[data-puxin-product-case08] figcaption{margin-top:7px}[data-puxin-product-case08] .row{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-top:12px}[data-puxin-product-case08] .progress{display:flex;flex-wrap:wrap;list-style:none;gap:5px;padding:12px 22px;margin:0}[data-puxin-product-case08] .progress li{padding:4px 8px;font-size:11px;background:var(--well);border-radius:4px}[data-puxin-product-case08] .progress [aria-current]{background:var(--ink);color:var(--bright)}[data-puxin-product-case08] .stage{display:grid;grid-template-columns:105px minmax(0,1fr) 230px;gap:16px;padding:20px;background:var(--well);align-items:start}[data-puxin-product-case08] .person{align-self:end;overflow:hidden}[data-puxin-product-case08] .person img{border-radius:0}[data-puxin-product-case08] .person figcaption{font-size:11px;text-align:center;background:var(--paper);padding:5px}[data-puxin-product-case08] .work,[data-puxin-product-case08] aside{min-width:0;padding:15px;background:var(--paper);border:1px solid var(--gold);border-radius:10px}[data-puxin-product-case08] #c8-actions{display:grid;gap:8px;margin-top:12px}[data-puxin-product-case08] #c8-actions p{font-size:12px;color:var(--muted)}[data-puxin-product-case08] #c8-feature{font-size:12px;margin-top:12px;border-top:1px solid var(--line);padding-top:10px}[data-puxin-product-case08] .boundary{font-size:11px;color:var(--muted);margin-top:12px;border-top:1px solid var(--line);padding-top:10px}[data-puxin-product-case08] .choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:12px}[data-puxin-product-case08] .choices button{padding:5px;font-size:11px;min-width:0}[data-puxin-product-case08] .choices img{display:block;width:100%;margin-bottom:5px;border-radius:3px}[data-puxin-product-case08] .dialogue{padding:18px 22px;display:flex;gap:14px;align-items:start;border-top:1px solid var(--gold)}[data-puxin-product-case08] .dialogue>img{width:54px;height:66px;object-fit:cover;object-position:top;border:1px solid var(--gold);border-radius:50%}[data-puxin-product-case08] .dialogue>div{flex:1;min-width:0}[data-puxin-product-case08] #c8-line{font:16px/1.8 var(--serif);margin-top:5px}[data-puxin-product-case08] #c8-message{margin-top:6px}[data-puxin-product-case08] .path-board{background:var(--bright);border:1px solid var(--line);padding:9px;margin-top:12px;border-radius:7px}[data-puxin-product-case08] .path-board svg{display:block;width:100%;height:auto}[data-puxin-product-case08] .path-board text{font:14px "Microsoft YaHei",sans-serif;fill:var(--ink)}[data-puxin-product-case08] .path-board .wire{fill:none;stroke:#999189;stroke-width:5;stroke-linecap:round}[data-puxin-product-case08] .path-board .follow{stroke:var(--ink);stroke-width:7;stroke-dasharray:12 5}[data-puxin-product-case08] .path-board p{font-size:11px;color:var(--muted)}[data-puxin-product-case08] .path-description{font-size:12px;margin-top:8px}[data-puxin-product-case08] .before-after{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}[data-puxin-product-case08] .before-after img{width:100%;display:block;border-radius:5px}[data-puxin-product-case08] .before-after p{font-size:11px}[data-puxin-product-case08] .card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}[data-puxin-product-case08] .tip{border-top:2px solid var(--gold);padding-top:5px;min-width:0}[data-puxin-product-case08] .version{padding:10px 0;border-bottom:1px solid var(--line)}[data-puxin-product-case08] .version p{font-size:12px}[data-puxin-product-case08] .workcard{padding:12px;border:1px solid var(--gold);margin:12px 0;display:grid;grid-template-columns:130px minmax(0,1fr);gap:15px}[data-puxin-product-case08] .workcard img{width:100%;display:block}[data-puxin-product-case08] .workcard p{font-size:12px}[data-puxin-product-case08] .intro{padding:18px 22px}[data-puxin-product-case08] .intro-frame{position:relative;aspect-ratio:16/9;background:var(--well);overflow:hidden;border:1px solid var(--gold);border-radius:8px}[data-puxin-product-case08] .intro-frame video,[data-puxin-product-case08] #c8-intro-photo{width:100%;height:100%;display:block;object-fit:cover}[data-puxin-product-case08] .intro-frame video{position:absolute;inset:0;object-fit:contain;background:#201c17}[data-puxin-product-case08] #c8-intro-person{position:absolute;height:85%;width:35%;object-fit:contain;bottom:0;left:2%}[data-puxin-product-case08] .intro-caption{position:absolute;bottom:0;left:0;right:0;padding:12px 18px;background:rgba(247,244,238,.95);border-top:1px solid var(--gold)}[data-puxin-product-case08] .intro-caption span{font-size:11px;color:var(--darkgold)}[data-puxin-product-case08] .intro-caption p{font:19px/1.5 var(--serif);margin-top:4px}[data-puxin-product-case08] progress{width:95px;accent-color:var(--darkgold)}[data-puxin-product-case08] #c8-intro-note{margin-top:9px}
@media(max-width:850px){[data-puxin-product-case08] .stage{grid-template-columns:minmax(0,1fr) 220px}[data-puxin-product-case08] .person{display:none}}
@media(max-width:600px){[data-puxin-product-case08] header{display:block;padding:16px}[data-puxin-product-case08] h2{font-size:22px}[data-puxin-product-case08] nav,[data-puxin-product-case08] .tools{padding-left:16px;padding-right:16px}[data-puxin-product-case08] .home,[data-puxin-product-case08] .stage,[data-puxin-product-case08] .card-grid{grid-template-columns:1fr;padding:13px;gap:13px}[data-puxin-product-case08] .dialogue{padding:15px;flex-wrap:wrap;gap:10px}[data-puxin-product-case08] .dialogue>img{width:42px;height:53px}[data-puxin-product-case08] .dialogue>div{flex:1 1 calc(100% - 62px)}[data-puxin-product-case08] #c8-sim-label{margin-left:52px}[data-puxin-product-case08] .panel,[data-puxin-product-case08] .intro{padding:14px}[data-puxin-product-case08] .intro-frame{aspect-ratio:4/3}[data-puxin-product-case08] .intro-caption p{font-size:16px}[data-puxin-product-case08] .workcard{grid-template-columns:85px minmax(0,1fr);gap:10px}[data-puxin-product-case08] .card-grid{padding:0}}
@media(prefers-reduced-motion:reduce){[data-puxin-product-case08] *,[data-puxin-product-case08] *::before,[data-puxin-product-case08] *::after{animation:none!important;transition:none!important}}

[data-puxin-product-case08] .feedback-quote{margin:0 0 7px;padding:10px;border-left:3px solid var(--gold);background:var(--bright)}[data-puxin-product-case08] .feedback-quote span{font-size:11px;color:var(--darkgold)}[data-puxin-product-case08] #c8-actions .feedback-quote p{font:15px/1.7 var(--serif);color:var(--ink);margin-top:5px}
@media(min-width:601px){[data-puxin-product-case08] #c8-photo{max-height:360px;object-fit:contain;background:var(--bright)}}

/* C08 的观察条件与即时结果。尺寸和配色继续使用事务所终端变量。 */
[data-puxin-product-case08] .c8-step-guide{margin:12px 0;padding:11px 13px;border-left:3px solid var(--gold);background:var(--bright)}
[data-puxin-product-case08] .c8-step-guide b{display:block;margin:5px 0;font-size:14px;line-height:1.65;color:var(--ink)}
[data-puxin-product-case08] .c8-step-guide p{font-size:12px;line-height:1.65;color:var(--muted);margin:4px 0 0}
[data-puxin-product-case08] .c8-gray{filter:grayscale(1)}
[data-puxin-product-case08] #c8-photo-tools{position:sticky;top:-15px;z-index:2;background:var(--paper);padding:8px 0;margin:0 0 8px;border-bottom:1px solid var(--line)}
[data-puxin-product-case08] #c8-photo-tools:empty{display:none}
[data-puxin-product-case08] .c8-view-label{flex:1 0 100%;font-size:12px}
[data-puxin-product-case08] .c8-view-label b{color:var(--darkgold);display:block}
[data-puxin-product-case08] .c8-view-label span{color:var(--muted);display:block;margin-top:3px}
[data-puxin-product-case08] #c8-photo-tools button{min-height:38px;font-size:12px;padding:7px 12px}
[data-puxin-product-case08] .c8-local-feedback{padding:10px 12px;border-left:3px solid var(--gold);background:var(--well);font-size:12px;line-height:1.75}
[data-puxin-product-case08] #c8-actions .c8-local-feedback{color:var(--ink)}
[data-puxin-product-case08] #c8-before-after{display:block}
[data-puxin-product-case08] .c8-revision-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
[data-puxin-product-case08] .c8-revision-pair figure{min-width:0;padding:7px;border:1px solid var(--line);background:var(--bright);border-radius:5px}
[data-puxin-product-case08] .c8-revision-pair img{width:100%;height:auto;object-fit:contain}
[data-puxin-product-case08] .c8-method-cards{display:grid;gap:16px}
[data-puxin-product-case08] .c8-method-card{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;align-items:center;background:var(--paper);border-top:2px solid var(--gold);padding:14px}
[data-puxin-product-case08] .c8-method-card>*{min-width:0}
[data-puxin-product-case08] .c8-method-card img{display:block;width:100%;height:auto;object-fit:contain;border:1px solid var(--line)}
[data-puxin-product-case08] .c8-method-card h4{font:600 18px/1.5 var(--serif);margin:0 0 8px}
[data-puxin-product-case08] .c8-method-card p{font-size:12px;line-height:1.8}
[data-puxin-product-case08] .c8-tip-question{border-top:1px solid var(--line);padding-top:10px;margin-top:10px}
[data-puxin-product-case08] .c8-tip-question b{display:block;color:var(--darkgold)}
[data-puxin-product-case08] .c8-reason,[data-puxin-product-case08] .c8-part-choices{display:grid;gap:6px}
[data-puxin-product-case08] .c8-use-status{font-size:12px;line-height:1.7}
[data-puxin-product-case08] .c8-use-status b{color:var(--darkgold)}
.tkp-layer #c8-actions .c8-reason{padding:10px 12px;border-bottom:1px solid var(--line)}
.tkp-layer #c8-actions .c8-reason>button,.tkp-layer #c8-actions .c8-part-choices>button{padding:10px 12px;min-height:44px;font:13px/1.7 var(--sans);border:1px solid var(--line);border-radius:5px;background:var(--bright)}
.tkp-layer #c8-actions .c8-reason>button:before,.tkp-layer #c8-actions .c8-part-choices>button:before{display:none}
.tkp-layer #c8-actions .c8-reason>button[aria-pressed=true],.tkp-layer #c8-actions .c8-part-choices>button[aria-pressed=true]{border-color:var(--darkgold);background:var(--well);box-shadow:inset 3px 0 0 var(--gold)}
.tkp-layer #c8-actions .c8-part-choices{padding:8px 12px}
.tkp-layer #c8-actions .c8-use-status{padding:12px 16px;border-bottom:1px solid var(--line);background:var(--bright)}
.tkp-layer #c8-actions #c8-complete{padding-right:18px;background:var(--gold);color:#fff;line-height:1.6}
.tkp-layer #c8-actions #c8-complete:after{display:none}
.tkp-layer #c8-actions #c8-complete:before{color:#fff}
@media(max-width:620px){[data-puxin-product-case08] .c8-method-card,[data-puxin-product-case08] .c8-revision-pair{grid-template-columns:1fr}[data-puxin-product-case08] .c8-method-card{gap:9px}[data-puxin-product-case08] .c8-step-guide{padding:10px}}

/* 路线是独立可点击关系图；照片保持原图比例。 */
[data-puxin-product-case08] .path-board {padding:13px;background:var(--bright);border:1px solid var(--line);border-radius:8px;margin-top:12px}
[data-puxin-product-case08] .path-board h4{margin:0 0 8px;font-size:16px}
[data-puxin-product-case08] .path-board svg{width:100%;height:auto;max-height:380px;display:block;overflow:visible}
[data-puxin-product-case08] .path-board svg text{font:13px "Microsoft YaHei",sans-serif;fill:var(--ink)}
[data-puxin-product-case08] .path-board>p{font-size:12px;margin-top:10px;line-height:1.7}
[data-puxin-product-case08] .c8-table{fill:#ded2bd;stroke:#9c8970;stroke-width:2}
[data-puxin-product-case08] .c8-support{fill:none;stroke:#777168;stroke-width:14;stroke-linejoin:round}
[data-puxin-product-case08] .c8-hook{fill:none;stroke:#7f796f;stroke-width:18;stroke-linecap:round;stroke-linejoin:round}
[data-puxin-product-case08] .c8-loop{fill:#b9c5bd;stroke:#507362;stroke-width:3}
[data-puxin-product-case08] .c8-gap{fill:none;stroke:#b48b45;stroke-width:5;stroke-dasharray:5 4}
[data-puxin-product-case08] .c8-route-line{fill:none;stroke-width:4;stroke-dasharray:8 6;pointer-events:none}
[data-puxin-product-case08] .c8-route-target{fill:none;stroke:transparent;stroke-width:30;cursor:pointer;pointer-events:stroke}
[data-puxin-product-case08] .c8-svg-route[role=button]{cursor:pointer;outline:none}
[data-puxin-product-case08] .c8-svg-route[role=button] text{paint-order:stroke;stroke:var(--bright);stroke-width:5;stroke-linejoin:round;font-size:14px;pointer-events:all}
[data-puxin-product-case08] .c8-svg-route.is-selected .c8-route-line{stroke-width:7;stroke-dasharray:none}
[data-puxin-product-case08] .c8-svg-route[role=button]:focus-visible .c8-route-target,[data-puxin-product-case08] .c8-svg-route[role=button]:hover .c8-route-target{stroke:rgba(183,146,85,.2)}
[data-puxin-product-case08] #c8-choices:not(:empty){margin:8px 0 12px}
[data-puxin-product-case08] #c8-task .c8-local-feedback{margin:12px 0 0;color:var(--ink)}
[data-puxin-product-case08] #c8-photo{object-fit:contain!important;object-position:center;aspect-ratio:3/2}
@media(max-width:620px){[data-puxin-product-case08] .path-board svg text,[data-puxin-product-case08] .path-board .c8-svg-route[role=button] text{font-size:22px}[data-puxin-product-case08] .path-board{padding:9px}}
/* 路径观察真正切换主图；应用照片作为完整、不裁切的动作参考。 */
[data-puxin-product-case08].c8-diagram-view .work>figure{display:none}
[data-puxin-product-case08].c8-diagram-view .choices img{display:none}
[data-puxin-product-case08].c8-use-view .c8-context{display:grid;grid-template-columns:minmax(0,1fr) 145px;gap:12px;align-items:center}
[data-puxin-product-case08].c8-use-view .c8-context .c8-step-guide{margin:0}
[data-puxin-product-case08].c8-use-view .c8-context figure{margin:0;min-width:0}
[data-puxin-product-case08].c8-use-view #c8-photo{width:100%;height:auto!important;max-height:116px!important;aspect-ratio:3/2;object-fit:contain!important;background:var(--bright)}
[data-puxin-product-case08].c8-use-view .c8-context figcaption{font-size:11px;line-height:1.5}
[data-puxin-product-case08].c8-use-view .path-board{margin-top:10px;padding:10px}
[data-puxin-product-case08].c8-use-view .path-board h4{margin-bottom:3px}
[data-puxin-product-case08].c8-use-view .path-board>p{margin-top:6px}
[data-puxin-product-case08].c8-use-view #c8-feature:empty{display:none}
@media(max-width:1100px),(max-height:639px){[data-puxin-product-case08].c8-use-view .c8-context{display:block}[data-puxin-product-case08].c8-use-view .c8-context figure{margin:10px 0 0}[data-puxin-product-case08].c8-use-view #c8-photo{height:120px!important;max-height:120px!important;aspect-ratio:auto}[data-puxin-product-case08].c8-use-view .c8-context figcaption{text-align:center}}

/* 部位图可点击区比标记更大，照片始终完整显示。 */
[data-puxin-product-case08] .c8-cup-body{fill:#e7e2d9;stroke:#6b655d;stroke-width:3}
[data-puxin-product-case08] .c8-cup-cap{fill:#d7d2c7;stroke:#6b655d;stroke-width:2}
[data-puxin-product-case08] .c8-flip{fill:#ebe7df;stroke:#7f796e;stroke-width:2}
[data-puxin-product-case08] .c8-rib{fill:none;stroke:#bcb5a7;stroke-width:1.5}
[data-puxin-product-case08] .c8-band{fill:#cfc7b7;stroke:#a99e89;stroke-width:1.5}
[data-puxin-product-case08] .c8-part-leader{fill:none;stroke-width:2}
[data-puxin-product-case08] .c8-part-number{fill:#fff;font-weight:bold;pointer-events:none}
[data-puxin-product-case08] .c8-part-target,[data-puxin-product-case08] .c8-label-target{fill:transparent;stroke:transparent;pointer-events:all}
[data-puxin-product-case08] .c8-svg-part[role=button]{cursor:pointer;outline:none}
[data-puxin-product-case08] .c8-svg-part[role=button]:hover .c8-part-target,[data-puxin-product-case08] .c8-svg-part[role=button]:focus-visible .c8-part-target{fill:rgba(183,146,85,.2);stroke:#7f633d;stroke-width:2}
[data-puxin-product-case08] .c8-svg-part.is-selected .c8-part-dot{stroke:#fff;stroke-width:3}
[data-puxin-product-case08] .path-board svg{max-height:350px}
[data-puxin-product-case08] .path-board svg text{font-size:14px}
[data-puxin-product-case08] .path-board .c8-part-label{font-size:14px}
[data-puxin-product-case08] .path-board .c8-part-number{font-size:15px}
[data-puxin-product-case08].c8-diagram-view .work>figure{display:none}
@media(max-width:620px){[data-puxin-product-case08] .path-board svg{max-height:none}[data-puxin-product-case08] .path-board svg text,[data-puxin-product-case08] .path-board .c8-part-label{font-size:18px}[data-puxin-product-case08] .path-board .c8-part-number{font-size:19px}}

/* C08 固定杯形的色材基准与可读提示。 */
[data-puxin-product-case08] .c8-baseline-picker{flex:1 0 100%;padding:12px;background:var(--bright);border:1px solid var(--line);border-radius:6px;margin:8px 0}
[data-puxin-product-case08] .c8-baseline-picker small,[data-puxin-product-case08] .c8-baseline-note{display:block;font-size:11px;color:var(--muted);margin-top:8px}
[data-puxin-product-case08] .c8-baseline-picker .row{margin:8px 0}
[data-puxin-product-case08] .c8-cup-body{fill:#777069;stroke:#4c4944}
[data-puxin-product-case08] .c8-band{fill:#777069;stroke:#655f58}
[data-puxin-product-case08] .c8-rib{stroke:#948b80}
[data-puxin-product-case08] .c8-step-guide{scroll-margin-top:24px}

/* C08 过程表达：静态三步与四镜屏幕预演。 */
[data-puxin-product-case08].c8-story-view .work>figure{display:none}
[data-puxin-product-case08] .c8-step-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:12px 0;align-items:start}
[data-puxin-product-case08] .c8-step-board figure{min-width:0;border:1px solid var(--line);background:var(--bright);padding:6px}
[data-puxin-product-case08] .c8-step-board img{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;display:block}
[data-puxin-product-case08] .c8-step-board figcaption{font-size:12px;line-height:1.65;margin-top:8px}
[data-puxin-product-case08] .c8-frame-image{position:relative}
[data-puxin-product-case08] .c8-direction-cue{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px;background:#f4e7c6;border:1px solid #b08a48;color:#775823;font-size:12px;line-height:1.5}
[data-puxin-product-case08] .c8-direction-cue svg{width:64px;height:35px;flex:0 0 64px}
[data-puxin-product-case08] .c8-frame-image>.c8-direction-cue{position:static;margin-top:6px}
[data-puxin-product-case08] .c8-choice-images{display:flex;gap:2px;width:100%}
[data-puxin-product-case08] .c8-choice-images img{width:0!important;min-width:0;flex:1;height:auto!important;aspect-ratio:3/2;object-fit:contain!important}
[data-puxin-product-case08] #c8-choices button>b,[data-puxin-product-case08] #c8-choices button>span{display:block;font-size:12px;padding:3px 5px}
[data-puxin-product-case08] #c8-choices button>span{font-weight:400;color:var(--muted);font-size:11px}
[data-puxin-product-case08] .c8-screen-preview{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:7px;background:var(--bright)}
[data-puxin-product-case08] .c8-preview-heading{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;margin-bottom:8px}
[data-puxin-product-case08] .c8-preview-heading span{color:var(--muted)}
[data-puxin-product-case08] .c8-screen{position:relative;text-align:center}
[data-puxin-product-case08] .c8-screen>img{width:100%;height:260px;object-fit:contain;background:var(--paper)}
[data-puxin-product-case08] #c8-preview-cue{position:absolute;bottom:34px;right:5px}
[data-puxin-product-case08] .c8-preview-controls{margin:9px 0;font-size:12px}
[data-puxin-product-case08] .c8-preview-controls button{font-size:12px;padding:6px 9px;min-height:36px}
[data-puxin-product-case08] .c8-frame-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:0;gap:6px;list-style:none}
[data-puxin-product-case08] .c8-frame-strip li{min-width:0}
[data-puxin-product-case08] .c8-frame-strip button{padding:5px;width:100%;font-size:10px;line-height:1.5}
[data-puxin-product-case08] .c8-frame-strip img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;margin-bottom:5px}
[data-puxin-product-case08] .c8-order-board{margin-top:12px}
[data-puxin-product-case08] .c8-order-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}
[data-puxin-product-case08] .c8-order-cards article{padding:8px;border:1px solid var(--line);border-radius:6px;min-width:0;background:var(--bright)}
[data-puxin-product-case08] .c8-order-cards img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
[data-puxin-product-case08] .c8-order-cards p{font-size:12px;line-height:1.6;margin:5px 0}
[data-puxin-product-case08] .c8-order-cards .row{gap:4px}
[data-puxin-product-case08] .c8-order-cards button{font-size:12px;min-height:40px;padding:5px 9px}
[data-puxin-product-case08] .c8-order-number{font-size:12px;color:var(--darkgold)}
[data-puxin-product-case08] .c8-direction-line{fill:none;pointer-events:none}
[data-puxin-product-case08] .c8-direction-target{fill:none;stroke:transparent;stroke-width:24;pointer-events:stroke}
[data-puxin-product-case08] .c8-direction-label-box{fill:var(--bright);stroke:var(--line);stroke-width:1.5}
[data-puxin-product-case08] .c8-svg-direction{cursor:pointer;outline:none}
[data-puxin-product-case08] .c8-svg-direction[aria-pressed=true] .c8-direction-label-box{fill:var(--well);stroke:var(--darkgold);stroke-width:3}
[data-puxin-product-case08] .c8-svg-direction:focus-visible .c8-direction-label-box,[data-puxin-product-case08] .c8-svg-direction:hover .c8-direction-label-box{stroke:var(--darkgold);stroke-width:3}
[data-puxin-product-case08] .c8-flip{fill:#bba576;stroke:#655b48}
[data-puxin-product-case08] .path-board svg .c8-part-label{font-size:17px}
[data-puxin-product-case08] .path-board svg .c8-object-label{font-size:13px}
@media(max-width:620px){[data-puxin-product-case08] .c8-step-board,[data-puxin-product-case08] .c8-order-cards{grid-template-columns:1fr}[data-puxin-product-case08] .c8-step-board figure{display:grid;grid-template-columns:minmax(0,1fr) 104px;align-items:center;gap:8px}[data-puxin-product-case08] .c8-frame-image{padding-bottom:0}[data-puxin-product-case08] .c8-frame-image>.c8-direction-cue{position:static;min-height:0;font-size:11px}[data-puxin-product-case08] .c8-direction-cue svg{width:48px;flex-basis:48px}[data-puxin-product-case08] .c8-screen>img{height:220px}[data-puxin-product-case08] .c8-frame-strip{grid-template-columns:repeat(2,minmax(0,1fr))}[data-puxin-product-case08] .c8-frame-strip button{font-size:12px}[data-puxin-product-case08] .c8-order-cards article{display:grid;grid-template-columns:100px minmax(0,1fr);gap:5px 10px}[data-puxin-product-case08] .c8-order-number{grid-column:1/-1}[data-puxin-product-case08] .c8-order-cards img{grid-row:span 2}[data-puxin-product-case08] .c8-order-cards .row{align-self:start}[data-puxin-product-case08] .path-board svg .c8-part-label{font-size:20px}[data-puxin-product-case08] .path-board svg .c8-object-label{font-size:17px}}

/* Learning revision: the student's editable composition stays separate from reference photography. */
[data-puxin-product-case08] .c8-editor,[data-puxin-product-case08] .c8-composer{padding:14px;border:1px solid var(--gold);background:var(--bright);border-radius:9px;margin:12px 0}
[data-puxin-product-case08] fieldset{border:1px solid var(--line);margin:10px 0;padding:10px;display:flex;flex-wrap:wrap;gap:8px;min-width:0}
[data-puxin-product-case08] legend{padding:0 6px;color:var(--darkgold)}
[data-puxin-product-case08] .c8-saved-artifact{margin:14px 0;padding:12px;border:1px solid var(--line);border-radius:8px;overflow:hidden}
[data-puxin-product-case08] .c8-saved-artifact svg,[data-puxin-product-case08] .c8-editor svg{width:100%;height:auto;display:block;max-width:100%}
[data-puxin-product-case08] .c8-compose-frames{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:10px 0}
[data-puxin-product-case08] .c8-compose-frames article{min-width:0;border:1px solid var(--line);padding:8px;border-radius:7px}
[data-puxin-product-case08] .c8-compose-frames img{display:block;width:100%;height:auto}
@media(max-width:600px){[data-puxin-product-case08] .c8-compose-frames,[data-puxin-product-case08] .c8-artifact-frames{grid-template-columns:1fr!important}[data-puxin-product-case08] .c8-compose-frames button{flex:1;min-width:0}}

/* Short everyday story: one choice, one response, one local change. */
[data-puxin-product-case08][data-story-revision="1"] .story-clues,[data-puxin-product-case08] .story-hints{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
[data-puxin-product-case08] .story-hints p{flex-basis:100%;padding:8px 10px;background:var(--bright);border-left:2px solid var(--gold)}
[data-puxin-product-case08] .story-option-images{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%}
[data-puxin-product-case08] .story-option-images button{padding:7px;min-width:0;display:block}[data-puxin-product-case08] .story-option-images img{display:block;width:100%;height:auto;object-fit:contain}
[data-puxin-product-case08] .story-option-images b{display:block;margin-top:6px;font-size:13px}
[data-puxin-product-case08] .story-mini-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px}
[data-puxin-product-case08] .story-frames{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:10px 0}
[data-puxin-product-case08] .story-frames figure{min-width:0;border:1px solid var(--line);padding:8px;border-radius:8px;background:var(--bright)}
[data-puxin-product-case08] .story-frames img{width:100%;height:auto;display:block}[data-puxin-product-case08] .story-frames [draggable=true]{cursor:grab}
[data-puxin-product-case08] .story-frame-image{position:relative}[data-puxin-product-case08] .story-cue{background:#ece0c6;color:#665032;display:flex;align-items:center;gap:6px;padding:7px;font-size:12px}[data-puxin-product-case08] .story-cue svg{width:58px;height:26px;flex:none}
[data-puxin-product-case08] .story-family svg{width:100%;height:auto;max-height:315px;display:block}[data-puxin-product-case08] .story-family text{font-size:15px;fill:#50483d}
[data-puxin-product-case08] .story-callback,[data-puxin-product-case08] .story-note,[data-puxin-product-case08] .story-workcard{padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--bright);margin:10px 0}
[data-puxin-product-case08] .story-history article{border-bottom:1px solid var(--line);padding:10px 0}
[data-puxin-product-case08][data-story-revision="1"] .choices{display:block}
[data-puxin-product-case08][data-story-phase="feedback"] .work>figure img,[data-puxin-product-case08][data-story-phase="revise"] .work>figure img{max-height:270px;object-fit:contain}
/* Keep all three storyboard photographs complete, with dialogue outside the image. */
[data-puxin-product-case08][data-story-revision="1"] #c8-intro .intro-frame{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;aspect-ratio:auto;background:var(--well)}
[data-puxin-product-case08][data-story-revision="1"] #c8-intro-photo{grid-area:1/1;justify-self:center;align-self:center;min-width:0;min-height:0;width:100%;height:auto;max-width:1080px;max-height:min(56vh,640px);padding:12px;box-sizing:border-box;object-fit:contain;object-position:center}
[data-puxin-product-case08][data-story-revision="1"] #c8-intro .intro-caption{grid-area:2/1;position:static;background:var(--paper)}
@media(min-width:1101px) and (min-height:640px){
  .tkp-layer [data-puxin-product-case08][data-story-revision="1"] #c8-intro .intro-frame{flex:1 1 0;grid-template-rows:minmax(0,1fr) auto;min-height:0}
  .tkp-layer [data-puxin-product-case08][data-story-revision="1"] #c8-intro-photo{height:100%;max-height:640px;padding:20px 24px}
  .tkp-layer [data-puxin-product-case08][data-story-revision="1"] #c8-intro>.row{padding-right:340px;flex-shrink:0;flex-wrap:wrap}
}
[data-puxin-product-case08].story-motion .story-frames figure{animation:story-read-8 .85s ease-in-out both}
[data-puxin-product-case08].story-motion .story-frames figure:nth-child(2){animation-delay:.85s}[data-puxin-product-case08].story-motion .story-frames figure:nth-child(3){animation-delay:1.7s}
[data-puxin-product-case08].story-motion .story-family-desk{animation:story-read-8 .8s ease-in-out}[data-puxin-product-case08].story-motion .story-card{animation:story-card-8 1.2s .7s ease-out both}[data-puxin-product-case08].story-motion .story-family-carry{animation:story-read-8 .8s 1.9s ease-in-out}
@keyframes story-read-8{0%,100%{filter:none}50%{filter:drop-shadow(0 0 5px #bd9046)}}
/* Keep the actual reading break or a readable three-step sequence visible after playback. */
[data-puxin-product-case08] .story-frames figure.story-frame-focus{border:2px solid #936924;box-shadow:inset 0 0 0 2px #f2e5cc}
[data-puxin-product-case08] .story-frames figure.story-frame-focus>b{color:#765321}
[data-puxin-product-case08] .story-frames[data-followable="true"] figure{border-color:#9a835b}
[data-puxin-product-case08] .story-frames figure>b{display:block;line-height:1.6;margin-bottom:6px;font-size:12px}
[data-puxin-product-case08] .story-frames figcaption{line-height:1.7;color:#635748;margin-top:8px}
@keyframes story-card-8{from{transform:translateY(34px);opacity:.4}to{transform:translateY(0);opacity:1}}
@media(prefers-reduced-motion:reduce){[data-puxin-product-case08] .story-frames figure,[data-puxin-product-case08] .story-card,[data-puxin-product-case08] .story-family-desk,[data-puxin-product-case08] .story-family-carry{animation:none!important}}
@media(max-width:600px){[data-puxin-product-case08] .story-frames{grid-template-columns:1fr}[data-puxin-product-case08] .story-frames figure{display:block}[data-puxin-product-case08] .story-frames .row button{flex:1}[data-puxin-product-case08] .story-option-images{grid-template-columns:1fr}[data-puxin-product-case08] .story-option-images button{display:grid;grid-template-columns:105px 1fr;align-items:center;gap:10px}[data-puxin-product-case08] .story-family svg{min-height:150px}}