:root{--bg:#f5f5f7;--surface:#fff;--text:#1d1d1f;--muted:#6e6e73;--line:#e5e5ea;--blue:#007aff;--green:#34c759;--red:#ff3b30;--shadow:0 16px 40px rgba(0,0,0,.08)}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 84% 2%,#d9eeff 0,transparent 24rem),var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;letter-spacing:-.015em}.page{width:min(1200px,calc(100% - 32px));margin:auto;padding:28px 0 64px}.app-header{display:flex;align-items:center;gap:13px;margin:0 4px 24px}.app-header h1{margin:0;font-size:27px;letter-spacing:-.045em}.app-header .icon-button{margin-left:auto}.app-mark{display:grid;width:43px;height:43px;place-items:center;border-radius:14px;background:linear-gradient(145deg,#8fdaff,#007aff);box-shadow:0 8px 20px rgba(0,122,255,.25);color:#fff;font-size:14px;font-weight:750}.eyebrow,.section-kicker{margin:0 0 4px;color:var(--muted);font-size:10px;font-weight:750;letter-spacing:.1em}.hero-card{position:relative;overflow:hidden;display:flex;min-height:245px;align-items:center;padding:34px;margin-bottom:16px;border-radius:28px;background:linear-gradient(135deg,#101114,#292b30);color:#fff}.hero-card h2{position:relative;z-index:1;margin:0 0 12px;font-size:clamp(30px,5vw,48px);line-height:.98;letter-spacing:-.05em}.hero-card p:not(.section-kicker){position:relative;z-index:1;max-width:450px;margin:0;color:#d4d4d9;font-size:15px}.hero-card .section-kicker{color:#a8cfff}.hero-orb{position:absolute;width:300px;height:300px;right:-65px;bottom:-155px;border-radius:50%;background:radial-gradient(circle at 33% 31%,#d8f2ff,#0080ff 34%,#053f98 66%,transparent 68%)}.card{margin-bottom:16px;padding:25px;border:1px solid rgba(0,0,0,.04);border-radius:24px;background:rgba(255,255,255,.92);box-shadow:var(--shadow)}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.section-heading h2{margin:0;font-size:22px;letter-spacing:-.04em}.status-dot,.api-label,.row-count{padding:7px 10px;border-radius:999px;background:#f1f8f3;color:#24833a;font-size:12px;font-weight:650;white-space:nowrap}.api-label{background:#eff8ff;color:#0071e3}.api-label i{display:inline-block;width:7px;height:7px;margin-right:5px;border-radius:50%;background:var(--green)}.row-count{background:#f2f2f7;color:var(--muted)}.filter-form,.form-grid,.upload-form{display:grid;gap:12px}.filter-form{grid-template-columns:repeat(4,minmax(0,1fr));align-items:end}label{display:grid;gap:7px;color:#3a3a3c;font-size:12px;font-weight:650}input,select{width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;outline:none;background:#fbfbfd;color:var(--text);font:inherit;font-size:14px}input:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,122,255,.14)}button{border:0;font:inherit;cursor:pointer;transition:transform .16s ease,background .16s ease}button:hover{transform:translateY(-1px)}button:active{transform:translateY(0)}.primary-button,.secondary-button{min-height:44px;padding:0 18px;border-radius:13px;background:var(--blue);color:white;font-size:14px;font-weight:700}.secondary-button{background:#f1f2f5;color:var(--text)}.advanced-filters{grid-column:span 2;align-self:center}.advanced-filters summary,.upload-panel summary{cursor:pointer;color:var(--blue);font-size:13px;font-weight:650}.advanced-filters[open]{display:grid;grid-template-columns:1fr 1fr;gap:12px}.advanced-filters[open] summary{grid-column:span 2}.card-description{margin:-5px 0 16px;color:var(--muted);font-size:14px}.sync-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.sync-actions form{margin:0}.sync-button{display:grid;width:100%;min-height:74px;padding:13px;border:1px solid var(--line);border-radius:16px;background:#fbfbfd;text-align:left}.sync-button span{font-size:14px;font-weight:720}.sync-button small{margin-top:5px;color:var(--muted);font-size:11px}.sync-button:hover{border-color:#9bcbff;background:#f5faff}.report-status{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.report-status span{display:flex;gap:6px;padding:6px 9px;border-radius:9px;background:#f5f5f7;color:var(--muted);font-size:11px}.report-status b{color:var(--text)}.upload-panel{margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}.upload-form{grid-template-columns:repeat(4,1fr);margin-top:15px}.table-card{padding-bottom:0;overflow:hidden}.table-wrap{overflow:auto;margin:0 -25px}table{width:100%;min-width:1800px;border-collapse:collapse;font-size:12px}th,td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}th{position:sticky;top:0;background:#fafafa;color:var(--muted);font-size:10px;font-weight:750;text-transform:uppercase;letter-spacing:.04em}tbody tr:hover{background:#fafcff}tfoot{background:#f3f8ff;font-weight:750}.empty{padding:36px;color:var(--muted);text-align:center}.management-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.compact-card{margin:0}.form-grid{grid-template-columns:1fr 1fr}.form-grid .secondary-button{width:max-content}.checkbox-label{display:flex;align-items:center;gap:8px}.checkbox-label input{width:16px;min-height:16px}.list{display:grid;gap:8px;margin-top:16px}.list-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-top:1px solid var(--line);color:#525256;font-size:12px}.text-button{padding:5px 0;background:transparent;color:var(--red);font-size:12px}.flash{margin:0 0 16px;padding:13px 15px;border-radius:14px;background:#eff8ff;color:#0066cc;font-size:14px;font-weight:600}.flash.error{background:#fff1f0;color:#c4322a}.flash.success{background:#effaf2;color:#27853e}dialog{width:min(500px,calc(100% - 32px));border:0;border-radius:24px;padding:25px;box-shadow:0 24px 80px rgba(0,0,0,.24)}dialog::backdrop{background:rgba(0,0,0,.35);backdrop-filter:blur(4px)}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.dialog-head h2{margin:0;font-size:24px}.icon-button{display:grid;width:36px;height:36px;place-items:center;padding:0;border-radius:50%;background:#f1f2f5;color:var(--text);font-size:18px;font-weight:650}dialog ol{display:grid;gap:12px;padding-left:20px;margin:0 0 22px;color:#46464a;font-size:14px;line-height:1.4}@media(max-width:760px){.page{width:min(100% - 20px,1200px);padding-top:18px}.hero-card,.card{border-radius:20px;padding:20px}.hero-card{min-height:220px}.hero-orb{right:-130px}.filter-form,.form-grid,.upload-form{grid-template-columns:1fr 1fr}.filter-form .primary-button{grid-column:span 2}.advanced-filters{grid-column:span 2}.sync-actions{grid-template-columns:1fr 1fr}.management-grid{grid-template-columns:1fr}.table-wrap{margin:0 -20px}}@media(max-width:420px){.filter-form,.form-grid,.upload-form{grid-template-columns:1fr}.filter-form .primary-button,.advanced-filters{grid-column:span 1}.advanced-filters[open]{grid-template-columns:1fr}.advanced-filters[open] summary{grid-column:span 1}}
 .app-header > a.secondary-button { margin-left: auto; background: #007aff; color: #fff; box-shadow: 0 8px 18px rgba(0,122,255,.2); }
 .app-header > a.secondary-button + a.secondary-button { margin-left: -5px; }
 .management-grid { display: none; }

/* Clear, touch-friendly navigation shared by the report and manual entry pages. */
.app-title { min-width: max-content; }
.app-mark { text-decoration: none; }
.app-nav { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.app-header > .app-nav { margin-left: auto; }
.app-header > a.secondary-button { margin-left: 0; }
.nav-button, .back-button, .help-button {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 48px;
    padding: 7px 12px;
    border: 1px solid #dce9f5;
    border-radius: 15px;
    background: #fff;
    color: var(--text);
    box-shadow: 0 5px 14px rgba(0, 0, 0, .05);
    font: inherit;
    text-align: left;
    text-decoration: none;
}
.nav-button:hover, .back-button:hover, .help-button:hover {
    border-color: #8ec8ff;
    background: #f4faff;
    transform: translateY(-1px);
}
.nav-button-icon {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 9px;
    background: #e5f3ff;
    color: var(--blue);
    font-size: 19px;
    font-weight: 500;
}
.nav-button b { display: block; font-size: 13px; line-height: 1.1; }
.nav-button small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; font-weight: 600; letter-spacing: 0; }
.nav-button.compact { min-width: 144px; }
.back-button { padding: 0 15px; border-color: transparent; background: #f1f2f5; box-shadow: none; font-size: 13px; font-weight: 700; }
.back-button span { font-size: 19px; font-weight: 400; }
.help-button { padding: 0 13px; border: 0; background: transparent; box-shadow: none; color: #57575c; font-size: 12px; font-weight: 700; }
.help-button span { display: grid; width: 23px; height: 23px; place-items: center; border-radius: 50%; background: #e9e9ee; color: #57575c; font-size: 14px; }

@media (max-width: 760px) {
    .app-header { align-items: flex-start; }
    .app-nav { flex-wrap: wrap; justify-content: flex-end; }
    .nav-button { min-height: 44px; }
    .nav-button small { display: none; }
}

@media (max-width: 560px) {
    .app-header { gap: 10px; }
    .app-title { min-width: 0; }
    .app-header h1 { font-size: 22px; }
    .app-nav { width: 100%; margin-left: 0; justify-content: stretch; }
    .nav-button, .back-button { flex: 1; justify-content: center; }
    .nav-button.compact { min-width: 0; }
    .help-button { padding: 0 8px; }
}

/* Manual entry pages use a calmer, denser layout for frequent data entry. */
.manual-intro { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:0 0 16px; padding:23px 25px; border:1px solid #dcecff; border-radius:22px; background:linear-gradient(120deg,#fff,#f1f8ff); }
.manual-intro h2 { margin:0 0 6px; font-size:26px; letter-spacing:-.04em; }
.manual-intro p:not(.section-kicker) { margin:0; color:var(--muted); font-size:14px; }
.entry-layout { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.entry-layout .card { margin:0; }
.entry-card { padding:22px; box-shadow:0 10px 28px rgba(0,0,0,.055); }
.entry-card .section-heading { margin-bottom:14px; }
.entry-card .section-heading h2 { font-size:20px; }
.entry-badge { display:grid; width:30px; height:30px; place-items:center; border-radius:10px; background:#e8f4ff; color:#0071e3; font-size:12px; font-weight:750; }
.entry-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
.entry-form .primary-button,.entry-form .secondary-button { width:100%; align-self:end; }
.quick-list { display:grid; gap:2px; margin-top:17px; border-top:1px solid var(--line); }
.quick-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); }
.quick-row b { display:block; font-size:13px; }
.quick-row small { display:block; margin-top:3px; color:var(--muted); font-size:11px; }
.compact-empty { padding:17px 0 0; text-align:left; }
.delete-icon { display:grid; width:31px; height:31px; place-items:center; border:1px solid #ffd8d5; border-radius:10px; background:#fff7f6; color:#e23830; font-size:21px; line-height:1; }
.entry-table-card { padding-bottom:0; overflow:hidden; }
.entry-table { min-width:1050px; font-size:12px; }
.entry-table th,.entry-table td { padding:10px 12px; vertical-align:middle; }
.entry-table input { min-width:105px; min-height:37px; padding:7px 9px; border-radius:9px; background:#fff; font-size:12px; }
.entry-table td:nth-child(4) input,.entry-table td:nth-child(5) input { min-width:160px; }
.entry-table .lot-total { color:#434348; font-variant-numeric:tabular-nums; font-weight:700; }
.type-pill { display:inline-block; padding:5px 7px; border-radius:7px; background:#e7f5ff; color:#006eb9; font-size:10px; font-weight:750; }
.type-pill.one-time { background:#f1f2f5; color:#626268; }
.row-actions { display:flex; gap:6px; }
.save-row,.delete-row { min-height:34px; padding:0 9px; border-radius:9px; font-size:11px; font-weight:700; }
.save-row { background:#e8f4ff; color:#006eb9; }
.delete-row { background:#fff1f0; color:#d6322b; }
.save-row:hover { background:#d3ebff; }
.delete-row:hover,.delete-icon:hover { background:#ffe1df; }

@media (max-width:760px) { .entry-layout { grid-template-columns:1fr; } .manual-intro { align-items:flex-start; flex-direction:column; } }
@media (max-width:560px) { .manual-intro { padding:20px; } .manual-intro h2 { font-size:23px; } .entry-form { grid-template-columns:1fr; } .entry-table-card { padding-left:20px; padding-right:20px; } }
.excel-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 18px;
    padding: 12px;
    border: 1px solid #cfe3f7;
    border-radius: 14px;
    background: #f5faff;
    color: #456278;
    font-size: 13px;
}

.excel-toolbar .primary-button,
.excel-toolbar .secondary-button { margin-left: auto; }
.excel-toolbar .secondary-button + .primary-button { margin-left: 0; }
.new-row-label { color: #7a8996; font-size: 12px; }

.excel-mode-launch { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0 0 18px; padding:14px 16px; border:1px solid #cfe4f7; border-radius:15px; background:#f6fbff; color:#587084; font-size:13px; }.excel-mode-launch div{display:grid;gap:3px}.excel-mode-launch strong{color:#193d5a;font-size:14px}.excel-mode-launch span{color:#587084}
.excel-sheet { margin:20px 0; padding:24px; border:1px solid #b9d9f5; border-radius:20px; background:#fff; box-shadow:0 12px 28px rgba(30,92,145,.09); }
.excel-sheet-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-bottom:18px; }
.excel-sheet-head h2 { margin:3px 0 5px; }.excel-sheet-head p:last-child { margin:0; color:#637b8e; font-size:13px; }
.excel-grid-toolbar{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}.excel-grid-toolbar span{padding:6px 9px;border-radius:8px;background:#f1f6fa;color:#587084;font-size:11px;font-weight:650}.excel-grid-toolbar span:first-child{background:#e6f3ff;color:#006eb9}.excel-grid { width:100%; min-width:850px; border-collapse:separate; border-spacing:0; }.excel-grid th { position:sticky;top:0;padding:11px; background:#eaf5ff; color:#315975; font-size:11px; text-transform:uppercase; text-align:left; }.excel-grid td { padding:0; border-right:1px solid #d9e5ef; border-bottom:1px solid #d9e5ef; }.excel-grid td:first-child{border-left:1px solid #d9e5ef}.excel-grid input { width:100%; min-width:110px; padding:10px; border:0; border-radius:0; background:#fff; }.excel-grid input:focus { outline:2px solid #007aff; outline-offset:-2px; background:#f6fbff; }.excel-grid tr:hover input{background:#fcfeff}.excel-lot-total{padding:10px!important;background:#f7fbff;color:#1f4c6b;font-variant-numeric:tabular-nums;font-weight:750}.excel-delete-cell{width:42px;text-align:center}.excel-delete{width:28px;height:28px;border-radius:8px;background:transparent;color:#9a5660;font-size:20px;line-height:1}.excel-delete:hover{background:#fff0ef;color:#d6322b}
.excel-sheet-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:16px; }
@media (max-width:560px) { .excel-mode-launch, .excel-sheet-actions { align-items:stretch; flex-direction:column; } }

/* One data set, two views: a compact form grid and an Excel-like work sheet. */
.sheet-controls { display:flex; align-items:end; flex-wrap:wrap; gap:12px; margin:-4px 0 18px; padding:13px; border:1px solid #d7e7f6; border-radius:16px; background:linear-gradient(120deg,#f8fcff,#f2f7fc); }
.view-switch { display:flex; padding:3px; border-radius:11px; background:#e9eef4; }
.view-switch button { min-height:32px; padding:0 11px; border-radius:8px; background:transparent; color:#5d6670; font-size:12px; font-weight:700; }
.view-switch button.is-active { background:#fff; color:#006dcc; box-shadow:0 2px 5px rgba(20,57,89,.12); }
.date-filter { display:flex; align-items:end; flex-wrap:wrap; gap:7px; }
.date-filter label { gap:4px; font-size:10px; }
.date-filter input { min-height:34px; width:132px; padding:5px 8px; border-radius:8px; font-size:12px; }
.date-filter span { padding-bottom:9px; color:#8b98a4; font-size:11px; }
.filter-reset { min-height:34px; padding:0 6px; background:transparent; color:#007aff; font-size:11px; font-weight:700; }
.sheet-actions { display:flex; align-items:center; gap:8px; margin-left:auto; }
.sheet-actions [data-count] { color:#697886; font-size:11px; font-weight:650; white-space:nowrap; }
.sheet-actions .primary-button,.sheet-actions .secondary-button { min-height:36px; padding:0 12px; font-size:12px; }
.excel-view { margin:0 -25px; }
.excel-view .excel-hint { margin:0 25px 10px; color:#587084; font-size:12px; }
.excel-view .table-wrap { margin:0; }
.excel-grid { min-width:1040px; }
.excel-grid td.is-selected { background:#dcefff; box-shadow:inset 0 0 0 1px #007aff; }
.excel-grid td.is-selected input { background:#eaf6ff; }
@media (max-width:760px) { .sheet-controls { align-items:stretch; } .sheet-actions { width:100%; margin-left:0; justify-content:flex-end; } .date-filter input { width:120px; } }
@media (max-width:560px) { .sheet-controls,.date-filter { display:grid; grid-template-columns:1fr 1fr; } .view-switch,.sheet-actions { grid-column:span 2; } .date-filter span { display:none; } .date-filter input { width:100%; } .filter-reset { text-align:left; } }
