/* Current shared geometry and guided feature, with the existing local art. */
.container,.head-inner,.foot-inner{width:92%;max-width:1100px;margin-inline:auto;box-sizing:border-box}
.head-inner{min-height:64px;height:auto;padding:8px 0;gap:20px}.site-head nav{position:static;gap:clamp(12px,2vw,24px);flex-wrap:wrap;justify-content:flex-end}
.hero,.hero.replay-hero{width:100%;max-width:1195.65px;height:264px;min-height:264px;grid-template-columns:minmax(0,1fr) minmax(0,492px);background:#031c2d;mask:none;-webkit-mask:none}
.hero>div,.hero.replay-hero>div{position:relative;inset:auto;padding:30px 0 22px 8%;width:auto;margin-right:-120px;pointer-events:auto}
.hero h1,.hero.replay-hero h1{font-size:clamp(33px,4.5vw,48px);line-height:1.04;margin-bottom:18px}.hero p,.hero.replay-hero p{white-space:normal;font-size:19px;max-width:410px;line-height:1.35}
.hero>img,.hero.replay-hero>img,.hero:not(.replay-hero)>img{width:100%;max-width:492px;height:264px;object-fit:contain;object-position:right bottom;align-self:end;justify-self:end}
.hero:not(.replay-hero)>img{max-width:372px;height:224px}
.container,.replay-page .container{margin-top:16px;margin-bottom:26px}
#touch-lab{height:auto;padding:18px 16px}#touch-lab>h2,.mode-row,#touch-lab>.actions,#session-status,.surface-row,.session-tools{position:static;height:auto;margin:12px 0}
.surface-row{grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:22px;padding:0}#coverage-grid{width:100%;height:auto;aspect-ratio:2}#grid-help{max-width:none}
.session-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,319px);height:auto}.session-tools>.actions{flex-wrap:wrap;margin:0}.cell-inspector{min-width:0}.cell-inspector .inspector-hint{position:static;margin:4px 0}.cell-inspector dl{grid-template-columns:1fr 1fr 1fr 1fr}
#copy-status:not(:empty),#error:not(:empty){position:static;font-size:13px}#session-status{max-width:none}
.how,.tips{height:auto;min-height:0}.steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.steps article>div{min-height:82px;padding-left:48px}.steps h3{white-space:normal}.steps p{position:static;margin-top:6px}.steps img{height:auto;width:100%;max-height:157px;object-fit:contain}.example{position:static;height:auto;margin-top:12px}.example p{gap:18px;flex-wrap:wrap}.example span{white-space:normal;margin:0}.example strong{white-space:normal}
.faq{height:auto;min-height:0;margin-top:25px}.faq summary{height:auto;min-height:35px;padding-right:36px}
.teaser{grid-template-columns:minmax(0,1fr) minmax(0,398px);height:210px}.teaser>div{position:relative;padding:18px;max-width:none;margin:0}.teaser h2{font-size:28px;line-height:1.1}.teaser p{width:auto;max-width:310px;font-size:13px}.teaser>img{max-width:398px;width:100%;object-fit:contain}
.guide{grid-template-columns:minmax(0,27%) minmax(0,36%) minmax(0,37%);height:auto;min-height:225px;padding:8px 10px;gap:0}
.guide-art{width:auto;height:auto}.guide-copy{height:auto;min-height:196px;margin:6px 0;padding:0 16px}.guide-form{width:auto;margin:10px 0 0;padding:0 16px}.guide li{white-space:normal}.guide h2{font-size:23px}
.site-foot,.foot-inner{height:auto;min-height:80px}.foot-inner{position:static;padding:10px 0;gap:16px;align-items:center;flex-wrap:wrap}.foot-inner nav,.foot-inner>button{position:static}.foot-inner nav a{width:auto!important}.foot-inner nav{gap:18px}
.canonical-heart{display:inline-block;width:20px;height:20px;background:#00b4e6;mask:url('/assets/canonical-heart-mask.png') center/contain no-repeat;-webkit-mask:url('/assets/canonical-heart-mask.png') center/contain no-repeat;vertical-align:middle;margin-right:7px}
.replay-page .workbench{height:auto;padding:18px;background:#f3fafe}.replay-page .workbench h2{font-size:29px}.guided-routes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:18px 0}.guided-routes article{padding:12px;background:#e4f4fa;border-radius:4px;font-size:13px}.guided-routes p{font-size:12px;margin:8px 0 0}.guided-actions{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin-bottom:20px}.guided-actions label{display:block;flex:1;min-width:180px;font-size:13px;font-weight:800}.guided-actions select{display:block;width:100%;margin-top:7px}.guided-actions button{min-height:36px;font-size:12px}
#replay-title,#replay-scope,#replay-grid,.playback,.metrics,#r-extra,.replay-page .workbench>.actions,#replay-error:not(:empty){position:static;inset:auto;width:auto;height:auto;margin:12px 0}
#replay-title{font-size:16px}#replay-scope{font-size:12px}#replay-grid{display:block;width:100%;height:auto;aspect-ratio:3;background:#dae5ed}
.playback{display:flex;gap:15px;flex-wrap:wrap;align-items:center}.playback>*{position:static!important}.playback #play{flex:none;width:38px;height:38px}.playback #scrubber{flex:1;width:auto;min-width:150px}.playback label{font-size:12px}.playback #time-label{font-size:12px}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.metrics div{height:auto;min-height:66px;padding:8px}.replay-page .workbench>.actions{flex-wrap:wrap}.replay-page .workbench>.actions>.button,#reset-replay{width:auto}
.share-panel{position:static;height:auto;padding:18px;background:#f3fafe}.share-panel>h2,.share-panel>p,.formats,.share-row{position:static;margin:0 0 16px;height:auto;width:auto}.share-panel>h2{font-size:27px}.share-panel>p{font-size:13px}.formats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.formats label{height:auto;min-height:53px;padding:9px 8px 9px 42px}.formats small{font-size:10px}.share-row{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:24px;margin:0}.share-row canvas{width:100%;height:auto;max-width:none}.share-controls{height:auto;min-width:0;display:flex;flex-direction:column;gap:10px}.share-controls>label:first-child{margin:0 0 4px;font-size:14px}.share-controls .check{height:auto;margin:0 0 6px;font-size:12px}.share-controls>button{position:static;width:100%;height:auto;min-height:35px;margin:0;padding:8px}.share-controls>#share-link{order:1;background:#00a8dc;color:white}.share-controls>#download-json{order:2}.share-controls>#download-png{order:3}.share-controls>#download-html{order:4}.share-controls>#copy-caption{order:5}.share-controls>small,#share-status:not(:empty){position:static;order:6;font-size:11px}#share-status textarea{width:100%;min-height:100px}.tips{padding:12px 0}.tips .steps{gap:18px}.tips article{padding-left:0}.tips .tip-icon{display:none}.tips .steps h3{font-size:15px;white-space:normal}.tips .steps p{font-size:13px;position:static}
@media(max-width:811px){.hero>div,.hero.replay-hero>div{padding-left:8%;margin-right:-170px}.hero,.hero.replay-hero{grid-template-columns:minmax(0,1fr) minmax(0,55%)}.hero>img,.hero.replay-hero>img{max-width:100%;height:auto;max-height:264px}.guide{grid-template-columns:35% minmax(0,1fr)}.guide-form{grid-column:1/-1;padding-top:14px;margin-top:12px}.guide-copy{border-right:0}.site-head nav{max-width:55%}.site-head img{max-width:155px;height:auto}.session-tools{display:flex;flex-wrap:wrap}.cell-inspector{flex:1;min-width:240px}.formats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.hero,.hero.replay-hero{height:350px;min-height:350px;display:block;position:relative}.hero>div,.hero.replay-hero>div{position:relative;padding:22px 4%;margin:0;width:100%}.hero h1,.hero.replay-hero h1{font-size:35px;max-width:310px}.hero p,.hero.replay-hero p{font-size:16px;max-width:280px}.hero>img,.hero.replay-hero>img,.hero:not(.replay-hero)>img{position:absolute;right:0;bottom:0;width:260px;height:auto;max-height:160px;object-position:right bottom}.surface-row,.share-row{grid-template-columns:minmax(0,1fr)}.steps{grid-template-columns:1fr}.steps article>div{padding-left:48px;min-height:0}.steps img{max-width:225px;margin:12px 0}.steps article{padding-bottom:10px}.guided-routes{grid-template-columns:1fr;gap:8px}.guided-routes article{padding:10px}.metrics{grid-template-columns:repeat(2,1fr)}.guide-art img{max-width:110px}.guide-copy{padding-inline:10px}.guide h2{font-size:21px}.guide li{font-size:12px}.guide-form{padding:12px 5px}.guide-form label{font-size:12px}.teaser{height:auto;grid-template-columns:1fr}.teaser>img{max-height:200px;justify-self:end}.tips .steps{grid-template-columns:1fr}.head-inner{gap:12px}.site-head nav{gap:8px 12px}.site-head nav a{font-size:11px}.site-head img{width:145px}.share-panel,.replay-page .workbench{padding:15px}}

#coverage-grid{position:relative}#coverage-grid .sample-trail{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

.floating-support .canonical-heart{margin:0}.floating-support{display:grid;place-items:center;z-index:10}