.pa-library,.pa-form { --pa-ink:#20362f; --pa-muted:#6b7a73; --pa-line:#e2e9e5; --pa-surface:#fff; --pa-soft:#f5f8f6; color:var(--pa-ink); }
.dark .pa-library,.dark .pa-form { --pa-ink:#e4eee8; --pa-muted:#9eafa5; --pa-line:#2b3e34; --pa-surface:#121f18; --pa-soft:#1b2b22; }
.pa-library { max-width:1200px; margin:auto; padding-bottom:28px; }
.pa-heading { display:flex; justify-content:space-between; align-items:center; gap:18px; margin:8px 0 24px; }
.pa-heading h1 { font-size:28px; font-weight:750; letter-spacing:-.7px; overflow-wrap:anywhere; }
.pa-eyebrow { font-size:10px; letter-spacing:.12em; font-weight:700; color:#16816b; margin-bottom:8px; }
.pa-muted { color:var(--pa-muted); font-size:13px; line-height:1.7; margin:8px 0; }
.pa-meta { color:var(--pa-muted); font-size:12px; line-height:1.6; margin-top:8px; overflow-wrap:anywhere; }
.pa-btn { min-height:44px; display:inline-flex; align-items:center; justify-content:center; padding:10px 15px; border:1px solid var(--pa-line,#d5e1da); border-radius:10px; background:var(--pa-surface,#fff); color:var(--pa-ink,#20362f); font-size:13px; font-weight:600; cursor:pointer; }
.pa-btn:hover { filter:brightness(.96); }
.pa-primary { background:#0c7964; border-color:#0c7964; color:white; }
.pa-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.pa-card { border:1px solid var(--pa-line); border-radius:16px; background:var(--pa-surface); padding:22px; min-width:0; }
.pa-card h2,.pa-section-heading h2 { font-size:17px; font-weight:700; }
.pa-card h3 { font-size:15px; font-weight:650; overflow-wrap:anywhere; }
.pa-library-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.pa-archive-card { padding:0; overflow:hidden; }
.pa-cover { display:flex; align-items:center; justify-content:center; aspect-ratio:16/10; background:var(--pa-soft); border-bottom:1px solid var(--pa-line); color:var(--pa-muted); font-size:13px; padding:14px; }
.pa-cover img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 4px 8px #0001); }
.pa-card-content { padding:20px; }.pa-card-content h2 { margin-top:12px; overflow-wrap:anywhere; }
.pa-badge { display:inline-block; border-radius:6px; background:var(--pa-soft); color:#16816b; padding:5px 8px; font-size:11px; }
.pa-filters { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:22px; }
.pa-filters input[type=search] { flex:1; min-width:180px; }
.pa-filters :is(input[type=search],select) { padding:10px 12px; border:1px solid var(--pa-line); border-radius:10px; background:var(--pa-surface); font-size:13px; }
.pa-empty { text-align:center; padding:50px 20px; }.pa-empty p { font-size:14px; margin:12px 0 22px; }
.pa-form { display:flex; flex-direction:column; gap:18px; }.pa-form label { font-size:13px; font-weight:600; display:flex; flex-direction:column; gap:8px; }
.pa-drop { min-height:170px; display:flex; align-items:center; justify-content:center; gap:14px; text-align:center; border:1px dashed #70a99a; border-radius:14px; background:var(--pa-soft); padding:20px; }
.pa-drop span { font-size:12px; color:var(--pa-muted); font-weight:400; }
.pa-form input[type=file] { max-width:100%; font-size:12px; min-height:44px; }
.pa-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.pa-error { color:#b54040; background:#fff0ef; border-radius:8px; padding:12px; font-size:13px; margin:14px 0; overflow-wrap:anywhere; }
.pa-selected { display:flex; align-items:center; justify-content:space-between; gap:16px; background:var(--pa-soft); margin-bottom:28px; }
.pa-selected .pa-actions { margin:0; }
.pa-description { white-space:pre-wrap; font-size:14px; line-height:1.8; margin-bottom:24px; }
.pa-detail-grid { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(0,1fr); gap:24px; align-items:start; }
.pa-detail-grid aside { display:flex; flex-direction:column; gap:20px; min-width:0; }
.pa-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.pa-section-heading h2 span { color:#16816b; margin-left:6px; }
.pa-version { margin-bottom:16px; }.pa-version-top { display:flex; gap:18px; align-items:center; }.pa-version-top > div { min-width:0; }
.pa-version-cover { width:130px; height:100px; flex-shrink:0; background:var(--pa-soft); display:flex; align-items:center; justify-content:center; border-radius:8px; color:var(--pa-muted); font-size:12px; }.pa-version-cover img { max-width:100%; max-height:100%; object-fit:contain; }
.pa-replace { border-top:1px solid var(--pa-line); margin-top:18px; padding-top:8px; }.pa-replace summary { padding:10px 0; font-size:12px; color:var(--pa-muted); cursor:pointer; }
.pa-run { display:flex; justify-content:space-between; gap:10px; padding:12px 0; border-bottom:1px solid var(--pa-line); font-size:12px; }
.pa-text-link { color:#16816b; text-decoration:underline; }.pa-delete { color:#a95858; font-size:12px; min-height:44px; padding:10px; }
.pa-library :is(button,a,input,summary,select):focus-visible,.pa-viewer :is(button,a,input):focus-visible { outline:3px solid #37c9a6; outline-offset:3px; }
.pa-viewer-document { background:#111917; }
/* Keep all presentation controls inside the device's usable area, including fullscreen. */
.pa-viewer { --pa-safe-top:env(safe-area-inset-top, 0px); --pa-safe-right:env(safe-area-inset-right, 0px); --pa-safe-bottom:env(safe-area-inset-bottom, 0px); --pa-safe-left:env(safe-area-inset-left, 0px); box-sizing:border-box; padding:var(--pa-safe-top) var(--pa-safe-right) var(--pa-safe-bottom) var(--pa-safe-left); margin:0; width:100%; height:100vh; height:100dvh; background:#111917; color:#f2f7f4; display:flex; flex-direction:column; overflow:hidden; }
.pa-viewer-header { padding:12px 20px; display:flex; justify-content:space-between; align-items:center; gap:12px; background:#18231e; }
.pa-viewer-header,.pa-viewer-status,.pa-viewer-controls { flex-shrink:0; }
.pa-viewer-header > div { min-width:0; flex:1; }
.pa-viewer-header > a { flex-shrink:0; }.pa-viewer-header strong { display:block; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.pa-viewer-header span { font-size:11px; color:#b0c3b8; }
.pa-viewer-btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; min-width:44px; padding:8px 12px; border:1px solid #3c5147; border-radius:8px; font-size:12px; color:#f2f7f4; background:#20352b; cursor:pointer; white-space:nowrap; }
.pa-viewer-status { padding:6px 16px; font-size:11px; color:#a8c5b5; text-align:center; background:#15241c; min-height:28px; }
.pa-stage { flex:1; min-height:0; display:flex; align-items:center; justify-content:center; overflow:auto; position:relative; padding:12px; touch-action:pan-y; }
.pa-stage canvas { display:block; flex-shrink:0; background:white; box-shadow:0 8px 40px #0005; }
.pa-stage.is-zoomed { align-items:flex-start; justify-content:flex-start; }
.pa-viewer-controls { display:flex; justify-content:space-between; align-items:center; padding:10px 16px; gap:12px; background:#18231e; flex-wrap:wrap; }
.pa-viewer-nav,.pa-viewer-tools { display:flex; align-items:center; gap:8px; font-size:12px; }.pa-viewer-nav input { width:56px; height:44px; background:#20352b; color:white; border:1px solid #3c5147; border-radius:6px; text-align:center; }
.pa-thumbnails { box-sizing:border-box; inset:var(--pa-safe-top) var(--pa-safe-right) var(--pa-safe-bottom) var(--pa-safe-left); width:min(900px,calc(100vw - var(--pa-safe-left) - var(--pa-safe-right) - 24px)); max-height:calc(100dvh - var(--pa-safe-top) - var(--pa-safe-bottom) - 24px); margin:auto; background:#17281f; color:white; border:1px solid #3c5147; border-radius:14px; padding:20px; overflow:auto; }
.pa-thumbnails::backdrop { background:#000b; }.pa-thumb-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:14px; }.pa-thumb { border:1px solid #3c5147; border-radius:8px; padding:8px; min-height:100px; font-size:12px; }.pa-thumb canvas { width:100%; height:auto; display:block; margin-bottom:8px; }
.pa-blackout:not([hidden]) { display:block; position:fixed; inset:0; width:100%; height:100%; background:black; z-index:999; border:0; }
.pa-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
@media(max-width:1023px) { .pa-library-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.pa-detail-grid { grid-template-columns:1fr; } }
@media(max-width:600px) {
  .pa-heading { align-items:flex-start; }.pa-heading h1 { font-size:24px; }.pa-heading > a { flex-shrink:0; }.pa-library-grid { grid-template-columns:1fr; }.pa-card { padding:17px; }.pa-archive-card { padding:0; }
  .pa-selected { flex-direction:column; align-items:flex-start; }.pa-form-grid { grid-template-columns:1fr; }.pa-version-top { gap:12px; }.pa-version-cover { width:90px; height:78px; }.pa-section-heading { flex-wrap:wrap; }.pa-filters select { flex:1; min-width:0; }
  .pa-viewer-header { padding:8px 10px; }.pa-viewer-header strong { max-width:48vw; }.pa-viewer-controls { justify-content:center; padding:8px; gap:8px; }.pa-viewer-tools { flex-wrap:wrap; justify-content:center; }.pa-viewer-tools .pa-viewer-btn { padding:8px; }.pa-viewer-status { font-size:10px; }
}
.pa-drop.is-dragging { border:2px solid #16816b; background:#e3f3eb; }

/* iOS must not zoom the page when archive/search/page-number fields receive focus. */
@media (max-width:767px) {
  .pa-library :is(input,select,textarea),.pa-library .pa-filters :is(input,select),.pa-form :is(input,select,textarea),.pa-form input[type=file],.pa-viewer-nav input { font-size:16px; }
  .pa-form :is(input,select,textarea) { min-width:0; max-width:100%; }
}
