.usability-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:.6rem; }
.usability-toolbar button, .guide-coach button, .pdf-picker button { min-height:44px; padding:.55rem .85rem; border:1px solid #cbd5dc; border-radius:10px; background:#fff; color:#173b38; cursor:pointer; }
.usability-toolbar button[aria-pressed="true"] { background:#e1f4ed; border-color:#287a63; }
.image-viewer { width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; box-sizing:border-box; margin:0; border:0; padding:16px; background:#10221f; color:#fff; }
.image-viewer[open] { display:flex; flex-direction:column; gap:12px; }
.image-viewer::backdrop, .guide-dialog::backdrop, .pdf-picker::backdrop { background:rgba(5,20,18,.65); }
.image-viewer__stage { position:relative; flex:1; min-height:100px; overflow:hidden; display:flex; align-items:center; justify-content:center; touch-action:none; outline-offset:-3px; }
.image-viewer__stage img { max-width:100%; max-height:100%; object-fit:contain; user-select:none; transform-origin:center; }
.image-viewer p { margin:0; font-size:.875rem; }
.guide-welcome { padding:18px; border:1px solid #b7dcd0; border-radius:16px; background:#f0f9f5; margin:16px 0; }
.guide-dialog, .pdf-picker { box-sizing:border-box; width:min(720px,calc(100vw - 24px)); max-height:88dvh; border:0; border-radius:20px; padding:24px; color:#173b38; }
.guide-dialog h2, .pdf-picker h2 { margin-top:0; }
.guide-topics { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; margin:18px 0; }
.guide-topics button { text-align:left; padding:16px; background:#f1f7f4; border:1px solid #dae8e1; border-radius:12px; min-height:60px; font:inherit; cursor:pointer; }
.guide-coach { position:fixed; bottom:14px; left:50%; transform:translateX(-50%); width:min(680px,calc(100vw - 28px)); box-sizing:border-box; z-index:80; padding:18px; border:1px solid #b6d6c9; border-radius:16px; background:#fff; color:#153b31; box-shadow:0 10px 45px #183f3433; }
.guide-coach p { margin:8px 0 14px; line-height:1.7; }
.guide-highlight { outline:3px solid #198264 !important; outline-offset:5px; scroll-margin-block:100px 250px; }
.pdf-picker__pages { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:10px; margin:16px 0; }
.pdf-picker__page { display:flex; flex-direction:column; gap:6px; padding:10px; border:1px solid #cbdcd5; border-radius:10px; }
.pdf-picker__page canvas { max-width:100%; height:auto; background:#f0f3f2; }
.pdf-picker__page:has(input:checked) { border-color:#188262; background:#e9f7f1; }
.pdf-picker__status { min-height:1.5em; }
.reference-document__actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
.reference-document__preview { padding:0; border:0; background:none; cursor:zoom-in; }
@media (prefers-reduced-motion:reduce) { .guide-highlight { scroll-behavior:auto; } }

.web-image-preview { display:block; max-width:100%; max-height:320px; object-fit:contain; margin:16px auto; cursor:zoom-in; }
.web-image-preview[hidden] { display:none; }
.web-image-comparison { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:16px 0; }
.web-image-comparison button { padding:8px; border:1px solid #cbdcd5; border-radius:12px; background:#fff; cursor:zoom-in; }
.web-image-comparison img { width:100%; height:240px; object-fit:contain; }
.web-image-comparison span { display:block; padding:8px; }
#image-view > * { margin-block:12px; }