/* The approved ReelUse system, extended for a visual product guide. */
html{scroll-padding-top:28px}.skip-link{position:fixed;top:-80px;left:20px;background:var(--ink);color:white;padding:12px 20px;z-index:100}.skip-link:focus{top:12px}button:focus-visible,a:focus-visible,video:focus-visible{outline:3px solid var(--blue);outline-offset:5px}.nav [aria-current]{color:var(--blue)}.how-hero{display:grid;grid-template-columns:.93fr 1.07fr;align-items:center;gap:58px;padding-block:76px 70px}.hero-intro h1{font-size:clamp(48px,5.1vw,72px);line-height:1.02;letter-spacing:-.035em;margin:0 0 25px}.hero-intro h1 span,.chapter-copy h2 span,.how-close h2 span{color:var(--blue)}.hero-intro .intro{font-size:20px;line-height:1.65;max-width:430px;color:var(--muted);margin:0 0 28px}.quiet{font-size:14px;color:var(--muted);margin:16px 0 0}.mono{font:12px/1.5 Geist,monospace;letter-spacing:.065em}.hero-visual{border:2px solid var(--ink);border-radius:18px;background:var(--paper);box-shadow:7px 8px 0 var(--ink);overflow:hidden;transform:rotate(1deg)}.visual-top{background:var(--blue);color:white;display:flex;align-items:center;justify-content:space-between;padding:17px 22px;border-bottom:2px solid var(--ink)}.mini-dot{height:8px;width:8px;border-radius:50%;background:var(--yellow)}.journey-caption{padding:22px 24px 8px;display:flex;align-items:center;gap:22px;font-size:18px}.journey-caption strong{color:var(--blue)}.library-preview{position:relative;display:block;overflow:hidden;margin:0 12px}.library-preview img{width:100%;height:auto;display:block}.screen-play{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;gap:12px;white-space:nowrap;padding:15px 20px;background:var(--ink);color:white;border:2px solid white;border-radius:100px;font-weight:700;font-size:14px;box-shadow:0 5px 25px #17151225}.library-preview:hover .screen-play{background:var(--blue)}.visual-bottom{display:flex;justify-content:space-between;gap:12px;padding:15px 22px;font-size:12px;border-top:1px solid var(--line);color:var(--muted)}.visual-bottom b{color:var(--blue);padding-left:8px}.chapter-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-block:1px solid var(--line);margin-inline:auto;min-height:85px}.chapter-nav a{display:flex;align-items:center;gap:16px;font-size:15px;font-weight:700;padding:24px 0}.chapter-nav a+a{padding-left:24px;border-left:1px solid var(--line)}.chapter-nav span{font:13px Geist,monospace;color:var(--blue)}.chapter-nav b{font-size:21px;color:var(--blue);margin-left:auto;padding-right:24px}.chapter{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center;padding-block:104px}.chapter-copy h2{font-size:clamp(34px,4vw,51px);line-height:1.09;margin:0 0 24px}.chapter-copy>p:not(.eyebrow){font-size:19px;line-height:1.7;color:var(--muted);margin:0 0 20px}.chapter-copy>p.small-copy{font-size:16px;line-height:1.75}.chapter-copy .text-button{margin-top:10px}.input-visual{background:var(--tint);border-radius:20px;border:1px solid #ccd8fc;padding:30px;position:relative;background-image:radial-gradient(#1756ff12 1px,transparent 1px);background-size:12px 12px}.input-tabs{display:flex;padding:5px;background:#fbfaf7a6;border:1px solid #ccd8fc;border-radius:10px;margin-bottom:28px;gap:5px}.input-tabs button{flex:1;border:0;background:transparent;padding:11px 10px;border-radius:6px;font:700 15px Satoshi;cursor:pointer}.input-tabs button[aria-selected=true]{background:var(--ink);color:white}.input-visual [role=tabpanel]{padding:30px 24px;background:white;border:1px solid var(--line);border-radius:12px;min-height:292px}.input-symbol{display:grid;place-items:center;width:46px;height:46px;background:var(--tint);color:var(--blue);border-radius:10px;font-size:28px;margin-bottom:20px}.input-visual h3{font-size:24px;margin:0 0 10px;line-height:1.15}.input-visual p{font-size:15px;color:var(--muted);line-height:1.6;margin:0}.sample-input{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line);padding:14px 12px;margin-top:24px;border-radius:6px;color:var(--muted);font-size:13px;overflow-wrap:anywhere;background:var(--paper)}.input-note{display:flex;align-items:center;gap:10px;font-size:14px;margin-top:18px}.input-note>span:first-child{color:var(--blue)}p.diagram-label{font-size:12px;margin:18px 0 0;color:var(--muted)}.find-band{background:#f2f1ec;border-block:1px solid var(--line)}.find-band .chapter{gap:90px}.moments-visual{background:var(--paper);border:2px solid var(--ink);border-radius:16px;box-shadow:6px 7px 0 var(--ink);padding:27px;transform:rotate(-1deg)}.moment-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.moment-header>span:last-child{font-size:28px;color:var(--blue)}.timeline-diagram{margin:29px 0}.timeline{height:58px;display:flex;align-items:center;gap:12px;padding:10px 7px;background:repeating-linear-gradient(90deg,#d9d5cb 0 2px,transparent 2px 7px);border-block:1px solid var(--line)}.timeline span{height:42px;background:var(--blue);opacity:.92;width:15%;border-radius:5px;border:2px solid var(--paper)}.timeline span:first-child{margin-left:10%;background:var(--yellow)}.timeline span:nth-child(2){margin-left:9%}.timeline span:nth-child(3){margin-left:6%}.timeline span:last-child{display:none}.time-labels{display:flex;justify-content:space-between;color:var(--muted);font:12px Geist;margin-top:9px}.moment-list{display:grid;gap:9px}.moment-list>div{display:flex;align-items:center;padding:18px 15px;background:white;border:1px solid var(--line);border-radius:8px;gap:18px;font-size:16px}.moment-list b{font:13px Geist;color:var(--blue)}.moment-list i{margin-left:auto;font-size:20px;color:var(--blue);font-style:normal}.included{display:flex;flex-wrap:wrap;gap:10px 18px;font-size:14px;font-weight:700;margin-top:27px}.demo-section{padding-block:100px}.demo-heading{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:35px}.demo-heading h2,.how-faq h2{font-size:clamp(34px,4vw,49px);line-height:1.1;margin:0}.demo-heading>p{font-size:17px;color:var(--muted);line-height:1.65;margin:0 0 4px}.walkthrough-player{max-width:920px;margin:auto;border:2px solid var(--ink);border-radius:14px;overflow:hidden;box-shadow:0 7px 0 var(--ink);background:var(--paper)}.player-bar{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid var(--line)}.player-bar .wordmark{font-size:25px}.walkthrough-player video{display:block;width:100%;max-height:570px;aspect-ratio:4/3;background:var(--paper);object-fit:contain}.demo-footnote{text-align:center;margin:28px 0 0;font-size:14px;color:var(--muted)}.demo-footnote a{color:var(--blue);font-weight:700;margin-left:8px}.review-band{background:var(--blue);color:white;background-image:radial-gradient(#ffffff23 .8px,transparent .8px);background-size:12px 12px}.review-band .eyebrow{color:#e4ebff}.review-band .chapter-copy h2 span{color:var(--yellow)}.review-band .chapter-copy>p:not(.eyebrow){color:#eef2ff}.review-steps{padding:0;margin:34px 0 0;list-style:none;display:grid;gap:22px}.review-steps li{display:flex;gap:19px;border-top:1px solid #ffffff33;padding-top:22px}.review-steps li>span{font:13px Geist;color:var(--yellow);padding-top:4px}.review-steps h3{font-size:20px;margin:0 0 5px}.review-steps p{font-size:15px;line-height:1.65;color:#e4ebff;margin:0}.final-visual{max-width:340px;margin-inline:auto;width:100%;transform:rotate(2deg)}.result-label{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px}.result-label>span:last-child{font-size:28px;color:var(--yellow)}.result-phone{position:relative;background:var(--ink);border:3px solid var(--ink);border-radius:20px;padding:0;overflow:hidden;box-shadow:8px 9px 0 #1035a4;width:100%;cursor:pointer;display:block}.result-phone img{width:100%;height:auto;display:block}.result-play{position:absolute;bottom:17px;left:15px;right:15px;display:flex;align-items:center;justify-content:center;gap:10px;background:var(--paper);color:var(--ink);padding:13px 10px;border-radius:100px;font-size:14px;font-weight:700}.result-phone:hover .result-play{background:var(--yellow)}.result-note{text-align:center;font-size:13px;color:#e4ebff;margin:22px 0 0}.how-faq{display:grid;grid-template-columns:.85fr 1.15fr;gap:85px;padding-block:105px}.how-faq .text-button{margin-top:30px}.how-faq .faq-list{margin:0}.how-faq details:first-child{border-top:1px solid var(--line)}.how-faq summary{font-size:17px;padding-block:22px}.how-faq details p{font-size:16px;line-height:1.75}.how-faq details p a{color:var(--blue);text-decoration:underline}.how-close{padding-block:70px 90px;border-top:1px solid var(--line);text-align:center}.how-close h2{font-size:clamp(36px,5vw,62px);line-height:1.08;margin:0 0 28px}.how-close>p:last-child{font-size:14px;color:var(--muted);margin-top:20px}.how-close .button{margin:auto}.review-band button:focus-visible{outline-color:var(--yellow)}
@media(min-width:1400px){.how-hero{padding-block:90px}.hero-intro h1{font-size:76px}}@media(max-width:1000px){.how-hero{gap:30px}.chapter{gap:45px}.find-band .chapter{gap:45px}.chapter-nav a{font-size:13px;gap:10px}.chapter-nav b{padding-right:12px}.how-faq{gap:45px}.input-visual{padding:22px}.hero-intro h1{font-size:56px}}@media(max-width:760px){.wrap{padding-inline:24px}.nav{height:80px}.nav nav{display:none}.nav-actions{gap:15px}.how-hero{grid-template-columns:1fr;padding-block:42px 55px;gap:38px}.hero-intro h1{font-size:clamp(43px,9vw,64px);line-height:1.06}.desktop-break{display:none}.hero-intro .intro{font-size:18px;max-width:520px}.hero-visual{max-width:550px;width:calc(100% - 8px);margin:auto;transform:none}.chapter-nav{padding-inline:24px;min-height:0;grid-template-columns:1fr}.chapter-nav a{font-size:15px;padding:16px 0}.chapter-nav a+a{padding-left:0;border-left:0;border-top:1px solid var(--line)}.chapter-nav b{padding-right:0}.chapter{grid-template-columns:1fr;gap:34px;padding-block:64px}.chapter-copy h2{font-size:40px}.chapter-copy>p:not(.eyebrow){font-size:18px}.find-band .chapter{gap:34px}.find-band .chapter-copy{grid-row:1}.moments-visual{transform:none;margin-right:6px}.demo-section{padding-block:64px}.demo-heading{display:block}.demo-heading>p{margin-top:22px;font-size:16px}.player-bar{padding:15px}.walkthrough-player video{max-height:none}.review-band .chapter{gap:46px}.final-visual{max-width:300px;transform:none}.how-faq{grid-template-columns:1fr;padding-block:64px;gap:32px}.how-close{padding-block:55px 65px}.visual-bottom{font-size:11px;padding-inline:14px}.mono{font-size:12px}.screen-play{font-size:13px;padding:13px 16px}.nav .signin{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
/* Review revision: quieter grounds, blue reserved for useful accents. */
.visual-top{background:var(--paper);color:var(--muted);border-bottom:1px solid var(--line)}
.mini-dot{background:var(--blue)}
.hero-intro h1 span,.chapter-copy h2 span,.how-close h2 span{color:var(--ink)}
.input-visual{background-color:#f2f1ec;border-color:var(--line);background-image:radial-gradient(#d9d5cb80 .7px,transparent .7px)}
.input-tabs{background:var(--paper);border-color:var(--line)}
.input-symbol{background:var(--paper);color:var(--ink);border:1px solid var(--line)}
.review-band{background-color:#f2f1ec;color:var(--ink);background-image:radial-gradient(#d9d5cb70 .7px,transparent .7px);border-block:1px solid var(--line)}
.review-band .eyebrow{color:var(--muted)}
.review-band .chapter-copy h2 span{color:var(--ink);background:linear-gradient(transparent 64%,var(--yellow) 64%,var(--yellow) 92%,transparent 92%)}
.review-band .chapter-copy>p:not(.eyebrow){color:var(--muted)}
.review-steps li{border-top-color:var(--line)}
.review-steps li>span{color:var(--blue)}
.review-steps p,.result-note{color:var(--muted)}
.result-label>span:last-child{color:var(--ink)}
.result-phone{box-shadow:8px 9px 0 #d9d5cb}
.review-band button:focus-visible{outline-color:var(--blue)}
/* Review revision: make the brand highlighter visible throughout the journey. */
.hero-intro h1 span{background:linear-gradient(transparent 68%,var(--yellow) 68%,var(--yellow) 94%,transparent 94%);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-inline:3px}
.visual-top{background:var(--yellow);color:var(--ink)}
.input-tabs button[aria-selected=true]{background:var(--yellow);color:var(--ink);box-shadow:0 2px 0 var(--ink)}
.input-symbol{background:var(--yellow);border-color:var(--ink)}
.chapter-nav a>span{display:grid;place-items:center;flex:0 0 30px;height:30px;background:var(--yellow);color:var(--ink);border-radius:50%}
.moment-list>div:first-child{background:#fff8cf;border-color:#e3d37a}
.moment-list>div:first-child b{color:var(--ink)}
.result-label .mono{background:var(--yellow);color:var(--ink);padding:7px 11px;border-radius:4px}
.how-close h2 span{background:linear-gradient(transparent 68%,var(--yellow) 68%,var(--yellow) 94%,transparent 94%);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-inline:3px}
/* Revision 4: an operational guide with useful examples, rather than a second homepage. */
.guide-hero{display:flex;align-items:center;justify-content:space-between;gap:50px;padding-block:62px 45px}.guide-hero h1{font:800 clamp(38px,4.3vw,60px)/1.09 Bricolage,sans-serif;letter-spacing:-.025em;margin:0 0 22px}.guide-hero h1 span{background:linear-gradient(transparent 65%,var(--yellow) 65%,var(--yellow) 94%,transparent 94%)}.guide-hero>div>p:last-child{font-size:19px;line-height:1.65;color:var(--muted);max-width:530px;margin:0}.watch-guide{display:flex;gap:16px;align-items:center;flex-shrink:0}.watch-circle{display:grid;place-items:center;background:var(--yellow);border:1px solid var(--ink);width:54px;height:54px;border-radius:50%;font-size:18px;box-shadow:0 3px 0 var(--ink)}.watch-guide strong,.watch-guide small{display:block}.watch-guide strong{font-size:15px}.watch-guide small{font-size:12px;color:var(--muted);margin-top:5px}.guide-nav{grid-template-columns:repeat(4,1fr)}.guide-nav a{font-size:14px}.guide-nav a+a{padding-left:15px}.guide-nav b{padding-right:12px}.chapter{padding-block:75px}.setup-details{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-bottom:78px}.trim-example,.focus-example{padding:30px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}.trim-example{background:#fff9da;border-color:#e6dca4}.detail-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:24px}.plan-pill{font-size:12px;border:1px solid var(--line);background:var(--paper);padding:3px 9px;border-radius:99px;white-space:nowrap}.setup-details h3{font:800 29px/1.1 Bricolage;margin:0 0 17px;letter-spacing:-.02em}.setup-details p{font-size:16px;line-height:1.7;color:var(--muted);margin:0 0 20px}.trim-track{display:grid;grid-template-columns:1fr 2.25fr 2.75fr;gap:3px;margin-top:27px;height:70px;border-radius:7px;overflow:hidden}.trim-track>*{display:grid;place-items:center;background:#e6e3dc;font-size:12px;padding:6px;text-align:center}.trim-track strong{background:var(--yellow);border:2px solid var(--ink);font-size:14px}.trim-times{display:flex;justify-content:space-between;font:11px Geist;margin-top:9px}.trim-result{display:flex;justify-content:space-between;gap:15px;align-items:center;border-top:1px solid #e6dca4;padding-top:20px;margin-top:23px;font-size:14px}.trim-result span{max-width:155px;color:var(--muted)}.setup-details p.diagram-label{font-size:12px;margin:15px 0 0}.focus-note{padding:25px 20px;background:white;border:1px solid var(--line);border-left:4px solid var(--yellow);border-radius:7px;font-size:20px;line-height:1.5;margin:24px 0}.setup-details p.focus-foot{font-size:14px}.setup-details .text-button{font-size:14px}.library-figure{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden;padding:22px 18px}.library-figure .detail-head{padding-inline:6px;margin-bottom:12px}.library-figure img{display:block;width:100%;height:auto}.figure-key{display:flex;justify-content:space-between;gap:10px;font-size:12px;border-top:1px solid var(--line);padding-top:18px}.figure-key b{background:var(--yellow);display:inline-grid;place-items:center;width:19px;height:19px;border-radius:50%;margin-right:4px}.result-facts{margin-block:25px;display:grid;gap:17px}.result-facts>div{padding-top:17px;border-top:1px solid var(--line)}.result-facts strong{display:block;font-size:16px;margin-bottom:5px}.result-facts span{display:block;font-size:15px;line-height:1.65;color:var(--muted)}.caption-demo,.post-kit-demo{border:2px solid var(--ink);border-radius:15px;padding:28px;background:var(--paper);box-shadow:6px 7px 0 #d9d5cb}.caption-context{font-size:14px;color:var(--muted);margin-top:35px}.word-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.word-row>span,.editable-word{font-size:23px;font-weight:700;padding:8px;background:#f0eee8;border-radius:5px}.editable-word{padding:0;max-width:100%}.editable-word input{width:135px;max-width:100%;font:700 23px Satoshi;padding:8px;border:2px solid var(--ink);border-radius:5px;background:var(--yellow);color:var(--ink)}.caption-help,.correction-status{font-size:13px;color:var(--muted);line-height:1.6}.correction-button{font-size:14px;margin-top:9px}.correction-status{min-height:42px;margin:16px 0 0}.glossary-note{border-top:1px solid var(--line);padding-top:23px;margin-top:17px}.glossary-note h3{font-size:23px;margin:12px 0}.glossary-note p{font-size:14px;line-height:1.7;color:var(--muted);margin:0}.post-section{background:#f2f1ec;border-block:1px solid var(--line)}.kit-block{border-top:1px solid var(--line);padding-block:20px}.kit-block>div{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700}.kit-block button{font:700 12px Satoshi;background:var(--yellow);border:1px solid var(--ink);border-radius:5px;padding:7px 12px;cursor:pointer}.kit-block p{font-size:20px;line-height:1.6;margin:15px 0 0}.kit-more{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}.kit-more span{font-size:12px;padding:5px 8px;background:#efede6;border-radius:4px}.copy-status{font-size:13px;min-height:20px;color:var(--blue);margin-bottom:0}.publishing-note{padding:20px;border-left:3px solid var(--yellow);background:var(--paper);margin:25px 0}.publishing-note p{font-size:15px;color:var(--muted);line-height:1.7;margin:7px 0 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.demo-section{padding-block:72px}.walkthrough-player{max-width:800px}.walkthrough-player video{max-height:480px}.how-faq{padding-block:65px}.how-close{padding-block:55px 70px}
@media(max-width:1000px){.guide-hero{gap:25px}.guide-nav a{font-size:12px;gap:8px}.guide-nav b{display:none}.guide-nav a+a{padding-left:12px}.figure-key{flex-wrap:wrap}.trim-result{display:block}.trim-result span{display:block;max-width:none;margin-top:6px}}@media(max-width:760px){.guide-hero{display:block;padding-block:40px 30px}.guide-hero h1{font-size:42px}.guide-hero>div>p:last-child{font-size:17px}.watch-guide{margin-top:25px}.guide-nav{grid-template-columns:1fr 1fr;padding-block:8px}.guide-nav a,.guide-nav a+a{padding:12px 0;border:0;font-size:13px}.guide-nav a>span{flex-basis:26px;height:26px}.chapter{padding-block:55px}.setup-details{grid-template-columns:1fr;padding-bottom:55px;gap:20px}.trim-example,.focus-example{padding:23px}.trim-result{display:flex}.trim-times{font-size:10px}.correction-section .chapter{gap:30px}.caption-demo,.post-kit-demo{padding:23px;margin-right:6px}.post-section .chapter-copy{grid-row:1}.guide-hero h1 span{box-decoration-break:clone}.figure-key{font-size:11px}.demo-section{padding-block:55px}.walkthrough-player video{max-height:none}.how-faq{padding-block:55px}}
/* Revision 5: yellow has two focal roles: the opening highlight and active tab. */
.watch-circle{background:var(--paper);color:var(--ink);box-shadow:none;border-color:var(--line)}
.chapter-nav a>span{background:transparent;color:var(--muted)}
.input-symbol{background:var(--paper);border-color:var(--line)}
.trim-example{background:var(--paper);border-color:var(--line)}
.trim-track strong{background:var(--tint);border-color:var(--blue);color:var(--ink)}
.trim-result{border-top-color:var(--line)}
.focus-note{border-left-color:var(--line)}
.figure-key b{background:transparent;color:var(--blue)}
.editable-word input{background:white;border-color:var(--line)}
.editable-word input:focus{outline:2px solid var(--blue);outline-offset:2px}
.kit-block button{background:var(--paper);border-color:var(--line)}
.kit-block button:hover{background:var(--tint)}
.publishing-note{border-left-color:var(--line)}
.how-close h2 span{background:none}
/* Revision 6: a full-width neutral footer, clearly separated from the guide. */
.footer-ground{background-color:#eeece6;background-image:radial-gradient(#d9d5cb70 .7px,transparent .7px);background-size:12px 12px;border-top:2px solid #d0ccc2}
.footer-ground .footer-bottom{border-top-color:#d0ccc2}
