:root{color-scheme:light;--ink:#182438;--muted:#57677d;--blue:#1764d8;--light:#eef5ff;--border:#dce5f1;--bg:#f6f8fc;--white:#fff;--green:#127a56}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
a{color:#1457b8;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #4d91fa;outline-offset:2px}
.skip{position:absolute;top:-5em;left:1em;background:#fff;z-index:9;padding:10px 16px}
.skip:focus{top:1em}
.shell{max-width:1110px;margin:auto;padding:0 22px}
.topbar{background:var(--white);border-bottom:1px solid var(--border)}
.topbar .shell{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px}
.brand{text-decoration:none;font-size:19px;font-weight:850;letter-spacing:-.4px;color:#17365f}
.brand-mark{display:inline-grid;place-items:center;width:31px;height:31px;border-radius:9px;color:white;background:var(--blue);margin-right:7px;font-weight:800}
.nav{display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-size:14px;font-weight:650}
.nav a{text-decoration:none;color:#34445c}
.nav a:hover,.nav a[aria-current="page"]{color:var(--blue)}
.hero{padding:58px 0 29px}
.eyebrow{font-size:12px;font-weight:800;color:#1460c7;text-transform:uppercase;letter-spacing:.12em}
h1{font-size:clamp(32px,4vw,51px);line-height:1.15;letter-spacing:-.04em;margin:10px 0 14px}
h2{font-size:24px;line-height:1.25;letter-spacing:-.02em}
h3{font-size:18px;line-height:1.3;margin:0 0 8px}
.lead{font-size:18px;max-width:740px;color:var(--muted);line-height:1.75}
.note{font-size:13px;color:var(--muted)}
.navcrumb{font-size:13px;color:var(--muted);margin:24px 0 0}
.navcrumb a{color:#315e96}
.hero-short{padding:16px 0 26px}
.hero-short h1{font-size:clamp(29px,3.7vw,42px)}
.badges{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}
.pill{border:1px solid #cadcf3;background:#eaf3ff;border-radius:999px;padding:6px 12px;color:#255d9c;font-size:12px;font-weight:700}
.tool-section{margin:22px 0 46px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:16px}
.section-head p{margin:0;color:var(--muted);font-size:14px}
.category-title{margin:38px 0 15px}
.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.tool-card{background:var(--white);border:1px solid var(--border);border-radius:16px;padding:22px;min-height:163px;text-decoration:none;color:var(--ink);box-shadow:0 6px 20px #16325305;transition:transform .12s,border-color .12s}
.tool-card:hover{transform:translateY(-2px);border-color:#a3c7f7;text-decoration:none}
.card-icon{display:inline-grid;place-items:center;background:#e9f2ff;border-radius:10px;width:35px;height:35px;font-size:19px;margin-bottom:12px}
.tool-card h3{font-size:18px;margin:0 0 5px}
.tool-card p{margin:0;color:var(--muted);font-size:14px}
.highlights{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:42px 0}
.highlight{border:1px solid var(--border);border-radius:14px;padding:19px;background:white}
.highlight strong{display:block}
.highlight span{color:var(--muted);font-size:13px}
.columns{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start}
.paper{border:1px solid var(--border);background:white;border-radius:18px;padding:26px;box-shadow:0 8px 30px #1b3e7008}
.side-panel{background:#fafdff;border:1px solid var(--border);border-radius:16px;padding:21px}
.side-panel h2{font-size:18px;margin:0 0 10px}
.side-panel ul{padding-left:19px;margin:0}
.side-panel li{margin:9px 0;font-size:14px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.field{display:block;margin:0 0 17px}
.field>span,.field>label{display:block;font-size:13px;font-weight:750;margin-bottom:7px}
input:not([type="checkbox"]),select,textarea{width:100%;border:1px solid #becce0;border-radius:10px;padding:12px;background:#fff;color:var(--ink);font:inherit;min-height:47px}
input[type="checkbox"]{accent-color:var(--blue);width:18px;height:18px;vertical-align:middle;margin:0 6px 0 0}
textarea{min-height:130px;resize:vertical}
.controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:8px}
.button{display:inline-block;cursor:pointer;background:var(--blue);border:1px solid var(--blue);border-radius:10px;color:white;font:inherit;font-weight:800;padding:12px 18px;min-height:46px;text-decoration:none}
.button:hover{background:#0b4fbd}
.button.secondary{background:white;color:var(--blue);border-color:#a3c2e7}
.button.secondary:hover{background:#ecf5ff}
.button:disabled{cursor:not-allowed;opacity:.45}
.result{background:var(--light);border:1px solid #c9ddfa;padding:20px;border-radius:14px;margin-top:20px}
.result-label{color:#3f5b82;font-size:13px;font-weight:750;margin:0}
.result-main{display:block;font-size:clamp(24px,3.3vw,35px);line-height:1.3;letter-spacing:-.02em;margin:5px 0}
.result-note{margin:7px 0 0;font-size:14px;color:#36516f}
.details{white-space:pre-line;font-size:13px;color:#36516f;margin:12px 0 0;border-top:1px solid #d2e3f7;padding-top:12px}
.error{border-left:3px solid #d22;color:#a52222;background:#fff4f3;padding:12px;margin:15px 0 0}
.example,.faq,.method{margin-top:26px}
.example h2,.faq h2,.method h2{font-size:21px}
.example p,.faq p,.method p{font-size:15px;color:#516078}
.faq-item{border-top:1px solid var(--border);padding-top:12px;margin-top:12px}
.faq-item h3{font-size:16px}
.muted-box{background:#f8fafc;border-left:3px solid #6aa5ed;padding:12px 16px;font-size:14px;color:#4d6078}
.checkbox-row{display:block;font-size:14px;font-weight:650;margin:8px 0 16px}
.table-scroll{overflow-x:auto;overscroll-behavior-x:contain;border:1px solid var(--border);border-radius:12px}
.timecard{border-collapse:collapse;width:100%;min-width:600px}
.timecard th,.timecard td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--border);font-size:13px}
.timecard th{background:#f4f7fb}
.timecard th:first-child,.timecard td:first-child{padding-left:13px;min-width:88px}
.timecard tr:last-child td{border-bottom:0}
.timecard input:not([type="checkbox"]){padding:6px;min-height:38px;font-size:13px;min-width:90px}
.timecard .break-field{min-width:68px;width:75px}
.compact{font-size:14px}
.related{margin:33px 0}
.related ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;list-style:none;padding:0}
.related a{display:block;background:#fff;border:1px solid var(--border);padding:12px 15px;border-radius:10px;text-decoration:none;font-size:14px;font-weight:650}
.related a:hover{border-color:#97bde9}
.bottom{margin-top:56px;background:#fff;border-top:1px solid var(--border);padding:33px 0 40px}
.footer-grid{display:flex;justify-content:space-between;gap:22px;flex-wrap:wrap}
.footer-links{display:flex;gap:14px;flex-wrap:wrap;font-size:13px}
.bottom p{color:var(--muted);font-size:13px;margin:4px 0}
.email-img{display:block;max-width:380px;width:100%;height:auto;margin:14px 0}
.prose{max-width:770px;margin:40px auto 70px;background:#fff;border:1px solid var(--border);border-radius:18px;padding:30px}
.prose h1{font-size:39px}
.prose h2{font-size:22px;margin-top:27px}
.prose p,.prose li{color:#4c5e74}
@media(max-width:900px){.columns{grid-template-columns:1fr}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.highlights{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.shell{padding:0 15px}.topbar .shell{align-items:flex-start;flex-direction:column;gap:4px;padding-top:14px;padding-bottom:14px}.nav{gap:13px}.hero{padding:38px 0 18px}.lead{font-size:16px}.card-grid,.highlights,.form-grid,.related ul{grid-template-columns:1fr}.tool-card{min-height:120px}.paper{padding:18px}.section-head{display:block}.prose{padding:20px;margin:20px 0 45px}.prose h1{font-size:32px}}
@media print{.topbar,.bottom,.navcrumb,.related,.side-panel,.controls,.faq,.method,.example{display:none!important}body{background:#fff}.paper{box-shadow:none;border:0;padding:0}.shell{max-width:none}.columns{display:block}h1{font-size:26px}.result{border:1px solid #555}}

/* Light/Dark/System tokens (Auto uses the current OS color preference). */
:root{--tone-surface-alt:#fafdff;--tone-link:#1457b8;--tone-brand:#17365f;--tone-nav:#34445c;--tone-eyebrow:#1460c7;--tone-pill-bg:#eaf3ff;--tone-pill-border:#cadcf3;--tone-pill-text:#255d9c;--tone-icon-bg:#e9f2ff;--tone-icon-color:#2563eb;--tone-field-bg:#ffffff;--tone-field-border:#becce0;--tone-hover-border:#a3c7f7;--tone-text-soft:#516078;--tone-note-bg:#f8fafc;--tone-note-text:#4d6078;--tone-table-bg:#f4f7fb;--tone-border-result:#c9ddfa;--tone-result-text:#36516f;--tone-result-label:#3f5b82;--tone-error-bg:#fff4f3;--tone-error-text:#a52222;--tone-soft-button-bg:#ecf5ff;--tone-shadow:0 8px 30px #1b3e7008;}
:root[data-theme="light"]{color-scheme:light}
:root[data-theme="dark"]{color-scheme:dark;--ink:#eaf1fc;--muted:#a7b9d0;--blue:#2d72df;--light:#1b3554;--border:#32465d;--bg:#0b1320;--white:#172335;--green:#5ed9a2;--tone-surface-alt:#162638;--tone-link:#a6ceff;--tone-brand:#e5f0ff;--tone-nav:#d6e4f4;--tone-eyebrow:#a9caff;--tone-pill-bg:#1e3755;--tone-pill-border:#355b81;--tone-pill-text:#b7d4fa;--tone-icon-bg:#263d5e;--tone-icon-color:#b8d5ff;--tone-field-bg:#111d2c;--tone-field-border:#45617b;--tone-hover-border:#75a9eb;--tone-text-soft:#bdcce0;--tone-note-bg:#192c42;--tone-note-text:#c4d4e8;--tone-table-bg:#1e3045;--tone-border-result:#355b81;--tone-result-text:#c8e1ff;--tone-result-label:#abc9eb;--tone-error-bg:#40252c;--tone-error-text:#ffd0d4;--tone-soft-button-bg:#263e59;--tone-shadow:0 8px 30px #00000025;}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]):not([data-theme="dark"]){color-scheme:dark;--ink:#eaf1fc;--muted:#a7b9d0;--blue:#2d72df;--light:#1b3554;--border:#32465d;--bg:#0b1320;--white:#172335;--green:#5ed9a2;--tone-surface-alt:#162638;--tone-link:#a6ceff;--tone-brand:#e5f0ff;--tone-nav:#d6e4f4;--tone-eyebrow:#a9caff;--tone-pill-bg:#1e3755;--tone-pill-border:#355b81;--tone-pill-text:#b7d4fa;--tone-icon-bg:#263d5e;--tone-icon-color:#b8d5ff;--tone-field-bg:#111d2c;--tone-field-border:#45617b;--tone-hover-border:#75a9eb;--tone-text-soft:#bdcce0;--tone-note-bg:#192c42;--tone-note-text:#c4d4e8;--tone-table-bg:#1e3045;--tone-border-result:#355b81;--tone-result-text:#c8e1ff;--tone-result-label:#abc9eb;--tone-error-bg:#40252c;--tone-error-text:#ffd0d4;--tone-soft-button-bg:#263e59;--tone-shadow:0 8px 30px #00000025;}}

/* Theme-aware colors: all controls and body surfaces use named color tokens. */
a{color:var(--tone-link)}
.skip{background:var(--white)}
.brand{color:var(--tone-brand)}
.nav a{color:var(--tone-nav)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--tone-link)}
.eyebrow{color:var(--tone-eyebrow)}
.navcrumb a{color:var(--tone-link)}
.pill{background:var(--tone-pill-bg);border-color:var(--tone-pill-border);color:var(--tone-pill-text)}
.tool-card{box-shadow:var(--tone-shadow)}
.tool-card:hover,.tool-card:focus-visible{border-color:var(--tone-hover-border)}
.card-icon{background:var(--tone-icon-bg);color:var(--tone-icon-color);width:43px;height:43px;border-radius:12px}
.card-icon svg{display:block;width:25px;height:25px;stroke:currentColor;transition:transform .25s ease,opacity .25s ease}
.tool-card:hover .card-icon svg,.tool-card:focus-visible .card-icon svg{transform:translateY(-3px) rotate(-8deg) scale(1.1)}
.tool-card:nth-child(3n+2) .card-icon svg{animation:icon-float 7s ease-in-out infinite}
.tool-card:nth-child(3n+2):hover .card-icon svg,.tool-card:nth-child(3n+2):focus-visible .card-icon svg{animation:icon-pop .38s ease-out both}
@keyframes icon-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes icon-pop{0%{transform:translateY(0) scale(1)}55%{transform:translateY(-4px) scale(1.14)}100%{transform:translateY(-2px) scale(1.05)}}
.highlight,.paper,.related a,.prose{background:var(--white)}
.paper{box-shadow:var(--tone-shadow)}
.side-panel{background:var(--tone-surface-alt)}
input:not([type="checkbox"]),select,textarea{background:var(--tone-field-bg);border-color:var(--tone-field-border);color:var(--ink)}
input[type="checkbox"]{accent-color:var(--blue)}
.button.secondary{background:var(--white);border-color:var(--tone-field-border);color:var(--tone-link)}
.button.secondary:hover{background:var(--tone-soft-button-bg)}
.result{border-color:var(--tone-border-result)}
.result-label{color:var(--tone-result-label)}
.result-note,.details{color:var(--tone-result-text)}
.details{border-top-color:var(--border)}
.error{color:var(--tone-error-text);background:var(--tone-error-bg)}
.example p,.faq p,.method p,.prose p,.prose li{color:var(--tone-text-soft)}
.muted-box{background:var(--tone-note-bg);color:var(--tone-note-text)}
.timecard th{background:var(--tone-table-bg)}
.related a:hover{border-color:var(--tone-hover-border)}
.prose h1,.prose h2,.prose h3{color:var(--ink)}
.bottom{background:var(--white)}
.theme-switch{display:flex;flex-shrink:0;align-items:center;gap:3px;border:1px solid var(--border);background:var(--bg);padding:4px;border-radius:12px}
.theme-choice{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:7px 10px;min-height:36px;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer;font:inherit;font-size:12px;font-weight:700;white-space:nowrap}
.theme-choice svg{width:16px;height:16px;stroke:currentColor;flex-shrink:0}
.theme-choice:hover{color:var(--ink)}
.theme-choice[aria-pressed="true"]{color:var(--tone-link);background:var(--white);box-shadow:0 1px 3px #00000012}
.theme-choice:focus-visible{outline:3px solid #4d91fa;outline-offset:2px}
.topbar .shell{column-gap:16px}
.theme-choice:active svg{transform:scale(.9)}
@media(max-width:900px){.topbar .shell{flex-wrap:wrap;justify-content:space-between;padding-top:12px;padding-bottom:12px}}
@media(max-width:620px){.topbar .shell{align-items:center;flex-direction:row}.brand{font-size:17px}.nav{order:3;width:100%;gap:18px}.theme-switch{margin-left:auto}.theme-choice{padding:6px 8px;font-size:11px}}
@media(max-width:380px){.theme-choice span{display:none}.theme-choice{width:34px}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
@media print{
 :root,:root[data-theme="dark"]{color-scheme:light;--ink:#182438;--muted:#57677d;--blue:#1764d8;--light:#eef5ff;--border:#dce5f1;--bg:#fff;--white:#fff;--tone-link:#1457b8;--tone-surface-alt:#fff;--tone-text-soft:#516078;--tone-result-text:#36516f;--tone-result-label:#3f5b82;--tone-field-bg:#fff;--tone-field-border:#cbd5e1}
 .theme-switch{display:none!important}
 .card-icon svg{animation:none!important}
}

/* Fix intrinsic grid sizing on narrow screens; wide weekly tables scroll inside their card. */
.columns,.paper,.side-panel{min-width:0}
.table-scroll{max-width:100%;width:100%;overflow-x:auto}
@media(max-width:900px){.columns{grid-template-columns:minmax(0,1fr)}}

/* Accessible tool actions and stable result presentation. */
.result-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}
.result-actions .button{min-height:40px;padding:8px 13px;font-size:13px}
.result-actions [role="status"]{font-size:13px;color:var(--muted)}
.result-main{overflow-wrap:anywhere}
.limitations{margin-top:26px;border-top:1px solid var(--border);padding-top:7px}
.limitations h2{font-size:21px}
.limitations p{font-size:15px;color:var(--tone-text-soft)}
@media print {
  .result-actions,.limitations{display:none!important}
  .table-scroll{overflow:visible!important}
  .timecard{min-width:0;width:100%;font-size:10px}
  .timecard th,.timecard td{padding:4px;font-size:10px}
  .timecard input:not([type="checkbox"]){width:100%;min-width:0;padding:2px;font-size:10px}
}