/* Guide-only visual system. Native disclosure and radio controls need no JS. */
.guide-page{background:#f5f5ef}.guide-page .header{border-bottom-color:#dfe4dc}.guide-page .guide-hero{display:grid;grid-template-columns:1fr 1.1fr;gap:44px;align-items:center;padding-top:64px;padding-bottom:76px}.guide-hero-copy h1{font-size:clamp(36px,4.6vw,56px);font-weight:600;line-height:1.3;letter-spacing:-1.8px}.guide-hero-copy .eyebrow{letter-spacing:1.4px;color:var(--teal)}.guide-hero-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:24px}.guide-hero-actions .button{margin:0;gap:30px}.guide-hero-actions .inline-link{font-size:13px}.hero-facts{display:flex;gap:8px;flex-wrap:wrap;margin-top:25px}.hero-facts span{border:1px solid #d9e2da;border-radius:20px;padding:6px 10px;color:#62756e;font-size:10px}.guide-stage{position:relative;min-height:330px;padding:23px 22px 40px;background:linear-gradient(135deg,#e2ebe2,#eaf0e9 55%,#d7e8e0);border-radius:20px;border:1px solid #d8e3d9;box-shadow:0 18px 50px -30px #224f4840}.stage-top{display:flex;justify-content:space-between;gap:12px;font-size:9px;color:#547369;letter-spacing:.3px;margin-bottom:27px}.stage-top i{display:inline-block;width:5px;height:5px;background:#438e79;border-radius:50%;margin-right:6px}.stage-tv{position:relative;border:7px solid #243c40;border-radius:9px;margin-right:48px;box-shadow:0 17px 25px -14px #1b3d4250}.stage-tv img{display:block;width:100%;height:auto;border-radius:2px}.stage-tv:after{content:"";position:absolute;bottom:-21px;left:37%;width:27%;height:14px;border-bottom:5px solid #2b4649;background:linear-gradient(90deg,transparent 40%,#2b4649 40%,#2b4649 60%,transparent 60%)}.stage-pill{position:absolute;top:-16px;left:12px;border-radius:20px;background:#fffdf8;box-shadow:0 3px 8px #153b3620;padding:7px 11px;font-size:9px;color:#35645a}.stage-phone{position:absolute;right:17px;top:100px;width:98px;height:188px;border:4px solid #243c40;border-radius:17px;overflow:hidden;box-shadow:0 15px 26px -10px #1b3d4260;background:#0c1929;transform:rotate(3deg)}.stage-phone img{width:100%;height:auto;display:block}.stage-caption{font-size:9px;line-height:1.5;color:#658078;margin-top:37px}.guide-page .guide-layout{grid-template-columns:200px minmax(0,1fr);gap:44px}.guide-page .guide-toc{background:#eef1e9;border:1px solid #dde5da;border-radius:13px;padding:20px 13px;gap:2px}.guide-toc strong{font-size:12px;letter-spacing:1px;padding:2px 12px 13px;margin:0;color:#698078}.guide-page .guide-toc a{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:7px;font-size:12px;transition:background .15s}.guide-toc a:hover,.guide-toc a:focus-visible{background:#dce8df}.guide-toc svg{width:18px;height:18px;flex-shrink:0;color:#468275}.guide-page .guide-toc a span{font-size:12px;color:inherit;margin:0}.guide-toc .toc-help{font-size:10px!important;line-height:1.7;border-top:1px solid #d3ded2;border-radius:0!important;margin-top:14px;padding-top:18px!important;color:var(--teal)}.guide-version-strip{display:flex;flex-direction:column;gap:8px;padding:18px 22px;margin-bottom:35px;border-left:3px solid #80ad96;background:#eaf0e5;font-size:12px;color:#6a7e72;line-height:1.7}.guide-version-strip strong{font-weight:550;color:#3b6454}.guide-page .guide-section{padding:0 0 33px;border-top:0;border-bottom:1px solid #dce3d9;margin-bottom:40px}.guide-section-heading{display:flex;gap:15px;align-items:center;margin-bottom:24px}.section-icon{display:grid;place-items:center;background:#e3ece2;border:1px solid #d4e1d3;border-radius:13px;width:46px;height:46px;flex-shrink:0;color:#3b7c67}.section-icon svg{width:24px;height:24px}.guide-section-heading .eyebrow{font-size:9px;letter-spacing:1.7px;color:#7b9282}.guide-section-heading h2{margin:6px 0 0;font-size:23px;font-weight:600;letter-spacing:-.5px}.launch-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.launch-flow article{padding:20px 13px;background:#fffefa;border:1px solid #dfe6dc;border-radius:11px;position:relative}.launch-flow article:not(:last-child):after{content:"→";position:absolute;right:-12px;top:29px;background:#f5f5ef;color:#6e9a82;z-index:1;font-size:17px}.launch-flow article>span{font:600 11px/1 monospace;display:inline-flex;align-items:center;justify-content:center;border:1px solid #d1e1d2;background:#ebf2e6;border-radius:50%;width:29px;height:29px;color:#477e61}.guide-section .launch-flow h3{font-size:15px;margin:15px 0 6px}.guide-section .launch-flow p{font-size:11px;line-height:1.6;margin:0;color:#7b8a80}.guide-page .full-instructions{border:1px solid #dce4d9;border-radius:9px;padding:0;margin-top:20px;background:#fafbf6}.guide-page .full-instructions>summary{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 18px;font-size:13px;list-style:none;font-weight:550}.full-instructions>summary::-webkit-details-marker{display:none}.full-instructions>summary>span{font-size:10px;color:#6b8271;white-space:nowrap}.full-instructions>summary>span:after{content:" +";font-size:15px}.full-instructions[open]>summary>span:after{content:" −"}.instructions-body{padding:0 20px 16px;border-top:1px solid #e4e9de}.instructions-body>p,.instructions-body .steps li{font-size:13px}.guide-page .instructions-body .steps{margin-top:20px}.guide-page .instructions-body .guide-note{font-size:12px}.guide-page .instructions-body .guide-cards{gap:12px}.guide-page .instructions-body .guide-cards article{background:#f2f5ed}.guide-page .instructions-body .guide-example{display:none}.remote-lab{background:#eaf0e7;border:1px solid #dbe5d6;border-radius:13px;padding:29px;display:grid;grid-template-columns:155px 1fr;gap:35px;align-items:center}.remote-device{border:1px solid #435752;border-radius:39px;background:linear-gradient(120deg,#304b48,#203633);padding:24px 15px 20px;box-shadow:0 18px 28px -15px #233e3a60;text-align:center;color:#ecf4ed;max-width:155px}.remote-brand{font-size:8px;letter-spacing:2.5px;color:#91b5a7;margin-bottom:24px}.remote-top{display:flex;justify-content:space-between;gap:7px}.remote-top span,.remote-back{font-size:9px;background:#4a625b;border:1px solid #5a7367;border-radius:7px;padding:9px 7px}.remote-pad{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,34px);margin:21px 0;gap:3px}.remote-pad .key{display:flex;align-items:center;justify-content:center;font-size:19px;border-radius:8px;background:#3a554c;color:#cfe5d7;border:1px solid #4f6e5b}.remote-pad .up{grid-column:2}.remote-pad .left{grid-row:2;grid-column:1}.remote-pad .ok{grid-row:2;grid-column:2;background:#a4cc98;color:#214536;font-size:11px;font-weight:700}.remote-pad .right{grid-row:2;grid-column:3}.remote-pad .down{grid-row:3;grid-column:2}.remote-back{display:inline-block;padding:8px 14px}.remote-grip{margin:22px 17px 0;height:25px;background:repeating-linear-gradient(0deg,transparent 0 4px,#66857455 4px 5px);border-radius:4px}.remote-instructions{display:grid;gap:19px}.remote-instructions>div{position:relative;padding-left:72px}.remote-instructions kbd{font-family:inherit;position:absolute;left:0;top:3px;display:flex;align-items:center;justify-content:center;width:58px;min-height:30px;border:1px solid #c3d4bd;background:#f6f9ef;border-radius:6px;box-shadow:0 2px 0 #c9d8c2;font-size:11px;color:#4f7b5c}.remote-instructions h3{font-size:14px;margin:0 0 4px}.remote-instructions p{font-size:11px;line-height:1.7;margin:0;color:#738571}.ui-tag{display:inline-block;font-size:10px!important;border:1px solid #cbdcc5;background:#eaf3e1;color:#547849!important;border-radius:20px;padding:5px 10px;line-height:1.2}.layout-playground{border:1px solid #d9e4d4;border-radius:13px;background:#ecf2e8;padding:23px;text-align:center}.playground-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;gap:15px}.guide-section .playground-head p{font-size:11px;margin:0;color:#7b8b74}.layout-radio{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0}.layout-radio+label{display:inline-flex;border:1px solid #cbd9c3;border-radius:7px;background:#f9fcf3;font-size:12px;padding:9px 15px;margin:0 4px 7px;cursor:pointer;color:#71836a}.layout-radio:checked+label{background:#3c6f58;border-color:#3c6f58;color:#fff}.layout-radio:focus-visible+label{outline:3px solid #176b68;outline-offset:3px}.layout-canvas{height:230px;display:flex;align-items:center;justify-content:center;margin-top:12px}.layout-screen{width:95%;height:190px;padding:7px;background:#274a40;border:1px solid #4f7461;border-radius:8px;display:flex;gap:5px;box-shadow:0 14px 20px -17px #25462e88;transition:width .25s,height .25s}.layout-cell{padding:18px;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;background:#f7faf0;border-radius:2px}.layout-cell strong{font-size:12px;color:#59734e}.layout-cell.second{display:none;background:#d9e5c9}.mini-dots{color:#be755e;font-size:10px;letter-spacing:6px}.mini-grid{height:45px;width:80%;background:repeating-linear-gradient(0deg,transparent 0 9px,#79926a55 9px 10px),repeating-linear-gradient(90deg,transparent 0 12px,#79926a55 12px 13px)}#layout-double:checked~.layout-canvas .second,#layout-portrait:checked~.layout-canvas .second{display:flex}#layout-portrait:checked~.layout-canvas .layout-screen{width:145px;height:225px;flex-direction:column}#layout-portrait:checked~.layout-canvas .layout-cell{padding:8px;gap:4px}#layout-portrait:checked~.layout-canvas .mini-grid{height:19px}#layout-portrait:checked~.layout-canvas .layout-cell strong{font-size:9px}.guide-section .diagram-caption{font-size:10px;color:#839176;line-height:1.7;margin:12px 0 0}.save-strip{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:10px;color:#6d8366;border:1px solid #dce5d6;border-radius:7px;padding:15px;margin-top:12px}.save-strip b{font-weight:400;color:#9cac8d}.guide-screenshot{margin:0;background:#e5ece1;padding:10px;border:1px solid #d8e2d2;border-radius:12px;overflow:hidden}.guide-screenshot img{display:block;width:100%;height:auto;border:1px solid #d3ddce;border-radius:5px}.guide-screenshot figcaption{display:flex;justify-content:space-between;gap:12px;font-size:9px;line-height:1.7;padding:12px 5px 2px;color:#72876c}.reading-chips{display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;font-size:10px;color:#809077}.reading-chips span{display:flex;align-items:center;gap:7px}.reading-chips i{width:7px;height:7px;border-radius:2px;background:#c1cbb7}.reading-chips .chip-red{background:#be6955}.reading-chips .chip-grid{background:#749978}.match-demo{border:1px solid #d5dfd0;border-radius:13px;background:#fffefa;overflow:hidden}.match-demo-head{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#edf2e7;padding:15px 20px;font-size:9px;color:#829178}.match-score{display:flex;align-items:center;justify-content:space-evenly;padding:29px 15px 22px;gap:15px;text-align:center}.match-score>div>span{display:block;font-size:9px;color:#8f9b85;margin-bottom:8px}.match-score strong{font-size:15px;font-weight:550}.match-score>b{font-size:44px;font-weight:550;letter-spacing:4px;color:#3e6753}.match-score>b>span{color:#b0bea5;margin:0 6px}.match-result{margin:0 25px 22px;display:flex;align-items:center;justify-content:center;gap:22px;font-size:12px;color:#748268}.match-result b{color:#3b624e;margin-left:8px}.result-pill{background:#dce9ce;border:1px solid #b9d0a4;color:#4f7040;border-radius:20px;padding:6px 17px;font-weight:600}.match-formula{background:#f3f5ed;border-top:1px solid #e2e7db;padding:18px;text-align:center;font-size:12px;color:#789065;display:flex;gap:15px;align-items:center;justify-content:center;flex-wrap:wrap}.match-formula small{display:block;flex-basis:100%;font-size:10px;color:#89977c}.sports-scope{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.sports-scope>span{padding:15px 10px;font-size:11px;background:#eaf0e3;border-radius:7px;text-align:center;color:#52724b;line-height:1.7}.sports-scope small{display:block;font-size:9px;color:#84947a}.poster-comparison{display:grid;grid-template-columns:1fr 1fr;gap:17px}.poster-comparison article{padding:20px;background:#edf1e5;border:1px solid #dce3d3;border-radius:12px;overflow:hidden}.poster-stack,.poster-fixed{height:235px;position:relative;display:flex;align-items:flex-start;justify-content:center;margin-bottom:20px;padding-top:9px}.poster-stack img,.poster-fixed img{width:115px;height:196px;object-fit:cover;object-position:top;border:4px solid #fffefa;border-radius:4px;box-shadow:0 11px 20px -12px #66785877}.poster-stack img:first-child{position:absolute;transform:rotate(9deg) translate(15px,2px)}.poster-stack img:nth-child(2){transform:rotate(-7deg) translate(-12px,0)}.poster-fixed img{border-color:#fffefa}.poster-stack>span,.poster-fixed>span{position:absolute;bottom:0;font-size:9px;color:#617d52;background:#fafcf4;border:1px solid #d5e1c8;border-radius:20px;padding:7px 11px;white-space:nowrap}.poster-comparison h3{font-size:16px!important;margin:13px 0 7px!important}.poster-comparison p{font-size:12px!important;line-height:1.8!important;margin:0!important;color:#849178!important}.maintenance-grid{display:grid;gap:16px}.maintenance-grid article{position:relative;padding:22px 24px 20px 73px;border:1px solid #dbe4d3;border-radius:11px;background:#edf2e8}.maintenance-symbol{position:absolute;left:24px;top:20px;font-size:25px;color:#648653}.maintenance-grid h3{font-size:16px;margin:0 0 18px}.maintenance-grid p{font-size:11px;line-height:1.7;margin:14px 0 0;color:#7b8e70}.update-track,.route-demo{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:11px;color:#7c9170}.update-track strong{border:1px solid #b9d09f;border-radius:20px;padding:6px 11px;background:#e1edcf;color:#56733f}.update-track i,.route-demo i{font-style:normal;color:#9aac89}.route-node{background:#fafcf4;border:1px solid #d2dfc8;border-radius:6px;padding:9px 12px;font-size:11px}.route-node.alternative{background:#dfeacd;color:#59753d}.guide-page #help>details{background:#fdfdf7;border:1px solid #dfe5d8;padding:0 18px;border-radius:9px;margin-bottom:10px}.guide-page #help>details>summary{padding:17px 0;font-size:13px;font-weight:550;line-height:1.7}.guide-page #help>details>p{font-size:12px;padding-bottom:12px;margin-top:0}.guide-page #community .community-card{background:#e6eee1;border-radius:13px;border-color:#c8d9bd}.guide-page #community>h2{font-size:23px}.guide-page #community p{font-size:13px}.guide-page #community .group-number{font-size:37px;letter-spacing:4px;color:#4d794d}.guide-page #community .micro{font-size:11px}
@media(min-width:1400px){.guide-page .wrap{max-width:1320px}.guide-page .guide-layout{grid-template-columns:210px minmax(0,1fr);gap:65px}}@media(max-width:1000px){.guide-page .guide-hero{gap:25px;grid-template-columns:1fr 1fr}.stage-phone{width:80px;height:155px;top:90px;right:9px}.guide-stage{padding:20px 15px 32px;min-height:280px}.stage-top>span:last-child{display:none}.guide-page .guide-layout{grid-template-columns:175px minmax(0,1fr);gap:28px}.launch-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.launch-flow article:nth-child(2):after{display:none}.remote-lab{padding:23px 18px;gap:20px;grid-template-columns:135px 1fr}.remote-instructions>div{padding-left:0}.remote-instructions kbd{position:static;width:max-content;min-width:44px;margin-bottom:8px;padding:4px 9px}.remote-instructions{gap:15px}.remote-instructions p{display:none}.poster-comparison article{padding:16px}.poster-stack img,.poster-fixed img{width:100px;height:170px}.poster-stack,.poster-fixed{height:205px}}
@media(max-width:700px){.guide-page .guide-hero{grid-template-columns:1fr;padding-top:35px;padding-bottom:35px;gap:35px}.guide-hero-copy h1{font-size:39px;line-height:1.3;margin:20px 0 18px}.guide-hero-copy>p{font-size:13px}.guide-stage{min-height:280px;max-width:520px;width:100%;padding:20px 22px 32px}.stage-tv{margin-right:45px}.stage-top>span:last-child{display:block}.stage-phone{width:92px;height:175px;top:90px;right:17px}.guide-page .guide-layout{grid-template-columns:1fr;gap:28px}.guide-page .guide-toc{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:15px 12px}.guide-toc strong{grid-column:1/-1;padding-bottom:7px}.guide-toc a{min-width:0;font-size:11px!important;padding:10px!important;gap:7px}.guide-page .guide-toc a span{font-size:11px}.guide-toc svg{width:16px;height:16px}.guide-toc .toc-help{grid-column:1/-1;margin-top:7px;padding-top:12px!important}.guide-section-heading h2{font-size:22px}.guide-page .guide-section{margin-bottom:30px;padding-bottom:29px}.guide-version-strip{font-size:11px;padding:16px;margin-bottom:28px}.guide-section-heading{gap:12px;margin-bottom:20px}.section-icon{width:41px;height:41px;border-radius:11px}.section-icon svg{width:21px;height:21px}.launch-flow article{padding:17px}.remote-lab{gap:23px;grid-template-columns:125px 1fr;padding:24px 16px}.remote-device{border-radius:33px;padding:22px 10px 18px}.remote-pad{grid-template-rows:repeat(3,30px)}.remote-instructions h3{font-size:12px}.remote-instructions kbd{font-size:10px}.layout-playground{padding:20px 12px}.playground-head{align-items:flex-start}.guide-section .playground-head p{max-width:160px;text-align:right;font-size:10px;line-height:1.6}.layout-radio+label{font-size:11px;padding:9px 11px;margin-left:2px;margin-right:2px}.layout-cell{padding:10px}.layout-cell strong{font-size:10px}.layout-screen{width:100%}.save-strip{justify-content:center;font-size:9px;gap:7px;line-height:1.8}.guide-screenshot figcaption{flex-wrap:wrap;font-size:8px}.match-demo-head{padding:13px;font-size:8px}.match-score>b{font-size:37px}.match-score strong{font-size:12px}.sports-scope{gap:7px}.sports-scope>span{font-size:10px;padding:12px 7px}.sports-scope small{font-size:8px}.poster-comparison{gap:10px}.poster-comparison article{padding:15px 12px}.poster-comparison h3{font-size:14px!important}.poster-comparison p{font-size:11px!important}.poster-stack img,.poster-fixed img{width:87px;height:153px}.poster-stack,.poster-fixed{height:188px}.poster-stack>span,.poster-fixed>span{font-size:8px;padding:7px 8px}.maintenance-grid article{padding:20px 17px 20px 55px}.maintenance-symbol{left:17px;font-size:22px}.update-track,.route-demo{gap:8px;font-size:10px}.route-node{padding:8px;font-size:10px}.guide-page #community .group-number{font-size:29px;letter-spacing:2px}.instructions-body{padding:0 16px 12px}.guide-page .full-instructions>summary{padding:15px;font-size:12px}.guide-page .full-instructions>summary>span{font-size:9px}}
@media(prefers-reduced-motion:reduce){.layout-screen,.guide-toc a{transition:none}}
