:root { color-scheme: light; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #203247; background: #f5f7f8; }
* { box-sizing: border-box; }
body { margin: 0; }
.wrap { width: min(1840px, calc(100% - 48px)); margin: auto; }
.masthead { color: #fff; background: #112a3d; padding: 34px 0 28px; border-bottom: 6px solid #e6b45e; }
.eyebrow { color: #bcd2de; letter-spacing: .15em; font-size: .72rem; font-weight: 750; }
h1 { font: 2.6rem Georgia, serif; letter-spacing: -.03em; margin: 9px 0; }
.masthead p { color: #d5e0e7; margin: 0; }
.intro { background: #e8f0f3; border-left: 4px solid #32809b; margin: 24px 0; padding: 16px 20px; line-height: 1.5; }
.toolbar { display: grid; grid-template-columns: 1fr .7fr 1.8fr; gap: 15px; background: white; padding: 18px; border: 1px solid #d9e0e4; }
label { display: grid; gap: 6px; font-size: .84rem; font-weight: 650; }
select, textarea { width: 100%; background: white; color: #203247; border: 1px solid #aebfc8; border-radius: 4px; padding: 10px; font: inherit; }
button, .import-button { background: white; color: #174861; border: 1px solid #b2c3cb; border-radius: 4px; padding: 10px 13px; cursor: pointer; font: 650 .85rem system-ui, sans-serif; }
button:hover, .import-button:hover { background: #e8f0f3; }
button:disabled { opacity: .45; cursor: default; }
select:focus-visible, textarea:focus-visible, button:focus-visible, .import-button:focus-within, a:focus-visible { outline: 3px solid #e4ae55; outline-offset: 2px; }
.navigation { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 18px 0; }
.navigation > div { text-align: center; }
#page-id { display: block; font: 1.35rem Georgia, serif; }
#page-meta, #progress { display: block; color: #536b7a; font-size: .82rem; margin-top: 3px; }
.action-panel { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px 16px; background: #fffaf0; border: 1px solid #e8d6b7; padding: 15px 18px; margin-bottom: 18px; }
.action-panel label { max-width: 680px; }
.columns { display: grid; grid-template-columns: minmax(0, 1.08fr) repeat(2, minmax(0, 1fr)); align-items: start; gap: 16px; }
.card { min-width: 0; margin: 0; background: #fff; border: 1px solid #d9e0e4; }
.card h2 { background: #e7eff2; font-size: 1.1rem; margin: 0; padding: 13px 16px; }
.source img { display: block; width: 100%; height: auto; }
.source figcaption { text-align: center; color: #5f7080; font-size: .8rem; padding: 12px; }
.badges { display: flex; flex-wrap: wrap; gap: 6px; padding: 13px 16px 4px; min-height: 49px; }
.badge { border-radius: 20px; font-size: .76rem; font-weight: 650; padding: 5px 9px; background: #edf1f3; color: #596c77; }
.badge.warning { color: #884317; background: #fff0d6; }
.badge.script { color: #744b21; background: #f8eee1; }
.output pre { white-space: pre-wrap; overflow-wrap: anywhere; overflow-y: auto; max-height: 72vh; min-height: 300px; border-top: 1px solid #e9edef; padding: 16px; margin: 0; font: .89rem/1.55 system-ui, sans-serif; }
.notes { background: white; border: 1px solid #d9e0e4; margin: 20px 0; padding: 16px; }
.notes textarea { margin-top: 8px; resize: vertical; }
.storage { background: #fffaf0; border-left: 4px solid #d9a34e; display: flex; justify-content: space-between; align-items: center; gap: 25px; padding: 18px 20px; }
.storage p { font-size: .85rem; line-height: 1.5; margin: 6px 0; max-width: 850px; }
#save-status { font-size: .8rem; color: #536b7a; }
.file-actions { display: flex; gap: 8px; white-space: nowrap; }
.import-button { display: inline-block; }
#import { position: absolute; width: 1px; height: 1px; opacity: 0; }
footer { border-top: 1px solid #d9e0e4; color: #5f7080; padding: 20px 0; margin: 30px 0; font-size: .84rem; }
.desktop-only { display: none; }
@media (max-width: 900px) { .desktop-only { display: flex; position: fixed; inset: 0; width: 100vw; height: 100dvh; z-index: 10; background: #112a3d; color: white; align-items: center; justify-content: center; padding: 35px; text-align: center; font: 1.2rem/1.5 system-ui, sans-serif; } }