:root{--navy:#0a223c;--ink:#12243a;--muted:#607181;--teal:#1a947a;--mint:#d8f9ed;--background:#f5f8fb;--border:#dce4eb;--white:#fff;--amber:#af6717;--red:#aa4343;--radius:18px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--background)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}button,select,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}a{color:inherit}a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #39c9ae;outline-offset:3px}.skip{position:absolute;top:-60px;background:white;padding:12px;z-index:100}.skip:focus{top:0}.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}.topbar{background:#fff;border-bottom:1px solid #edf0f3;position:sticky;top:0;z-index:30}.top-inner{max-width:1160px;margin:auto;min-height:74px;padding:10px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.logo{text-decoration:none;font-size:25px;font-weight:850;letter-spacing:-1.3px;white-space:nowrap}.logo span{color:var(--teal)}.logo small{font-weight:550;color:var(--muted);font-size:13px;letter-spacing:0}.logomark{color:var(--teal);margin-right:8px}.top-inner nav{display:flex;gap:30px}.top-inner nav a{text-decoration:none;font-size:14px;font-weight:650}.top-inner nav a:hover{color:var(--teal)}select{border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:white;color:var(--ink);max-width:100%}.language select{max-width:145px}.hero{background:linear-gradient(120deg,#0a223c,#123752 67%,#105a63);color:white;overflow:hidden}.hero-inner{max-width:1160px;padding:70px 24px 84px;margin:auto;display:grid;grid-template-columns:1.18fr .82fr;gap:64px;align-items:center}.eyebrow{color:#86e8cd;font-size:12px;font-weight:800;letter-spacing:2px;display:flex;align-items:center;gap:8px;text-transform:uppercase}.eyebrow.dark{color:#168671}.pulse{width:8px;height:8px;background:#76efd1;border-radius:50%;box-shadow:0 0 0 5px #76efd128}.hero h1{font-size:clamp(36px,4.2vw,61px);letter-spacing:-2.6px;line-height:1.08;margin:24px 0}.hero-copy>p{color:#c7dce7;line-height:1.75;font-size:17px;max-width:620px}.hero .smallnote{font-size:12px;line-height:1.5;color:#a9c2cf;margin-top:22px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.primary,.outline{border-radius:11px;border:1px solid transparent;min-height:44px;padding:12px 18px;font-weight:750;text-align:center;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px}.primary{background:#26b998;color:#062f32}.primary:hover{background:#45dbb8}.primary.darker{background:#0d495c;color:white}.outline{background:#fff;border-color:#cddae3;color:var(--ink)}.outline:hover{background:#f1f8fb}.hero .outline{background:transparent;border:1px solid #85aab4;color:white}.hero .outline:hover{background:#ffffff18}.film{width:min(350px,100%);aspect-ratio:4/4.4;border-radius:18px;background:#101c2b;box-shadow:0 15px 60px #0005,0 0 0 1px #91f5d855;padding:17px;margin:auto;transform:rotate(5deg);display:flex;flex-direction:column}.film-cap{font:600 11px monospace;color:#a0c2ce;letter-spacing:2px;padding:7px}.film-scan{display:grid;grid-template-columns:1fr 1fr;gap:9px;flex:1;padding:8px}.film-scan span{border:2px solid #a5d7e9;border-radius:80px 80px 28px 28px;opacity:.74;background:radial-gradient(ellipse at 60% 45%,#5f8da28c 3%,#1d3d549c 32%,#051220 72%);box-shadow:inset 0 0 25px #8fcee450}.film-scan span:nth-child(3),.film-scan span:nth-child(4){border-radius:35px 35px 80px 80px}.film-bottom{display:flex;justify-content:space-between;padding:10px 5px;font-size:10px;color:#9deacb}.float-tag{position:relative;background:white;color:#0d5b47;font-weight:750;padding:12px 20px;border-radius:12px;box-shadow:0 14px 45px #0002;margin:-25px 0 0 10px;width:max-content;transform:rotate(-5deg)}.section{max-width:1160px;margin:auto;padding:68px 24px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}.section-heading h2,.information h2{font-size:clamp(27px,3vw,38px);margin:11px 0;letter-spacing:-1.2px}.section-heading p,.information>p{color:var(--muted);max-width:720px;line-height:1.65;margin:8px 0}.localpill{background:#e4f8ed;color:#157259;padding:10px 14px;border-radius:25px;font-size:12px;font-weight:750;white-space:nowrap}.appgrid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:19px}.camera-card,.quality-card,.image-card,.adjustments,.result-footer{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:0 6px 24px #12243a08}.toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:15px 18px}.compactlabel{font-size:13px;font-weight:650}.toolbar select{max-width:185px}.segmented{display:flex;gap:3px;background:#eff4f7;border-radius:12px;padding:4px;margin-left:auto}.segmented button{border:0;border-radius:8px;background:transparent;padding:9px 13px;font-weight:700;color:#60717e}.segmented button.selected{background:#fff;color:#0c7768;box-shadow:0 2px 5px #0001}.viewbox{background:#071729;min-height:360px;aspect-ratio:4/3;position:relative;display:grid;place-items:center;overflow:hidden}.viewbox video{width:100%;height:100%;object-fit:contain;position:absolute;inset:0;display:none}.viewbox.active video{display:block}.view-placeholder{color:#d9ecf0;text-align:center;padding:20px;max-width:300px}.view-placeholder strong{font-size:18px}.view-placeholder p{font-size:13px;color:#98b1bf;line-height:1.6}.placeholder-icon{font-size:50px;margin-bottom:16px;color:#70d2c1}.viewbox.active .view-placeholder{display:none}.guide{position:absolute;inset:12% 13%;border:1px solid #91e9cc33;pointer-events:none;display:none}.viewbox.active .guide{display:block}.guide span{position:absolute;width:22px;height:22px;border:3px solid #69e6bd}.guide span:nth-child(1){top:-2px;left:-2px;border-right:0;border-bottom:0}.guide span:nth-child(2){top:-2px;right:-2px;border-left:0;border-bottom:0}.guide span:nth-child(3){bottom:-2px;left:-2px;border-right:0;border-top:0}.guide span:nth-child(4){bottom:-2px;right:-2px;border-left:0;border-top:0}.viewport-footer{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:10px 16px;background:#0717299e;color:#d6f2eb;font-size:12px}.countdown{position:absolute;color:white;background:#001f2dbd;padding:20px 35px;border-radius:18px;font-size:64px;font-weight:850;z-index:2}.camera-buttons{display:flex;flex-wrap:wrap;gap:10px;padding:16px}.camera-buttons>*{flex:1 1 145px}.camera-buttons .textbutton{flex-basis:100%;border:0;background:none;color:var(--red);font-weight:700}.hint{font-size:12px;line-height:1.5;color:var(--muted);margin:0;padding:0 16px 17px}.camera-utility{padding:12px 16px;display:flex;gap:9px;flex-wrap:wrap;align-items:center;border-bottom:1px solid var(--border);font-size:13px}.camera-utility[hidden]{display:none}.mini{border:1px solid var(--border);border-radius:8px;padding:7px;background:white}.quality-card{padding:24px}.quality-header{display:flex;justify-content:space-between;align-items:center}.quality-header h3{margin:0;font-size:20px}.score{font-size:30px;font-weight:800;color:var(--teal)}.muted{color:var(--muted);line-height:1.6;font-size:13px}.quality-list{border-top:1px solid var(--border);margin:20px 0}.quality-list>div{padding:13px 0;display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid var(--border);font-size:14px}.quality-list b{font-size:12px}.ok{color:#0c7857}.warn{color:var(--amber)}.bad{color:var(--red)}.readiness{background:#edf2f5;border-radius:10px;padding:14px;font-size:14px;font-weight:750}.readiness.ready{background:#d6fae6;color:#075d3c}.tips{margin-top:23px;background:#f3f8fa;padding:17px;border-radius:12px}.tips h4{margin:0 0 7px}.tips p{margin:0;line-height:1.6;color:var(--muted);font-size:13px}.technical{font-size:11px;color:var(--muted);margin:20px 0 0;line-height:1.5}.review-grid{display:grid;grid-template-columns:1fr 1fr;gap:19px}.image-title{padding:15px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px}.image-title span{font-size:12px;color:var(--muted)}.image-display{height:340px;background:#0c1824;display:grid;place-items:center;overflow:auto}.image-display img,.image-display canvas{max-width:100%;max-height:100%;object-fit:contain;display:block}.adjustments{margin-top:18px;padding:21px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}.adjustments h3{margin:0}.adjustments p{margin:3px 0}.adjustments label{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:750}.adjustments input{width:130px;accent-color:var(--teal)}.result-footer{margin-top:18px;padding:23px;display:flex;align-items:center;justify-content:space-between;gap:20px}.result-footer h3{margin:0}.export-buttons{display:flex;flex-wrap:wrap;gap:8px}.details{margin:18px 0;border:1px solid var(--border);background:white;border-radius:12px;padding:15px}.details summary{cursor:pointer;font-weight:700}.details pre{white-space:pre-wrap;word-break:break-word;max-height:360px;overflow:auto;font-size:12px;line-height:1.7}.viewer{border-top:1px solid var(--border)}#viewerStatus{font-weight:750}#viewerEmpty{margin:0}.information{padding-top:28px;padding-bottom:45px}.infogrid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:27px}.infogrid article{background:white;padding:24px;border-radius:16px;border:1px solid var(--border)}.infogrid .number{font-weight:850;color:var(--teal);font-size:21px}.infogrid h3{font-size:17px}.infogrid p{color:var(--muted);line-height:1.7;font-size:13px}.faq details{border-bottom:1px solid var(--border);padding:16px 0}.faq summary{font-weight:750;cursor:pointer}.faq p{color:var(--muted);line-height:1.7}footer{background:var(--navy);color:white}.footinner{max-width:1160px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:36px 24px;gap:20px}.footinner p{font-size:12px;color:#b2cad8}.footlinks{display:flex;gap:14px;flex-wrap:wrap;font-size:13px}.footlinks a{color:#cbe1e7}.footer-note{text-align:center;padding:17px 15px;border-top:1px solid #34536a;color:#a5c2ce;font-size:11px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:14px 20px;background:#082238;color:white;border-radius:10px;box-shadow:0 10px 25px #0004;z-index:100;max-width:90vw;font-size:13px}.filebutton{cursor:pointer}[hidden]{display:none!important}@media(max-width:980px){.top-inner nav{display:flex;order:3;flex-basis:100%;overflow-x:auto;white-space:nowrap;gap:17px;padding:4px 0 9px}.top-inner{flex-wrap:wrap;gap:6px 15px}.hero-inner{gap:18px;grid-template-columns:1fr}.hero-art{display:none}.appgrid{grid-template-columns:1fr}.quality-card{order:2}.infogrid{grid-template-columns:repeat(2,1fr)}.result-footer{align-items:stretch;flex-direction:column}}@media(max-width:580px){.top-inner{padding:9px 15px;min-height:62px}.logo{font-size:23px}.hero-inner{padding:43px 18px 51px}.hero h1{letter-spacing:-1.6px}.hero-copy>p{font-size:15px}.section{padding:46px 14px}.section-heading{flex-direction:column;align-items:flex-start}.localpill{font-size:11px}.toolbar{gap:8px}.toolbar select{max-width:157px}.segmented{margin-left:0}.viewbox{min-height:270px}.camera-buttons .primary,.camera-buttons .outline{flex:1 1 140px;padding:12px 9px}.review-grid{grid-template-columns:1fr}.image-display{height:270px}.adjustments{gap:15px}.infogrid{grid-template-columns:1fr}.footinner{flex-direction:column;align-items:flex-start}}

.perspective-dialog{border:1px solid var(--border);border-radius:17px;padding:22px;width:min(740px,94vw);max-height:90vh;overflow:auto;color:var(--ink);box-shadow:0 20px 65px #0004}.perspective-dialog::backdrop{background:#081b2cbb}.perspective-dialog h3{margin:0}.perspective-dialog p{font-size:13px;color:var(--muted);line-height:1.5}.perspective-dialog canvas{width:auto;max-width:100%;max-height:60vh;height:auto;display:block;background:#061729;cursor:crosshair;touch-action:manipulation;margin:10px auto;border-radius:8px}.perspective-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}

.viewer-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:17px 0}.viewer-controls label{font-size:13px;font-weight:750}.viewer-controls input{accent-color:var(--teal);width:130px}.viewer-controls button{min-height:36px;padding:8px 12px;font-size:12px}.viewer .image-display.zoomed{display:block;text-align:center;overflow:auto}.viewer .image-display.zoomed img{max-width:none;max-height:none;height:auto;margin:0}

.document,.policy{max-width:850px;margin:auto;padding:50px 22px 66px;line-height:1.8}.document h1,.policy h1{font-size:clamp(28px,5vw,40px);letter-spacing:-.8px}.document p,.document li,.policy p,.policy li{color:#3d5367;line-height:1.8}.document h2,.policy h2{margin-top:34px}.document pre{background:#edf4f8;padding:18px;border-radius:12px;white-space:pre-wrap;word-break:break-word}.guide-page{max-width:850px;margin:auto;padding:50px 22px 66px;line-height:1.8}.guide-page h1{font-size:clamp(28px,5vw,43px)}.guide-page h2{margin-top:34px}.guide-page p,.guide-page li{color:#3e5368}.guide-page .note{border-left:4px solid #279c87;background:#e9f7f2;padding:13px 19px;border-radius:8px}

/* Clear cross-page navigation and always-current local clock. */
.site-footer .footinner{align-items:flex-start}.site-footer .footlinks{max-width:685px;line-height:1.75}.footer-clock{max-width:1160px;margin:0 auto;border-top:1px solid #34536a;padding:18px 24px 21px;display:flex;align-items:baseline;gap:12px 22px;flex-wrap:wrap}.footer-clock>div{display:flex;gap:8px 14px;flex-wrap:wrap;align-items:baseline}.footer-clock span{color:#a9d0d6;font-size:13px}.footer-clock time{font-size:15px;color:#fff;font-weight:700;font-variant-numeric:tabular-nums}.footer-clock small{color:#b1c9d4;font-size:12px}.site-footer a:hover{color:#8de6cf}.site-footer .footer-note{line-height:1.6}@media(max-width:580px){.footer-clock{padding:19px 16px 23px}.footer-clock>div{flex-direction:column;gap:3px}.site-footer .footinner{padding:30px 16px}}

.guide-more{margin-top:23px;line-height:1.7}.guide-more a{color:#087566;text-underline-offset:3px}

/* Audit: prevent navigation overlap and adapt to reduced motion / RTL languages. */
.top-inner nav a{white-space:nowrap}.top-inner nav a:focus-visible{border-radius:4px}.language select{min-height:44px}@media(max-width:580px){.top-inner nav{font-size:12px}.top-inner nav a{font-size:12px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{scroll-behavior:auto!important;animation-duration:.01ms!important}}

.guide-page table{width:100%;border-collapse:collapse;font-size:14px;margin:26px 0}.guide-page td,.guide-page th{text-align:left;vertical-align:top;padding:13px;border:1px solid var(--border)}.guide-page th{background:#e9f4f1}.guide-page ol li{margin:12px 0}@media(max-width:580px){.guide-page table{display:block;overflow-x:auto;white-space:normal}.guide-page th,.guide-page td{min-width:145px}}

/* Low-end and keyboard/accessibility optimizations */
label.filebutton:focus-visible{outline:3px solid #177d9c;outline-offset:3px}
.camera-buttons{align-items:center}.camera-buttons .filebutton{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.quality-list{contain:layout style} .hero-art{content-visibility:auto;contain-intrinsic-size:380px}
@media (prefers-reduced-motion:reduce){.pulse{animation:none!important}}

/* Professional film workflow cards and private native share controls */
.film-workflows{padding-bottom:26px}.preset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.preset{min-width:0;min-height:82px;padding:13px 15px;text-align:left;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;background:#fff;border:1px solid #cadce4;border-radius:13px;color:#16364a;cursor:pointer}.preset strong{font-size:15px}.preset span{font-size:12px;color:#50677b}.preset.selected{background:#e8f7f2;border:2px solid #008a75;padding:12px 14px}.preset:focus-visible{outline:3px solid #005d88;outline-offset:2px}.preset-info{margin-top:18px;padding:19px 21px;background:#edf6f7;border:1px solid #cce4e8;border-radius:14px;display:flex;justify-content:space-between;align-items:center;gap:25px}.preset-info p{margin:6px 0;font-size:13px;line-height:1.6}.preset-info .linkbutton{white-space:nowrap}.share-panel{margin-top:22px;background:#fff;border:1px solid #a4c7ce;border-radius:17px;padding:22px}.share-panel h3{font-size:20px;margin:0 0 7px}.share-panel p{font-size:13px;line-height:1.65;margin:5px 0;color:#415970}.share-controls{display:flex;align-items:flex-end;gap:13px;flex-wrap:wrap;margin-top:18px}.share-controls>label{min-width:220px;flex:1 1 240px;font-size:13px;font-weight:750;display:flex;flex-direction:column;gap:8px}.share-controls select{width:100%;min-width:0;padding:12px;border:1px solid #92b7c4;border-radius:9px;background:white;color:#17364a;font-size:14px}.share-controls button{min-height:46px}.share-controls button:disabled{opacity:.53;cursor:not-allowed}.share-status{flex:1 1 100%;font-size:12px;color:#35566a}.share-panel .share-caution{font-size:12px;border-top:1px solid #d4e4e9;padding-top:13px;margin-top:15px}.preset-info a:hover,.preset:hover{border-color:#128775}@media(max-width:780px){.preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.preset-info{flex-direction:column;align-items:flex-start;gap:8px}}@media(max-width:390px){.preset-grid{grid-template-columns:1fr 1fr;gap:7px}.preset{padding:12px 9px;min-height:74px}.preset strong{font-size:13px}.preset span{font-size:11px}.share-panel{padding:15px}.share-controls button{width:100%}}@media(prefers-reduced-motion:reduce){.preset{transition:none}}
/* Share/film navigation remains within viewport on intermediate tablet widths. */
@media(max-width:1200px){.top-inner{flex-wrap:wrap;gap:6px 15px}.top-inner nav{display:flex;order:3;flex:1 0 100%;min-width:0;max-width:100%;overflow-x:auto;white-space:nowrap;gap:17px;padding:4px 0 9px}}

/* Cross-browser progressive enhancement. No unsupported control may masquerade as available. */
.compat-panel,.compat-nojs{margin:0 0 20px;padding:16px 19px;border:1px solid #b4d2dd;border-radius:12px;background:#edf6f9;color:#14384b;line-height:1.65;font-size:13px}
.compat-panel summary{cursor:pointer;font-weight:750}.compat-panel summary span{font-size:12px;margin-left:8px;font-weight:600;color:#246375}.compat-panel p{margin:10px 0 5px}.compat-panel a{color:#064e72;text-decoration:underline}.compat-nojs{border-color:#d3b9a0;background:#fff9f2}
.compat-panel[data-support="limited"]{border-color:#e7caa6;background:#fff9ee}
#startCamera:disabled,#exportUmf:disabled{opacity:.6;cursor:not-allowed}
@media (max-width:480px){.compat-panel,.compat-nojs{padding:13px;font-size:12px}.compat-panel summary span{display:block;margin-left:0}}

.compat-log{box-sizing:border-box;width:100%;max-width:100%;border:1px solid #93b6c2;border-radius:10px;padding:12px;line-height:1.5;font-family:ui-monospace,monospace}

/* MedCam v4.5 — responsive, touch-first progressive enhancement. Layout depends on
   viewport and input modality, not user agent or claimed device brand. */
html {scroll-padding-top:clamp(82px,12vh,150px)}
#workspace,#film-workflows,#resultSection,#how-it-works,#faq {scroll-margin-top:clamp(82px,12vh,150px)}
body {min-width:0;overflow-wrap:break-word}
.top-inner, .hero-inner, .section, .appgrid, .camera-card, .quality-card,
.review-grid, .result-footer, .share-panel {min-width:0}
img,video,canvas {max-width:100%}
.adaptive-menu {display:none}
.display-fit {font-size:12px; color:#325b6a; padding:7px 0 0; margin:4px 0 8px}
/* At laptop/tablet widths, show a complete accessible menu instead of a
   horizontally clipped nav rail. No JavaScript is needed to open the menu. */
@media (max-width:1400px) {
  .top-inner {display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px 14px;min-height:65px; padding:10px 20px}
  .top-inner>.desktop-nav {display:none}
  .adaptive-menu {display:block;position:relative;justify-self:end;grid-column:3;grid-row:1;min-width:0}
  .adaptive-menu summary {list-style:none;cursor:pointer;border:1px solid #cadce4;background:#fff;min-height:44px; padding:10px 13px;border-radius:11px;font-weight:750;color:#193b51;display:flex;align-items:center;gap:10px}
  .adaptive-menu summary::-webkit-details-marker {display:none}
  .adaptive-menu[open] summary {border-color:#238e79;background:#edf8f3}
  .adaptive-menu nav {position:absolute;z-index:60;right:0;top:calc(100% + 8px);width:min(310px,calc(100vw - 28px));max-width:calc(100vw - 28px);max-height:min(70vh,580px);overflow-y:auto;overscroll-behavior:contain;display:grid;gap:0;white-space:normal;background:white;border:1px solid #c7dce3;box-shadow:0 16px 42px #13243c30;border-radius:12px;padding:8px}
  .adaptive-menu nav a {white-space:normal;display:block;min-height:44px;padding:12px 13px;text-decoration:none;font-size:14px;font-weight:650;border-radius:7px;color:#16384c}
  .adaptive-menu nav a:hover,.adaptive-menu nav a:focus-visible{background:#e9f6f3;color:#006b5d}
  .top-inner>.language{grid-column:2;grid-row:1;min-width:0}
}
@media(max-width:560px){
  .top-inner{grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;padding:9px 14px;min-height:0}
  .top-inner .logo {grid-column:1;grid-row:1;font-size:24px;min-width:0}
  .top-inner>.language{grid-column:1/-1;grid-row:2;justify-self:stretch}
  .top-inner>.language select{width:100%;max-width:none;min-height:44px}
  .adaptive-menu{grid-column:2;grid-row:1}
  .hero-inner{padding:36px 16px 40px}
  .hero h1{font-size:clamp(28px,9vw,40px);line-height:1.13;letter-spacing:-1.1px;margin:16px 0}
  .hero-actions .linkbutton{flex:1 1 175px}
  .toolbar {align-items:stretch}
  .toolbar .compactlabel {flex-basis:100%}
  .toolbar select {max-width:none;flex:1 1 100%;width:100%}
  .segmented{margin:0;width:100%}
  .segmented button {min-height:44px;flex:1 1 50%}
  .camera-utility label {flex-basis:100%}
  .viewbox{min-height:220px;aspect-ratio:4/3}
  .camera-buttons>* {flex:1 1 calc(50% - 7px);min-width:0}
  .camera-buttons .filebutton {padding:12px 8px;white-space:normal}
  .result-footer,.share-controls {min-width:0}
  .export-buttons {width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .export-buttons button {min-width:0;overflow-wrap:anywhere}
  .share-controls>label {flex-basis:100%;min-width:0}
  .share-controls>button{flex:1 1 100%}
  .perspective-dialog{padding:14px;width:min(100% - 20px,740px);max-height:calc(100dvh - 20px)}
  .footinner,.footer-clock{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
}
@media(max-width:360px) {
  .preset-grid{gap:6px}.preset{min-height:82px;padding:10px 8px}
  .preset strong{font-size:12px}.preset span{font-size:11px}
  .camera-buttons {gap:7px;padding:10px}
  .camera-buttons .primary,.camera-buttons .outline {padding:11px 6px;font-size:12px}
  .quality-card {padding:16px}.section {padding-left:12px;padding-right:12px}
}
/* Mobile browsers switching to landscape may provide desktop-like width but very
   little vertical room. Preserve the live camera and controls without overflow. */
@media(orientation:landscape) and (max-height:550px){
  .topbar{position:relative}
  .hero-inner{padding-top:25px;padding-bottom:30px}
  .section{padding-top:27px;padding-bottom:30px}
  .viewbox{min-height:180px; height:min(75dvh,430px);aspect-ratio:auto}
  .image-display{height:min(70dvh,320px)}
  .perspective-dialog{max-height:95dvh}
}
/* Tablets with coarse touch input and browser 'desktop mode' should still have
   finger-sized controls, even if the viewport pretends to be desktop width. */
@media(pointer:coarse){
  .top-inner nav a, .adaptive-menu summary,.camera-utility button,button,select,
  summary,.filebutton{touch-action:manipulation}
  .mini, .viewer-controls button {min-height:44px}
  .preset{min-height:76px}
  .camera-utility input[type=range], .adjustments input[type=range]{min-height:36px}
}
@media(hover:none){.float-tag{pointer-events:none}}
@media(prefers-contrast:more){.outline,.preset,.adaptive-menu summary{border-width:2px}.muted{color:#344b60}}
@media(forced-colors:active){.preset.selected,.readiness.ready{border:2px solid CanvasText}.guide span{border-color:Highlight}}
@media(prefers-reduced-motion:reduce){.film,.float-tag{transform:none}.pulse{box-shadow:none}}
@supports(padding:max(0px)){
 .topbar{padding-top:env(safe-area-inset-top,0px)}
 .toast{bottom:max(18px,env(safe-area-inset-bottom,0px))}
}
/* Safe areas on notch/rounded-corner phones, regardless of browser mode. */
@media(max-width:560px){
 .top-inner {padding-left:max(14px,env(safe-area-inset-left,0px));padding-right:max(14px,env(safe-area-inset-right,0px))}
 .section {padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
}

/* Safety-first capture review: visible before any share or export action. */
.review-status{border:1px solid #9ab9cd;border-left:5px solid #287596;border-radius:12px;padding:14px 16px;background:#f0f8fc;color:#17354e;font-size:.95rem;line-height:1.5;margin:16px 0;}
.review-status[data-level="warning"]{background:#fff8ea;border-color:#dfb776;border-left-color:#a36b19;color:#503e20;}
@media (max-width:600px){.review-status{padding:12px;margin:12px 0;font-size:.92rem;}}

/* v4.8: Live tips immediately below camera preview, without stamping image pixels. */
.live-frame-guidance{margin:10px 12px 8px;padding:11px 14px;border-radius:11px;border:1px solid #afccd5;background:#edf4f7;color:#173c4c;font-size:13px;line-height:1.5;font-weight:680;overflow-wrap:anywhere}
.live-frame-guidance[data-level=ready]{background:#e6f7ec;border-color:#94c8b1;color:#155837}
.live-frame-guidance[data-level=review]{background:#fff6e5;border-color:#d7b476;color:#57401b}
@media(max-width:420px){.live-frame-guidance{padding:10px;font-size:12px;margin:8px 9px}}

/* Native share, accessibility and small-phone layout. */
.share-local-note {max-width:70ch; line-height:1.55; margin:12px 0 0; font-size:.84rem; color:#3d5366}
.share-controls #shareTryJpg[hidden] {display:none!important}
.share-controls #shareTryJpg {min-height:44px; white-space:normal; overflow-wrap:anywhere; max-width:100%}
@media(max-width:520px){.share-controls>label,.share-controls>button{flex:1 1 100%;min-width:0}.share-controls>button{width:100%}}

/* Privacy-aware printing: print only the explicitly prepared derived image.
   Never auto-print, auto-share, or print site navigation or advertising. */
#printSheet{display:none}
@media print {
  @page{size:auto;margin:12mm}
  body.print-ready > :not(#printSheet){display:none!important}
  body.print-ready #printSheet{display:flex!important;flex-direction:column;align-items:center;justify-content:center;
    width:100%!important;max-width:100%!important;padding:0!important;margin:0!important;
    color:#111!important;background:#fff!important;font-family:Arial,sans-serif}
  body.print-ready #printSheet h1{font-size:13pt;line-height:1.4;margin:0 0 9mm}
  body.print-ready #printCanvas{display:block!important;max-width:100%!important;
    max-height:230mm!important;width:auto!important;height:auto!important;object-fit:contain;
    break-inside:avoid;page-break-inside:avoid}
  body.print-ready #printSheet p{font-size:8.5pt;line-height:1.4;max-width:170mm;margin:6mm 0 0}
}

/* v5.2: optional accessible 2.5D positioning arrows; no measured sensor depth */
.pose-compass{position:absolute;right:12px;top:12px;z-index:1;display:flex;align-items:center;gap:8px;max-width:min(66%,320px);background:rgba(4,24,33,.86);color:#effff9;border:1px solid rgba(159,229,202,.7);border-radius:12px;padding:9px 11px;font-size:12px;line-height:1.35;pointer-events:none;backdrop-filter:blur(4px);box-sizing:border-box;overflow-wrap:anywhere}
.pose-compass[hidden]{display:none!important}
.pose-symbol{font-size:29px;font-weight:850;color:#a8f6d9;min-width:28px;text-align:center;line-height:1}
.pose-message{font-weight:650}
.pose-compass[data-action=unknown]{border-color:#bdc8d3;color:#e3e9ed}.pose-compass[data-action=unknown] .pose-symbol{color:#f5c276}
.pose-settings{padding:0 15px 10px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:12px;line-height:1.5}
.pose-settings label{font-weight:700;display:flex;align-items:center;gap:6px;cursor:pointer}
.pose-settings input{accent-color:#157c67;min-width:17px;min-height:17px}
.pose-settings small{color:#5c6c77;max-width:580px}
@media(max-width:480px){.pose-compass{right:8px;top:8px;padding:7px;max-width:72%;font-size:11px}.pose-symbol{font-size:23px;min-width:23px}.pose-settings{padding:0 10px 10px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.pose-compass *{transition:none!important;animation:none!important}}
/* Narrow viewports: grid min-content must not widen the camera beyond the device. */
@media(max-width:980px){.appgrid{grid-template-columns:minmax(0,1fr)}.camera-card,.quality-card{min-width:0}.viewbox{min-width:0;max-width:100%}}
@media(max-width:360px){.camera-card,.toolbar,.camera-utility{max-width:100%;min-width:0}.toolbar select,.camera-utility select{min-width:0;max-width:100%}}
/* Wide comparison tables remain inside small phone viewports and can scroll. */
.guide-page table,.document table,.policy table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;-webkit-overflow-scrolling:touch}
.guide-page table th,.guide-page table td{min-width:82px}

/* v5.3 Capability-first control layout and low-overlap visual positioning. */
.camera-utility,.camera-utility>*{min-width:0;max-width:100%}
.camera-switch-wrap,.focus-wrap{display:flex;align-items:center;gap:7px;flex:1 1 140px;flex-wrap:wrap}
.camera-switch-wrap select,.focus-wrap select{min-width:0;max-width:100%;flex:1 1 140px}
#zoomWrap{display:flex;gap:8px;align-items:center;flex-wrap:wrap;min-width:0;max-width:100%}
#zoomWrap input{min-width:82px;max-width:100%}
.pose-visual{min-width:0;margin:5px 12px 12px;padding:8px 11px;display:flex;align-items:center;gap:15px;background:#f0f7f8;border:1px solid #c9dee1;border-radius:12px;color:#1b4753}
.pose-scene{flex:none;width:100px;height:74px;position:relative;perspective:170px;overflow:visible;display:grid;place-items:center}
.pose-illustration-film{position:absolute;left:39px;top:4px;width:51px;height:55px;background:linear-gradient(135deg,#346479,#142f43);border:2px solid #53ae99;border-radius:5px;transform:rotateY(-21deg) rotateX(8deg);box-shadow:6px 6px 8px #0a27382d;display:grid;grid-template-columns:repeat(2,1fr);gap:4px;padding:5px}
.pose-illustration-film span{border-radius:50%;background:radial-gradient(circle,#9fb6c3,#30596f 70%)}
.pose-illustration-phone{position:absolute;left:4px;bottom:6px;width:36px;height:58px;border:3px solid #1c4b59;border-radius:7px;background:linear-gradient(125deg,#d4f6e9,#8bd9c7);transform:rotateY(12deg) rotateX(5deg);box-shadow:2px 3px 8px #071f3535}
.pose-illustration-lens{position:absolute;top:5px;left:5px;width:9px;height:9px;border:2px solid #214757;background:#1e6677;border-radius:50%}
.pose-direction-icon{position:absolute;left:39px;bottom:1px;font-size:27px;font-weight:900;color:#0a856b;line-height:1;filter:drop-shadow(0 1px 1px white)}
.pose-visual-caption{min-width:0;display:flex;flex-direction:column;gap:3px;overflow-wrap:anywhere;font-size:12px;line-height:1.4}
.pose-visual-caption strong{font-size:13px;color:#143c4a}
.pose-visual-caption small{font-size:10px;color:#536a73}
.pose-visual[data-motion=on] .pose-illustration-phone{transition:transform .32s ease}
.pose-visual[data-motion=on] .pose-scene[data-action=left] .pose-illustration-phone{transform:translateX(-7px) rotateY(12deg)}
.pose-visual[data-motion=on] .pose-scene[data-action=right] .pose-illustration-phone{transform:translateX(7px) rotateY(12deg)}
.pose-visual[data-motion=on] .pose-scene[data-action=up] .pose-illustration-phone{transform:translateY(-6px) rotateY(12deg)}
.pose-visual[data-motion=on] .pose-scene[data-action=down] .pose-illustration-phone{transform:translateY(6px) rotateY(12deg)}
.pose-visual[data-motion=on] .pose-scene[data-action=closer] .pose-illustration-phone{transform:translateX(9px) scale(1.10) rotateY(12deg)}
.pose-visual[data-motion=on] .pose-scene[data-action=back] .pose-illustration-phone{transform:translateX(-6px) scale(.91) rotateY(12deg)}
@media(max-width:380px){.pose-visual{margin:4px 8px 10px;gap:8px;padding:8px}.pose-scene{width:77px;transform:scale(.77);transform-origin:center}.pose-visual-caption{font-size:11px}.pose-visual-caption small{font-size:9px}.camera-utility{padding:9px}}
@media(prefers-reduced-motion:reduce){.pose-visual *{animation:none!important;transition:none!important;transform-style:flat!important}}

/* Brand attribution. Static footer only; no third-party JS or trackers. */
.footer-note .powered-by{white-space:normal;color:#e0f1f1;font-weight:650}.footer-note .powered-by a{color:#a2f7df;text-decoration:underline;text-underline-offset:2px}.footer-note .powered-by a:focus-visible{outline:2px solid #a2f7df;outline-offset:3px}

/* v6.1: practical content tables and editorial disclosures: no ads in camera tools. */
.guide-page .content-table{display:block;width:100%;overflow-x:auto;border-collapse:separate;border-spacing:0;margin:20px 0;max-width:100%;font-size:14px}
.guide-page .content-table th,.guide-page .content-table td{padding:12px 13px;border-bottom:1px solid #dce4eb;vertical-align:top;text-align:left;min-width:135px;line-height:1.55}
.guide-page .content-table th{background:#eaf3f4;color:#173a49}
.guide-page .editorial-note{padding:14px 16px;background:#f1f8fb;border-left:4px solid #178773;border-radius:6px;color:#243f51;line-height:1.6}
.guide-page code{overflow-wrap:anywhere;font-size:.9em}
@media(max-width:450px){.guide-page .content-table{font-size:12px}.guide-page .content-table th,.guide-page .content-table td{padding:9px;min-width:112px}}

/* v6.2: All homepage capabilities discoverable, no false promises about hardware support. */
.feature-catalog{padding-top:42px;padding-bottom:38px}
.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.feature-card{background:#fff;border:1px solid #d2e1e7;border-radius:15px;padding:17px 15px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-decoration:none;min-width:0;min-height:180px;overflow-wrap:anywhere;box-shadow:0 4px 13px #12304508;transition:border-color .16s,box-shadow .16s,transform .16s}
.feature-card:hover{border-color:#278e83;box-shadow:0 5px 17px #16394a18;transform:translateY(-2px)}
.feature-card:focus-visible{outline:3px solid #007c6b;outline-offset:2px}
.feature-icon{display:grid;place-items:center;border-radius:10px;background:#e9f5f3;color:#176e62;width:38px;height:38px;font-size:23px;line-height:1}
.feature-card strong{font-size:15px;line-height:1.3;color:#17334b}
.feature-card>span:not(.feature-icon){font-size:12px;line-height:1.55;color:#4d6677;flex:1}
.feature-card small{font-size:11px;line-height:1.3;color:#146c5b;font-weight:750}
.feature-catalog-note{color:#536879;line-height:1.65;font-size:12px;margin:17px 0 0}
.feature-action-help{padding:14px 16px;background:#f0f7fb;border:1px solid #a4c9d3;border-left:4px solid #23828e;border-radius:12px;color:#21465a;line-height:1.5;font-weight:650;margin:0 0 20px}
#features,#workspace,#film-workflows,#browserCompatibility,#viewerSection,#resultSection{scroll-margin-top:105px}
@media(max-width:1050px){.feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.feature-card{min-height:174px;padding:13px}.feature-catalog{padding-top:34px;padding-bottom:25px}}
@media(max-width:420px){.feature-grid{grid-template-columns:1fr}.feature-card{min-height:0;padding:13px 14px;display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:12px;row-gap:3px}.feature-icon{grid-row:span 3;width:36px;height:36px}.feature-card>span:not(.feature-icon){grid-column:2}.feature-card small{grid-column:2}}
@media(prefers-reduced-motion:reduce){.feature-card{transition:none;transform:none!important}}

/* Non-interactive status toast must never block a user's camera or tool tap. */
.toast{pointer-events:none}
