@import url('./vendor/mouth-anatomy-aide/styles.css');

/* The source tissue palette, paths, typography and illustration proportions
   are retained. These rules add the swallowing workspace and new structures. */
:root{font-size:14px;--bolus:#70b53f;--bolus-dark:#487e28}
body{min-width:320px}.header-inner{max-width:1640px;min-height:82px;padding:0 36px}.brand{font-size:26px}.brand small{font-size:9px;margin-top:3px}.swallow-brand-mark{display:grid;place-items:center;width:43px;height:43px;background:var(--green);border-radius:14px;transform:rotate(-5deg)}.swallow-brand-mark svg{width:38px;height:38px}.header-context{display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:1.6px;color:#758372}.prototype-tag{font-size:9px;letter-spacing:.2px;padding:5px 8px;border:1px solid #dce3d4;background:#f0f3e9;border-radius:5px;color:#71836a;margin-left:5px}
main{max-width:1640px;padding:0 36px}.intro{padding:26px 0 28px}h1{font-size:38px;letter-spacing:-1px}.intro>div>p:last-child{font-size:12px}.vfss-workspace{display:grid;grid-template-columns:235px minmax(450px,1fr) 260px;gap:18px;align-items:start}.scenario-panel{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}.panel-heading{padding:20px 17px 18px}.panel-heading h2{font-size:20px;font-weight:500;letter-spacing:-.5px}.panel-heading .eyebrow{font-size:8px;letter-spacing:1.4px;margin-bottom:7px}.step-counter{font-family:Georgia,serif;font-size:28px;color:#d0d7c8}
#scenario-list{padding:0 9px 12px}.scenario-button{width:100%;display:flex;gap:10px;align-items:center;padding:11px 8px;border:1px solid transparent;border-radius:9px;text-align:left;margin-bottom:4px;min-height:62px}.scenario-button>span:nth-child(2){flex:1}.scenario-button strong{font-size:12px;font-weight:550;display:block;line-height:1.4}.scenario-button small{font-size:9px;color:#8a9581;display:block;margin-top:3px}.scenario-button:hover{background:#f2f5ec}.scenario-button.active{background:#eaf1e4;border-color:#b8c9ac}.scenario-glyph{height:29px;width:29px;background:#f0f2e9;color:#7c9170;border-radius:8px;display:grid;place-items:center;font-size:20px;font-family:Georgia,serif;flex-shrink:0}.scenario-button.active .scenario-glyph{background:#d8e5cd;color:#557744}.scenario-selected{font-size:15px;color:#b7c1ab;align-self:center}.active .scenario-selected{font-size:8px;color:#688557}.scenario-group{font-size:8px;letter-spacing:1.5px;color:#909c83;padding:17px 9px 9px;border-top:1px solid #ebeee3;margin-top:10px}.delivery-panel{padding:18px 15px;border-top:1px solid var(--line);background:#fafbf5}.delivery-panel .eyebrow{font-size:8px;letter-spacing:1.4px}.delivery-options{display:flex;gap:5px;margin:13px 0 10px}.delivery-options button{flex:1;font-size:9px;display:flex;align-items:center;gap:6px;flex-direction:column;padding:10px 2px;border:1px solid #e1e6d8;border-radius:8px;background:var(--paper);white-space:nowrap}.delivery-options button.active{color:#3a6249;border-color:#93ad87;background:#edf3e7}.delivery-icon{font-size:21px;height:24px}.delivery-panel>p:last-child{color:#8b9681;font-size:9px;line-height:1.6}.scenario-footnote{padding:14px 16px;border-top:1px solid #e8ebdf;color:#98a18c;font-size:9px;line-height:1.8}
.visual-card{border-radius:14px;min-width:0}.visual-toolbar{padding:12px 16px;min-height:57px;gap:8px}.view-label{display:flex;align-items:center;gap:7px;font-size:11px;color:#56744b}.view-label .icon{width:15px}.view-options{display:flex;align-items:center;gap:13px}.view-options label{display:flex;align-items:center;gap:5px;font-size:9px;color:#819077;white-space:nowrap}input[type=checkbox]{accent-color:#688c5a}.view-options input{width:12px;height:12px;margin:0}.stage{height:clamp(470px,55vh,640px);background:#fbf9f2}.stage-caption{top:16px;left:18px;font-size:9px;gap:6px}.stage-paused{font-size:7px;letter-spacing:1.2px;color:#9aab8d;margin-left:5px}.anatomy-svg{height:100%;width:100%;padding-top:20px}.bolus-key{position:absolute;bottom:13px;left:17px;font-size:9px;color:#879276;display:flex;align-items:center;gap:6px}.bolus-key i{width:7px;height:7px;background:var(--bolus);border-radius:50%}.projection-note{position:absolute;right:16px;bottom:13px;font-size:7px;color:#979f8a}.anatomy-label text{font-size:11px}.swallow-label text{font-size:10px}.oesophageal-lumen{fill:#fffef9}.oesophageal-wall{fill:none;stroke:#bc9383;stroke-width:1.5}.pocket{fill:#f6eddf;stroke:#c9aa86;stroke-width:1.2}.pyriform-pocket{stroke-dasharray:3 2;fill-opacity:.7}.vestibule-wall{fill:none;stroke:#c29b86;stroke-width:2}.closure-line{stroke:#b38a9e;stroke-linecap:round}.fold-landmark{stroke:#a17792;stroke-width:.9;stroke-dasharray:3 3;opacity:.65;fill:none}.ues{stroke:#c8aa94;stroke-width:3}.bolus-packet{fill:var(--bolus);stroke:#5e9e32;stroke-width:.4}.path-guide{stroke-width:1.3;stroke-dasharray:4 5;fill:none;opacity:.7}.food-guide{stroke:#73974b}.airway-guide{stroke:#aa7b97}#swallow-guides{display:none}.show-guides #swallow-guides{display:block}.delivery-cup{fill:#e7eee5;fill-opacity:.85;stroke:#8b9e88;stroke-width:1.6}.delivery-liquid{fill:#a7ce80;opacity:.65}.bottle-ring{fill:#dce5cd;stroke:#879d7c;stroke-width:1.5}.bottle-teat{fill:#efe3cc;stroke:#b2a081;stroke-width:1.3}.device-detail{fill:none;stroke:#95a489;stroke-width:1.5}.delivery-straw{fill:none;stroke:#839c79;stroke-width:7;stroke-linejoin:round;stroke-linecap:round}
.transport{padding:14px 16px 9px;border-top:1px solid #e7e8df;background:#fffefa}.transport-row{display:flex;align-items:center;gap:7px;margin-bottom:14px}.transport .icon-button{width:28px;height:31px;color:#87967b}.transport .icon{width:16px;height:16px}.play-button{display:flex;align-items:center;justify-content:center;gap:7px;min-width:120px;border-radius:7px;padding:10px 12px;background:var(--green);color:#fbfdf3;font-size:11px;white-space:nowrap}.play-button:hover{background:#164c3f}.time-readout{font-size:9px;font-variant-numeric:tabular-nums;color:#899780;white-space:nowrap;margin-left:3px}.speed-control{display:flex;gap:6px;align-items:center;font-size:9px;color:#899780;margin-left:auto}.speed-control select{border:1px solid #e2e6d9;background:#f7f9f0;color:#5e7655;padding:5px;border-radius:5px;font:inherit;font-size:10px}.loop-control{display:flex;align-items:center;gap:4px;color:#899780;font-size:9px}.loop-control input{height:12px;width:12px}.transport #timeline{--track:#7d9a69;--empty:#e8ebdf;height:20px}.phase-track{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:6px 0 0}.phase-track button{font-size:8px;color:#9ca68f;padding:4px 0;border-radius:4px;white-space:nowrap}.phase-track button.active{background:#edf2e5;color:#527545}.phase-track button:hover{background:#f0f3e9}.frame-summary{display:flex;gap:11px;align-items:center;min-height:92px;padding:17px 18px;background:#f4f7ee;border-top:1px solid #e5eadc}.frame-summary .flow-symbol{width:33px;height:33px;border-radius:10px;background:#e3edda}.frame-summary>div{flex:1}#phase-title{font-size:12px;font-weight:600}#frame-description{font-size:10px;color:#859179;line-height:1.7;margin-top:5px}#frame-description.airway-event{color:#966643}.illustrative-time{font-size:8px;color:#97a089;white-space:nowrap;align-self:flex-start;padding-top:3px}
.learning-panel{display:flex;flex-direction:column;gap:13px}.observation-card{background:var(--paper);padding:20px 18px 17px;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.observation-card>.eyebrow{font-size:8px;letter-spacing:1.5px}.observation-card h2{font-family:Georgia,serif;font-size:24px;letter-spacing:-.6px;font-weight:400;margin:9px 0 11px}.observation-card>p:not(.eyebrow){font-size:11px;line-height:1.8;color:#849078}.closeup-heading{display:flex;align-items:center;gap:5px;font-size:9px;margin-top:20px;padding-top:17px;border-top:1px solid #e7eadf;color:#7c896f}.closeup-heading i{width:5px;height:5px;border-radius:50%;background:#b88fa3}.closeup-heading span{margin-left:auto;font-size:8px;color:#a4ab96}.closeup-wrap{display:flex;margin:12px 0 15px;background:#faf8f0;border:1px solid #eeeadf;border-radius:10px;overflow:hidden;height:216px;align-items:stretch}.swallow-closeup{width:51%;height:100%}.closeup-labels{flex:1;display:flex;flex-direction:column;justify-content:space-evenly;padding:8px 5px 9px 0;font-size:8px;color:#a08c7d}.closeup-labels>span:before{content:'—';color:#c4b5a6;margin-right:3px}.closeup-labels .fold-key{color:#9d768c}.closeup-labels small{display:block;font-size:7px;color:#a0a48e;margin-top:4px;margin-left:12px}.observation-card>.focus-note{font-size:10px!important;line-height:1.8!important;padding:10px 11px;border-left:2px solid #b9c8a5;background:#f1f5e9;border-radius:0 6px 6px 0;color:#7b896d!important}.review-card{padding:6px 15px;background:#f1f2eb;border:1px solid #dfe4d6;border-radius:10px}.review-card details{margin:0}.review-card summary{font-size:10px;color:#738366;min-height:36px}.review-card summary>span{display:flex;align-items:center;gap:7px}.review-card summary>span .icon{width:15px;height:15px}.review-card .range-control{margin:14px 0}.review-card .range-heading label{font-size:10px}.review-intro{font-size:9px;line-height:1.7;color:#86947a;margin:8px 0 12px}.review-card .outline-button{font-size:10px;padding:9px;width:100%;justify-content:center}.review-card .quiet-button{font-size:10px;margin:6px 0;width:100%}#export-status{display:block;font-size:9px;color:#55784a;padding-bottom:5px}
.discovery-note{margin:22px 0 25px}.anatomy-credit{font-size:9px;color:#95a086}footer{max-width:1568px;margin:0 36px;font-size:9px;padding:18px 0 22px}.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}
dialog{max-width:660px;width:calc(100% - 36px);max-height:85vh;padding:26px 30px 30px;border:1px solid #dbe2d1;border-radius:16px;background:var(--paper);color:var(--ink);box-shadow:0 20px 80px #213b3330}dialog::backdrop{background:#203b365c;backdrop-filter:blur(3px)}.dialog-header{display:flex;align-items:center;justify-content:space-between}dialog h2{font-family:Georgia,serif;font-weight:400;font-size:30px;margin:10px 0 14px}dialog h3{font-size:13px;margin:22px 0 8px}dialog p,dialog li{font-size:12px;line-height:1.8;color:#798770}dialog ul{padding-left:18px}.dialog-tip{background:#eef3e6;padding:12px;border-radius:8px;margin-top:18px}.focus-view .scenario-panel,.focus-view .learning-panel,.focus-view .header-context,.focus-view .discovery-note,.focus-view footer{display:none}.focus-view .vfss-workspace{display:block}.focus-view .visual-card{max-width:1200px;margin:auto}.focus-view .stage{height:65vh;min-height:460px}.focus-view .intro{padding:14px 0}.focus-view .intro h1{font-size:29px}
@media(min-width:1600px){.vfss-workspace{grid-template-columns:250px minmax(450px,1fr) 280px;gap:22px}.stage{height:620px}.anatomy-label text{font-size:12px}.swallow-label text{font-size:11px}}
@media(max-width:1200px){.header-context{display:none}.header-inner,main{padding-left:24px;padding-right:24px}.vfss-workspace{grid-template-columns:205px minmax(410px,1fr);gap:16px}.learning-panel{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.observation-card{display:grid;grid-template-columns:1fr 200px;column-gap:22px}.observation-card>.eyebrow,.observation-card h2,.observation-card>#scenario-description,.observation-card>#scenario-focus{grid-column:1}.closeup-heading{grid-column:2;grid-row:1/3;margin-top:0;padding-top:0;border:0;align-self:start}.closeup-wrap{grid-column:2;grid-row:3/6;margin:0;height:190px}.review-card{align-self:start}.stage{height:520px}footer{margin:0 24px}.illustrative-time{display:none}}
@media(max-width:760px){.header-inner{padding:0 16px;min-height:70px}.brand{font-size:22px}.brand small{font-size:8px}.swallow-brand-mark{width:36px;height:36px;border-radius:11px}.header-inner>.quiet-button{font-size:10px}.header-inner>.quiet-button .icon{display:none}main{padding:0 16px}.intro{padding:23px 0 22px;gap:10px}.intro h1{font-size:33px}.intro .eyebrow{font-size:8px}.intro>div>p:last-child{font-size:10px;max-width:240px;line-height:1.6}.intro .outline-button{font-size:0;width:37px;height:37px;padding:9px}.intro .outline-button .icon{width:17px;height:17px}.vfss-workspace{display:flex;flex-direction:column;gap:15px}.scenario-panel{width:100%}.panel-heading{padding:13px 14px 10px}.panel-heading h2{font-size:17px}.panel-heading .eyebrow{font-size:7px}.panel-heading .step-counter{font-size:24px}#scenario-list{display:flex;overflow-x:auto;gap:7px;padding:0 12px 12px}.scenario-button{flex:0 0 157px;min-height:56px;padding:8px;gap:7px;margin:0}.scenario-button strong{font-size:10px}.scenario-button small{font-size:8px}.scenario-glyph{width:24px;height:27px;font-size:17px}.scenario-selected{display:none}.scenario-group{display:none}.delivery-panel{display:flex;align-items:center;gap:10px;padding:10px 13px}.delivery-panel .eyebrow{font-size:7px;max-width:55px;line-height:1.6}.delivery-options{flex:1;margin:0;gap:5px}.delivery-options button{flex-direction:row;justify-content:center;font-size:9px;padding:7px 5px}.delivery-icon{font-size:17px;height:19px}.delivery-panel>p:last-child,.scenario-footnote{display:none}.visual-card{width:100%;order:2}.stage{height:410px}.anatomy-svg{padding-top:20px}.visual-toolbar{padding:10px 12px;min-height:48px}.view-label{font-size:9px}.view-label .icon{display:none}.view-options{gap:8px}.view-options label{font-size:8px}.projection-note{font-size:6px;right:10px;bottom:12px}.bolus-key{font-size:8px;left:11px}.transport{padding:12px 10px 8px}.transport-row{gap:3px;flex-wrap:wrap}.play-button{min-width:102px;font-size:10px;padding:9px 8px}.transport .icon-button{width:24px}.transport .icon{width:14px}.time-readout{font-size:8px;margin-left:0}.speed-control{font-size:0;gap:0}.speed-control select{font-size:9px;max-width:52px}.loop-control{font-size:8px;gap:1px}.loop-control input{width:10px;margin:2px}.frame-summary{padding:14px 12px;min-height:88px}.frame-summary .flow-symbol{width:29px;height:29px}#phase-title{font-size:11px}#frame-description{font-size:9px}.learning-panel{width:100%;order:3;display:flex;gap:12px}.observation-card{display:grid;grid-template-columns:1fr 140px;padding:16px 14px;column-gap:13px}.observation-card h2{font-size:22px}.observation-card>p:not(.eyebrow){font-size:10px}.observation-card>.focus-note{font-size:9px!important}.closeup-heading{font-size:8px;line-height:1.5}.closeup-heading span{display:none}.closeup-wrap{height:185px}.closeup-labels{font-size:7px}.closeup-labels small{font-size:6px}.review-card{width:100%;padding:8px 14px}.review-card summary{font-size:11px}.review-card .range-control{margin:17px 0}.review-card input[type=range]{height:24px}.discovery-note{gap:10px;margin:20px 0}.discovery-note strong{font-size:10px}.discovery-note p{font-size:9px}.anatomy-credit{display:none}footer{margin:0 16px;font-size:8px;flex-wrap:wrap;gap:10px}footer>span:first-child{display:none}.focus-view .stage{height:65vh;min-height:400px}.focus-view .intro h1{font-size:30px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.anatomy-label text{font-size:12px;fill:#68775e}.swallow-label text{font-size:11px}.closeup-labels{color:#7f7467}.bolus-packet{stroke-width:0}
@media(max-width:760px){.anatomy-label text{font-size:18px}.swallow-label text{font-size:16px}.closeup-labels{font-size:8px}.closeup-labels small{font-size:7px}.orientation-label{font-size:11px}}