@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

:root { --lime:#c8e600; --ink:#151710; --paper:#f4f6ef; --white:#fff; --line:#e1e5d9; --muted:#72796b; --warning:#edbd32; --danger:#e15d4d; }
* { box-sizing:border-box; } body { margin:0; background:var(--paper); color:var(--ink); font-family:'DM Sans',Arial,sans-serif; }
.login-screen { position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 75% 15%,#4b5520 0,#171912 37%,#10110e 100%); }.login-card { width:min(420px,100%);padding:38px;border-radius:15px;background:#fff;box-shadow:0 28px 70px #0008;display:grid;gap:16px; }.login-card img { width:220px;height:105px;object-fit:contain;object-position:center;margin:0 auto 5px;border-radius:7px;filter:drop-shadow(0 2px 2px #0002); }.login-card h1 { font-size:29px; }.login-card>p:not(.eyebrow):not(.login-error) { margin:-7px 0 5px;color:var(--muted);font-size:13px; }.login-card .primary-button { margin-top:2px; }.login-error { min-height:18px;margin:-6px 0 0;color:#c34636;font-size:12px;line-height:1.4; }.auth-pending .app-shell,.unauthenticated .app-shell { display:none; }.authenticated .login-screen { display:none; }.user-menu { margin-top:10px;padding:13px 12px 4px;border-top:1px solid #31342c;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:#c7cbc0; }.user-menu button { border:0;background:transparent;color:var(--lime);padding:4px 0;cursor:pointer;font:700 10px 'DM Sans'; }.api-message { min-height:16px;margin:0;font-size:12px; }.api-message.error { color:#c34636; }.api-message.success { color:#668000; }.user-active { color:#668000;background:#edf4ca;border-radius:9px;padding:4px 8px;font-size:10px;font-weight:700; }
.app-shell { min-height:100vh; } .sidebar { position:fixed; inset:0 auto 0 0; z-index:2; width:260px; padding:26px 17px; color:#fff; background:#141610; display:flex; flex-direction:column; }
.brand { display:flex;justify-content:center;align-items:center;height:108px;margin:0 0 35px; } .brand img { width:218px;height:104px;object-fit:contain;object-position:center; } .brand-mark,.brand strong,.brand small { display:none; }
.main-nav { display:grid; gap:7px; }.nav-link { width:100%; border:0; background:transparent; color:#abb0a4; border-radius:8px; padding:13px 14px; text-align:left; cursor:pointer; font:600 14px 'DM Sans'; transition:.2s; }.nav-link span { width:25px; display:inline-block; color:#b6bdac; font-size:17px; }.nav-link:hover,.nav-link.active { color:#fff; background:#2b2e25; }.nav-link.active span { color:var(--lime); }.nav-link b { float:right; border-radius:10px; padding:1px 7px; background:#424638; color:var(--lime); font-size:11px; }.sidebar-note { margin-top:auto; padding:12px; color:#969b90; font-size:11px; line-height:1.6; }.pulse { width:7px; height:7px; display:inline-block; background:var(--lime); border-radius:50%; margin-right:6px; }
.main-content { margin-left:260px; padding:35px min(6vw,90px); max-width:1700px; }.topbar,.section-heading,.panel-heading,.modal-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; }.topbar { margin-bottom:30px; }.eyebrow { color:var(--muted); font-size:10px; letter-spacing:1.6px; font-weight:700; margin:0 0 5px; }.lime { color:#799000; } h1,h2,h3 { margin:0; font-family:'Space Grotesk','DM Sans',sans-serif; letter-spacing:-1px; } h1 { font-size:30px; } h2 { font-size:30px; } h3 { font-size:18px; }.section-heading { margin-bottom:25px; }.section-heading p:not(.eyebrow) { margin:8px 0 0; color:var(--muted); font-size:14px; }
.primary-button,.secondary-button,.print-button,.text-button { border:0; border-radius:7px; padding:12px 17px; cursor:pointer; font:700 13px 'DM Sans'; }.primary-button { color:#1b1e14; background:var(--lime); box-shadow:0 7px 15px #b5cd0040; }.primary-button:hover { background:#daf900; }.secondary-button { color:#3d4338; background:#fff; border:1px solid var(--line); }.text-button { padding:7px; color:#718900; background:transparent; }.view { display:none; }.view.active { display:block; }
.intro-card { min-height:225px; padding:38px 42px; border-radius:14px; color:white; background:#171912; overflow:hidden; display:flex; align-items:center; }.intro-card h2 { font-size:33px; line-height:1.14; }.intro-card h2 em { color:var(--lime); font-style:normal; }.intro-card p:not(.eyebrow) { max-width:440px; color:#b9bfb1; font-size:14px; line-height:1.6; }.gekko-orbit { position:relative; width:250px; height:165px; margin-left:auto; }.gekko-orbit:before,.gekko-orbit:after { content:''; position:absolute; border:12px solid var(--lime); border-color:var(--lime) transparent transparent var(--lime); border-radius:50%; transform:rotate(25deg); }.gekko-orbit:before { width:235px;height:110px;top:28px;left:0; }.gekko-orbit:after { width:177px;height:82px;top:65px;left:25px; }.gekko-orbit span { position:absolute;top:2px;right:30px;color:var(--lime);font-size:52px; }.gekko-orbit i,.gekko-orbit b { position:absolute;width:9px;height:9px;border-radius:50%;background:#fff;top:40px;right:41px; }.gekko-orbit b { width:6px;height:6px;top:80px;right:79px; }
.stat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:20px 0; }.stat-grid article,.panel { background:#fff; border:1px solid var(--line); border-radius:11px; }.stat-grid article { padding:20px 22px; }.stat-grid span { color:var(--muted);font-size:13px; }.stat-grid strong { display:block; margin:7px 0 1px; font:700 35px 'Space Grotesk'; }.stat-grid small { color:#899083;font-size:11px; }.warning-stat { border-left:4px solid var(--warning)!important; }.danger-stat { border-left:4px solid var(--danger)!important; }.panel { padding:23px; }.recent-panel { margin-top:25px; }.work-list { margin-top:15px; }.work-item { display:grid; grid-template-columns:10px 1.25fr 1.35fr 120px 105px; gap:14px; align-items:center; padding:14px 6px; border-top:1px solid var(--line); font-size:13px; }.work-status { width:8px;height:8px;border-radius:50%;background:#b7bdb1; }.work-status.warning { background:var(--warning); }.work-status.urgent { background:var(--danger); }.work-main strong,.work-title { display:block;font-size:14px; }.work-main small,.work-sub { display:block;margin-top:3px;color:var(--muted);font-size:12px; }.age-label { color:var(--muted);font-size:11px; }.work-actions { display:flex;gap:6px;justify-content:flex-end; }.icon-button { border:1px solid var(--line); background:#fff;border-radius:5px;padding:5px 7px;color:#4f5748;cursor:pointer; }.icon-button:hover { background:#f5f9e4;border-color:#a6c000; }
.status-label { display:inline-block;margin-top:6px;padding:3px 7px;border-radius:9px;background:#eef4d2;color:#647600;font-size:10px;font-weight:700; }.status-label.closed { background:#e8ece5;color:#667064; }.status-date-hint { color:var(--muted);font-size:10px;font-weight:500; }
.task-panel { max-width:850px; }.task-entry { display:flex;gap:10px;padding-bottom:17px;border-bottom:1px solid var(--line); }.task-entry input { min-width:0; }.task-list { display:grid; }.task-item { display:flex;align-items:center;gap:11px;padding:14px 2px;border-bottom:1px solid var(--line);font-size:14px; }.task-item input { width:19px;height:19px;accent-color:#9db700; }.task-item span { flex:1; }.task-item.done span { color:#8a9283;text-decoration:line-through; }.task-item .icon-button { opacity:.7; }
.toolbar { display:flex;align-items:center;justify-content:space-between;margin-bottom:15px; }.search-wrap { width:320px;padding:9px 12px;background:#fff;border:1px solid var(--line);border-radius:7px;color:#77806f; }.search-wrap input { border:0;outline:0;width:270px;font:13px 'DM Sans'; }.legend { display:flex;align-items:center;gap:6px;color:var(--muted);font-size:11px; }.yellow-dot,.red-dot { width:8px;height:8px;border-radius:50%;background:var(--warning);margin-left:8px; }.red-dot { background:var(--danger); }.table-panel { padding:7px 22px; }.full-list { margin:0; }
.calculator-grid { display:grid;grid-template-columns:minmax(420px,1.35fr) minmax(300px,.7fr);gap:20px; }.calc-form { display:grid;gap:18px; }.vat-pill { color:#687800;background:#eff5c9;border-radius:10px;padding:4px 9px;font-size:10px;font-weight:700; } label { display:grid;gap:7px;color:#42483d;font-size:12px;font-weight:700; } input,select,textarea { width:100%;padding:11px 12px;color:var(--ink);font:14px 'DM Sans';background:#fff;border:1px solid #dbe1d3;border-radius:6px;resize:vertical; } input:focus,select:focus,textarea:focus { outline:2px solid #d9ed87;border-color:#a9c400; }.two-col { display:grid;grid-template-columns:1fr 1fr;gap:16px; }.calc-form hr { width:100%;margin:0;border:0;border-top:1px solid var(--line); }.total-card { padding:27px;background:#181a13;color:#fff;border-radius:11px; }.total-card h3 { margin-bottom:25px; }.cost-line,.total-line { display:flex;justify-content:space-between;padding:14px 0;color:#c5cabd;border-bottom:1px solid #393c32;font-size:13px; }.cost-line strong { color:#fff; }.total-line { border:0;align-items:end;color:#fff;margin-top:7px; }.total-line strong { color:var(--lime);font:700 25px 'Space Grotesk'; }.print-button { width:100%;margin-top:22px;color:#fff;background:#32352b; }.saved-calcs { margin-top:20px; }.saved-list { margin-top:15px; }.saved-row { display:flex;justify-content:space-between;align-items:center;padding:13px 3px;border-top:1px solid var(--line);font-size:13px; }.saved-row strong { display:block; }.saved-row small { display:block;color:var(--muted);margin-top:3px; }.materials-layout { display:grid;grid-template-columns:340px 1fr;gap:20px; }.material-form { display:grid;gap:16px;align-content:start; }
.line-section { padding:17px; border:1px solid var(--line); border-radius:9px; background:#fbfcf8; }.line-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }.line-section-heading strong { display:block;font-size:13px; }.line-section-heading small { color:var(--muted);font-size:11px; }.add-line-button { border:1px solid #b4ce18;background:#f5facf;color:#536300;border-radius:5px;padding:7px 9px;cursor:pointer;font:700 11px 'DM Sans'; }.add-line-button:disabled { cursor:not-allowed;opacity:.45; }.calculation-lines { display:grid;gap:10px; }.calc-line { display:grid;grid-template-columns:minmax(170px,1.5fr) 95px 120px 30px;gap:9px;align-items:end; }.calc-line label { font-size:10px;gap:4px; }.calc-line input,.calc-line select { padding:9px 9px;font-size:12px; }.remove-line { border:0;border-radius:5px;background:#fff0ed;color:#c94b3c;height:35px;cursor:pointer;font-size:17px; }.remove-line:disabled { opacity:.25;cursor:not-allowed; }
.subnav-link { margin-left:12px;width:calc(100% - 12px);font-size:12px;padding-top:9px;padding-bottom:9px; }.custom-calculator-grid { max-width:1050px; }.margin-control { display:flex;align-items:center;justify-content:space-between;margin-top:4px; }.margin-control strong { display:block;font-size:14px; }.margin-control small { display:block;margin-top:4px;color:var(--muted);font-size:11px; }.margin-control output { padding:8px 12px;border-radius:6px;background:#eef5c8;color:#5c6d00;font:700 18px 'Space Grotesk'; }.custom-calculator-grid input[type=range] { accent-color:#a6c600;padding:0; }.margin-steps { display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-top:-11px; }
dialog { width:calc(100% - 32px);max-width:700px;padding:0;border:0;border-radius:13px;box-shadow:0 25px 70px #0005; } dialog::backdrop { background:#10120dbb; }.worksheet-form { padding:27px; }.modal-heading { margin-bottom:25px; }.close-button { width:31px;height:31px;border:0;border-radius:50%;background:#eef0e9;font-size:23px;line-height:1;cursor:pointer; }.form-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px; }.wide { grid-column:1 / -1; }.modal-actions { display:flex;justify-content:flex-end;gap:10px;margin-top:25px; }
.preview-dialog { padding:28px; }.preview-dialog .modal-heading { border-bottom:1px solid var(--line);padding-bottom:18px; }.preview-grid { display:grid;grid-template-columns:1fr 1fr;gap:17px 30px;margin:20px 0; }.preview-field { padding-bottom:9px;border-bottom:1px solid var(--line);font-size:14px; }.preview-field span,.preview-note-label { display:block;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.9px;text-transform:uppercase;margin-bottom:5px; }.preview-note { padding:14px;background:#f7f9f1;border-radius:7px;white-space:pre-wrap;line-height:1.55;font-size:13px; }.preview-table { width:100%;border-collapse:collapse;font-size:13px;margin:8px 0 19px; }.preview-table td { padding:10px 5px;border-bottom:1px solid var(--line); }.preview-table td:last-child { text-align:right;font-weight:700; }.preview-table .subtotal td { background:#f5f8e5;font-size:12px; }.preview-table .gross td { padding-top:15px;border-top:3px solid var(--lime);font-size:17px; }.preview-actions { display:flex;justify-content:flex-end;gap:9px;margin-top:23px; }
.calendar-panel { margin-top:25px; }.calendar-actions { display:flex;gap:7px;align-items:center; }.calendar-actions .primary-button { padding:9px 12px; }.calendar-title { margin:22px 0 12px;font:700 20px 'Space Grotesk';text-transform:capitalize; }.calendar-weekdays,.calendar-grid { display:grid;grid-template-columns:repeat(7,1fr); }.calendar-weekdays span { padding:7px;color:var(--muted);font-size:10px;font-weight:700;text-align:center;text-transform:uppercase; }.calendar-day { position:relative;min-height:72px;padding:8px;border:1px solid #edf0e8;background:#fff;color:var(--ink);cursor:pointer;text-align:left;font:600 12px 'DM Sans'; }.calendar-day:hover { background:#f6fbe0; }.calendar-day.outside { color:#b8bdb3;background:#fafbf8; }.calendar-day.today { box-shadow:inset 0 0 0 2px var(--lime); }.calendar-day.has-events:after { content:'';position:absolute;left:8px;bottom:8px;width:6px;height:6px;border-radius:50%;background:#92ab00; }.calendar-event-preview { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:7px;color:#576500;font-size:10px; }.calendar-hint { margin:12px 0 0;color:var(--muted);font-size:11px; }.hidden-field { display:none; }.quick-note-button { position:fixed;right:25px;bottom:25px;z-index:3;display:flex;align-items:center;gap:9px;border:0;border-radius:24px;padding:13px 17px;background:var(--lime);color:#1a1e11;box-shadow:0 8px 25px #788d0070;cursor:pointer;font:700 13px 'DM Sans'; }.quick-note-button:hover { background:#d9f900;transform:translateY(-1px); }.quick-note-button:first-letter { font-size:19px; }.notes-dialog { padding:28px;width:min(520px,calc(100vw - 32px)); }.notes-dialog p { color:var(--muted);font-size:12px;margin:0 0 15px; }.notes-dialog textarea { min-height:290px;line-height:1.55; }
.danger-button { border:0;border-radius:7px;padding:12px 14px;background:#fff0ed;color:#bd4234;font:700 13px 'DM Sans';cursor:pointer;margin-right:auto; }.day-events { display:grid;gap:9px;margin:4px 0 18px; }.day-event { width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:left;border:1px solid var(--line);border-left:4px solid var(--lime);background:#fbfcf8;padding:12px;border-radius:7px;cursor:pointer;font:600 13px 'DM Sans'; }.day-event small { display:block;margin-top:3px;color:var(--muted);font-size:11px;font-weight:400; }.full-button { width:100%; }
.session-timer { position:fixed;left:18px;bottom:16px;z-index:4;display:flex;align-items:center;gap:8px;padding:8px 11px;border-radius:8px;background:#24271f;color:#fff;box-shadow:0 5px 14px #0003;font-size:17px; }.session-timer div { display:grid;gap:1px; }.session-timer small { color:#b8c0aa;font-size:9px;line-height:1; }.session-timer strong { color:var(--lime);font:700 15px 'Space Grotesk';letter-spacing:.5px; }.auth-pending .session-timer,.unauthenticated .session-timer { display:none; }
@media (max-width:900px) { .sidebar { width:68px;padding:25px 8px; }.brand { height:55px;margin:0 0 35px; }.brand img { width:50px;height:52px;object-fit:cover;object-position:left; }.nav-link { padding:12px 3px;text-align:center;font-size:0; }.nav-link span { width:auto;font-size:19px; }.nav-link b,.sidebar-note { display:none; }.main-content { margin-left:68px; }.calculator-grid,.materials-layout { grid-template-columns:1fr; }.gekko-orbit { display:none; } }
@media (max-width:620px) { .main-content { padding:22px 14px;margin-left:68px; }.topbar,.section-heading { align-items:flex-start; }.topbar .primary-button { padding:13px 10px; }.intro-card { min-height:185px;padding:27px; }.intro-card h2 { font-size:28px; }.stat-grid,.two-col,.form-grid,.preview-grid { grid-template-columns:1fr; }.wide { grid-column:auto; }.work-item { grid-template-columns:8px 1fr auto;gap:10px; }.work-title,.age-label { display:none; }.toolbar { align-items:stretch;flex-direction:column;gap:9px; }.search-wrap { width:100%; }.search-wrap input { width:88%; }.legend { justify-content:flex-end; }.calc-line { grid-template-columns:1fr 1fr 30px; }.calc-line label:first-child { grid-column:1/-1; }.calendar-day { min-height:52px;padding:5px;font-size:10px; }.calendar-event-preview { display:none; }.calendar-actions .primary-button { font-size:0;padding:10px; }.calendar-actions .primary-button:first-letter { font-size:15px; }.quick-note-button { right:15px;bottom:16px;padding:13px; }.quick-note-button span { display:none; } }
@media (max-width:700px) { body { padding-bottom:78px; }.sidebar { position:fixed;inset:auto 0 0;width:100%;height:72px;padding:7px 5px;background:#141610;border-top:1px solid #33372d;display:block;overflow-x:auto; }.brand,.sidebar-note,.user-menu { display:none; }.main-nav { width:max-content;min-width:100%;display:flex;gap:2px;justify-content:space-around; }.nav-link,.subnav-link { width:58px;min-width:58px;margin:0;padding:7px 2px 5px;text-align:center;font-size:0;border-radius:7px; }.nav-link span { width:auto;font-size:19px;line-height:22px; }.nav-link.active:after { content:'';display:block;width:4px;height:4px;border-radius:50%;background:var(--lime);margin:3px auto 0; }.nav-link b { display:none; }.main-content { width:100%;margin:0;padding:18px 14px 18px; }.topbar { margin-bottom:20px; }.topbar h1 { font-size:23px; }.topbar .eyebrow { max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }.topbar .primary-button { padding:11px 12px;font-size:12px;white-space:nowrap; }.section-heading { margin-bottom:18px; }.section-heading h2 { font-size:24px; }.section-heading p:not(.eyebrow) { font-size:13px;line-height:1.45; }.intro-card { min-height:auto;padding:25px 22px;border-radius:12px; }.intro-card h2 { font-size:27px; }.intro-card p:not(.eyebrow) { margin-bottom:0; }.stat-grid { gap:10px;margin:12px 0;grid-template-columns:repeat(3,1fr); }.stat-grid article { padding:14px 12px; }.stat-grid span { font-size:10px;line-height:1.2;display:block; }.stat-grid strong { font-size:27px;margin-top:5px; }.stat-grid small { display:none; }.panel { padding:17px; }.panel-heading { align-items:flex-start; }.recent-panel,.calendar-panel { margin-top:16px; }.work-list { margin-top:9px; }.work-item { grid-template-columns:8px minmax(0,1fr) auto;gap:8px;padding:13px 1px; }.work-main { grid-column:2;grid-row:1; }.work-title { display:block;grid-column:2;grid-row:2;font-size:13px; }.work-title .work-sub { display:none; }.age-label { display:block;grid-column:2;grid-row:3;font-size:10px; }.work-actions { grid-column:3;grid-row:1 / span 3;flex-wrap:wrap;justify-content:flex-end;max-width:66px; }.icon-button { padding:5px 6px; }.toolbar { align-items:stretch;flex-direction:column;gap:9px; }.search-wrap { width:100%; }.search-wrap input { width:88%; }.legend { justify-content:flex-end; }.calculator-grid { grid-template-columns:1fr;gap:14px; }.calc-form,.total-card { padding:18px; }.line-section { padding:13px; }.line-section-heading { align-items:flex-start; }.line-section-heading .add-line-button { white-space:nowrap; }.calc-line { grid-template-columns:1fr 1fr 28px;gap:7px; }.calc-line label:first-child { grid-column:1/-1; }.calc-line input,.calc-line select { min-height:38px; }.total-card h3 { margin-bottom:13px; }.total-line strong { font-size:22px; }.materials-layout { grid-template-columns:1fr;gap:14px; }.saved-row { gap:10px;align-items:flex-start; }.saved-row>div:last-child { white-space:nowrap; }.calendar-panel { padding:15px; }.calendar-actions { gap:4px; }.calendar-actions .primary-button { padding:9px;font-size:0; }.calendar-actions .primary-button:first-letter { font-size:16px; }.calendar-title { margin:17px 0 8px;font-size:17px; }.calendar-weekdays span { padding:5px 1px;font-size:9px; }.calendar-day { min-height:48px;padding:5px 4px;font-size:10px; }.calendar-event-preview { display:none; }.calendar-hint { font-size:10px;line-height:1.4; }.quick-note-button { right:14px;bottom:87px;padding:13px;border-radius:50%;width:48px;height:48px;justify-content:center; }.quick-note-button span { display:none; }.worksheet-form,.preview-dialog,.notes-dialog { padding:20px; }.modal-heading { margin-bottom:18px; }.modal-actions { position:sticky;bottom:-20px;background:#fff;padding-top:12px;margin-top:18px; }.notes-dialog { width:calc(100vw - 22px); }.login-screen { padding:16px; }.login-card { padding:27px 22px;gap:14px;border-radius:13px; }.login-card img { width:190px;height:88px; }.login-card h1 { font-size:26px; } }
@media (max-width:375px) { body { padding-bottom:68px; }.sidebar { height:62px;padding:5px 3px; }.nav-link,.subnav-link { width:49px;min-width:49px;padding:5px 1px; }.nav-link span { font-size:17px; }.main-content { padding:14px 11px; }.topbar h1 { font-size:21px; }.topbar .primary-button { padding:10px 9px;font-size:11px; }.intro-card { padding:21px 18px; }.intro-card h2 { font-size:24px; }.stat-grid { gap:7px; }.stat-grid article { padding:12px 8px; }.stat-grid strong { font-size:24px; }.panel { padding:14px; }.calendar-day { min-height:42px;font-size:9px; }.quick-note-button { bottom:75px;right:11px;width:44px;height:44px; }.worksheet-form,.preview-dialog,.notes-dialog { padding:16px; }.close-button { width:28px;height:28px; }.day-event { padding:10px; } }
@media (max-width:700px) { .session-timer { left:11px;bottom:83px;padding:7px 9px; } } @media (max-width:375px) { .session-timer { left:9px;bottom:72px;padding:6px 8px; }.session-timer small { font-size:8px; }.session-timer strong { font-size:13px; } }
@media (max-width:700px) { .task-entry { align-items:stretch;flex-direction:column; }.task-entry .primary-button { width:100%; }.task-item { padding:14px 0; } }