:root{color-scheme:dark;--bg: #0f1419;--panel: #171e26;--panel-border: #2a3542;--text: #e8eef4;--muted: #93a1b0;--accent: #3d9ee8;--accent-strong: #6ec6ff;--danger: #e07070;--warn: #e0b44f;--ok: #7bd389;--shadow: color-mix(in srgb, black 35%, transparent);font-family:Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html,body,#app{margin:0;height:100%;background:var(--bg);color:var(--text)}.app{display:grid;grid-template-columns:minmax(260px,320px) 1fr;grid-template-rows:auto 1fr;height:100%}.banner{grid-column:1 / -1;padding:10px 16px;background:#1d2833;border-bottom:1px solid var(--panel-border);color:var(--muted);font-size:13px}.banner strong{color:var(--text)}.banner.warn{background:#2a2414;color:var(--warn)}.banner.danger{background:#2a1717;color:var(--danger)}.sidebar{display:flex;flex-direction:column;border-right:1px solid var(--panel-border);background:var(--panel);min-height:0}.sidebar header{padding:16px 16px 8px}.sidebar h1{margin:0 0 4px;font-size:16px;font-weight:600}.sidebar p{margin:0;color:var(--muted);font-size:12px;line-height:1.4}.toolbar{display:flex;flex-wrap:wrap;gap:8px;padding:8px 16px 12px}button,.file-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--panel-border);background:#22303c;color:var(--text);border-radius:6px;padding:7px 10px;font:inherit;font-size:12px;cursor:pointer}button:hover,.file-button:hover{border-color:var(--accent)}button:disabled{opacity:.5;cursor:default}.file-button input{display:none}.file-list{overflow:auto;flex:1;padding:0 8px 16px}.file-row{width:100%;text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin-bottom:6px;padding:8px 10px}.file-row.active{border-color:var(--accent);background:#1c3a52}.file-row .name{font-size:13px}.file-row .meta{color:var(--muted);font-size:11px}.empty,.error{padding:8px 16px 16px;color:var(--muted);font-size:13px}.error{color:var(--danger)}.viewer-wrap{position:relative;min-width:0;min-height:0;background:#12171c}.viewer-wrap canvas{display:block;width:100%;height:100%}.viewer-status{position:absolute;left:16px;bottom:16px;color:var(--muted);font-size:12px;pointer-events:none;text-shadow:0 1px 2px var(--shadow)}.progress{padding:0 16px 12px;color:var(--accent-strong);font-size:12px}@media(max-width:800px){.app{grid-template-columns:1fr;grid-template-rows:auto auto 50vh 1fr}.sidebar{border-right:0;border-bottom:1px solid var(--panel-border);max-height:40vh}}