:root { color-scheme: light; --bg:#f4f3ee; --surface:#fbfaf6; --ink:#263d36; --muted:#82867c; --green:#294e43; --green-soft:#e7ede5; --line:#e2e3da; --paper:#f8f4e9; --writing:#344d67; --amber:#9f713e; --amber-soft:#f2e8d4; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:"Segoe UI",Arial,sans-serif; font-size:14px; -webkit-font-smoothing:antialiased; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.42; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #7eaa96; outline-offset:3px; }
button { color:inherit; }
svg { width:19px; height:19px; flex-shrink:0; stroke:currentColor; fill:none; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
[hidden] { display:none !important; }
.app-shell { display:grid; grid-template-columns:216px minmax(0,1fr); min-height:100vh; }
.sidebar { background:var(--surface); border-right:1px solid var(--line); padding:31px 20px 21px; display:flex; flex-direction:column; gap:42px; position:sticky; top:0; height:100vh; }
.brand { display:flex; align-items:center; gap:8px; padding:0; border:0; background:none; text-align:left; }
.brand-symbol { width:56px; height:56px; flex-shrink:0; display:grid; place-items:center; }
.brand-text { min-width:0; }
.brand-symbol img { display:block; width:100%; height:100%; object-fit:contain; }
.brand-symbol svg { width:23px; height:23px; }
.brand-name { font-family:Georgia,serif; font-size:24px; letter-spacing:-.8px; }
.brand small { display:block; font-size:9px; letter-spacing:1.5px; margin-top:3px; color:var(--muted); text-transform:uppercase; }
.nav-heading { margin:0 14px 13px; font-size:10px; color:#989c90; letter-spacing:1.5px; text-transform:uppercase; }
.nav-links { display:flex; flex-direction:column; gap:6px; }
.nav-link { border:0; background:transparent; display:flex; gap:12px; align-items:center; padding:13px 14px; border-radius:9px; color:#747e71; text-align:left; }
.nav-link:hover { background:#eeefe8; }
.nav-link.active { background:var(--green-soft); color:var(--green); font-weight:600; }
.nav-link svg { width:18px; height:18px; }
.nav-count { margin-left:auto; font-size:10px; background:#d8e3d4; padding:3px 6px; border-radius:5px; font-weight:500; }
.sidebar-bottom { margin-top:auto; }
.demo-note { border:1px solid var(--line); padding:14px; border-radius:11px; margin-bottom:24px; font-size:11px; color:#82897d; line-height:1.6; }
.demo-note strong { display:block; color:#4e6658; font-size:12px; margin-bottom:4px; font-weight:600; }
.demo-note .dot { display:inline-block; width:6px; height:6px; background:#7a9d72; border-radius:50%; margin-right:5px; }
.profile { display:flex; align-items:center; gap:11px; border-top:1px solid var(--line); padding:20px 7px 0; }
.avatar { background:#e5e6db; color:#5b705e; border-radius:50%; width:34px; height:34px; display:grid; place-items:center; font-size:11px; font-weight:600; }
.profile strong { font-size:12px; font-weight:600; }
.profile small { color:var(--muted); display:block; margin-top:3px; font-size:10px; }
.main { width:100%; max-width:1740px; padding:27px 38px 23px; margin:0 auto; min-width:0; }
.topbar { display:flex; justify-content:space-between; align-items:center; color:#92978b; font-size:11px; margin-bottom:26px; }
.breadcrumb { display:flex; gap:11px; align-items:center; }
.breadcrumb svg { width:14px; height:14px; }
.breadcrumb span:last-child { color:#596b5b; }
.save-indicator { display:flex; gap:6px; align-items:center; }
.save-indicator svg { width:14px; height:14px; }
.intro { display:flex; justify-content:space-between; gap:20px; align-items:center; margin-bottom:26px; }
.eyebrow { text-transform:uppercase; color:#8b927e; letter-spacing:1.7px; font-size:10px; margin:0 0 8px; }
h1 { font-family:Georgia,"Times New Roman",serif; font-weight:400; font-size:41px; letter-spacing:-1.7px; margin:0 0 9px; line-height:1.12; }
.intro p { color:#89907f; font-size:12px; margin:0; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid #d9dfd2; background:#fafaf5; padding:10px 15px; border-radius:8px; font-size:12px; text-decoration:none; white-space:nowrap; }
.button:hover { background:#eef0e7; }
.button.primary { background:var(--green); color:#f9faf4; border-color:var(--green); }
.button.primary:hover { background:#1c3f34; }
.button.small { padding:7px 11px; font-size:11px; }
.button.ghost { border-color:transparent; background:transparent; color:#76846e; }
.button.danger { color:#985a43; background:#fcf3ed; border-color:#ead5c7; }
.button svg { width:16px; height:16px; }
.stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:31px; }
.stat { background:var(--surface); border:1px solid #e6e5dc; border-radius:12px; padding:17px 19px 16px; }
.stat-header { display:flex; align-items:center; justify-content:space-between; color:#7d8574; font-size:10px; letter-spacing:1.15px; text-transform:uppercase; }
.stat-header svg { color:#95a183; width:17px; height:17px; }
.stat-value { font-family:Georgia,serif; font-size:34px; letter-spacing:-1px; margin:8px 0 6px; line-height:1; font-variant-numeric:tabular-nums; }
.stat-value .unit { font-family:"Segoe UI",sans-serif; font-size:12px; color:#939986; margin-left:6px; letter-spacing:0; }
.stat-sub { font-size:10px; color:#979b8e; display:flex; gap:5px; align-items:center; }
.stat-sub .dot { width:5px; height:5px; border-radius:50%; background:#91a28a; }
.section-heading { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:16px; }
.section-title { display:flex; gap:12px; align-items:center; }
h2 { font-size:21px; letter-spacing:-.6px; font-family:Georgia,serif; font-weight:400; margin:0; }
.small-tag { font-size:9px; letter-spacing:.3px; padding:5px 8px; border-radius:5px; color:#8a927a; background:#e9ece2; white-space:nowrap; }
.book-controls { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.segmented { display:flex; background:#e9eae2; padding:3px; border:1px solid #e1e3d8; border-radius:8px; }
.segmented button { background:transparent; border:0; border-radius:5px; color:#8b937e; font-size:11px; padding:7px 12px; }
.segmented button[aria-pressed="true"] { background:#fcfcf7; box-shadow:0 1px 4px #40543912; color:#476444; }
.icon-button { display:grid; place-items:center; width:34px; height:34px; border-radius:8px; background:#fcfcf6; border:1px solid #dfe2d6; }
.icon-button:hover { background:#e7ede2; }
.icon-button svg { width:16px; height:16px; }
.book-scroll { overflow-x:auto; overflow-y:hidden; padding:8px 1px 18px; scrollbar-width:thin; }
.book-stage { position:relative; min-width:1020px; padding:7px; background:#516351; border-radius:12px; box-shadow:0 16px 30px #5c614118,0 3px 5px #46513b23; perspective:2000px; }
.book-stage::after { content:""; position:absolute; z-index:-1; left:12px; right:12px; bottom:-5px; height:15px; border:1px solid #c7c3b3; border-radius:0 0 8px 8px; background:repeating-linear-gradient(to bottom,#ebe7d9 0px,#ebe7d9 2px,#d8d5c6 2px,#d8d5c6 3px); }
.book-spread { display:grid; grid-template-columns:1fr 1fr; position:relative; background:var(--paper); border-radius:7px; min-height:503px; }
.book-half { padding:22px 21px 19px; position:relative; min-width:0; background:radial-gradient(ellipse at 50% 10%,#fffcf2a0,transparent 85%); }
.book-half.left { background:linear-gradient(to right,#e8e2d31c,transparent 10%,transparent 90%,#c2b99e20); border-radius:7px 0 0 7px; padding-right:22px; }
.book-half.right { background:linear-gradient(to right,#b5aa9220,transparent 9%,transparent 91%,#e8e2d31c); border-radius:0 7px 7px 0; padding-left:22px; }
.book-spine { position:absolute; z-index:2; width:30px; left:calc(50% - 15px); top:0; bottom:0; pointer-events:none; background:linear-gradient(to right,transparent,#b3ab9720 30%,#968c7830 48%,#7c766a20 51%,#b2aa9517 70%,transparent); }
.paper-table { width:100%; border-collapse:collapse; table-layout:fixed; color:#514f43; border:1px solid #959485; }
.paper-table th,.paper-table td { border:1px solid #aaa699; padding:0 3px; }
.paper-table thead { height:86px; }
.paper-table thead th { font-size:9px; line-height:1.6; font-weight:500; text-align:center; background:#eeeadf70; }
.paper-table thead tr:first-child { height:29px; }
.paper-table thead tr:last-child { height:57px; }
.paper-table thead .group-head { font-size:10px; }
.paper-table .year-cell { font-size:9px; text-align:left; padding-left:5px; }
.paper-table .year-cell strong { font-family:"Segoe Print","Bradley Hand",cursive; color:var(--writing); font-size:15px; font-weight:400; margin-left:4px; }
.paper-table .carry-label { text-align:left; padding-left:9px; letter-spacing:.2px; font-size:10px; }
.paper-table .carry-value { font-family:"Segoe Print","Bradley Hand",cursive; color:var(--writing); font-size:15px; background:transparent; font-weight:400; line-height:1; }
.paper-table tbody tr { height:34px; }
.paper-table tbody td { font-family:"Segoe Print","Bradley Hand",cursive; color:var(--writing); font-size:14px; line-height:1.4; white-space:nowrap; text-align:center; }
.paper-table .person-cell { text-align:left; padding-left:5px; font-size:14px; }
.paper-table .model-cell { font-size:13px; }
.paper-table .remarks-cell { font-size:11px; text-align:left; }
.paper-table tbody tr.is-highlight td,.paper-table tbody tr:hover td { background:#d5dfd550; }
.paper-table tbody tr.edited td { background:#f2e6bf40; }
.paper-table .date-button { font-size:12px; display:flex; align-items:center; justify-content:center; gap:4px; font-family:inherit; border:0; padding:5px 0; color:inherit; background:transparent; width:100%; }
.paper-table .exception-dot { display:inline-block; flex-shrink:0; width:5px; height:5px; border-radius:50%; background:#b68647; }
.paper-table tfoot td { height:29px; }
.paper-table .signature { font-family:"Segoe UI",sans-serif; font-size:8px; vertical-align:top; height:58px; padding:8px 6px; color:#777469; }
.paper-table .sum-label { font-family:"Segoe UI",sans-serif; font-size:9px; text-align:left; padding-left:7px; color:#656353; font-weight:500; }
.paper-table .sum-value { font-family:"Segoe Print","Bradley Hand",cursive; font-size:15px; text-align:center; color:var(--writing); }
.paper-table tfoot tr:last-child { background:#e9e5d744; }
.turn-sheet { position:absolute; top:0; bottom:0; width:50%; pointer-events:none; z-index:10; overflow:hidden; background:var(--paper); box-shadow:3px 0 25px #5e544343; backface-visibility:hidden; }
.turn-sheet.forward { right:0; transform-origin:left center; border-radius:0 7px 7px 0; animation:turn-forward 560ms cubic-bezier(.35,.06,.34,1) both; }
.turn-sheet.backward { left:0; transform-origin:right center; border-radius:7px 0 0 7px; animation:turn-backward 560ms cubic-bezier(.35,.06,.34,1) both; }
.turn-sheet .book-half { width:100%; height:100%; }
@keyframes turn-forward { 0% { transform:rotateY(0); filter:brightness(1); } 60% { filter:brightness(.91); } 100% { transform:rotateY(-180deg); filter:brightness(.86); } }
@keyframes turn-backward { 0% { transform:rotateY(0); } 60% { filter:brightness(.91); } 100% { transform:rotateY(180deg); filter:brightness(.86); } }
.book-navigation { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:18px; margin:5px 5px 0; }
.page-turn { display:flex; align-items:center; gap:7px; font-size:11px; border:0; background:transparent; color:#6c7a61; padding:10px 0; }
.page-turn:last-child { justify-self:end; }
.page-turn svg { width:15px; height:15px; }
.page-center { text-align:center; }
.page-caption { font-size:11px; color:#5a6f53; margin-bottom:8px; }
.page-caption strong { color:#294e43; font-weight:600; }
.page-chips { display:flex; justify-content:center; gap:4px; }
.page-chip { width:26px; height:25px; padding:0; border:0; border-radius:5px; background:transparent; color:#909884; font-size:10px; }
.page-chip:hover { background:#e6e9de; }
.page-chip.active { background:var(--green); color:#f6f6ee; }
.book-status { display:flex; justify-content:center; gap:12px; align-items:center; margin:17px 0 13px; flex-wrap:wrap; }
.status-text { display:inline-flex; gap:5px; align-items:center; font-size:10px; color:#829176; }
.status-text svg { width:13px; height:13px; }
.status-text.warning { color:var(--amber); }
.copy-button { font-size:10px; background:transparent; color:#73846a; border:0; border-bottom:1px dotted #a4b09b; padding:2px 0; }
.reconcile { padding:10px 14px; background:#eee9dc; color:#92866c; border-radius:8px; display:flex; align-items:center; gap:9px; font-size:10px; line-height:1.6; }
.reconcile svg { width:15px; height:15px; color:#ad9366; }
.reconcile button { margin-left:auto; border:0; background:transparent; color:#7b785c; font-size:10px; white-space:nowrap; text-decoration:underline; text-underline-offset:3px; }
.view-footnote { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin:17px 1px 0; color:#a0a591; font-size:9px; }
.view-footnote button { background:transparent; border:0; font-size:inherit; color:inherit; padding:0; text-decoration:underline; text-underline-offset:3px; }
.focus-mode .sidebar,.focus-mode .topbar,.focus-mode .intro,.focus-mode .stats,.focus-mode .view-footnote { display:none; }
.focus-mode .app-shell { display:block; }
.focus-mode .main { max-width:1660px; padding-top:35px; }
.focus-mode .book-spread { min-height:580px; }
.focus-mode .paper-table tbody tr { height:42px; }
.focus-mode .paper-table tbody td { font-size:17px; }
.focus-mode .paper-table .person-cell,.focus-mode .paper-table .model-cell { font-size:16px; }
.focus-mode .paper-table .date-button { font-size:15px; }
.list-panel { background:var(--surface); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.list-tools { padding:17px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; border-bottom:1px solid var(--line); }
.search-input { flex:1; min-width:170px; }
.table-scroll { overflow:auto; }
.data-table { width:100%; border-collapse:collapse; }
.data-table th { font-weight:500; color:#87947a; font-size:10px; text-align:left; background:#f0f2e9; padding:12px 15px; white-space:nowrap; }
.data-table td { padding:13px 15px; border-bottom:1px solid #eceee4; font-size:12px; white-space:nowrap; }
.data-table .text-end { text-align:right; }
.text-button { border:0; background:transparent; padding:0; color:#355740; text-decoration:underline; text-underline-offset:3px; }
.role-tag { display:inline-block; padding:4px 6px; border-radius:4px; font-size:9px; background:#e8ede2; color:#6c815e; }
.role-tag.dual { background:#f0ebdd; color:#9a8864; }
.empty-result { padding:50px; text-align:center; color:#8c927e; }
dialog { border:1px solid #dfe4d6; border-radius:16px; padding:0; width:min(700px,calc(100vw - 32px)); max-height:90vh; background:#fbfcf7; color:var(--ink); box-shadow:0 28px 100px #1c352d3b; }
dialog::backdrop { background:#1e312b65; backdrop-filter:blur(3px); }
.dialog-header { padding:24px 26px 20px; display:flex; justify-content:space-between; gap:20px; align-items:flex-start; border-bottom:1px solid #e7eadf; }
.dialog-header h2 { font-size:26px; margin:0 0 5px; }
.dialog-header p { font-size:11px; color:#89967d; margin:0; line-height:1.6; }
.dialog-content { padding:23px 26px; }
.dialog-footer { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:9px; padding:16px 26px; border-top:1px solid #e5e9dc; background:#f3f5ee; }
.dialog-label { color:#819473; font-size:10px; text-transform:uppercase; letter-spacing:1px; margin:0 0 10px; }
.summary-strip { display:flex; justify-content:space-between; gap:12px; padding:14px 16px; border:1px solid #e2e7d8; border-radius:8px; background:#f0f4e9; margin-bottom:21px; }
.summary-strip span { font-size:10px; color:#86937a; }
.summary-strip strong { display:block; font-family:Georgia,serif; font-weight:400; font-size:23px; color:#45603a; margin-top:5px; }
.flight-picks { display:flex; gap:7px; flex-wrap:wrap; margin:12px 0 20px; }
.flight-pick { background:#f0f3e9; border:1px solid #e0e5d5; border-radius:6px; padding:8px 10px; font-size:10px; }
.flight-pick.active { background:#e1ebd7; border-color:#99ac87; color:#476b34; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 18px; }
.field { display:flex; flex-direction:column; gap:6px; color:#687c59; font-size:11px; }
.field.wide { grid-column:1/-1; }
input,select,textarea { border:1px solid #d8dfca; border-radius:6px; background:#fdfef9; color:#304429; padding:10px 11px; min-width:0; }
input[type="checkbox"] { accent-color:var(--green); }
textarea { resize:vertical; }
.field-help { font-size:10px; color:#919a83; line-height:1.6; margin-top:11px; }
.alert { background:#f1ead8; border:1px solid #e7dbbe; color:#8b7856; padding:12px 14px; border-radius:8px; font-size:11px; line-height:1.75; margin-bottom:15px; }
.alert strong { color:#7b6442; }
.alert.error { background:#f6e6de; color:#a46047; border-color:#e9c8b8; }
.plain-copy { font-size:12px; color:#7d8b6e; line-height:1.85; margin:0 0 15px; }
.detail-line { display:flex; gap:10px; align-items:center; padding:11px 0; border-bottom:1px solid #e8ebdf; font-size:11px; }
.detail-line svg { width:15px; height:15px; color:#b69556; }
.detail-line .button { margin-left:auto; }
.dropzone { display:flex; flex-direction:column; align-items:center; gap:10px; padding:30px 16px; border:1px dashed #aebba0; border-radius:10px; background:#f2f6ec; text-align:center; cursor:pointer; }
.dropzone.dragging { background:#e2ecd8; border-color:#547641; }
.dropzone svg { width:28px; height:28px; color:#82976f; }
.dropzone strong { font-weight:500; font-size:13px; }
.dropzone small { color:#93a080; font-size:10px; }
.import-results { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:17px 0; }
.import-result { border-radius:7px; padding:14px; background:#f0f3e8; text-align:center; }
.import-result strong { font-family:Georgia,serif; display:block; font-size:26px; font-weight:400; }
.import-result span { font-size:10px; color:#89977a; }
.column-guide,.source-details { border:1px solid var(--line); border-radius:8px; padding:12px 14px; margin:16px 0; background:var(--surface); }
.column-guide summary,.source-details summary,.alert summary { cursor:pointer; font-size:12px; line-height:1.6; }
.column-guide h3 { font-size:13px; margin:20px 0 9px; }
.column-list { margin:0; font-size:12px; }
.column-list>div { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.8fr); gap:12px; padding:9px 0; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.column-list dt { font-weight:500; }
.column-list dd { margin:0; line-height:1.6; color:var(--muted); }
.column-found,.column-missing { display:block; font-size:10px; margin-top:3px; }
.column-found { color:#43613c; }
.column-missing { color:#9c4b30; }
.missing-optionals { margin-top:16px; }
.import-sheet-field { margin-top:18px; }
.import-file-summary { overflow-wrap:anywhere; }
.time-fields { border:1px solid var(--line); border-radius:8px; padding:14px; margin:18px 0; min-width:0; }
.time-fields legend { font-size:12px; padding:0 5px; }
.time-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
@media(max-width:500px) { .time-grid { grid-template-columns:1fr; } .column-list>div { grid-template-columns:1fr; gap:4px; } }
.toggle-line { display:flex; gap:12px; align-items:center; padding:15px 0; border-bottom:1px solid #e5eade; }
.toggle-line label { display:flex; gap:12px; align-items:center; font-size:12px; flex:1; }
.toggle-line small { display:block; font-size:10px; color:#8d9a7c; margin-top:4px; }
.model-row { display:grid; grid-template-columns:84px minmax(0,1fr); gap:15px; align-items:center; padding:13px 0; border-bottom:1px solid #e7ebde; }
.model-row strong { font-size:12px; font-weight:500; }
.model-row small { display:block; color:#8a9977; font-size:10px; margin-top:4px; }
.toast { position:fixed; z-index:100; bottom:25px; left:50%; transform:translateX(-50%); background:#2d503e; color:#f2f7e8; padding:14px 21px; border-radius:10px; box-shadow:0 8px 25px #233b2830; font-size:12px; max-width:calc(100vw - 32px); text-align:center; }
.handwriting-off .paper-table tbody td,.handwriting-off .paper-table .carry-value,.handwriting-off .paper-table .sum-value,.handwriting-off .paper-table .year-cell strong { font-family:"Segoe UI",sans-serif; font-size:13px; }
.print-only { display:none; }
@media (min-width:1650px) { .paper-table tbody tr { height:38px; } .paper-table tbody td { font-size:16px; } .paper-table .date-button { font-size:14px; } .paper-table .person-cell { font-size:15px; } .paper-table .model-cell { font-size:14px; } .paper-table .sum-value,.paper-table .carry-value { font-size:17px; } .book-half { padding:27px 27px 22px; } }
@media (max-width:1200px) { .app-shell { grid-template-columns:178px minmax(0,1fr); } .sidebar { padding-left:12px; padding-right:12px; } .brand-name { font-size:21px; } .brand-symbol { width:48px; height:48px; } .main { padding:25px 24px; } .stat { padding:16px; } .book-scroll { margin-right:-5px; } }
@media (max-width:900px) { .app-shell { grid-template-columns:70px minmax(0,1fr); } .sidebar { padding:24px 10px; align-items:center; } .brand { padding:0; } .brand-symbol { width:44px; height:44px; } .brand-text,.nav-heading,.nav-link span,.demo-note,.profile div:not(.avatar),.sidebar small { display:none; } .nav-link { padding:13px; } .nav-links { gap:10px; } .profile { padding:17px 0 0; } .main { padding:23px 24px; } .stats { gap:10px; } .stat { padding:14px; } .stat-value { font-size:29px; } .stat-sub { font-size:9px; } .section-heading { gap:14px; } }
@media (max-width:650px) { .app-shell { display:block; } .sidebar { height:auto; position:relative; padding:15px 18px; flex-direction:row; justify-content:space-between; border-right:0; border-bottom:1px solid var(--line); gap:10px; } .brand-text { display:block; } .brand small,.brand-name { display:none; } .brand-symbol { width:34px; height:34px; border-radius:10px; } .nav-links { flex-direction:row; gap:4px; } .nav-link { padding:9px 12px; } .sidebar-bottom { margin:0; } .profile { border:0; padding:0; } .main { padding:22px 18px; } .topbar { margin-bottom:23px; } .save-indicator { font-size:10px; } h1 { font-size:33px; } .intro { flex-direction:column; align-items:stretch; gap:14px; margin-bottom:24px; } .intro .book-controls { justify-content:flex-start; } .intro .button { font-size:11px; padding:10px; } .intro .button svg { width:14px; } .intro p { font-size:10px; max-width:none; line-height:1.6; } .stats { grid-template-columns:1fr 1fr; gap:11px; margin-bottom:25px; } .stat { padding:15px; } .stat-value { font-size:32px; } .stat-sub { font-size:10px; } .section-heading { align-items:center; margin-bottom:10px; } .section-title { gap:8px; } h2 { font-size:20px; } .small-tag { font-size:8px; } .book-controls { width:100%; justify-content:space-between; } .book-stage { min-width:1080px; } .book-scroll { margin-right:-18px; padding-right:18px; margin-left:-1px; } .book-navigation { gap:8px; margin:5px 0 0; } .page-turn { font-size:10px; } .page-center { min-width:160px; } .page-caption { font-size:10px; } .page-chip { width:23px; } .reconcile { align-items:flex-start; font-size:10px; } .reconcile button { display:none; } .dialog-content { padding:19px; } .dialog-header { padding:20px; } .dialog-footer { padding:16px 19px; } .form-grid { gap:13px; } input,select,textarea { font-size:16px; padding:9px; } .summary-strip { padding:12px; gap:6px; } .summary-strip strong { font-size:21px; } .focus-mode .main { padding:20px 16px; } .view-footnote { font-size:9px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; } }
@media print { @page { size:A4 landscape; margin:9mm; } body { background:white; } .sidebar,.topbar,.intro,.stats,.section-heading,.book-navigation,.book-status,.reconcile,.view-footnote,.toast,dialog { display:none !important; } .app-shell { display:block; min-height:0; } .main { margin:0; padding:0; max-width:none; } .book-scroll { overflow:visible; padding:0; } .book-stage { padding:0; min-width:0; background:none; box-shadow:none; border-radius:0; } .book-stage::after { display:none; } .book-spread { min-height:0; background:#fffdf7; } .book-half { padding:10px; } .book-spine { width:12px; left:calc(50% - 6px); } .paper-table tbody tr { height:31px; } .paper-table tbody td { font-size:13px; } .paper-table .carry-value,.paper-table .sum-value { font-size:14px; } .print-only { display:block; text-align:center; margin-top:14px; font-size:10px; } }

/* The paper is always laid out at this size; its frame scales the whole spread. */
.stats-link-row { display:flex; justify-content:flex-end; margin:-19px 0 23px; }
.stats-link-row button { display:flex; align-items:center; gap:7px; font-size:11px; text-decoration:none; }
.stats-link-row svg { width:14px; height:14px; }
.book-scroll { overflow:visible; margin:0; padding:8px 6px 18px; width:100%; }
.book-stage { min-width:0; margin:0 auto; padding:6px; overflow:hidden; perspective:1800px; border-radius:12px; transition:height .15s ease; }
.book-spread { display:flex; width:1400px; height:640px; min-height:0; position:absolute; top:6px; left:6px; transform-origin:0 0; perspective:2000px; isolation:isolate; }
.book-spread .book-half { flex:none; width:700px; height:640px; padding:28px 25px; }
.book-spread .paper-table { height:580px; }
.book-spread .paper-table th,.book-spread .paper-table td { padding:0 4px; }
.book-spread .paper-table thead { height:104px; }
.book-spread .paper-table thead tr:first-child { height:36px; }
.book-spread .paper-table thead tr:last-child { height:68px; }
.book-spread .paper-table thead th { font-size:16px; line-height:1.4; }
.book-spread .paper-table thead th small { font-size:12px; }
.book-spread .paper-table .group-head { font-size:17px; }
.book-spread .paper-table .year-cell { font-size:12px; }
.book-spread .paper-table .year-cell strong { font-size:17px; margin-left:3px; }
.book-spread .paper-table tbody tr { height:40px; }
.book-spread .paper-table tbody td { font-size:22px; line-height:1.2; overflow:visible; }
.book-spread .paper-table .date-button { font-size:20px; gap:3px; line-height:1.2; padding:0; }
.book-spread .paper-table .person-cell,.book-spread .paper-table .model-cell { font-size:21px; }
.book-spread .paper-table .remarks-cell { font-family:"Segoe UI",Arial,sans-serif; font-size:17px; white-space:normal; }
.book-spread .paper-table .remarks-cell .cell-content { white-space:normal; overflow-wrap:anywhere; }
.book-spread .paper-table .numeric-cell { font-family:"Segoe Print","Bradley Hand",cursive; font-variant-numeric:tabular-nums; font-size:22px; line-height:1; font-weight:400; color:var(--writing); }
.book-spread .paper-table .carry-label,.book-spread .paper-table .sum-label { font-size:17px; padding-left:10px; }
.book-spread .paper-table tfoot tr { height:38px; }
.book-spread .paper-table .signature { height:76px; font-size:14px; vertical-align:top; padding:9px; }
.cell-content,[data-fit] { display:inline-block; white-space:nowrap; }
.book-spread .paper-table .date-cell { position:relative; }
.book-spread .paper-table .new-row td { background:#dbe9d52b; }
.row-new-marker { position:absolute; left:3px; bottom:0; color:#4c7b40; font-family:"Segoe UI",Arial,sans-serif; font-size:9px; font-weight:700; line-height:1; letter-spacing:1px; }
.new-tag { display:inline-block; padding:3px 6px; background:#e2efd8; color:#52703c; border-radius:4px; font-size:9px; font-weight:600; margin-left:6px; }
.book-spread .paper-table .jump-target td { background:#f5df9c88; box-shadow:inset 0 1px #c39932,inset 0 -1px #c39932; }
.book-spread .paper-table .exception-dot { position:absolute; left:-13px; top:50%; transform:translateY(-50%); width:5px; height:5px; box-shadow:0 0 0 2px #f8f4e9; }
.half-controls { display:none; gap:4px; background:#e8ebe1; padding:4px; border-radius:9px; margin:0 0 15px; }
.half-controls.visible { display:flex; }
.half-controls button { flex:1; padding:9px 7px; border:0; background:transparent; border-radius:6px; font-size:12px; }
.half-controls button[aria-pressed="true"] { background:#fcfcf7; color:#375f3a; box-shadow:0 1px 5px #24432a12; }
.half-controls small { display:block; font-size:9px; color:#8b947f; margin-top:3px; }
.half-caption { color:#87937a; font-size:10px; margin-top:5px; }
.book-navigation { margin-top:0; }
.book-notes { padding:10px 15px; border:1px solid #e7e1ce; background:#faf6e9; border-radius:8px; margin:10px 0; font-size:12px; line-height:1.6; }
.book-notes p { margin:5px 0; white-space:pre-wrap; overflow-wrap:anywhere; }
.crew-sub { display:block; margin-top:4px; color:#8c967e; font-size:10px; }
.book-jump-button { color:#55774a; padding:6px 8px; font-size:10px; }
.book-jump-button svg { width:13px; height:13px; }
.half-reveal .book-spread { animation:half-reveal .26s ease-out; }
@keyframes half-reveal { from { opacity:.35; } to { opacity:1; } }
.book-spread .turn-sheet { position:absolute; left:700px; top:0; width:700px; height:640px; z-index:5; pointer-events:none; transform:none; animation:none; background:none; box-shadow:none; transform-style:preserve-3d; overflow:visible; backface-visibility:visible; }
.book-spread .turn-sheet.backward { left:0; }
.turn-preparation { position:absolute; inset:0; display:flex; width:1400px; height:640px; visibility:hidden; pointer-events:none; }
.paper-strip { position:absolute; top:0; left:0; height:640px; transform-style:preserve-3d; will-change:transform; }
.backward .paper-strip { left:auto; right:0; }
.strip-front,.strip-back { position:absolute; inset:0; overflow:hidden; backface-visibility:hidden; background:var(--paper); }
.strip-back { transform:rotateY(180deg); background:#f7f2e5; }
.strip-content { position:absolute; width:700px; height:640px; top:0; }
.strip-content .book-half { background:var(--paper); }
.strip-light { position:absolute; inset:0; background:#655333; backface-visibility:visible; pointer-events:none; }
.landscape-hint { display:none; }
.focus-mode .main { max-width:none; padding:8px 20px; }
.focus-mode .book-scroll { padding:5px 0 9px; }
.focus-mode .stats-link-row { display:none; }
.focus-mode .section-heading { margin:0 0 5px; }
.focus-mode .book-status,.focus-mode .reconcile { display:none; }
.focus-mode .page-chips { display:none; }
.focus-mode .book-navigation { margin:0; }
.focus-mode .book-navigation .page-caption { font-size:11px; }
.focus-mode .half-controls { margin-bottom:7px; }
.panel-description { font-size:12px; color:#89917f; line-height:1.8; margin:0 0 20px; }
.people-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:17px; }
.person-card { background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:22px; }
.person-card-head { display:flex; align-items:center; gap:12px; }
.person-avatar { flex:none; border-radius:50%; width:44px; height:44px; display:grid; place-items:center; background:#eee9dc; color:#8f805f; font-family:Georgia,serif; font-size:17px; }
.person-avatar.own { background:#deead7; color:#4a6c3d; }
.person-card h3 { margin:0 0 7px; font-size:15px; font-weight:500; }
.person-roles { display:flex; gap:4px; flex-wrap:wrap; }
.person-metrics { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:22px 0; }
.person-metrics strong { font:28px Georgia,serif; color:#455e42; }
.person-metrics strong small { font:11px "Segoe UI",sans-serif; color:#8b977c; }
.person-metrics span { display:block; color:#8a9480; font-size:10px; margin-top:6px; }
.person-card-bottom { border-top:1px solid #e9ecdf; padding-top:15px; display:flex; align-items:center; justify-content:space-between; font-size:11px; color:#8b967f; }
.person-card-bottom strong { font-weight:500; color:#566e48; }
.insight-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:0 0 24px; }
.insight-card { background:var(--surface); border:1px solid var(--line); padding:20px; border-radius:11px; }
.insight-label { font-size:10px; color:#8b977e; display:flex; align-items:center; gap:8px; }
.insight-label svg { width:15px; height:15px; }
.insight-card h3 { font:23px Georgia,serif; color:#425c3b; margin:17px 0 9px; overflow-wrap:anywhere; }
.insight-card p { font-size:10px; line-height:1.8; color:#909c82; margin:0; }
.analysis-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.insight-panel { background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:23px; min-width:0; }
.ranking-row { display:flex; gap:13px; align-items:center; padding:12px 0; border-bottom:1px solid #edf0e5; }
.rank-number { font:20px Georgia,serif; color:#aab39d; width:20px; }
.ranking-person { flex:1; min-width:0; }
.ranking-person strong { display:block; font-size:12px; font-weight:500; }
.ranking-person span { display:block; font-size:10px; color:#8a987a; margin-top:5px; }
.ranking-value { font:16px Georgia,serif; color:#687e59; }
.rank-bar { margin-top:8px; background:#ecf0e5; height:3px; border-radius:2px; }
.rank-bar span { margin:0; height:100%; background:#a1b38e; border-radius:2px; }
.month-chart { display:flex; align-items:flex-end; gap:14px; padding-top:20px; overflow:auto; }
.month-column { min-width:47px; flex:1; text-align:center; }
.month-bar-space { height:150px; display:flex; align-items:flex-end; justify-content:center; margin:9px 0; }
.month-bar { width:60%; min-height:3px; background:linear-gradient(#99b384,#506e43); border-radius:5px 5px 0 0; transition:height .35s ease; }
.month-switch { display:flex; padding:3px; gap:2px; background:#e9ede2; border:1px solid #e1e7d7; border-radius:7px; }
.month-switch button { border:0; border-radius:5px; padding:6px 10px; background:transparent; color:#89967c; font-size:10px; }
.month-switch button[aria-pressed="true"] { background:#fcfcf7; color:#43633b; box-shadow:0 1px 4px #30482210; }
.month-time { font:14px Georgia,serif; color:#617751; }
.month-column strong { font-size:10px; font-weight:500; }
.month-column small { display:block; font-size:8px; color:#919d81; margin-top:4px; }
.launch-stats { display:flex; gap:20px; padding:14px 0 23px; flex-wrap:wrap; }
.launch-stats strong { display:block; font:27px Georgia,serif; color:#5b754c; }
.launch-stats span { font-size:10px; color:#8c9b7c; }
.edited-legend { display:flex; gap:6px; align-items:center; font-size:10px; color:#937443; }
.edited-legend i { width:10px; height:10px; background:#ead7a8; border-radius:2px; }
.edited-notice { color:#8b6c36; background:#f3e9ce; padding:10px 12px; border-radius:6px; font-size:12px; }
.grouping-setting { padding:20px 0; border-bottom:1px solid var(--line); }
.grouping-heading { display:flex; justify-content:space-between; align-items:center; gap:14px; }
.grouping-heading > strong { font-size:13px; font-weight:500; }
.gap-policy-options { display:grid; gap:8px; border:0; margin:14px 0 0; padding:0; }
.gap-policy-options label { display:flex; gap:12px; padding:12px; background:#f1f2eb; border:1px solid transparent; border-radius:8px; cursor:pointer; }
.gap-policy-options label:has(input:checked) { border-color:#a0b397; background:#eaf0e5; }
.gap-policy-options input { accent-color:var(--green); margin-top:3px; }
.gap-policy-options span { font-size:12px; }
.gap-policy-options small { display:block; margin-top:4px; line-height:1.5; font-size:10px; color:#7a876d; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.place-row { display:grid; grid-template-columns:1fr 1.15fr .85fr; gap:15px; padding:15px 0; border-bottom:1px solid var(--line); align-items:center; }
.place-row > div strong { font-size:13px; font-weight:500; overflow-wrap:anywhere; }
.place-row > div small { display:block; color:var(--muted); font-size:10px; margin-top:5px; }
.statistics-filter { display:flex; align-items:center; gap:14px; margin:0 0 20px; }
.statistics-filter > label { color:#71836b; font-size:12px; }
.statistics-filter select,.calendar-year-label select { background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:7px; padding:9px 12px; font-size:12px; }
.statistics-filter > span { color:var(--muted); font-size:11px; }
.activity-calendar,.season-comparison { margin-top:23px; }
.activity-calendar h2 { display:flex; align-items:center; gap:8px; }
.insight-panel .section-heading p { margin:8px 0 0; font-size:11px; color:var(--muted); }
.calendar-year-label { display:flex; align-items:center; gap:9px; font-size:11px; color:var(--muted); }
.calendar-months { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px 24px; margin-top:25px; }
.calendar-month h3 { font-size:12px; font-weight:500; margin:0 0 12px; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; }
.calendar-day { display:grid; place-items:center; height:24px; min-width:0; border:0; background:#eff0e8; border-radius:5px; font-size:10px; color:#86917d; padding:0; }
.calendar-day.flown { background:#abc09c; color:#294b33; font-weight:600; }
.calendar-day.level-2 { background:#7f9f6f; color:white; }
.calendar-day.level-3 { background:#436d4f; color:white; }
.calendar-day.flown:hover { box-shadow:0 0 0 2px #8da47d; }
.weekday { text-align:center; font-size:9px; color:#9aab90; margin-bottom:4px; }
.calendar-legend { display:flex; flex-wrap:wrap; align-items:center; gap:16px; font-size:10px; color:#8b977e; margin-top:25px; }
.calendar-legend > span { display:flex; align-items:center; gap:7px; }
.calendar-legend i { display:block; width:10px; height:10px; border-radius:3px; background:#eff0e8; }
.calendar-legend .flown { background:#436d4f; }
.calendar-flight { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid var(--line); padding:15px 0; }
.calendar-flight strong { font-size:13px; font-weight:500; }
.calendar-flight small { display:block; font-size:11px; color:var(--muted); margin-top:6px; }
.comparison-scroll { overflow-x:auto; }
.comparison-table { border-collapse:collapse; width:100%; font-size:12px; }
.comparison-table th,.comparison-table td { padding:14px 10px; text-align:left; white-space:nowrap; border-bottom:1px solid var(--line); }
.comparison-table th { font-weight:500; }
.comparison-table thead { color:#8b977e; font-size:10px; }
.comparison-table strong { font-weight:500; }
.season-bar { width:85px; height:3px; margin-top:6px; background:#e5e9df; }
.season-bar span { display:block; height:3px; background:#8da47d; }
@media (max-width:1100px) { .calendar-months { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:650px) {
  .statistics-filter { flex-wrap:wrap; gap:10px; }
  .statistics-filter > span { flex-basis:100%; }
  .calendar-months { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 16px; }
  .calendar-day { height:20px; font-size:9px; border-radius:3px; }
  .place-row { grid-template-columns:1fr 1fr; gap:10px; }
  .place-row > div { grid-column:1 / -1; }
  .calendar-flight { align-items:flex-start; flex-wrap:wrap; }
  .calendar-flight .button { font-size:10px; }
}
@media (max-width:360px) { .sidebar .nav-link { padding-left:7px; padding-right:7px; } }
@media print { .statistics-filter,.edited-legend { display:none; } }
.aircraft-stat { display:flex; justify-content:space-between; gap:10px; align-items:center; padding:13px 0; border-top:1px solid #e8ecdf; font-size:11px; }
.aircraft-stat strong { font-weight:500; }
.aircraft-stat small { display:block; font-size:9px; color:#9ba38e; margin-top:4px; }
.add-aircraft { padding-top:18px; }
.add-aircraft h3 { font:20px Georgia,serif; margin:0 0 17px; }
.add-aircraft .button { margin-top:15px; }
.info-popover { position:relative; flex:none; }
.info-popover [role="tooltip"] { display:none; position:absolute; right:0; top:42px; width:min(360px,75vw); z-index:5; border:1px solid #d8deca; border-radius:10px; background:#fcfdf7; box-shadow:0 8px 25px #30412624; padding:15px; font-size:11px; line-height:1.7; color:#6d7d5c; }
.info-popover:hover [role="tooltip"],.info-popover:focus-within [role="tooltip"] { display:block; }
.import-conflict { border:1px solid #e3d4b6; border-radius:9px; padding:16px; margin:17px 0; background:#fcf9f0; }
.import-conflict.resolved { border-color:#a8bb93; background:#f5f8ef; }
.import-conflict h3 { font-size:13px; margin:0 0 13px; font-weight:500; }
.conflict-diff>div { display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; padding:8px 0; border-bottom:1px solid #e9e4d6; font-size:11px; }
.conflict-diff span { white-space:pre-wrap; overflow-wrap:anywhere; }
.conflict-diff strong { font-weight:500; }
.conflict-diff .conflict-diff-head { font-size:9px; color:#98a18a; }
.conflict-decision { padding:0; border:0; margin:17px 0 0; }
.conflict-decision legend { font-size:11px; margin-bottom:7px; color:#7c886c; }
.conflict-decision label { display:flex; gap:9px; align-items:center; font-size:11px; padding:7px 0; }
.conflict-decision input { margin:0; accent-color:var(--green); }
.dialog-header { position:sticky; top:0; z-index:10; background:#fbfcf7; }
.dialog-footer { position:sticky; bottom:0; z-index:10; }
#book-jump { margin-top:6px; padding:3px 8px; font-size:10px; }
.handwriting-off .book-spread .paper-table tbody td { font-family:"Segoe UI",Arial,sans-serif; font-size:22px; }
.handwriting-off .book-spread .paper-table .numeric-cell { font-family:"Segoe UI",Arial,sans-serif; font-size:22px; }
@media(max-width:1200px) { .people-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .insight-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:650px) {
  .sidebar { padding:12px 10px; gap:4px; } .sidebar-bottom { display:none; } .nav-links { gap:1px; } .nav-link { padding:9px 10px; } .brand-symbol { width:30px; height:30px; } .brand-symbol svg { width:20px; height:20px; }
  .main { padding:21px 14px; } .topbar { gap:8px; font-size:10px; } .save-indicator { font-size:9px; } .save-indicator svg { width:12px; } .stats { margin-bottom:26px; } .stats-link-row { margin-top:-16px; }
  .book-scroll { margin:0; padding:8px 2px 17px; } .book-stage { min-width:0; border-radius:9px; } .section-title { gap:7px; } .section-heading .book-controls { width:auto; gap:7px; } .section-heading { gap:10px; } .small-tag { font-size:8px; }
  .book-navigation { gap:5px; } .page-center { min-width:165px; } .page-turn { gap:4px; padding:5px 0; } .page-turn svg { width:13px; } .book-status { gap:10px; margin-top:13px; } .book-status .status-text { font-size:10px; }
  .people-grid { grid-template-columns:1fr; gap:13px; } .person-card { padding:20px; } .analysis-grid { grid-template-columns:1fr; gap:15px; } .insight-panel { padding:18px; } .insight-card { padding:15px; } .insight-card h3 { font-size:21px; } .insight-label { font-size:9px; } .insight-grid { gap:10px; } .insight-card p { font-size:10px; } .month-chart { gap:8px; }
  .focus-mode .main { padding:8px; } .focus-mode .section-title { display:none; } .focus-mode .section-heading { justify-content:flex-end; } .focus-mode .book-controls { width:auto; } .focus-mode .landscape-hint { display:flex; align-items:center; justify-content:center; gap:7px; font-size:10px; color:#839375; margin-top:15px; } .focus-mode .landscape-hint svg { width:13px; height:13px; }
  .form-grid { gap:12px; } .info-popover [role="tooltip"] { top:36px; } .grouping-setting { align-items:flex-start; } .grouping-setting small { line-height:1.7; } .conflict-diff>div { font-size:10px; gap:7px; }
}
@media(orientation:landscape) { .focus-mode .half-controls,.focus-mode .landscape-hint { display:none; } .focus-mode .section-title { display:none; } .focus-mode .section-heading { justify-content:flex-end; } .focus-mode .book-controls { width:auto; } .focus-mode .book-navigation { padding:0 10px; } }
@media print {
  .half-controls,.stats-link-row,.landscape-hint { display:none !important; } .book-scroll { overflow:visible; padding:0; width:100%; } .book-stage { width:270mm !important; height:123.5mm !important; margin:0; overflow:visible; background:none; } .book-spread { top:0; left:0; transform:scale(.728) !important; } .book-spread .turn-sheet { display:none; } .book-notes { font-size:10px; margin-top:8px; } .print-only { margin-top:8px; }
}