.treatment-chapter{border:1px solid var(--line);border-radius:10px;margin-bottom:20px;overflow:clip;scroll-margin-top:116px;background:var(--paper)}
.treatment-chapter.reendo-chapter{background:#f0ece5}
.treatment{width:100%;min-height:113px;gap:22px;padding:23px 32px;border:0;background:#fff;border-radius:0}
.treatment strong{font:400 34px Georgia,serif;letter-spacing:-.025em}
.treatment small{font-size:15px;line-height:1.5;margin-top:7px;color:var(--muted)}
.treatment-number{font:italic 20px Georgia,serif;color:var(--cyan)}
.chapter-title{flex:1}
.chapter-tag{font-size:12px;border:1px solid var(--line);border-radius:100px;padding:9px 13px;white-space:nowrap}
.treatment .fold-icon{border:1px solid var(--line);border-radius:50%;width:38px;height:38px;flex-shrink:0;display:grid;place-items:center;font-size:25px;margin-left:0}
.treatment.is-active{background:var(--ink);color:white;box-shadow:none;border:0}
.treatment.is-active small{color:#cee4e9}
.treatment.is-active .treatment-number{color:var(--brand)}
.treatment.is-active .chapter-tag,.treatment.is-active .fold-icon{border-color:#ffffff40}
.treatment:hover:not(.is-active){background:#f2f6f4}
.reendo-chapter .treatment.is-active{background:#80573f}
.chapter-panel{overflow-anchor:none;position:relative;min-width:0}
.tooth-overview{padding:30px 32px 22px}
.gallery-heading{display:flex;justify-content:space-between;gap:25px;align-items:center;margin:0 0 16px}
.gallery-heading .eyebrow{margin-bottom:8px;font-size:12px}
.gallery-heading h3{font:400 30px/1.2 Georgia,serif;letter-spacing:-.025em;margin:0}
.gallery-heading h3 em{font-weight:400;color:var(--cyan)}
.gallery-heading>p{font-size:14px;line-height:1.6;color:var(--muted);margin:0}
.jaw-row{position:relative;border-bottom:1px solid var(--line);padding:0 0 10px;margin-bottom:10px}
.jaw-row h4{font-size:12px;letter-spacing:.09em;text-transform:uppercase;font-weight:500;color:var(--cyan);margin:0;padding:11px 0 0}
.jaw-teeth{display:flex;justify-content:center;align-items:end;gap:0}
.gallery-tooth{width:calc(100% / 6);min-width:0;border:0;padding:0 2px 7px;position:relative;background:transparent;transition:opacity .28s,transform .4s;outline-offset:0;border-radius:6px}
.gallery-tooth:disabled{opacity:1;cursor:wait}
.tooth-drawing{display:flex;justify-content:center;align-items:center;height:173px;width:100%;position:relative;isolation:isolate}
.tooth-drawing img{display:block;max-width:100%;width:auto;height:auto;max-height:173px;object-fit:contain;aspect-ratio:15/16;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse 52% 58% at 50% 50%,#000 76%,transparent 100%);transition:transform .4s}
.gallery-tooth:hover .tooth-drawing img,.gallery-tooth:focus-visible .tooth-drawing img{transform:translateY(-6px)}
.gallery-tooth:hover strong,.gallery-tooth:focus-visible strong{color:var(--cyan)}
.tooth-label{display:block;position:relative;text-align:center;padding-top:3px}
.tooth-label strong{font-size:15px;font-weight:500;display:block}
.tooth-label small{font-size:12px;color:var(--muted);display:block;margin-top:3px}
.tooth-label svg{position:absolute;left:calc(50% - 67px);top:-40px;width:57px;height:38px;transform:rotate(-54deg);pointer-events:none}
.tooth-label svg path{fill:none;stroke:var(--cyan);stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}
.gallery-foot{font-size:12px;line-height:1.6;color:var(--muted);margin:17px 0 0;text-align:center}
.is-leaving .gallery-heading,.is-leaving .jaw-row h4,.is-leaving .gallery-foot{opacity:0;transition:opacity .2s}
.is-leaving .gallery-tooth{opacity:0;transform:translateY(10px)}
.is-leaving .gallery-tooth.is-selected .tooth-drawing{visibility:hidden}
.flying-tooth{object-fit:contain;position:fixed;z-index:30;display:block;pointer-events:none;transform-origin:0 0;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse 52% 58% at 50% 50%,#000 76%,transparent 100%)}
#treatment-body{margin:0;padding:19px 32px 18px}
.is-preparing #treatment-body,.is-entering #treatment-body{position:absolute;inset:0 0 auto;width:100%}
.is-preparing #treatment-body{visibility:hidden}
.is-entering #treatment-body .caption,.is-entering #treatment-body .tour-navigation,.is-entering #treatment-body .tour-controls,.is-entering #treatment-body .tour-hint,.is-entering #treatment-body .further-reading,.is-entering #treatment-body .page-foot,.is-entering #treatment-body .orientation{opacity:0}
.workspace{display:block;border:0;min-width:0}
.tour{padding:0;scroll-margin-top:113px}
.tour-heading{min-height:51px;gap:18px;border-bottom:1px solid var(--line)}
#endo-tour-slot .tour-navigation{position:sticky;top:72px;z-index:10;background:var(--paper);border-bottom:1px solid var(--line)}
#endo-tour-slot .tour-heading{height:auto;min-height:52px;padding-block:4px;border-bottom:0;gap:14px}
.back-to-teeth{border:1px solid var(--line);border-radius:5px;background:transparent;color:var(--ink);padding:7px 11px;min-height:44px;font-size:14px;display:flex;align-items:center;gap:8px;flex-shrink:0}
.back-to-teeth span{font-size:20px}
.back-to-teeth:hover{background:var(--cyan);border-color:var(--cyan);color:var(--paper-light)}
.gallery-tooth:focus{background:#287c840b;box-shadow:inset 0 0 0 1px #287c8455}
.tooth-switcher{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:22px;padding:0 0 9px}
.switcher-jaw{display:grid;grid-template-columns:36px minmax(0,1fr);align-items:center;gap:6px;min-width:0}
.switcher-jaw-label{font-size:12px;color:var(--muted)}
.switcher-teeth{position:relative;display:flex;gap:3px;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#287c8466 transparent;padding:4px}
.switcher-tooth{flex:1 0 55px;min-width:0;min-height:76px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:4px 3px;border:1px solid transparent;border-radius:5px;background:transparent;transition:background .18s,border-color .18s}
.switcher-tooth img{display:block;width:45px;height:48px;object-fit:contain;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse 54% 61%,#000 74%,transparent 100%)}
.switcher-tooth>span{font-size:12px;line-height:1.3;white-space:nowrap}
.switcher-tooth:hover{background:#ffffff60;border-color:var(--line)}
.switcher-tooth[aria-pressed=true]{background:#287c8412;border-color:var(--cyan);box-shadow:inset 0 -2px var(--cyan);color:var(--ink)}
.switcher-tooth:focus-visible{outline-offset:1px}
.tooth-loading{position:absolute;inset:auto 15px 45%;margin:0;text-align:center;font-size:14px;color:var(--muted);animation:loading-in .15s .2s both;pointer-events:none}
@keyframes loading-in{from{opacity:0}to{opacity:1}}
#tour-name{margin-left:auto;font-size:14px;font-weight:500}
.whole-button{font-size:14px;color:var(--muted);padding-left:0}
.story-stage{grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);gap:15px;height:510px;min-height:0;align-items:center;touch-action:pan-y;scroll-margin-top:110px}
.story-stage:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.caption{padding:20px 0 20px 15px;max-width:360px}
.caption .scene-kicker{font-size:12px;color:var(--cyan);letter-spacing:.09em;margin-bottom:22px}
.caption h2{font-size:clamp(32px,3.2vw,45px);line-height:1.12;letter-spacing:-.04em;margin-bottom:22px}
.caption>p:not(.scene-kicker){font-size:17px;line-height:1.7;color:var(--muted);max-width:29ch}
.pointer-label{font:italic 17px/1.4 Georgia,serif;color:var(--cyan);margin-top:30px}
.art-box{max-height:none}
.orientation{font-size:12px;letter-spacing:0;bottom:8px}
.tour-controls{gap:21px;min-height:72px;padding-top:13px}
.play-button{font-size:14px;min-width:114px;gap:9px}
#play-label{display:inline}
.play-button>span:first-child{width:36px;height:36px}
.scene-steps{gap:15px}
.scene-step{font-size:13px;min-height:43px;padding-top:10px}
.scene-step>i{background:var(--cyan)}
#prev-button,#next-button{width:39px;height:39px}
.tour-hint{font-size:12px;line-height:1.6;margin:4px 0 16px;color:var(--muted)}
.further-reading{display:block;border-top:1px solid var(--line);padding:13px 0 3px}
.further-reading summary{font-size:14px;min-height:30px}
.further-reading details>div{font-size:15px;line-height:1.7;max-width:83ch}
.page-foot{font-size:12px;line-height:1.6;border:0;padding:0;gap:24px}
.page-foot details{max-width:320px}
.page-foot p{max-width:65ch}
.page-foot a{font-size:12px}
.is-reendo #tour-name{margin-left:0}
.is-reendo .whole-button{margin-left:auto}
.reendo-intro{padding:25px 32px 17px;display:flex;align-items:center;gap:24px}
.reendo-intro .eyebrow{margin:0;white-space:nowrap}
.reendo-intro>p:last-child{font-size:15px;line-height:1.6;color:var(--muted);margin:0}
.retreatment-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:0 32px 14px}
.retreatment-card{display:flex;align-items:center;gap:1px;min-width:0;text-align:left;border:1px solid var(--line);border-radius:5px;padding:12px 11px 12px 0;background:#faf7f1;transition:border-color .2s,background .2s}
.retreatment-card>img{width:38%;height:108px;object-fit:contain;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse 62% 65% at 50% 50%,#000 50%,transparent 95%)}
.retreatment-card-copy{flex:1;min-width:0}
.retreatment-card-copy>small{font-size:12px;color:#94745a;display:block;margin-bottom:8px}
.retreatment-card strong{font-size:15px;line-height:1.35;font-weight:500;display:block}
.card-action{font-size:12px;color:var(--muted);display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}
.retreatment-card[aria-pressed=true]{border-color:#97765e;background:#e8dece;box-shadow:inset 0 -2px #97765e}
.retreatment-card:hover{border-color:#97765e}
@media(min-width:1600px){.story-stage{height:550px}}
@media(max-width:1150px){.chapter-tag{display:none}
.tooth-drawing{height:155px}
.tooth-drawing img{max-height:155px}
.tooth-label svg{left:calc(50% - 56px);width:44px}
.story-stage{height:470px;grid-template-columns:minmax(230px,.85fr) minmax(0,1.15fr)}
.caption{padding-left:0}
.caption h2{font-size:35px}
.caption>p:not(.scene-kicker){font-size:16px}
.scene-steps{gap:10px}
.scene-step{font-size:12px}
.tour-controls{gap:13px}
.retreatment-cards{gap:9px}
.retreatment-card{padding-right:8px}
.retreatment-card strong{font-size:14px}}
@media(max-width:900px){.treatment{padding:22px 24px}
.tooth-switcher{grid-template-columns:minmax(0,1fr);gap:0}
.switcher-tooth{min-height:62px;flex-basis:55px;padding-block:3px}
.switcher-tooth img{width:30px;height:32px}
.tooth-overview{padding-inline:21px}
.gallery-heading h3{font-size:26px}
.gallery-heading>p{font-size:13px}
.tooth-drawing{height:132px}
.tooth-drawing img{max-height:132px}
.tooth-label svg{top:-32px;width:37px;left:calc(50% - 43px)}
.tooth-label strong{font-size:14px}
.tooth-label small{font-size:12px}
#treatment-body{padding-inline:24px}
.story-stage{height:435px;grid-template-columns:minmax(220px,.94fr) minmax(0,1.06fr);gap:8px}
.caption h2{font-size:31px}
.pointer-label{font-size:15px}
.tour-controls{gap:10px}
.play-button{min-width:38px}
#play-label{display:none}
.scene-step{font-size:12px}
.retreatment-cards{grid-template-columns:repeat(2,minmax(0,1fr));padding-inline:24px}
.retreatment-card>img{width:30%;height:90px}
.retreatment-card strong{font-size:16px}
.retreatment-card-copy>small{display:none}
.retreatment-card{padding:8px 16px 8px 0}
.reendo-intro{padding-inline:24px;display:block}
.reendo-intro .eyebrow{margin-bottom:8px}}
@media(max-width:700px){.treatment-chapter{border-radius:7px;scroll-margin-top:91px;margin-bottom:15px}
.treatment{padding:18px 17px;gap:12px;min-height:104px}
.treatment-number{display:block;align-self:flex-start;margin-top:6px;font-size:16px}
.treatment strong{font-size:29px}
.treatment small{font-size:13px;margin-top:6px;max-width:26ch}
.treatment .fold-icon{width:31px;height:31px;font-size:22px}
.tooth-overview{padding:23px 14px 20px}
.gallery-heading{display:block;margin-bottom:12px}
.gallery-heading h3{font-size:28px;max-width:18ch}
.gallery-heading>p{font-size:14px;margin-top:13px}
.gallery-heading>p br{display:none}
.jaw-row h4{font-size:12px;margin-top:12px;padding-bottom:5px}
.jaw-teeth{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 0}
.gallery-tooth{width:100%;padding-bottom:8px}
.tooth-drawing{height:142px}
.tooth-drawing img{max-height:142px}
.tooth-label{padding-top:1px}
.tooth-label strong{font-size:14px}
.tooth-label small{font-size:12px}
.tooth-label svg{left:calc(50% - 49px);top:-35px;width:41px}
.gallery-foot{font-size:12px;margin-top:13px;text-align:left}
.gallery-tooth:hover .tooth-drawing img{transform:none}
#treatment-body{padding:10px 16px 18px}
.tour{scroll-margin-top:89px}
.tour-heading{flex-wrap:wrap;gap:5px 16px;min-height:52px;padding-bottom:5px}
#endo-tour-slot .tour-navigation{top:59px}
#endo-tour-slot .tour-heading{display:grid;grid-template-columns:auto minmax(0,1fr) 44px;gap:7px;min-height:50px}
#endo-tour-slot .back-to-teeth{font-size:12px;padding:6px 8px;gap:6px}
#endo-tour-slot #tour-name{margin-left:0;text-align:right;line-height:1.3}
#endo-tour-slot .whole-button{width:44px;min-height:44px;font-size:20px;margin:0}
#endo-tour-slot .whole-button>span{display:none}
.tooth-switcher{padding-bottom:5px}
.back-to-teeth{font-size:13px;min-height:44px;gap:8px}
#tour-name{font-size:13px}
.whole-button{font-size:12px;min-height:30px;padding:4px 0;margin-left:auto}
.story-stage{display:flex;flex-direction:column;height:auto;gap:0}
.caption{padding:23px 0 0;min-height:235px;max-width:100%;align-self:stretch}
.caption .scene-kicker{font-size:12px;margin-bottom:14px}
.caption h2{font-size:31px;min-height:0;max-width:23ch;line-height:1.15;margin-bottom:14px}
.caption>p:not(.scene-kicker){font-size:16px;line-height:1.6;min-height:0;max-width:42ch}
.pointer-label{font-size:16px;margin-top:18px;max-width:27ch}
.art-box{height:clamp(310px,49svh,420px);width:100%;margin-top:8px}
.orientation{font-size:12px;right:2px;bottom:5px}
.tour-controls{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;gap:8px 12px;padding-block:14px 7px;min-height:0}
.scene-steps{grid-column:1/-1;grid-row:1;gap:9px;align-items:stretch}
.scene-step{font-size:12px;line-height:1.4;min-width:0;flex-basis:0;min-height:47px;white-space:normal}
.tour-controls .play-button{grid-column:2;grid-row:2;justify-self:center;font-size:14px;min-height:42px}
#play-label{display:inline}
#prev-button{grid-column:1;grid-row:2}
#next-button{grid-column:3;grid-row:2}
#prev-button,#next-button{width:40px;height:40px}
.tour-hint{font-size:12px;margin:8px 0 15px}
.further-reading{padding-top:10px}
.further-reading details{padding:0;border:0}
.further-reading summary{font-size:14px;min-height:35px}
.further-reading details>div{font-size:15px}
.page-foot{display:block;font-size:12px;line-height:1.6}
.page-foot details{margin-top:10px}
.reendo-intro{padding:22px 17px 15px}
.retreatment-cards{padding:0 16px 14px;gap:8px}
.retreatment-card{display:block;padding:10px 12px;position:relative;overflow:hidden;min-height:136px}
.retreatment-card>img{width:61px;height:76px;position:absolute;right:-6px;top:4px;opacity:.65}
.retreatment-card-copy{position:relative;display:block;padding-top:51px}
.retreatment-card strong{font-size:14px;max-width:14ch;min-height:2.7em}
.card-action{font-size:12px;margin-top:9px}}
@media(max-width:370px){.tooth-drawing{height:119px}
.tooth-drawing img{max-height:119px}
.tooth-label small{font-size:12px}
.scene-steps{flex-wrap:wrap}
.scene-step{flex-basis:28%}
.treatment-number{display:none}}
@media(prefers-reduced-motion:reduce){.gallery-tooth,.tooth-drawing img,.is-leaving .gallery-heading,.is-leaving .jaw-row h4,.is-leaving .gallery-foot{transition:none}
.switcher-tooth{transition:none}.tooth-loading{animation:none}
.gallery-tooth:hover .tooth-drawing img,.gallery-tooth:focus-visible .tooth-drawing img{transform:none}
.flying-tooth{display:none}}

/* The surgical chapter reuses the approved tooth presentation and its controls. */
.surgery-service{font-size:16px;line-height:1.7;margin:-16px 0 30px;max-width:80ch;color:var(--muted)}
.surgery-service a{color:var(--ink);text-decoration-color:var(--cyan);text-underline-offset:4px}
.surgery-intro{align-items:flex-start}
.surgery-intro .eyebrow{white-space:normal;flex:0 0 180px;line-height:1.6}
.surgery-intro>p:last-child{max-width:74ch}
.is-surgery #tour-name{margin-left:0}
.is-surgery .whole-button{margin-left:auto}
.surgery-note{font-size:12px;line-height:1.6;color:var(--muted);max-width:88ch;margin:5px 0 17px;padding-left:12px;border-left:2px solid var(--line)}
@media(max-width:700px){.surgery-service{font-size:14px;margin:-4px 0 26px}.surgery-intro .eyebrow{margin-bottom:9px}.surgery-chapter .treatment strong{font-size:27px}.is-surgery .tour-heading{height:auto;min-height:50px}.surgery-note{font-size:12px}}

/* Continuous scroll presentation. The range is the same timeline as the wheel. */
.continuous-controls{display:flex;align-items:center;gap:22px;padding:15px 0 9px;min-height:66px}
.scrub-label{display:flex;align-items:center;gap:10px;flex-shrink:0;font-size:12px;color:var(--muted)}
.scrub-label svg{width:18px;height:28px;fill:none;stroke:var(--cyan);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.tour-progress{--progress:0%;flex:1;min-width:0;appearance:none;-webkit-appearance:none;height:32px;margin:0;background:transparent;cursor:ew-resize;touch-action:pan-y;accent-color:var(--cyan)}
.tour-progress::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:linear-gradient(to right,var(--cyan) var(--progress),#193f4825 var(--progress))}
.tour-progress::-moz-range-track{height:3px;background:#193f4825}.tour-progress::-moz-range-progress{height:3px;background:var(--cyan)}
.tour-progress::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:2px solid var(--paper);border-radius:50%;background:var(--cyan);margin-top:-7.5px;box-shadow:0 0 0 1px #287c8450}
.tour-progress::-moz-range-thumb{width:15px;height:15px;border:2px solid var(--paper);border-radius:50%;background:var(--cyan);box-shadow:0 0 0 1px #287c8450}
.tour-progress:focus-visible{outline:2px solid var(--cyan);outline-offset:4px;border-radius:3px}
#tour-percent{min-width:42px;text-align:right;font-size:12px;font-variant-numeric:tabular-nums;color:var(--muted)}
.caption{animation:none!important}.arrow-layer{transition:none}.arrow-layer:not(.visible){opacity:0!important}
@media(max-width:700px){.continuous-controls{display:flex;gap:13px;padding:12px 0 5px}.scrub-label{font-size:11px;gap:7px}.scrub-label svg{width:15px}.caption{min-height:235px;overflow:visible}.caption h2{font-size:clamp(26px,6.5vw,31px)}#tour-percent{font-size:11px;min-width:35px}}

/* Matched anatomical variants share one canvas, camera and scroll position. */
.variant-labels{position:absolute;top:calc(50% - var(--illustration-height,100%)/2 + 6px);left:50%;transform:translateX(-50%);width:var(--illustration-width,100%);max-width:100%;display:grid;grid-template-columns:1fr 1fr;gap:12px;z-index:2;pointer-events:none;text-align:center;color:var(--ink);font-size:14px;line-height:1.3}
.variant-labels span{padding:4px 5px;background:linear-gradient(90deg,transparent,#f3eee4cc 15%,#f3eee4cc 85%,transparent)}
.is-comparison .orientation{max-width:100%;right:0;text-align:center;width:100%}
@media(min-width:701px){.story-stage.is-comparison{grid-template-columns:minmax(220px,.65fr) minmax(0,1.35fr)}}
@media(max-width:700px){.variant-labels{gap:8px;font-size:13px}.is-comparison .art-box{height:clamp(330px,52svh,430px)}}
