:root{color-scheme:dark;--bg:#111820;--ink:#f3f6f8;--muted:#a6b4c0;--line:#35434f;--green:#0b8861}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--bg);color:var(--ink);font:1rem/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}a,button{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid #72deba;outline-offset:5px}button,a{touch-action:manipulation}.viewer{height:100vh;height:100dvh;min-height:320px;display:flex;flex-direction:column;padding:20px clamp(12px,3vw,40px);gap:16px;max-width:1800px;margin:auto}.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none}.viewer-header>div{display:flex;align-items:center;gap:20px;min-width:0}.viewer-brand{font-size:1.25rem;font-weight:800;letter-spacing:-.04em;white-space:nowrap}.viewer-brand span{color:#68d7af}h1{margin:0;font-size:1rem;font-weight:500;overflow-wrap:anywhere;max-height:3em;overflow:auto}.viewer-counter{font-size:.9375rem;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--muted)}.viewer-stage{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;align-items:center;gap:clamp(10px,2vw,28px);flex:1;min-height:0;width:100%}.viewer-frame{height:100%;min-height:0;position:relative;display:flex;align-items:center;justify-content:center}.viewer-frame img{display:block;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}.viewer-arrow{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border:1px solid var(--line);border-radius:50%;font-size:1.6rem;text-decoration:none;color:var(--ink);background:#202c36}.viewer-arrow:hover{background:#304450}.viewer-arrow[aria-disabled=true]{opacity:.3;pointer-events:none}.viewer-footer{flex:none;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}.viewer-hint{margin:0;font-size:.8125rem;color:var(--muted)}.viewer-close{font:inherit;min-height:44px;padding:10px 28px;border:1px solid #38aa83;border-radius:8px;background:var(--green);color:#fff;font-weight:650;cursor:pointer}.viewer-close:hover{background:#0a7352}.viewer-close:disabled{opacity:.5;cursor:default}.viewer-image-status{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;margin:0;padding:20px;color:var(--muted)}.viewer-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.viewer-empty h2{margin:0 0 12px}.viewer-empty p{margin:0;color:var(--muted)}@media(max-width:600px){.viewer{padding:12px;gap:12px}.viewer-header>div{gap:10px}.viewer-brand{font-size:1rem}h1{font-size:.875rem}.viewer-stage{grid-template-columns:44px minmax(0,1fr) 44px;gap:8px}.viewer-arrow{width:44px;height:44px}.viewer-close{min-width:180px}}@media(max-height:450px){.viewer{gap:8px;padding-block:8px}.viewer-footer>.viewer-hint:first-child{display:none}}