:root{font-family:Arial,Helvetica,sans-serif;color:#19313d;background:#f7fbfd;font-synthesis:none;--header-text:#203746;--header-heading:#123f73;--header-secondary:#647b8c;--header-accent:#2383c5;--header-surface:#f8fbfc;--header-border:#d5e4ea}
*{box-sizing:border-box}
body{margin:0;padding-bottom:80px}
button,input,select{font:inherit}
button{cursor:pointer;border:0}
button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ff9f43;outline-offset:2px}
.app-header{position:sticky;top:0;z-index:8;display:flex;align-items:center;gap:12px;min-height:56px;padding:7px 20px;background:#fff;border-bottom:1px solid var(--header-border);box-shadow:0 1px 4px #b9d4df35}
.sidebar-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;padding:0;background:transparent;color:#245b85;border-radius:6px}
.sidebar-toggle:hover{background:#e7f3f7}
.sidebar-toggle:focus-visible{outline:2px solid rgba(35,131,197,.28);outline-offset:2px}
.sidebar-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.brand{flex:none;display:flex;align-items:center;min-width:142px}
.brand-name{font-size:23px;font-weight:600;letter-spacing:.02em;color:#173b5c;white-space:nowrap}
.brand-name small{font-size:12px;font-weight:500;color:var(--header-secondary);letter-spacing:.01em}
.header-field{display:flex;align-items:center;gap:6px;width:0;height:38px;padding:0 8px;color:#526e80;font-size:12px;font-weight:600;white-space:nowrap;min-width:0;flex:1 1 0}
.header-icon{width:17px;height:17px;flex:none;fill:none;stroke:#245b85;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.header-label{flex:none}
.header-field input,.header-field select{height:36px;background:var(--header-surface);border:1px solid var(--header-border);border-radius:7px;padding:6px 8px;color:var(--header-text);font-size:14px;font-weight:400;min-width:0}
.header-field input:focus,.header-field select:focus{border-color:var(--header-accent);outline:2px solid #2383c533;outline-offset:0}
.header-field input{width:100%;flex:1 1 auto}
.header-field select{width:100%;flex:1 1 auto}
.date-control{position:relative;display:flex;align-items:center;width:0;min-width:0;flex:1 1 auto}
.date-control input{width:100%;padding-right:30px}
.date-control .date-icon{position:absolute;right:8px;width:16px;height:16px;fill:none;stroke:#245b85;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:auto;cursor:pointer}
.date-control input::-webkit-calendar-picker-indicator{opacity:0;cursor:pointer}
.primary{display:flex;align-items:center;justify-content:center;gap:8px;height:40px;background:var(--header-accent);color:#fff;padding:0 14px;border-radius:7px;white-space:nowrap;font-size:13px;font-weight:600}
.secondary{background:#e4f2f7;color:#23516a;padding:13px;border-radius:6px}
.header-dropdown{position:relative;margin-left:auto;flex:none}
.header-actions{display:flex;align-items:stretch}
.header-actions #nextSubject{border-radius:6px 0 0 6px}
.header-actions #nextSubject{display:flex;align-items:center;gap:8px}
.action-icon,.menu-icon{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.menu-icon{width:18px;height:18px}
.header-menu-button{border-left:1px solid #ffffff7a;border-radius:0 7px 7px 0;padding:0;width:38px;font-size:19px;line-height:1}
.header-menu-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.header-menu{position:absolute;right:0;top:calc(100% + 3px);min-width:190px;padding:5px;background:#fff;border:1px solid #a7cee5;border-radius:7px;box-shadow:0 4px 16px #315b7050;z-index:12}
.header-menu[hidden]{display:none}
.header-menu button{display:flex;align-items:center;gap:9px;width:100%;padding:9px 12px;background:#fff;color:#23516a;text-align:left;border-radius:4px;white-space:nowrap}
.header-menu button:hover{background:#d7eef7}
.header-menu .export-icon{color:#168450}
.header-menu .results-icon{color:#2577b7}
.header-menu .reset-option{margin-top:5px;border-top:1px solid #d6e4ea;border-radius:0 0 4px 4px;background:#fff4dd;color:#825100;font-weight:600}
.header-menu .reset-option:hover{background:#ffe9b7}
.header-menu .reset-all-option{background:#fff0ed;color:#a32d25;font-weight:600}
.header-menu .reset-all-option:hover{background:#ffddd7}
.sidebar{position:fixed;top:0;bottom:0;left:0;z-index:20;display:flex;flex-direction:column;width:min(320px,86vw);padding:22px 18px;background:#fff;box-shadow:4px 0 18px #315b7038;transform:translateX(-105%);transition:transform .3s ease;overflow-y:auto}
.sidebar.open{transform:translateX(0)}
.sidebar-head{display:flex;align-items:center;justify-content:space-between;padding:0 2px 22px;border-bottom:1px solid var(--header-border)}
.sidebar-close{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:transparent;color:#245b85;border-radius:6px;font-size:26px;line-height:1}
.sidebar-close:hover{background:#e7f3f7}
.sidebar-nav{display:flex;flex-direction:column;gap:4px;padding-top:18px}
.sidebar-nav button,.sidebar-nav a{display:block;width:100%;padding:11px 12px;background:#fff;color:#203746;border:0;border-radius:6px;font-size:14px;text-align:left;text-decoration:none;cursor:pointer}
.sidebar-nav button:hover,.sidebar-nav a:hover{background:#e7f3f7;color:#123f73}
.sidebar-install{margin-bottom:4px}
.sidebar-install[hidden]{display:none}
.sidebar-install-actions{display:flex;align-items:stretch;width:100%}
.sidebar-nav .sidebar-install-main,.sidebar-nav .sidebar-install-info{height:40px;background:var(--header-accent);color:#fff;border-radius:0;font-size:13px;font-weight:600}
.sidebar-nav .sidebar-install-main{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;flex:1;width:auto;padding:0 12px;border-radius:7px 0 0 7px}
.sidebar-nav .sidebar-install-info{display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;padding:0;border-left:1px solid #ffffff7a;border-radius:0 7px 7px 0}
.sidebar-nav .sidebar-install-main:hover,.sidebar-nav .sidebar-install-info:hover{background:#1f74ad;color:#fff}
.sidebar-install svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sidebar-divider{height:1px;margin-top:10px;background:var(--header-border)}
.sidebar-logo{display:flex;justify-content:center;margin-top:14px;padding:12px 8px 8px}
.sidebar-logo img{display:block;width:min(100%,260px);height:auto}
.sidebar-backdrop{position:fixed;inset:0;z-index:19;background:rgba(18,63,115,.18);opacity:1;transition:opacity .3s ease}
.sidebar-backdrop[hidden]{display:none}
.notice{padding:6px 18px;background:#fff5dc;color:#704d08;font-size:12px}
.copy-toast{display:none;position:fixed;top:20px;right:20px;width:300px;background:#18b268;color:#fff;padding:10px;border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,.2);text-align:center;z-index:50}
.copy-toast.show{display:block;animation:copyToastSlideIn .5s forwards,copyToastFadeOut 2s forwards 1.5s}
@keyframes copyToastSlideIn{from{transform:translateY(-100%)}to{transform:translateY(0)}}
@keyframes copyToastFadeOut{from{opacity:1}to{opacity:0}}
.dashboard{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:10px}
.panel{position:relative;z-index:1;min-width:0;background:#fff;border-radius:8px;box-shadow:0 2px 8px #a6c8d570;overflow:hidden;padding:8px;display:flex;flex-direction:column;min-height:590px;transition:transform .3s ease,box-shadow .3s ease}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 6px 9px}
.panel h2{display:flex;align-items:center;gap:10px;min-width:0;font-size:16px;line-height:1.2;font-weight:700;color:#123c75;margin:0}
.panel h2 span{min-width:0}
.panel-icon{width:23px;height:23px;flex:none;fill:none;stroke:#006ec8;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.panel-icon-filled{fill:#006ec8;stroke:none}
[data-panel="deauville"] .panel-icon-filled{fill:currentColor}
.expand{display:grid;place-items:center;flex:none;width:27px;height:27px;padding:0;background:transparent;color:#0071c9;border-radius:4px;white-space:nowrap}
.expand:hover{background:#eaf6ff}
.expand svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.toggle-row,.form-row{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:36px;background:#d9f2f8;border-radius:7px;padding:6px 10px;margin-bottom:5px}
.toggle-row{font-family:Arial,Helvetica,sans-serif;font-size:14px;font-weight:400;color:#19313d}
.toggle-row input[type=checkbox],.extent-row input[type=checkbox]{position:absolute;opacity:0;width:1px;height:1px}
.switch{display:inline-block;position:relative;width:48px;height:23px;border-radius:15px;background:#789596;flex:none;transition:background-color .2s cubic-bezier(.27,.2,.25,1.51)}
.switch:before{content:'×';position:absolute;top:2px;left:2px;width:19px;height:19px;border-radius:50%;background:#d2e1e5;color:#69868c;text-align:center;line-height:19px;transition:left .2s cubic-bezier(.27,.2,.25,1.51),transform .2s cubic-bezier(.27,.2,.25,1.51),box-shadow .2s ease}
.toggle-row input:checked+.switch,.extent-row input:checked+.switch{background:#237fc3}
.toggle-row input:checked+.switch:before,.extent-row input:checked+.switch:before{left:27px;content:'✓';color:#237fc3;background:#fff}
.toggle-row:not(.is-disabled):active .switch:before,.extent-row:not(.is-disabled):active .switch:before{transform:scale(1.08);box-shadow:0 1px 2px rgba(146,146,146,.45)}
.toggle-row.is-disabled,.extent-row.is-disabled{opacity:.46;cursor:not-allowed}
.toggle-row select{border:0;background:#f1fbff;border-radius:4px;padding:3px;min-width:80px}
.svg-area{position:relative;min-height:340px;height:370px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.region-svg{height:540px;min-height:540px}
.anatomy-svg{display:block;max-width:100%;max-height:100%;width:auto;height:100%;overflow:visible}
.clickable{cursor:crosshair;pointer-events:all}
.region-svg .clickable:hover:not(.selected){opacity:.24!important;fill:#e21f34!important;stroke:#ae152a!important}
.region-svg .clickable.selected{opacity:.78!important;fill:#e21f34!important;stroke:#ae152a!important}
.panel[data-panel="sites"] .clickable:hover:not(.hover-suppressed),.panel[data-panel="peritoneal"] .clickable:hover:not(.hover-suppressed){opacity:.24!important;fill:#e21f34!important;stroke:#ae152a!important}
.panel[data-panel="soft"] .clickable:hover:not(.hover-suppressed){opacity:.3!important;fill:#2f9bd9!important;stroke:#1f77b4!important}
.panel .clickable.hover-suppressed{opacity:0!important}
.lesion-marker{fill:#e6001c;stroke:white;stroke-width:.3;cursor:pointer;pointer-events:all}
.lesion-marker:hover{fill:#9b0014;stroke-width:.4}
.mammary-icon{pointer-events:none}
.mammary-target{opacity:0;fill:#2fa0eb;stroke:#2fa0eb;stroke-width:.24}
.panel-foot{font-size:12px;color:#446c7c;padding:7px 10px;margin-top:auto;background:#f0f8fb;border-radius:5px}
#responseSummary{text-align:center}
.panel[data-panel="regions"] .panel-foot{text-align:center}
.extent-group{margin-bottom:5px;background:#f2f9fb;border-radius:7px;padding:4px}
.extent-title{font-size:12px;font-weight:bold;color:#31637a;padding:2px 5px 5px}
.extent-row{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:30px;background:#d9f2f8;border-radius:5px;padding:3px 7px;margin-top:3px;font-size:12px;cursor:pointer}
.extent-row .switch{width:42px;height:21px}
.extent-row .switch:before{width:17px;height:17px;line-height:17px}
.extent-row input:checked+.switch:before{left:23px}
.deauville-graphic{display:flex;align-items:center;justify-content:center;gap:8px;margin:12px auto;width:min(100%,410px);height:330px}
.deauville-graphic img{display:block;max-width:calc(100% - 76px);max-height:100%;width:auto;height:auto;object-fit:contain}
.deauville-slider{position:relative;display:flex;align-items:stretch;gap:4px;height:88%;min-width:64px}
.deauville-slider::before{content:"";position:absolute;left:20px;top:13px;bottom:13px;width:8px;transform:translateX(-50%);border-radius:999px;background:linear-gradient(to bottom,#15171b 0%,#555961 25%,#9298a2 50%,#cbd0d7 75%,#ffffff 100%);pointer-events:none}
.deauville-track-marks{position:absolute;left:20px;top:13px;bottom:13px;pointer-events:none}
.deauville-track-marks i{position:absolute;left:0;width:13px;height:13px;box-sizing:border-box;background:#fff;border:2px solid #818894;border-radius:50%;transform:translate(-50%,-50%)}
.deauville-track-marks i:nth-child(1){top:0}
.deauville-track-marks i:nth-child(2){top:25%}
.deauville-track-marks i:nth-child(3){top:50%}
.deauville-track-marks i:nth-child(4){top:75%}
.deauville-track-marks i:nth-child(5){top:100%}
#deauvilleRange{position:relative;z-index:1;appearance:none;writing-mode:vertical-lr;direction:rtl;accent-color:#2683c8;cursor:pointer;width:40px;margin:0;background:transparent}
#deauvilleRange::-webkit-slider-runnable-track{width:8px;height:100%;background:transparent;border-radius:999px}
#deauvilleRange::-webkit-slider-thumb{appearance:none;box-sizing:border-box;width:26px;height:26px;margin-left:-9px;background:#2683c8;border:3px solid #fff;border-radius:50%;box-shadow:0 2px 6px #315b7040;transition:transform 380ms cubic-bezier(.2,1.65,.35,1),box-shadow 180ms ease}
#deauvilleRange::-moz-range-track{width:8px;height:100%;background:transparent;border-radius:999px}
#deauvilleRange::-moz-range-progress{width:8px;background:transparent}
#deauvilleRange::-moz-range-thumb{box-sizing:border-box;width:26px;height:26px;background:#2683c8;border:3px solid #fff;border-radius:50%;box-shadow:0 2px 6px #315b7040;transition:transform 380ms cubic-bezier(.2,1.65,.35,1),box-shadow 180ms ease}
#deauvilleRange:active:not(:disabled)::-webkit-slider-thumb{transform:scale(1.18);box-shadow:0 0 0 6px #2683c81c,0 3px 10px #24526940}
#deauvilleRange:active:not(:disabled)::-moz-range-thumb{transform:scale(1.18);box-shadow:0 0 0 6px #2683c81c,0 3px 10px #24526940}
#deauvilleRange:focus-visible{outline:2px solid #2683c8;outline-offset:2px;border-radius:999px}
#deauvilleRange:disabled{cursor:not-allowed}
@media(prefers-reduced-motion:reduce){#deauvilleRange::-webkit-slider-thumb{transition:none}#deauvilleRange::-moz-range-thumb{transition:none}#deauvilleRange:active:not(:disabled)::-webkit-slider-thumb{transform:none}#deauvilleRange:active:not(:disabled)::-moz-range-thumb{transform:none}}
.deauville-ticks{position:relative;height:100%;font-size:14px;font-weight:600;color:#245269;padding:0;min-width:14px}
.deauville-ticks span{position:absolute;right:0;line-height:1;transform:translateY(-50%)}
.deauville-ticks span:nth-child(1){top:13px}
.deauville-ticks span:nth-child(2){top:calc(25% + 6.5px)}
.deauville-ticks span:nth-child(3){top:50%}
.deauville-ticks span:nth-child(4){top:calc(75% - 6.5px)}
.deauville-ticks span:nth-child(5){top:calc(100% - 13px)}
.panel.deauville-disabled .deauville-graphic{opacity:.45}
.deauville-definition{display:flex;align-items:center;justify-content:center;min-height:29px;text-align:center;line-height:1.3;padding:6px 10px;margin-top:5px}
.deauville-definition[hidden]{display:none}
#responseSummary[hidden]{display:none}
.form-stack{padding-top:8px}
.form-stack .form-row{display:grid;grid-template-columns:minmax(0,1fr) 150px;align-items:center;gap:12px;font-size:13px;min-height:44px}
.form-row>span:first-child{min-width:0}
.form-control{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;min-width:0}
.form-control.with-unit{grid-template-columns:minmax(0,1fr) 24px;gap:5px}
.form-control input,.form-control select{width:100%;min-width:0;height:32px;background:#f5fcff;border:0;padding:6px;border-radius:5px}
.response-only[hidden]{display:none}
.result-bar{position:fixed;z-index:9;bottom:0;left:0;right:0;min-height:64px;display:flex;align-items:center;padding:8px 14px;background:#fff;border-top:1px solid var(--header-border);box-shadow:0 -1px 4px #b9d4df35}
.code-display{width:100%;min-width:0;max-height:58px;overflow:auto;text-align:center;padding-inline:150px;font-size:14px;line-height:1.4}
.code-prefix{font-weight:700;color:#19313d}
.code-display output{overflow-wrap:anywhere}
.code-controls{position:absolute;left:14px;right:14px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:flex-end;gap:5px}
/* Release and build date from version.json, written by the container build. Sits left, the copy button stays right. */
.build-stamp{margin-right:auto;font-size:11px;color:#5f7380;white-space:nowrap;pointer-events:none}
.icon-button{display:grid;place-items:center;width:38px;height:38px;background:#eaf6ff;color:#247cc0;border:1px solid #a7cee5;border-radius:6px;font-size:25px;line-height:1}
.icon-button:hover{background:#fff}
.icon-button svg{width:23px;height:25px;fill:currentColor}
.code-copy-button{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;padding:0;background:var(--header-accent);color:#fff;border:0;border-radius:8px;box-shadow:none;line-height:1;transition:background-color 120ms ease,transform 80ms ease,box-shadow 120ms ease}
.code-copy-button:hover{background:#1f74ad}
.code-copy-button:active{background:#1a6599;transform:scale(.97)}
.code-copy-button:focus-visible{outline:3px solid rgba(35,131,197,.28);outline-offset:2px}
.code-copy-button.is-copied{background:#1f74ad}
.code-copy-button .copy-icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.dialog-actions{display:flex;justify-content:center;gap:8px;margin-top:20px}
.dialog-actions button{font-size:13px}
.panel.expanded{z-index:11;transform:scale(1.75);box-shadow:0 8px 28px #315b7070}
.panel:nth-child(3n+1).expanded{transform-origin:top left}
.panel:nth-child(3n+2).expanded{transform-origin:top center}
.panel:nth-child(3n).expanded{transform-origin:top right}
.panel:nth-child(n+4).expanded{transform-origin:bottom left}
.panel:nth-child(5).expanded{transform-origin:bottom center}
.panel:nth-child(6).expanded{transform-origin:bottom right}
dialog{border:0;border-radius:9px;max-width:480px;padding:28px;box-shadow:0 4px 35px #1c425b66}
#disclaimerDialog{max-width:400px}
#installInfoDialog{max-width:420px}
.install-dialog-brand{display:flex;align-items:baseline;justify-content:center;gap:6px;margin-top:0;color:#173b5c}
.install-dialog-brand span{font-size:23px;font-weight:600;letter-spacing:.02em}
.install-dialog-brand small{font-size:12px;font-weight:500;color:var(--header-secondary);letter-spacing:.01em}
.install-dialog-title{margin:0 0 16px;text-align:center;font-weight:700}
.install-instruction{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;text-align:center}
.share-home-icon{width:29px;height:29px;fill:none;stroke:#111;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.results-dialog{width:min(1200px,94vw);max-width:min(1200px,94vw);padding:0;overflow:hidden}
.results-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid var(--header-border);background:#fff}
.results-dialog-head h2{margin:0;color:#173b5c;font-size:20px}
.results-dialog .results-dialog-close{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:transparent;color:#245b85;border-radius:6px;font-size:26px;line-height:1}
.results-dialog .results-dialog-close:hover{background:#e7f3f7}
.results-table-wrap{max-height:calc(82vh - 69px);overflow:auto;padding:0 0 14px}
.results-table{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;font-size:12px;background:#fff}
.results-table th,.results-table td{padding:9px 11px;border-right:1px solid #e2edf1;border-bottom:1px solid #e2edf1;text-align:left;white-space:nowrap;vertical-align:middle}
.results-table th{position:sticky;top:0;z-index:1;background:#f0f8fb;color:#28536a;font-weight:700}
.results-table th:first-child,.results-table td:first-child{position:sticky;left:0;text-align:center}
.results-table th:first-child{z-index:3;background:#f0f8fb}
.results-table td:first-child{z-index:2;background:#fff}
.results-delete{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;background:transparent;color:#a32d25;border-radius:5px}
.results-delete:hover{background:#fff0ed}
.results-delete svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.results-empty{margin:0;padding:34px 20px;text-align:center;color:#647b8c}
dialog button{padding:9px 20px;background:#267fbd;color:#fff;border-radius:4px}
@media(max-width:1100px){.app-header{gap:8px;padding-inline:14px}
.brand{min-width:128px}
.header-field{gap:4px;padding-inline:4px}
.subject-field{flex:.85 1 0}
.date-field{flex:1.1 1 0}
.stage-field{flex:1.05 1 0}
.header-field input{width:100%}
.date-control input{width:100%}
.header-field select{width:100%}
}
@media(max-width:1000px){
.dashboard{grid-template-columns:repeat(2,minmax(0,1fr))}
.expand{display:none}
.panel.expanded{transform:none}
}
@media(max-width:1040px){.app-header{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr);grid-template-areas:"menu brand" "subject subject" "date date" "timepoint timepoint" "actions actions";align-items:center;gap:7px 8px;padding:8px 10px}
.sidebar-toggle{grid-area:menu}
.brand{grid-area:brand;min-width:0}
.header-dropdown{grid-area:actions;width:100%;margin-left:0}
.header-actions{width:100%}
.subject-field{grid-area:subject}
.date-field{grid-area:date}
.stage-field{grid-area:timepoint}
.header-field{display:grid;grid-template-columns:17px 81px minmax(0,1fr);width:100%;padding:0;font-size:12px;gap:6px}
.header-field input,.header-field select{width:100%;font-size:14px}
.subject-field input{flex:1;width:auto}
.date-control{flex:1;width:auto}
.date-control input{width:100%}
.stage-field select{flex:1;width:auto}
.primary{height:38px;padding-inline:10px}
.header-actions #nextSubject{flex:1}
.header-menu-button{width:38px}
}
@media(max-width:700px){
.dashboard{grid-template-columns:1fr}
.panel{min-height:500px}
.code-display{max-height:72px;padding-inline:48px}
.build-stamp{display:none}
}


dialog{max-width:min(800px,92vw);max-height:82vh;overflow:auto}
@media(max-width:340px){.app-header{grid-template-areas:"menu menu" "subject subject" "date date" "timepoint timepoint" "actions actions"}
.app-header .brand{display:none}
}

@media(min-height:1200px){.dashboard{min-height:calc(100vh - 120px);align-content:center}}

@media(min-width:1101px) and (max-height:1000px) and (orientation:landscape){
.panel{min-height:525px}
.svg-area{height:360px;min-height:360px}
.region-svg{height:400px;min-height:400px}
.deauville-graphic{height:360px;margin-block:8px}
}

dialog{max-width:min(800px,92vw);max-height:82vh;overflow:auto}
@media(max-width:430px){.form-stack .form-row{grid-template-columns:minmax(0,1fr) 125px;gap:8px}}

/* Organ masks contain adjoining subpaths; their internal edges must not be stroked. */
.panel[data-panel="sites"] .clickable,.panel[data-panel="peritoneal"] .clickable,.panel[data-panel="soft"] .clickable[data-region^="OSS"],.panel[data-panel="soft"] .clickable[data-region^="OSS"]:hover{stroke:none!important}

/* Compact layout keeps identity and subject actions reachable while scrolling. */
.mobile-context-fields,.mobile-action-bar{display:none}
@media(max-width:700px){
 :root{--mobile-actions-height:70px}
 html{scroll-padding-top:100px;scroll-padding-bottom:150px}
 body{padding-bottom:calc(150px + env(safe-area-inset-bottom,0px))}
 .app-header{position:sticky;top:0;grid-template-areas:"menu brand" "subject subject";padding-top:max(8px,env(safe-area-inset-top,0px));background:#fff;box-shadow:0 2px 8px #9fbbc42b}
 .app-header .brand{display:block}
 .app-header .header-dropdown{display:none}
 .app-header .subject-field{background:#d9f2f8;border-radius:7px;padding:0 8px;grid-template-columns:17px 76px minmax(0,1fr)}
 .mobile-context-fields{display:grid;gap:5px;padding:7px 10px;background:#fff}
 .mobile-context-fields .header-field{grid-area:auto;height:38px}
 .mobile-action-bar{position:fixed;z-index:10;inset:auto 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));min-height:calc(var(--mobile-actions-height) + env(safe-area-inset-bottom,0px));padding:5px 4px calc(5px + env(safe-area-inset-bottom,0px));background:#d9f2f8;border-top:1px solid #b7dce7;box-shadow:0 -2px 8px #9cbeca25}
 .mobile-action-bar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:54px;padding:3px 2px;background:transparent;color:#245b85;border-radius:7px;font-size:clamp(10px,2.7vw,12px);line-height:1.15;white-space:nowrap;-webkit-tap-highlight-color:transparent}
 .mobile-action-bar svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
 .mobile-action-bar button:hover{background:#c9e9f2}
 .mobile-action-bar button:active{background:#bde2ee}
 .result-bar{bottom:calc(var(--mobile-actions-height) + env(safe-area-inset-bottom,0px))}
 .panel{scroll-margin-top:100px}
}