.grid-page { --grid-ink:#233b31; --grid-muted:#536a5f; --grid-rule:#bdc9bd; --grid-paper:#f7f8f3; --grid-moss:#486c50; --grid-edge:#a36532; color:var(--grid-ink); background:#f3f5ef; }
.grid-page *, .grid-page *::before, .grid-page *::after { box-sizing:border-box; }
.grid-page .brand { display:inline-flex; align-items:center; gap:8px; }
.grid-page .brand-symbol { display:inline-flex; width:28px; height:28px; flex:0 0 28px; }
.grid-page .brand-symbol svg { display:block; width:100%; height:100%; }
.grid-page .brand-pro { margin-left:2px; color:#286b4e; font-size:.67em; letter-spacing:.01em; }
.grid-skip { position:absolute; left:12px; top:-80px; z-index:20; padding:10px 14px; background:#fff; color:var(--grid-ink); }
.grid-skip:focus { top:12px; }
.grid-main { padding-top:22px; padding-bottom:65px; }
.grid-path { margin:0 0 16px; color:var(--grid-muted); font-size:13px; }
.grid-path a { color:var(--grid-ink); text-underline-offset:3px; }
.grid-main h1 { max-width:900px; margin:0 0 12px; font:400 clamp(36px,5vw,64px)/1.04 Georgia,"Times New Roman",serif; letter-spacing:-.035em; }
.grid-lead { max-width:730px; margin:0 0 23px; color:var(--grid-muted); font-size:16px; line-height:1.6; }
.grid-answer { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr); gap:0; border-block:2px solid var(--grid-ink); background:#e9eee5; }
.grid-answer-primary { padding:21px 28px 23px; }
.grid-answer h2 { margin:0 0 10px; font-size:14px; font-weight:700; letter-spacing:0; }
.grid-answer-primary > p:nth-child(2), .grid-answer-order > p:first-child { display:flex; align-items:baseline; flex-wrap:wrap; gap:9px; margin:0; }
.grid-answer-primary strong { font:400 clamp(48px,6.5vw,86px)/1 Georgia,"Times New Roman",serif; font-variant-numeric:tabular-nums; }
.grid-answer-primary span, .grid-answer-order span { color:var(--grid-muted); font-size:13px; }
.grid-answer-primary #grid-status { max-width:540px; margin:11px 0 0; color:var(--grid-muted); font-size:13px; line-height:1.45; }
.grid-answer-order { display:flex; flex-direction:column; justify-content:center; padding:17px 27px; border-left:1px solid var(--grid-rule); }
.grid-answer-order strong { font-size:27px; font-variant-numeric:tabular-nums; }
.grid-answer-order > p:nth-child(2) { margin:7px 0; font-size:13px; }
.grid-answer-order > p:nth-child(2) strong { font-size:18px; }
.grid-answer-order small { max-width:260px; color:var(--grid-muted); font-size:11px; line-height:1.45; }
.grid-workbench { display:grid; grid-template-columns:minmax(0,1fr) minmax(310px,.75fr); gap:36px; margin:34px 0; align-items:start; }
.grid-form h2, .grid-range h2, .grid-detail h2 { margin:0 0 10px; font:400 clamp(25px,2.7vw,36px)/1.16 Georgia,"Times New Roman",serif; }
.grid-form > p, .grid-range p, .grid-detail p, .grid-detail li { color:var(--grid-muted); font-size:14px; line-height:1.65; }
.grid-form > p { max-width:650px; margin:0 0 17px; }
.grid-form fieldset { margin:0; padding:17px 0 21px; border:0; border-top:1px solid var(--grid-rule); }
.grid-form legend { float:left; width:100%; margin:0 0 15px; padding:0; font-size:14px; font-weight:750; }
.grid-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; clear:both; }
.grid-order-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-fields label { display:flex; flex-direction:column; gap:5px; min-width:0; font-size:13px; font-weight:700; }
.grid-fields label span { color:var(--grid-muted); font-size:11px; font-weight:450; }
.grid-fields input { width:100%; min-height:46px; padding:10px 12px; border:1px solid #8eaa96; border-radius:0; outline-offset:2px; color:var(--grid-ink); background:#fff; font:600 16px/1.2 system-ui,-apple-system,sans-serif; }
.grid-fields input:focus-visible, .grid-page a:focus-visible, .grid-page summary:focus-visible { outline:3px solid #aa713c; outline-offset:3px; }
.grid-fields input::placeholder { color:#75897c; font-weight:400; }
.grid-figure { margin:0; padding:16px; border:1px solid var(--grid-rule); background:#fff; }
.grid-figure img { display:block; width:100%; height:auto; }
.grid-figure figcaption { margin:12px 0 0; color:var(--grid-muted); font-size:12px; line-height:1.5; }
.grid-range { display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,.7fr); gap:26px; padding:24px 0; border-top:2px solid var(--grid-ink); border-bottom:1px solid var(--grid-rule); }
.grid-range p { max-width:660px; margin:0; }
.grid-range-readout { padding-left:22px; border-left:1px solid var(--grid-rule); }
.grid-range-readout > p { margin:0 0 9px; }
.grid-range-readout strong { color:var(--grid-ink); font-size:18px; font-variant-numeric:tabular-nums; }
#grid-range-note { font-size:12px; }
.grid-detail { max-width:900px; margin-top:31px; }
.grid-detail ol { margin:14px 0; padding-left:21px; }
.grid-detail li { margin:0 0 7px; padding-left:5px; }
.grid-detail a { color:#0b624d; text-underline-offset:3px; }
.grid-formula { overflow-x:auto; padding:13px 16px; border-left:4px solid var(--grid-moss); background:#e9eee5; color:var(--grid-ink) !important; font-size:13px !important; }
.grid-faq details { padding:14px 0; border-top:1px solid var(--grid-rule); }
.grid-faq details:last-child { border-bottom:1px solid var(--grid-rule); }
.grid-faq summary { cursor:pointer; font-weight:700; font-size:14px; }
.grid-faq details p { margin:10px 0 0; }
@media(max-width:900px) { .grid-workbench { grid-template-columns:1fr; gap:12px; } .grid-figure { max-width:700px; } }
@media(max-width:620px) { .grid-main { padding-top:14px; } .grid-main h1 { font-size:38px; } .grid-lead { font-size:14px; } .grid-answer { grid-template-columns:1fr; } .grid-answer-primary { padding:16px 16px 14px; } .grid-answer-primary strong { font-size:62px; } .grid-answer-order { padding:13px 16px 15px; border-left:0; border-top:1px solid var(--grid-rule); } .grid-fields { grid-template-columns:1fr; gap:12px; } .grid-order-fields { grid-template-columns:1fr 1fr; } .grid-range { grid-template-columns:1fr; gap:12px; } .grid-range-readout { padding-left:0; border-left:0; } }
@media(max-width:390px) { .grid-order-fields { grid-template-columns:1fr; } .grid-main h1 { font-size:35px; } }