/* Products and the Cut/Edit problems, designs and AI material. */
@media(max-width:760px){.sample-page .product-head h1{text-wrap:balance}}
@media(max-width:760px){.design-home .hero-topline{flex-direction:column;align-items:flex-start;gap:14px}.design-home .hero-topline .edition{max-width:none;white-space:normal;text-align:left}}
.design-home .hero-grid{grid-template-columns:1fr 1.04fr;gap:52px}
.design-home .hero-copy h1{font-size:clamp(42px,4.35vw,65px);line-height:1.24;letter-spacing:-.055em}
.design-home .hero-copy .lead{max-width:480px;font-size:14px;line-height:1.95}
.design-home .hero-foot{gap:24px}
.memory-board{position:relative;margin:0;padding:27px 30px;background:var(--white);border:1px solid #aab8a4;box-shadow:10px 13px 0 #dfe3d0;transform:rotate(-1deg);color:var(--ink)}
.board-top{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--line);padding-bottom:13px;font-size:10px;letter-spacing:.12em}
.board-top strong{font-family:var(--serif);font-size:22px;font-weight:500;letter-spacing:-.04em}
.board-route{position:relative;margin-top:17px}
.route-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px}
.route-caption strong{font-family:var(--serif);font-size:17px;font-weight:500}
.route-drawing{display:block;width:100%;height:135px;margin:2px 0 5px}
.diagram-mark{color:var(--orange);font-size:11px;font-weight:600;letter-spacing:.05em}
.film-label{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin:6px 0}
.film-strip{display:flex;gap:3px;position:relative;padding:7px;background:var(--ink);overflow:hidden}
.film-frame{display:block;flex:1;min-width:0;height:47px;background:linear-gradient(155deg,#9dbeb3 0 38%,#d7dbc0 39% 57%,#c3a773 58% 69%,#526b4c 70%);position:relative}
.film-frame:after{content:'';position:absolute;left:0;right:0;top:23%;height:2px;background:#f4f2e977;transform:rotate(-7deg)}
.film-frame:nth-child(2n){filter:brightness(.85)}
.film-frame:nth-child(3n){background:linear-gradient(145deg,#abc7bc 0 42%,#ddd1a9 43% 65%,#54714d 66%)}
.film-strip.long .film-frame:nth-child(n+3):nth-child(-n+5){outline:2px solid var(--lime);outline-offset:-2px}
.clip-connection{display:flex;align-items:center;justify-content:center;gap:13px;height:44px;font-size:11px}
.clip-connection:before,.clip-connection:after{content:'';height:25px;border-left:1px solid var(--orange);transform:rotate(20deg)}
.clip-connection:after{transform:rotate(-20deg)}
.kept-clip{width:58%;margin:auto;position:relative}
.kept-clip .film-strip{background:var(--orange)}
.kept-clip .film-frame{height:56px}
.board-note{margin-top:21px;padding-top:13px;border-top:1px solid var(--line);font-size:12px;line-height:1.7}
.board-note strong{display:block;font-weight:600}
.diagram-caption{display:flex;justify-content:space-between;gap:20px;margin-top:18px;font-size:10px;color:var(--muted)}
.journey-chain{display:grid;grid-template-columns:1fr 30px 1fr 30px 1.2fr;align-items:center;gap:14px;margin-top:38px}
.journey-node{border-top:1px solid #839685;padding:22px 0 5px}
.journey-node h3{font-family:var(--serif);font-size:27px;font-weight:500;margin:8px 0}
.journey-node p{font-size:12px;line-height:1.8}
.journey-node small{font-size:10px;letter-spacing:.08em}
.journey-arrow{font-family:var(--serif);font-size:24px;text-align:center}
.journey-branches{display:grid;gap:18px}
.journey-branches .journey-node{padding-top:12px}
.journey-context{margin-top:27px;font-size:12px;max-width:790px;color:#d3ddce}
.design-home .experience-panel{margin-top:45px}
.design-home .sample-section{padding-top:0}
.collection-label{font-size:12px;font-weight:600;letter-spacing:.08em;margin-bottom:24px}
.design-grid{display:grid;grid-template-columns:1fr 1fr;gap:46px}
.design-card{border-top:2px solid var(--ink);padding:26px 0 18px;display:flex;flex-direction:column}
.design-card-head{display:flex;justify-content:space-between;gap:15px;align-items:center}
.design-card h3{font-family:var(--serif);font-size:46px;font-weight:500;letter-spacing:-.04em}
.design-card p{font-size:14px;margin-top:17px;max-width:490px}
.design-card .text-link{margin-top:24px;align-self:flex-start}
.sample-badge{display:inline-flex;gap:8px;align-items:center;padding:5px 10px;border:1px solid #abbaa0;font-size:10px;line-height:1.4;letter-spacing:.03em}
.sample-badge:before{content:'';width:5px;height:5px;background:var(--orange);border-radius:50%}
.sample-page .product-head{grid-template-columns:1.45fr .7fr;gap:56px}
.sample-page .product-head h1{font-size:clamp(40px,4.3vw,65px);line-height:1.28}
.sample-page .product-label{gap:14px;flex-wrap:wrap}
.sample-page .product-stage{border:0;box-shadow:none;background:none;margin-top:42px}
.sample-stage{display:grid;grid-template-columns:.95fr 1.05fr;gap:58px;align-items:center;padding:40px;background:#e6e9d8;border:1px solid var(--line)}
.sample-stage .memory-board{transform:none;box-shadow:7px 8px 0 #cdd5bf}
.sample-stage-copy h2{font-size:36px;line-height:1.4;margin:15px 0 20px}
.sample-stage-copy p{font-size:13px;line-height:1.9}
.sample-stage-copy .small-note{font-size:11px;margin-top:18px;color:var(--muted)}
.edit-diagram{padding:27px;background:var(--white);border:1px solid #aab8a4;box-shadow:7px 8px 0 #cdd5bf}
.edit-diagram .board-top{margin-bottom:23px}
.edit-sequence{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px}
.edit-shot{height:132px;display:flex;flex-direction:column;justify-content:space-between;padding:12px;background:linear-gradient(152deg,#a5c3b7 0 43%,#d9d0ad 44% 68%,#60764f 69%);color:#143b30;font-size:11px;position:relative}
.edit-shot:nth-child(2){background:linear-gradient(146deg,#a8c4ba 0 37%,#d6d3b3 38% 72%,#637552 73%)}
.shot-overlay{padding:4px 7px;background:#fffef8e8;font-size:10px;align-self:flex-start}
.shot-route{display:block;width:100%;height:55px;flex:1;margin:8px 0}
.time-underlay{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;border-bottom:1px solid var(--line);padding:10px 0 18px;font-size:9px}
.overlay-list{display:flex;gap:7px;flex-wrap:wrap;margin-top:21px}
.overlay-list span{font-size:10px;border:1px solid var(--line);padding:3px 8px}
.contract-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:36px;margin-top:30px}
.contract-piece{padding-top:18px;border-top:1px solid var(--line)}
.contract-piece h3{font-size:17px;font-weight:500;margin:10px 0}
.contract-piece p{font-size:12px;line-height:1.9}
.contract-piece .num{font-family:var(--serif);font-size:21px;color:var(--orange)}
.contract-note{margin-top:25px;font-size:12px;max-width:850px;color:var(--muted)}
.sample-delivery{display:grid;grid-template-columns:1fr 1.15fr;gap:60px;align-items:start}
.sample-delivery h2{font-size:43px;margin:16px 0 20px}
.sample-delivery p{font-size:13px;max-width:430px}
.sample-package{border:1px solid #718975;padding:27px 30px}
.package-top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}
.package-top strong{font-family:var(--serif);font-size:28px;font-weight:500}
.package-list{list-style:none;padding:0;margin:0}
.package-list li{border-top:1px solid #718975;padding:13px 0;display:flex;justify-content:space-between;gap:20px;font-size:12px}
.package-list span{font-size:10px;white-space:nowrap;color:#d4e88a}
.sample-package .package-notice{margin-top:18px;font-size:11px;color:#d3ddce}
.sample-how{margin-top:35px;padding-top:25px;border-top:1px solid #718975;display:grid;grid-template-columns:repeat(5,1fr);gap:16px;list-style:none;padding-left:0}
.sample-how li{font-size:12px;line-height:1.7}
.sample-how b{display:block;font-family:var(--serif);font-weight:500;color:var(--lime);font-size:23px;margin-bottom:9px}
.prompt-heading{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:24px}
.prompt-heading h2{font-size:43px;margin-top:15px}
.prompt-heading p{font-size:12px;max-width:410px}
.prompt-box{border:1px solid var(--line);background:var(--white)}
.prompt-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 22px;border-bottom:1px solid var(--line);font-size:11px}
.prompt-toolbar button{background:var(--ink);color:var(--white);border:0;padding:10px 16px;cursor:pointer;font-size:12px}
.prompt-code{margin:0;padding:26px 30px;white-space:pre-wrap;font-family:var(--sans);font-size:12px;line-height:1.9;overflow-wrap:anywhere;tab-size:2}
.prompt-status{font-size:11px;color:var(--muted)}
.verification-table{border-collapse:collapse;width:100%;font-size:12px;margin-top:28px}
.verification-table th,.verification-table td{text-align:left;vertical-align:top;padding:15px 19px;border-bottom:1px solid var(--line)}
.verification-table th{font-weight:500;border-top:1px solid var(--line);background:#e6e9d8}
.verification-table th:first-child{width:27%}
.sample-reference{margin-top:28px;font-size:12px}
.sample-reference summary{cursor:pointer;padding:15px 0;border-top:1px solid var(--line)}
.sample-reference a{display:inline-block;margin:8px 20px 8px 0}
.sample-page .related-sample{margin-top:26px}
@media(max-width:1050px){.design-home .hero-grid{gap:30px}.memory-board{padding:22px}.sample-page .product-head{gap:30px}.sample-stage{gap:30px;padding:30px}.sample-stage-copy h2{font-size:30px}.sample-delivery{gap:35px}.edit-diagram{padding:22px}}
@media(max-width:760px){.design-home .hero-grid{grid-template-columns:1fr;gap:36px}.design-home .hero-copy h1{font-size:clamp(39px,9.3vw,56px)}.design-home .hero-copy .lead{font-size:13px}.memory-board{padding:20px;box-shadow:5px 7px 0 #dfe3d0;transform:none;margin-right:5px}.board-top strong{font-size:21px}.board-top{font-size:9px}.route-drawing{height:118px}.film-frame{height:39px}.kept-clip .film-frame{height:45px}.board-note{font-size:11px}.diagram-caption{font-size:9px;gap:15px}.design-home .hero-foot{flex-direction:column;gap:8px;align-items:flex-start}.journey-chain{grid-template-columns:1fr;gap:8px;margin-top:26px}.journey-node{padding-top:17px}.journey-arrow{text-align:left;transform:rotate(90deg);width:28px;height:32px}.journey-branches{grid-template-columns:1fr 1fr;gap:25px}.journey-node h3{font-size:25px}.journey-context{font-size:11px}.design-grid{grid-template-columns:1fr;gap:22px}.design-card h3{font-size:39px}.design-card p{font-size:13px}.sample-page .product-head{grid-template-columns:1fr;gap:5px}.sample-page .product-head h1{font-size:clamp(37px,8.5vw,50px)}.sample-page .product-head .lead{font-size:13px}.sample-stage{grid-template-columns:1fr;padding:22px 16px;gap:30px}.sample-stage-copy h2{font-size:29px}.sample-stage-copy p{font-size:12px}.sample-stage .memory-board{padding:16px;margin-right:5px}.sample-page .product-stage{margin-top:28px}.edit-diagram{padding:16px;margin-right:5px}.edit-shot{height:110px;padding:7px}.shot-overlay{font-size:9px;padding:3px}.time-underlay{font-size:8px}.contract-grid{grid-template-columns:1fr;gap:17px}.contract-piece{padding-top:14px}.sample-delivery{grid-template-columns:1fr;gap:30px}.sample-delivery h2,.prompt-heading h2{font-size:34px}.sample-package{padding:20px}.sample-how{grid-template-columns:1fr;gap:14px}.sample-how li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start}.sample-how b{font-size:20px;margin:0}.prompt-heading{display:block}.prompt-heading p{margin-top:20px}.prompt-toolbar{padding:12px 14px;flex-wrap:wrap;gap:12px}.prompt-code{padding:20px 16px;font-size:11px}.verification-table th,.verification-table td{padding:13px 9px;font-size:11px}.verification-table th:first-child{width:32%}.sample-badge{font-size:9px}.design-card-head{flex-wrap:wrap}}

.recording-preview{margin:0;border:1px solid var(--line);background:var(--white);padding:14px}.recording-preview img{display:block;width:100%;height:auto}.recording-preview figcaption{font-size:11px;line-height:1.7;margin-top:12px;color:var(--muted)}
.design-home #record-and-revisit h2{text-wrap:balance}
.design-page-nav{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0}.design-page-nav .wrap{display:flex;flex-wrap:wrap;gap:12px 26px}.design-page-nav a{font-size:13px;text-underline-offset:5px}.design-requirements .section-heading p{max-width:490px;font-size:13px;line-height:1.9}.requirements-toc{display:grid;grid-template-columns:1fr 1fr;gap:0 36px;margin:34px 0 48px}.requirements-toc a{display:flex;gap:14px;align-items:baseline;border-bottom:1px solid var(--line);padding:12px 0;font-size:13px;line-height:1.7}.requirements-toc span{min-width:40px;font-family:var(--serif);font-size:17px;color:var(--orange)}.requirements-group>h3{font-family:var(--serif);font-size:29px;font-weight:500;margin:48px 0 20px}.requirement-detail{border-top:1px solid var(--line);padding:26px 0 34px;scroll-margin-top:24px}.requirement-heading{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:20px}.requirement-heading h4{font-family:var(--serif);font-size:25px;font-weight:500;line-height:1.55;flex:1;min-width:240px}.requirement-id{font-family:var(--serif);font-size:22px;color:var(--orange)}.requirement-level{font-size:11px;padding:4px 9px;border:1px solid var(--line);white-space:nowrap}.requirement-detail dl{margin:0;max-width:960px}.requirement-detail dl>div{display:grid;grid-template-columns:140px 1fr;gap:20px;margin:16px 0}.requirement-detail dt{font-size:12px;color:var(--muted);font-weight:500;line-height:1.9}.requirement-detail dd{margin:0;font-size:14px;line-height:1.95}.requirement-example{background:#e6e9d8;padding:28px 32px;margin-top:32px}.requirement-example h3{font-size:19px;font-weight:500;margin:0 0 12px}.requirement-example p{font-size:13px;line-height:1.95}.requirements-group:has([data-requirement-kind="proposal"]){padding-top:20px;border-top:2px solid var(--line)}
@media(max-width:760px){.requirements-toc{grid-template-columns:1fr;margin:25px 0 35px}.requirements-toc a{font-size:13px}.design-requirements .section-heading h2{text-wrap:balance}.design-page-nav .wrap{gap:10px 20px}.design-page-nav a{font-size:12px}.requirement-heading{gap:8px 12px;align-items:start}.requirement-heading h4{font-size:22px;min-width:0;flex-basis:calc(100% - 70px)}.requirement-level{margin-left:53px}.requirement-detail dl>div{grid-template-columns:1fr;gap:4px;margin:20px 0}.requirement-detail dt{font-size:11px}.requirement-detail dd{font-size:13px}.requirement-example{padding:22px 20px}}

/* Reading and copying are separate actions; keep primary navigation clear. */
.design-home .button::after,.sample-page .button::after,.problem-catalog .button::after{content:none}
.ai-url{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:25px 0;overflow-wrap:anywhere}
.ai-url a{font-size:13px}.ai-url button{padding:9px 14px;cursor:pointer}
.sample-page #ai .prompt-box{color:var(--ink)}
.local-preview-note{border:1px solid #aab8a4;padding:14px 18px;font-size:13px}
.ai-followup{margin-top:22px;font-size:13px}.problem-reason{font-size:14px;line-height:1.9;margin-top:20px}
.manual-copy{box-sizing:border-box;width:100%;height:260px;padding:18px;font:13px/1.7 system-ui;white-space:pre-wrap}
.ai-url [hidden],.sample-page [hidden]{display:none!important}
.problem-catalog h1{font-size:clamp(30px,5vw,48px);line-height:1.5}.catalog-return{display:flex;flex-wrap:wrap;gap:12px 24px;margin:26px 0}
.catalog-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.catalog-tools input,.catalog-tools select{font:inherit;max-width:100%;padding:9px}
.catalog-tools input{width:min(100%,420px);box-sizing:border-box}.catalog-toc{display:grid;gap:8px;margin:18px 0}
.catalog-problem{border-top:1px solid var(--line);padding:30px 0;scroll-margin-top:20px}.catalog-problem h2{font-size:25px;line-height:1.6;margin:12px 0}.catalog-problem dt{font-weight:600;margin-top:16px}.catalog-problem dd{margin:6px 0;font-size:14px;line-height:1.9;overflow-wrap:anywhere}
.problem-catalog [hidden]{display:none!important}.purpose-label{font-size:16px!important;line-height:1.6!important;overflow-wrap:anywhere}
@media(max-width:760px){.sample-page .product-head .actions{align-items:flex-start;flex-direction:column;gap:16px}.problem-catalog .catalog-tools{align-items:flex-start;flex-direction:column}.problem-catalog .catalog-problem h2{font-size:22px}.sample-page #ai .prompt-toolbar{align-items:flex-start;flex-direction:column}.ai-url{align-items:flex-start;flex-direction:column}}

/* Product indexes list apps without implying an ordered sequence. */
.plain-product-row { grid-template-columns:62px 1fr 1.2fr 36px; }
.plain-product-row:hover .row-arrow { transform:translateX(4px); }
@media(max-width:1000px) { .plain-product-row { grid-template-columns:52px 1fr 1fr 25px; } }
@media(max-width:760px) {
  .plain-product-row { grid-template-columns:44px 1fr 22px; }
  .plain-product-row p { grid-column:2; grid-row:2; }
  .plain-product-row .row-arrow { grid-column:3; grid-row:1 / span 2; }
}