:root{color-scheme:dark;--bg:#0d1b2a;--panel:#122032;--soft:rgba(255,255,255,.09);--text:#fff;--muted:#c0ceda;--accent:#1fb6d5;--border:rgba(255,255,255,.12);--mid:#ffd166;--a:#6acbff;--b:#ceabff;font-family:Arial,Helvetica,sans-serif;font-size:14px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{margin:0;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}button{min-height:42px;border:1px solid transparent;border-radius:12px;background:var(--soft);color:white;padding:10px 13px;font-weight:700;cursor:pointer;line-height:1.3}button:hover{background:rgba(255,255,255,.16)}button:disabled{opacity:.35;cursor:default}button:focus-visible,summary:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}[hidden]{display:none!important}.primary{background:var(--accent);color:#04222b}.primary:hover{background:#4ecce4}.secondary{background:#263d53;border-color:#3e5871}.quiet{background:transparent;color:var(--muted)}.small{font-size:11px;padding:6px 9px;min-height:32px}.icon-btn{font-size:24px;min-width:40px;padding:5px 9px}.muted{color:var(--muted)}h1,h2,h3,h4,p{margin:0}h2{font-size:18px}h3{font-size:13px}a{color:#79def1}.app-header{height:64px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--border)}.brand h1{font-size:19px;line-height:1.2}.brand p{font-size:11px;color:var(--muted);margin-top:4px}.help-button{background:transparent;color:#c7d8e7;font-size:12px;font-weight:400;flex-shrink:0}.workspace{height:calc(100dvh - 64px);min-height:480px;display:grid;grid-template-columns:minmax(0,1fr) 300px}.viewer{min-width:0;display:flex;flex-direction:column;overflow:hidden}.viewer-top{height:36px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 12px}.file-info{display:flex;align-items:center;gap:8px;min-width:0;font-size:11px;color:var(--muted)}#imageName{max-width:45vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tag{font-size:10px;border:1px solid var(--border);border-radius:6px;padding:4px 6px;white-space:nowrap;color:var(--muted)}.analysis-bar{display:flex;align-items:stretch;gap:10px;padding:4px 12px 9px;flex-shrink:0}.age-button{background:var(--accent);min-width:123px;max-width:150px;align-self:flex-start;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:7px;padding:13px 10px;color:#052b35}.age-button:hover{background:#4ac9e0}.age-button small{flex-basis:100%;font-size:9px;font-weight:400;opacity:.9;margin-top:1px}.results-section{flex:1;min-width:0}.results{display:grid;grid-template-columns:1fr 1fr;gap:8px}.result{background:rgba(255,255,255,.055);border:1px solid var(--border);border-radius:12px;padding:9px 12px;border-left:3px solid var(--a);min-width:0}#resultB{border-left-color:var(--b)}.result-top{display:flex;align-items:center;justify-content:space-between;gap:7px}.result h4{font-size:12px;font-weight:600;line-height:1.3}.angle{font-size:23px;white-space:nowrap;font-variant-numeric:tabular-nums}.angle small{font-size:14px;vertical-align:top;line-height:1.5;margin-left:2px}.result-state{font-size:11px;color:var(--muted);margin-top:3px;line-height:1.35}.result.within{background:rgba(35,124,81,.3);border-color:#478468}.result.within .result-state{color:#a7efcc}.result.above{background:#8e2430;border-color:#f06c75}.result.above .result-state{color:#ffe2e4}.angle-track{display:none}.cutoff-label{font-size:10px;color:var(--muted);margin:5px 2px 0}.instruction{display:flex;gap:9px;align-items:center;padding:9px 12px;min-height:46px;flex-shrink:0;border-top:1px solid var(--border);background:#172b3f}.instruction>span{font-size:12px;font-weight:700;color:var(--mid);min-width:32px}.instruction p{font-size:13px;line-height:1.4}.stage{position:relative;flex:1;min-height:140px;background:#080f17;overflow:hidden}.stage canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.stage.panning canvas{cursor:grab}.stage.dragging canvas{cursor:grabbing}.stage-badge{position:absolute;bottom:10px;left:10px;padding:6px 9px;border-radius:9px;background:#0d1b2ade;border:1px solid #58728b;font-size:11px;pointer-events:none}#dropHint{display:none;position:absolute;inset:12px;align-items:center;justify-content:center;border:2px dashed var(--accent);background:#102b3be8;font-size:20px;pointer-events:none}.stage.dragover #dropHint{display:flex}.loading{position:absolute;inset:0;background:#0d1b2aea;display:grid;place-items:center;color:var(--accent)}.viewer-status{height:27px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 12px;font-size:10px;color:#adc0d0}.bottom-actions{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:7px;padding:8px 10px 10px;border-top:1px solid var(--border);flex-shrink:0}.action{min-height:65px;padding:8px 4px;font-size:12px;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.action .icon{font-size:23px;line-height:1}.action.active{background:rgba(31,182,213,.22);border-color:#368ba0}.action.danger{background:rgba(255,141,134,.12);color:#ffc7c2}.inspector{border-left:1px solid var(--border);background:var(--panel);overflow:auto;scrollbar-width:thin;scrollbar-color:#455d73 transparent}.inspector-heading{padding:18px 15px;display:flex;align-items:center;gap:10px;justify-content:space-between}.inspector-heading h2{font-size:17px}.side-section{padding:16px 15px;border-top:1px solid var(--border)}.side-section h3{color:var(--muted);font-weight:500;margin-bottom:12px}.workflow{display:flex;flex-direction:column;gap:18px}.step{display:flex;align-items:center;gap:10px;font-size:13px;color:#c7d5df}.step b{width:28px;height:28px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;background:#24364a;color:#c1d0de;font-size:12px}.step small{display:block;font-size:11px;line-height:1.4;color:#9fb4c7;margin-top:4px}.step.current b{background:#66522a;color:#ffe2a0}.step.current span{color:white}.step.done b{background:#235d47;color:#bcf7df}.wide-button{display:flex;gap:12px;align-items:center;text-align:left;width:100%;min-height:63px;margin-bottom:9px;padding:10px 13px;font-size:14px}.wide-button .icon{font-size:25px;min-width:25px}.wide-button small{display:block;color:#aebfd0;font-size:11px;font-weight:400;margin-top:4px}.wide-button[aria-pressed=true]{background:#164557;border-color:#3d8194}.zoom-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:11px;background:rgba(255,255,255,.04);border-radius:12px}.zoom-controls button{font-size:21px;min-width:46px;background:transparent}.zoom-controls output{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.plain-tip{font-size:13px;line-height:1.65;color:#e0e9f0}.field-note{font-size:11px;line-height:1.55;color:#afc1d0;margin-top:9px}.local-note{font-size:11px;color:#91a9be;line-height:1.6;padding:15px}.workspace.panel-hidden{grid-template-columns:1fr}.workspace.panel-hidden .inspector{display:none}
dialog{color:var(--text);border:1px solid #3c5166;border-radius:18px;background:#122032;padding:0;width:min(540px,calc(100% - 24px));max-height:88dvh;box-shadow:0 18px 55px #0007}dialog::backdrop{background:#0009}.dialog-heading{padding:15px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--border)}.dialog-content{padding:16px 18px;font-size:13px;line-height:1.65}.dialog-content p+p{margin-top:12px}.dialog-actions,.export-options{display:flex;justify-content:flex-end;gap:8px;padding:12px 18px 18px}.dialog-actions button{min-width:100px}.export-options button{flex:1}.field{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#c7d7e4}.field small{font-size:10px;color:#93aabe;font-weight:400}.field-row{display:flex;gap:12px;align-items:flex-end;margin:16px 0}.field-row .field{flex:1;min-width:0}.field-row .age-field{flex:0 0 92px}input:not([type=range]):not([type=checkbox]),select,textarea{width:100%;border:1px solid #40566c;border-radius:10px;background:#0d1b2a;color:white;padding:10px 11px;min-height:43px;font-size:14px}textarea{resize:vertical;max-height:180px;line-height:1.5}input::placeholder,textarea::placeholder{color:#8ea5b9}.age-choices{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:15px}.age-choices button{font-size:19px;min-height:62px}.age-choices small{display:block;font-size:10px;color:#c4d5e3;font-weight:400;margin-top:3px}.age-choices button[aria-pressed=true]{background:#1b586a;border-color:var(--accent)}.more-section{border-top:1px solid var(--border);padding:17px 0}.more-section:last-child{padding-bottom:0}.more-section h3{font-size:14px}.button-pair{display:flex;gap:9px;margin-top:12px}.button-pair button{flex:1;font-size:12px}.reference-note{font-size:11px;color:var(--muted);line-height:1.55}.text-button{color:#8ae3f1;background:transparent;font-size:12px;min-height:35px;padding:8px 0;text-align:left}.text-button:hover{background:transparent;text-decoration:underline}#mobileViewSlot:not(:empty){padding:16px 0 4px}details summary{cursor:pointer;list-style:none;font-size:14px;font-weight:700;display:flex;align-items:center;gap:8px;min-height:30px}details summary::-webkit-details-marker{display:none}details summary:before{content:'›';font-size:22px;color:#91adc2}details[open] summary:before{transform:rotate(90deg)}details summary span{margin-left:auto;color:var(--muted);font-size:11px;font-weight:400}.point-list{margin-top:12px}.point-row{display:flex;align-items:center;gap:9px;min-height:39px;width:100%;margin-bottom:5px;padding:7px 9px;text-align:left;font-size:12px;font-weight:400;background:rgba(255,255,255,.035)}.point-row .point-number{color:var(--mid);min-width:18px}.point-row[data-index="2"] .point-number,.point-row[data-index="3"] .point-number{color:var(--a)}.point-row[data-index="4"] .point-number,.point-row[data-index="5"] .point-number{color:var(--b)}.point-row output{margin-left:auto;color:var(--muted);font-size:10px}.point-row.selected{background:#1c4255;border-color:#4b869c}.point-editor{display:flex;align-items:flex-end;gap:8px;margin-top:12px}.point-editor .field{flex:1;min-width:0}.point-editor button{font-size:12px}.point-editor input{font-size:12px!important;padding:9px!important}.adjustments{padding-top:15px}.adjustments>label{display:block;margin-bottom:15px;font-size:12px}.adjustments output{float:right;color:var(--muted)}input[type=range]{width:100%;margin:12px 0 0;accent-color:var(--accent)}input[type=checkbox]{accent-color:var(--accent);width:16px;height:16px;vertical-align:-3px;margin:0 7px 0 0}.check-row{display:flex;gap:30px;margin:12px 0 17px;font-size:12px}.adjustments .quiet{margin-top:10px}.help-steps{padding-left:20px}.help-steps li{padding-left:5px;margin:12px 0}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:15px 0;line-height:2.6}.help-grid p+p{margin:0}kbd{font:11px Arial;border:1px solid #43596b;padding:2px 4px;border-radius:4px;display:inline-block;line-height:1.3;margin-right:4px}table{border-collapse:collapse;width:100%;margin:14px 0;font-size:11px}caption{text-align:left;color:var(--muted);padding-bottom:8px}td,th{padding:8px;border-bottom:1px solid #30465a;text-align:left}th{color:var(--muted);font-weight:500}.method-notice{border-left:2px solid var(--mid);padding:10px 12px;background:#29302e;color:#e8d3ad}#toast{position:fixed;bottom:106px;left:50%;transform:translate(-50%,10px);background:#254459;color:#fff;border:1px solid #607f96;box-shadow:0 8px 24px #0006;padding:12px 16px;border-radius:12px;max-width:min(580px,92vw);font-size:13px;opacity:0;pointer-events:none;z-index:100;transition:opacity .15s,transform .15s}#toast.visible{opacity:1;transform:translate(-50%,0)}#printArea{display:none}
@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) 330px}.inspector-heading,.side-section{padding:20px}.action{font-size:13px;min-height:70px}.result{padding:11px 14px}}
@media(max-width:1100px) and (min-width:980px){.workspace{grid-template-columns:minmax(0,1fr) 280px}.bottom-actions{gap:5px;padding:8px}.action{font-size:10px;min-height:64px}.action .icon{font-size:22px}.analysis-bar{gap:8px}.age-button{min-width:108px}.age-button small{font-size:8px}.result{padding:8px}.result h4{font-size:10px}.result-state{font-size:10px}}
@media(max-width:979px){.workspace{grid-template-columns:1fr}.inspector{display:none}#togglePanel{display:none}.workspace,.workspace.panel-hidden{height:calc(100dvh - 64px);min-height:420px}.bottom-actions{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;padding:8px 10px max(8px,env(safe-area-inset-bottom))}.action{min-height:56px;font-size:12px;gap:4px;padding:6px 3px}.action .icon{font-size:21px}#toast{bottom:150px}.analysis-bar{gap:8px}.age-button{min-width:110px}.result{padding:8px 10px}.stage{min-height:120px}.viewer-status{height:25px}#position{display:none}.more-content{padding-top:10px}}
@media(max-width:600px){.app-header{height:60px;padding:0 12px}.brand h1{font-size:16px}.brand p{font-size:9px;max-width:250px}.help-button{padding:6px 8px;min-height:36px;font-size:20px}.help-button span{display:none}.workspace,.workspace.panel-hidden{height:calc(100dvh - 60px);min-height:400px}.viewer-top{height:30px;padding:0 10px}.file-info{font-size:10px}#imageName{max-width:61vw}.tag{font-size:9px;padding:3px 5px}.analysis-bar{padding:4px 10px 7px;gap:7px}.age-button{min-width:86px;max-width:86px;padding:10px 6px;font-size:11px;gap:4px;border-radius:12px}.age-button>span:first-child{font-size:15px}.age-button small{font-size:8px;line-height:1.4;margin-top:3px}.result{padding:7px;border-radius:10px;border-left-width:2px}.results{gap:6px}.result-top{display:block}.result h4{font-size:9px;min-height:12px}.angle{font-size:21px;margin:4px 0 0}.angle small{font-size:12px}.result-state{font-size:9px;min-height:25px;line-height:1.4}.cutoff-label{font-size:9px;margin-top:4px;line-height:1.3}.instruction{min-height:44px;padding:8px 10px;gap:5px}.instruction>span{font-size:11px;min-width:30px}.instruction p{font-size:11px}.viewer-status{font-size:9px;padding:0 10px}.bottom-actions{gap:6px}.action{font-size:11px;border-radius:13px;min-height:56px}.stage-badge{font-size:10px;padding:4px 7px;bottom:7px;left:7px}dialog{border-radius:17px;width:calc(100% - 20px);max-height:90dvh}.dialog-heading{padding:13px 14px}.dialog-heading h2{font-size:16px}.dialog-content{padding:14px;font-size:12px}.dialog-actions,.export-options{padding:10px 14px 16px}.export-options{flex-wrap:wrap}.export-options button{font-size:12px;min-width:90px}.age-choices{gap:6px}.age-choices button{padding:8px 4px}.button-pair{gap:7px}.button-pair button{padding:10px 6px}.help-grid{font-size:11px}.point-row output{font-size:9px}}
@media(max-height:520px) and (max-width:979px){.app-header{height:45px}.brand p{display:none}.workspace,.workspace.panel-hidden{height:calc(100dvh - 45px);min-height:400px}.analysis-bar{padding-top:0}.result-top{display:flex}.result-state{min-height:0}.age-button small{display:none}.bottom-actions{grid-template-columns:repeat(8,minmax(0,1fr));padding:5px;gap:4px}.action{min-height:48px;font-size:9px}.stage{min-height:100px}}
/* Keep labels readable, including controls that are currently unavailable. */
button:disabled,button:disabled:hover{opacity:1;background:#152334;color:#a8b8c7;border-color:var(--border)}
button:disabled .icon{opacity:.6}
#resultA{border-left-color:var(--a)}
.action>span:not(.icon){display:block;max-width:100%;white-space:normal;line-height:1.25}
.zoom-controls button{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:72px}
.zoom-controls button small{font-size:12px;line-height:1.3}
.icon-btn{display:inline-flex;align-items:center;gap:6px;font-size:12px;min-height:44px}
.icon-btn span[aria-hidden]{font-size:22px;line-height:1}
@media(max-width:979px){.action{font-size:12px;min-height:64px}.action>span:not(.icon){min-height:30px;display:flex;align-items:center;justify-content:center}.action .icon{font-size:22px}.bottom-actions{padding-bottom:max(8px,env(safe-area-inset-bottom))}}
@media(max-width:600px){.brand{min-width:0;flex:1}.help-button{display:flex;flex-direction:column;align-items:center;gap:3px;max-width:78px;min-height:44px;padding:4px 6px;font-size:11px;font-weight:600;line-height:1.2}.help-button span{display:block}.help-button .icon{font-size:18px}.brand p{line-height:1.4}.action{font-size:12px}}
@media(max-height:520px) and (max-width:600px){.bottom-actions{grid-template-columns:repeat(4,minmax(0,1fr))}.workspace,.workspace.panel-hidden{min-height:460px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{html{color-scheme:light}body{background:white;color:#111}.app-header,.workspace,dialog,#toast{display:none!important}#printArea{display:block!important;font:10pt Arial,sans-serif}#printArea h2{font-size:16pt;margin:0 0 3mm}#printArea p{line-height:1.3;margin:1.5mm 0;overflow-wrap:anywhere}#printArea img{display:block;width:100%;height:80mm;object-fit:contain;margin:3mm 0}#printArea table{font-size:10pt;margin:3mm 0;break-inside:avoid}#printArea th,#printArea td{border-color:#bbb;color:#111;padding:2mm}#printArea .print-footnote{font-size:8pt;color:#444}#printArea .print-note{white-space:pre-wrap}@page{size:A4 landscape;margin:9mm}}

.patient-name-field{margin-top:16px}.file-info{flex:1;overflow:hidden}.patient-summary{font-size:12px;font-weight:700;color:var(--text);max-width:48%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-info .tag{flex-shrink:0}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.workspace,.workspace.panel-hidden{height:calc(var(--app-height,100vh) - 64px)}
.modal-open{overflow:hidden}
.dialog-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.65);touch-action:none}
dialog{
  display:none;position:fixed;inset:auto;margin:0;left:50%;
  top:calc(var(--dialog-top,0px) + var(--dialog-height,100vh)/2);
  transform:translate(-50%,-50%);width:calc(100% - 24px);max-width:540px;
  max-height:calc(var(--dialog-height,100vh) - 24px);overflow:hidden;
}
dialog[open]{display:flex;flex-direction:column}
dialog .dialog-heading,dialog .dialog-actions,dialog .export-options{flex:0 0 auto}
dialog .dialog-heading{background:var(--panel)}
dialog .dialog-content{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
dialog .dialog-actions{background:var(--panel)}
.age-choices button{touch-action:manipulation}
#ageButton{touch-action:manipulation}
@media(max-width:979px){
  .workspace,.workspace.panel-hidden{height:calc(var(--app-height,100vh) - 64px)}
  dialog input:not([type=range]):not([type=checkbox]),dialog select,dialog textarea{font-size:16px!important}
}
@media(max-width:600px){
  .workspace,.workspace.panel-hidden{height:calc(var(--app-height,100vh) - 60px)}
  dialog{width:calc(100% - 16px);max-height:calc(var(--dialog-height,100vh) - 16px)}
  .dialog-heading{padding:10px 12px}
  .dialog-content{padding:12px}
  .dialog-actions,.export-options{padding:10px 12px}
  .age-choices{margin-top:12px}
  #patientDialog .age-choices button{min-height:58px}
  #ageButton{min-height:74px}
}
@media(max-height:520px) and (max-width:979px){
  .workspace,.workspace.panel-hidden{height:calc(var(--app-height,100vh) - 45px)}
  .dialog-heading{padding-top:6px;padding-bottom:6px}
  .dialog-actions,.export-options{padding-top:6px;padding-bottom:6px}
}
@media print{.dialog-backdrop{display:none!important}}

.sumort-back{color:#bdd4ee;text-decoration:none;font-size:13px;flex-shrink:0;padding:8px;border:1px solid #43556b;border-radius:5px}.app-header{gap:14px}.app-header .brand{margin-right:auto}.app-header .brand p{font-size:11px}@media(max-width:700px){.sumort-back{font-size:11px;max-width:95px;line-height:1.3}.app-header .brand p{display:none}.app-header .brand h1{font-size:14px}}@media print{.sumort-back{display:none}}