/* CronWave v3 layer: loaded after cronwave.css. Layout: sticky one-line header, tool-first hero,
   schedule composer (controls left, result right), compact footer. */
:root {
  color-scheme: dark;
  --font-display: 'Manrope', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-body: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
  --text2: #A6AFC6;
  --muted: #7F89A5;
  --on-accent: #14110A;
  --mark: rgba(245,158,11,.30);
  --nav-bg: rgba(8,10,15,.9);
  --danger-border: rgba(239,68,68,.3);
  --warn: #FBBF24;
  --danger: #F87171;
}
[data-theme="light"] {
  color-scheme: light;
  --text2: #404862;
  --muted: #5B647D;
  --accent: #A44A06;
  --accent2: #92400E;
  --on-accent: #FFFFFF;
  --mark: rgba(217,119,6,.24);
  --nav-bg: rgba(244,245,248,.92);
  --warn: #92400E;
  --success: #047857;
  --info: #1D4ED8;
  --danger: #B91C1C;
  --f-min: #1D4ED8; --f-hr: #6D28D9; --f-dom: #047857; --f-mon: #C2410C; --f-dow: #BE185D; --f-sec: #A16207;
}
body { font-family: var(--font-body); }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.mono { font-family: var(--font-mono); }
.btn-primary { background: var(--accent); color: var(--on-accent); box-shadow: none; }
.btn-primary:hover { filter: brightness(1.08); box-shadow: none; }
.btn-ghost { color: var(--text); }
.int-link { color: var(--on-accent); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

/* ── Header ─────────────────────────────────────────────── */
.site-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 100; background: var(--nav-bg); -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); border-bottom: 1px solid var(--border); }
.site-header nav { position: static; background: none; border: 0; -webkit-backdrop-filter: none; backdrop-filter: none; }
:root { --brand-gap: clamp(10px, 3.4vw, 52px); }
.nav-bar { display: flex; align-items: center; gap: 12px; min-height: 58px; }
.brand { display: inline-flex; align-items: center; gap: 9px; flex: 0 0 auto; color: var(--text); text-decoration: none; min-height: 44px; }
.brand:hover { opacity: 1; }
.brand-mark { width: 30px; height: 30px; border-radius: 7px; display: block; flex: 0 0 auto; }
.brand-word { font-family: var(--font-display); font-weight: 800; font-size: 1.2rem; letter-spacing: -.045em; line-height: 1; color: var(--text); }
.brand-word .w { color: var(--accent); }
.site-header .nav-links { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0 0 0 var(--brand-gap); padding: 0; flex: 1 1 auto; min-width: 0; position: static; }
.site-header .nav-links li { flex: 0 0 auto; }
.site-header .nav-links a { display: inline-flex; align-items: center; min-height: 36px; padding: 6px 10px; border-radius: 6px; font-size: .86rem; font-weight: 600; color: var(--text2); white-space: nowrap; border: 1px solid transparent; }
.site-header .nav-links a:hover { background: var(--surface2); color: var(--text); opacity: 1; }
.site-header .nav-links a[aria-current="page"] { color: var(--text); background: var(--accent-soft); border-color: var(--accent-border); }
.nav-right { display: flex; align-items: center; gap: 6px; margin-left: auto; flex: 0 0 auto; }
.site-header .theme-btn { min-height: 36px; padding: 6px 11px; }
.site-header .theme-btn svg { width: 15px; height: 15px; flex: 0 0 auto; }
#theme-icon[data-mode="light"] .i-sun { display: none; }
#theme-icon:not([data-mode="light"]) .i-moon { display: none; }
/* One row for as long as the seven links fit. Below NAVBP the links move to a second row, all visible. */
.site-header .nav-links a { padding: 6px 9px; font-size: .85rem; }
@media (max-width: 860px) { .site-header .theme-btn #theme-label { display: none; } .site-header .theme-btn { padding: 6px 9px; } }
/* Brand group, then a proportional gap (--brand-gap on the nav group), then the compact link group. Links tighten from 900px so the gap survives. */
@media (max-width: 900px) { .site-header .nav-links a { padding: 6px 5px; font-size: .8rem; } .nav-bar { gap: 8px; } }
/* Near the one-row limit the gap gives up space 1:1 with the viewport so nothing collides. */
@media (max-width: 800px) { :root { --brand-gap: clamp(4px, calc(100vw - 742px), 40px); } }
@media (max-width: 752px) {
  .site-header .nav-links a { padding: 6px 9px; font-size: .85rem; }
  .nav-bar { flex-wrap: wrap; row-gap: 0; padding-top: 4px; }
  .nav-right { order: 2; }
  .site-header .nav-links { order: 3; flex: 1 1 100%; margin: 0 -8px; padding: 0 0 6px; flex-wrap: wrap; row-gap: 2px; }
}
@media (max-width: 640px) { .site-header { position: static; } }
@media (max-width: 520px) { .wrap, .wrap-sm, .wrap-xs { padding-left: 16px; padding-right: 16px; } }

/* ── Footer ─────────────────────────────────────────────── */
.site-footer { border-top: 1px solid var(--border); margin-top: 64px; padding: 36px 0 28px; }
.site-footer .footer-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); gap: 28px; margin-bottom: 24px; }
.site-footer .footer-brand p { font-size: .84rem; color: var(--text2); margin: 12px 0 0; line-height: 1.6; max-width: 26rem; }
.site-footer h2 { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1.1px; color: var(--muted); margin: 0 0 12px; font-family: var(--font-body); }
.site-footer .footer-links { list-style: none; display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; }
.site-footer .footer-links a { display: inline-block; padding: 5px 0; font-size: .86rem; color: var(--text2); }
.site-footer .footer-links a:hover { color: var(--text); opacity: 1; }
.site-footer .footer-copy { display: flex; justify-content: space-between; gap: 8px 24px; flex-wrap: wrap; padding-top: 18px; border-top: 1px solid var(--border); font-size: .78rem; color: var(--muted); }
@media (max-width: 760px) { .site-footer .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .site-footer .footer-brand { grid-column: 1 / -1; } .site-footer { padding-bottom: 84px; } }

/* ── Hero ───────────────────────────────────────────────── */
.hero { padding: 44px 0 28px; }
.hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr); gap: 44px; align-items: start; }
@media (max-width: 860px) { .hero-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; } .hero { padding-top: 28px; } }
.hero-eyebrow { font-family: var(--font-body); font-size: .74rem; letter-spacing: .08em; margin-bottom: 14px; color: var(--text2); text-transform: uppercase; font-weight: 700; }
.hero-title { font-family: var(--font-display); font-weight: 800; font-size: clamp(2.15rem, 1.4rem + 2.8vw, 3.5rem); line-height: 1.04; letter-spacing: -.04em; text-wrap: balance; margin: 0 0 16px; color: var(--text); max-width: 14em; }
.hero-title .hl { background-image: linear-gradient(var(--mark), var(--mark)); background-repeat: no-repeat; background-size: 100% .3em; background-position: 0 90%; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.hero-sub { font-size: 1.05rem; line-height: 1.6; color: var(--text2); max-width: 31rem; margin: 0 0 22px; }
.hero-ctas { margin-bottom: 4px; }
.hero-trust { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 18px; padding: 0; margin: 18px 0 0; font-size: .82rem; color: var(--text2); }
.hero-trust li::before { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--success); margin-right: 8px; vertical-align: middle; }
.hq { background: var(--surface); border: 1px solid var(--border2); border-radius: 12px; box-shadow: var(--shadow); min-width: 0; }
.hq-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--border); font-size: .8rem; color: var(--text2); }
.hq-head b { color: var(--text); font-weight: 700; }
.hq-body { padding: 16px; }
.hq-label { display: block; font-size: .74rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.hq-input { width: 100%; font-family: var(--font-mono); font-size: 1.12rem; letter-spacing: .05em; padding: 11px 13px; background: var(--bg2); border: 1px solid var(--border2); border-radius: 8px; color: var(--text); }
.hq-out { margin-top: 14px; min-height: 150px; }
.hq-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.hq-chips .demo-chip b { font-family: var(--font-mono); font-weight: 600; }
.hq-sentence { margin: 12px 0 4px; font-size: 1rem; font-weight: 600; color: var(--text); line-height: 1.4; }
.hq-hint { font-size: .78rem; color: var(--muted); margin: 4px 0 0; }
.hq-err { padding: 9px 12px; border-radius: 8px; background: var(--danger-soft); border: 1px solid var(--danger-border); color: var(--danger); font-size: .84rem; }
.hq-runs { margin: 10px 0 0; padding-left: 20px; font-size: .86rem; color: var(--text2); display: grid; gap: 2px; }
.hq-links { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 12px; font-size: .84rem; }
.hq-links a { font-weight: 600; }

/* Tool tiles are real links */
a.tool-tile { display: block; color: inherit; text-decoration: none; }
a.tool-tile:hover { opacity: 1; }
.tool-tile-arrow { color: var(--accent); }
.content-section .section-title, .page-title { font-family: var(--font-display); letter-spacing: -.03em; text-wrap: balance; }
.hero-note { font-size: .74rem; color: var(--muted); margin-top: 14px; }
.hero-note kbd { font-size: .72rem; }

/* ── Composer ───────────────────────────────────────────── */
.ctl-label { display: block; font-size: .76rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.cmp-in { font-family: var(--font-body); font-size: .92rem; color: var(--text); background: var(--bg2); border: 1px solid var(--border2); border-radius: 8px; padding: 9px 11px; min-width: 0; }
.cmp-in:disabled { opacity: .5; }
.cmp-in.bad { border-color: var(--danger); }
.cmp-sel { width: 100%; }
.cmp-nl-row { display: flex; gap: 8px; }
.cmp-nl-row .cmp-in { flex: 1 1 auto; }
.cmp-nl-msg { margin-top: 10px; font-size: .84rem; line-height: 1.5; color: var(--text2); }
.cmp-nl-msg:empty { display: none; }
.cmp-nl-msg.ok { color: var(--text); }
.cmp-nl-msg.bad { color: var(--danger); }
.cmp-hint { font-size: .8rem; color: var(--text2); line-height: 1.5; margin: 8px 0; }
.cmp-hint.warn { color: var(--warn); }
.chip-btn { font-family: var(--font-body); font-size: .8rem; font-weight: 600; color: var(--text2); background: var(--surface2); border: 1px solid var(--border2); border-radius: 999px; padding: 6px 12px; cursor: pointer; min-height: 32px; line-height: 1.2; }
.chip-btn { font-weight: 500; }
.chip-row, .tp-quick { display: flex; flex-wrap: wrap; gap: 6px; }
.tp-field { display: grid; gap: 4px; min-width: 0; }
.tp-field label { font-size: .74rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.num-row { display: flex; align-items: center; gap: 8px; }
.tp-num { width: 76px; font-family: var(--font-mono); font-size: 1.05rem; text-align: center; }
.unit { font-size: .84rem; color: var(--text2); }
.tp-row { display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.tp-colon { font-size: 1.4rem; padding-bottom: 6px; color: var(--muted); }
.seg { display: inline-flex; border: 1px solid var(--border2); border-radius: 8px; overflow: hidden; }
.seg-b { font-family: var(--font-body); font-size: .84rem; font-weight: 700; padding: 9px 12px; background: var(--surface2); color: var(--text2); border: 0; cursor: pointer; }
.seg-b.on { background: var(--accent); color: var(--on-accent); }
.tp-fmt { margin-left: auto; }
.tp-body { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px 18px; align-items: start; }
@media (max-width: 520px) { .tp-body { grid-template-columns: minmax(0, 1fr); justify-items: center; } .tp-quick { justify-content: center; } }
.dial { display: grid; gap: 8px; justify-items: center; }
.dial-tabs { display: inline-flex; gap: 4px; }
.dial-tab { font-family: var(--font-body); font-size: .76rem; font-weight: 700; padding: 4px 12px; border-radius: 999px; border: 1px solid var(--border2); background: transparent; color: var(--text2); cursor: pointer; }
.dial-tab.on { background: var(--surface3); color: var(--text); }
.dial-svg { width: 216px; max-width: 100%; height: auto; touch-action: none; cursor: pointer; user-select: none; -webkit-user-select: none; }
.dl-face { fill: var(--surface2); stroke: var(--border2); }
.dl-hand { stroke: var(--accent); stroke-width: 2; }
.dl-hub { fill: var(--accent); }
.dl-n circle { fill: transparent; }
.dl-n text { fill: var(--text2); font-family: var(--font-mono); pointer-events: none; }
.dl-n:hover circle { fill: var(--surface3); }
.dl-sel circle { fill: var(--accent); }
.dl-sel text { fill: var(--on-accent); font-weight: 700; }
.dl-odd { fill: var(--accent); stroke: var(--on-accent); }

.af { min-width: 0; }
.link-btn { background: none; border: 0; padding: 0; color: var(--accent); font: inherit; font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

.out-sentence { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.35; margin-bottom: 12px; text-wrap: balance; }
.expr-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 14px; background: var(--bg2); border: 1px solid var(--border2); border-radius: 10px; }
.expr { font-size: 1.35rem; font-weight: 600; letter-spacing: .06em; color: var(--accent); flex: 1 1 12rem; min-width: 0; overflow-wrap: anywhere; background: none; border: 0; padding: 0; }
.fchips { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; }
.fchip { display: inline-flex; flex-direction: column; align-items: center; min-width: 54px; padding: 5px 9px; border-radius: 8px; border: 1px solid var(--border2); background: var(--surface2); }
.fchip b { color: var(--c); font-size: .95rem; }
.fchip i { font-style: normal; font-size: .66rem; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.out-box { margin: 12px 0; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--border2); background: var(--surface2); }
.out-box.unsup { border-color: var(--danger-border); background: var(--danger-soft); }
.out-box-t { font-weight: 700; font-size: .92rem; margin-bottom: 4px; }
.out-box ul { margin: 6px 0 0 18px; font-size: .86rem; color: var(--text2); line-height: 1.5; }
.out-closest { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border2); }
.out-notes { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 6px; font-size: .84rem; line-height: 1.5; }
.out-notes li { padding: 8px 11px; border-radius: 8px; background: var(--surface2); color: var(--text2); border-left: 3px solid var(--border2); }
.out-notes li.warn { border-left-color: var(--warn); color: var(--text); }
.out-notes li.bad { border-left-color: var(--danger); color: var(--text); }
.out-snip { margin-top: 14px; }
.out-snip-h { display: flex; justify-content: space-between; align-items: center; font-size: .76rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.out-pre { margin: 0; white-space: pre; overflow-x: auto; font-size: .78rem; }
.out-runs { margin-top: 16px; }
.out-runs-h { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.out-runs-h h3 { margin: 0; font-size: 1rem; font-family: var(--font-display); letter-spacing: -.01em; }
.tz-tag { font-size: .76rem; color: var(--text2); font-family: var(--font-mono); }
.run-ol { list-style: none; margin: 0; padding: 0; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.run-ol li { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 8px 12px; font-size: .88rem; border-bottom: 1px solid var(--border); font-variant-numeric: tabular-nums; }
.run-ol li:last-child { border-bottom: 0; }
.run-ol li:nth-child(odd) { background: var(--bg2); }
.run-ol .run-t { color: var(--text); font-weight: 600; }
.run-ol .run-u { color: var(--muted); font-size: .8rem; }
.run-ol li.skip { color: var(--warn); }
.run-more { margin-top: 8px; font-size: .84rem; }
.out-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: 16px; font-size: .86rem; color: var(--text2); }
.out-links a { font-weight: 600; }
.run-tz-note { font-size: .74rem; color: var(--muted); list-style: none; }

/* ── Validator cards, platform badges ───────────────────── */
.validation-result.warn { border-color: var(--accent-border); background: var(--accent-soft); }
.val-fix { margin-top: 8px; font-size: .78rem; color: var(--text2); }
.val-fix code { display: block; margin-top: 4px; overflow-wrap: anywhere; }
.plat-badge.invalid { border-color: var(--danger-border); color: var(--danger); background: var(--danger-soft); }
.validation-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }

/* ── Field reference tables ─────────────────────────────── */
.ref-scroll { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
.ref-scroll .ref-table { min-width: 560px; }
.ref-table td, .ref-table th { vertical-align: top; }
.ref-note { font-size: .84rem; color: var(--text2); margin: 10px 2px 0; line-height: 1.6; }
.doc-h3 { font-family: var(--font-display); font-size: 1.1rem; margin: 26px 0 10px; letter-spacing: -.01em; }
.prose { max-width: 46rem; }
.prose h2 { font-family: var(--font-display); font-size: 1.4rem; margin: 30px 0 10px; letter-spacing: -.02em; }
.prose p, .prose li { color: var(--text2); line-height: 1.75; font-size: .96rem; }
.prose ul { padding-left: 20px; }
.prose li { margin: 4px 0; }
.prose a { text-decoration: underline; text-underline-offset: 3px; }
.page-meta { font-size: .8rem; color: var(--muted); }
.related { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; margin-top: 12px; }
.related a { display: block; padding: 12px 14px; border: 1px solid var(--border2); border-radius: 10px; background: var(--surface); color: var(--text); }
.related a:hover { border-color: var(--accent-border); opacity: 1; }
.related a b { display: block; font-size: .92rem; }
.related a span { font-size: .8rem; color: var(--text2); line-height: 1.5; }

/* ── Assistant ──────────────────────────────────────────── */
.wa-fab { bottom: calc(20px + env(safe-area-inset-bottom, 0px)); right: 20px; background: var(--surface3); color: var(--text); border: 1px solid var(--border2); padding: 10px 16px; min-height: 44px; font-weight: 700; }
.wa-fab:hover { opacity: 1; background: var(--surface2); }
.wa-fab-mark { width: 18px; height: 18px; border-radius: 5px; display: block; }
.wa-fab-label { font-size: .86rem; font-weight: 700; }
.wa-panel { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); right: 20px; width: 392px; max-height: min(620px, calc(100vh - 120px)); max-height: min(620px, calc(100dvh - 120px)); }
.wa-panel[aria-hidden="true"] { visibility: hidden; }
.wa-panel.wa-open { visibility: visible; }
@media (max-width: 520px) { .wa-panel { left: 10px; right: 10px; width: auto; max-width: none; } .wa-fab { right: 12px; } .wa-fab-label { display: none; } .wa-fab { padding: 10px 12px; } }
.wa-hdr-badge { background: transparent; padding: 0; }
.wa-hdr-badge img { width: 30px; height: 30px; border-radius: 8px; display: block; }
.wa-acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.wa-act { font-family: var(--font-body); font-size: .76rem; font-weight: 600; padding: 6px 10px; min-height: 32px; border-radius: 6px; border: 1px solid var(--border2); background: var(--surface2); color: var(--text); cursor: pointer; }
.wa-act:hover { border-color: var(--accent-border); }
.wa-act-p { background: var(--accent); color: var(--on-accent); border-color: transparent; font-weight: 700; }
.wa-plats { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 4px; }
.wa-sim-chip { font-family: var(--font-body); font-weight: 600; }
.wa-sim-chip.on { border-color: var(--accent-border); background: var(--accent-soft); color: var(--accent); }
.wa-assume { font-size: .76rem; color: var(--text2); line-height: 1.5; padding: 7px 10px; background: var(--surface2); border-radius: 6px; margin-top: 8px; }
.wa-tzline { font-size: .68rem; color: var(--muted); margin-top: 4px; }
.wa-ctxline { margin-top: 8px; font-size: .78rem; color: var(--text2); }
.wa-ctxline code { overflow-wrap: anywhere; }
.wa-table { width: 100%; border-collapse: collapse; font-size: .78rem; margin-top: 6px; }
.wa-table th { text-align: left; padding: 6px 8px 6px 0; width: 64px; color: var(--text); vertical-align: top; }
.wa-table td { padding: 6px 0; color: var(--text2); border-bottom: 1px solid var(--border); overflow-wrap: anywhere; }
.wa-table .ok { color: var(--success); font-weight: 700; } .wa-table .bad { color: var(--danger); font-weight: 700; } .wa-table .warn { color: var(--warn); }
.wa-recipe-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); }
.wa-recipe-row code { display: inline-block; margin-top: 3px; }
.wa-recipe-row .wa-recipe-desc { font-size: .72rem; color: var(--text2); }
.wa-code-wrap, .wa-expr-display { min-width: 0; }
.wa-expr-val { overflow-wrap: anywhere; }
.wa-input:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.assistant-hero-note { margin-top: 18px; padding: 14px 16px; border: 1px solid var(--border2); border-radius: 10px; background: var(--surface); font-size: .9rem; color: var(--text2); line-height: 1.6; }

/* ── Build additions: footer columns, button-based FAQ and presets, doc sections ── */
.site-footer .footer-grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.4fr) minmax(0, .8fr); }
.site-footer .footer-links.cols { display: block; columns: 2; column-gap: 24px; }
.site-footer .footer-links.cols li { break-inside: avoid; }
@media (max-width: 760px) { .site-footer .footer-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .site-footer .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 420px) { .site-footer .footer-grid { grid-template-columns: minmax(0, 1fr); } }
button.faq-q { width: 100%; text-align: left; background: none; border: 0; font: inherit; color: inherit; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
button.preset-card { text-align: left; font: inherit; color: inherit; width: 100%; }
.preset-card > span { display: block; }
.doc { padding: 8px 0 24px; }
.doc .prose { max-width: 48rem; }
.doc .related { margin-bottom: 8px; }
.mono { font-family: var(--font-mono); }
.tool-tile-icon.mono, .platform-card-icon.mono, .feature-icon.mono { font-size: .86rem; font-weight: 600; letter-spacing: -.02em; }
kbd { font-family: var(--font-mono); }
.site-footer nav { position: static; background: none; border: 0; height: auto; -webkit-backdrop-filter: none; backdrop-filter: none; z-index: auto; }
.tool-tile-icon.mono { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 9px; background: var(--accent-soft); color: var(--accent); border: 1px solid var(--accent-border); margin-bottom: 12px; font-size: .9rem; }
.platform-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.platform-card > div:last-child { min-width: 0; }
.platform-card-icon.mono { flex: 0 0 auto; min-width: 2.2rem; text-align: center; }
.hq-head b { white-space: nowrap; }
.chip-lbl { opacity: 1; font-size: .64rem; }
.plat-badge span { opacity: 1; }
.out-closest .expr-row { padding: 10px 12px; }
.out-closest .expr { font-size: .95rem; font-weight: 600; word-break: break-word; overflow-wrap: anywhere; line-height: 1.5; letter-spacing: 0; }
.out-closest.guard .expr { font-size: .85rem; }

/* ── Cron Expression Builder (Generator) ─────────────────── */
.chip-btn:hover { color: var(--text); border-color: var(--accent-border); }
.chip-btn.on, .chip-btn[aria-expanded="true"] { color: var(--on-accent); background: var(--accent); border-color: var(--accent); }
.page-hero--tight { padding: 16px 0 12px; }
.page-hero--tight .page-title { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2rem); margin-bottom: 4px; }
.page-hero--tight .page-sub { font-size: .9rem; line-height: 1.5; max-width: 60rem; margin: 0; }
.gen { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; min-width: 0; }
.gen-bar { display: grid; grid-template-columns: minmax(0, 24rem) minmax(0, 1fr); gap: 10px 20px; align-items: end; padding: 12px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
.gen-env { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; min-width: 0; }
.gen-f { min-width: 0; }
.gen .ctl-label { margin-bottom: 4px; }
.gen-nl { min-width: 0; }
.gen-tzinfo { grid-column: 1 / -1; margin: 0; font-size: .78rem; color: var(--muted); }
.gen-bar .cmp-nl-msg { grid-column: 1 / -1; margin: 0; }
.gen-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.gen-quick-l { font-size: .76rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.gen-quick-c { display: flex; flex-wrap: wrap; gap: 6px; }
.gen-clock-b { margin-left: auto; }
.gen-quick .chip-btn { padding: 4px 10px; min-height: 34px; font-size: .78rem; }
.gen-fields-h .gen-clock-b { margin-left: auto; align-self: center; }
.gen-syntax { flex: 1 1 100%; }
.gen-clock[hidden] { display: none; }
.gen-clock { padding: 12px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
.gen-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.gen-fields, .gen-result { min-width: 0; }
.gen-fields-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; margin-bottom: 8px; }
.gen-fields-h h2, .gen-result-h h2 { font-family: var(--font-display); font-size: 1.05rem; letter-spacing: -.01em; margin: 0; }
.gen-syntax { font-size: .8rem; color: var(--text2); margin: 0; line-height: 1.45; }
#gen-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.gf { --c: var(--accent); padding: 10px 12px 10px 14px; background: var(--surface); border: 1px solid var(--border); border-left: 4px solid var(--c); border-radius: 10px; min-width: 0; }
.gf.bad { border-color: var(--danger); border-left-color: var(--danger); }
.gf-head { display: flex; align-items: center; gap: 8px; min-width: 0; }
.gf-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--c); flex: 0 0 auto; }
.gf-name { font-size: .92rem; }
.gf-range { font-size: .72rem; color: var(--muted); }
.gf-tok { margin-left: auto; font-size: .95rem; font-weight: 700; color: var(--c); background: var(--bg2); border: 1px solid var(--border2); border-radius: 6px; padding: 1px 8px; max-width: 55%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gf-tok.flash { animation: gfflash .7s ease-out; }
@keyframes gfflash { 0% { background: var(--c); color: var(--bg); } 100% { background: var(--bg2); color: var(--c); } }
@media (prefers-reduced-motion: reduce) { .gf-tok.flash { animation: none; } }
.gf-q { font-size: .8rem; color: var(--text2); margin: 2px 0 6px; }
.gf-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; min-width: 0; }
.gf-mode { flex: 1 1 11rem; max-width: 100%; }
.gf-sel { flex: 1 1 8rem; }
.gf-num { width: 5.2rem; text-align: center; }
.gf-text { flex: 1 1 10rem; }
.gf-t { font-size: .84rem; color: var(--text2); }
.gf .cmp-in { min-height: 38px; padding: 6px 9px; }
.gf .cmp-in[aria-invalid="true"] { border-color: var(--danger); }
.gf-grid { display: grid; gap: 5px; margin-top: 8px; grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); }
.gf-grid-hour { grid-template-columns: repeat(auto-fill, minmax(40px, 1fr)); }
.gf-grid-dow, .gf-grid-month { grid-template-columns: repeat(auto-fill, minmax(56px, 1fr)); }
.gf-tg { font-family: var(--font-mono); font-size: .8rem; font-weight: 600; min-height: 38px; border-radius: 7px; border: 1px solid var(--border2); background: var(--surface2); color: var(--text2); cursor: pointer; padding: 0 2px; }
.gf-tg:hover { border-color: var(--c); color: var(--text); }
.gf-tg.on { background: var(--c); border-color: var(--c); color: var(--bg); }
.gf-vals { font-size: .78rem; color: var(--text2); margin-top: 6px; line-height: 1.4; }
.gf-vals:empty, .gf-err:empty, .gf-note:empty { display: none; }
.gf-note { font-size: .78rem; color: var(--text2); margin-top: 6px; line-height: 1.45; }
.gf-note code { font-family: var(--font-mono); }
.gf-err { font-size: .8rem; color: var(--danger); margin-top: 6px; line-height: 1.4; font-weight: 600; }
.gen-result { position: sticky; top: 76px; padding: 12px 14px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; max-height: calc(100vh - 92px); overflow-y: auto; }
.gen-result-h { margin-bottom: 8px; }
.strip { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 5px; margin-bottom: 8px; }
.strip-c { --c: var(--accent); min-width: 0; text-align: center; padding: 5px 2px 6px; background: var(--bg2); border: 1px solid var(--border2); border-top: 3px solid var(--c); border-radius: 8px; }
.strip-c.bad { border-color: var(--danger); border-top-color: var(--danger); }
.strip-c.omit { border-style: dashed; }
.strip-c.omit .strip-l { color: var(--text2); }
.strip-l { font-size: .62rem; line-height: 1.15; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--muted); padding: 0 2px; min-height: 2.3em; display: flex; align-items: center; justify-content: center; }
.strip-v { display: block; font-size: 1rem; font-weight: 700; color: var(--c); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 2px; }
.strip-c .strip-v { transition: color .2s; }
.expr-in { flex: 1 1 10rem; min-width: 0; font-size: 1.3rem; font-weight: 600; letter-spacing: .06em; color: var(--accent); background: transparent; border: 0; outline: 0; padding: 2px 0; }
.expr-in[aria-invalid="true"] { color: var(--danger); }
.gen-result .expr-row:focus-within { border-color: var(--accent); }
.gen-result .out-sentence { font-size: 1.05rem; margin: 10px 0 0; }
.gen-result .out-runs { margin-top: 12px; }
.gen-result .run-ol li { padding: 5px 10px; font-size: .84rem; }
.gen-result .out-links { margin-top: 12px; }
.out-snip summary { cursor: pointer; font-size: .84rem; font-weight: 700; color: var(--text2); padding: 6px 0; }
.out-snip-b { display: grid; gap: 8px; justify-items: start; }
.out-snip-b .out-pre { width: 100%; }
.gen-dock { display: none; }
@media (max-width: 1000px) {
  .gen-grid { grid-template-columns: minmax(0, 1fr); }
  .gen-result { position: static; max-height: none; overflow: visible; }
  .gen-bar { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 1001px) { .gen-bar { grid-template-columns: minmax(0, 22rem) minmax(0, 1fr); } }
@media (max-width: 1000px) {
  .gen-dock { display: flex; align-items: center; gap: 10px; position: sticky; bottom: 0; z-index: 40; padding: 8px 150px 8px 12px; margin: 0 -2px; background: var(--surface); border: 1px solid var(--border2); border-radius: 12px; box-shadow: 0 -6px 18px rgba(0,0,0,.18); }
  .gen-dock-l { font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
  .gen-dock-v { flex: 1 1 auto; min-width: 0; font-size: 1.05rem; font-weight: 700; color: var(--accent); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .gen-dock-v.bad { color: var(--danger); font-size: .86rem; }
  .gen-dock .btn { min-height: 38px; flex: 0 0 auto; }
}
@media (max-width: 560px) {
  .gen-env { grid-template-columns: minmax(0, 1fr); }
  .gen-clock-b { margin-left: 0; }
  .gf-num { width: 4.6rem; }
  .strip-l { font-size: .54rem; letter-spacing: 0; }
  .strip-v { font-size: .86rem; }
  .strip { gap: 3px; }
  .gf-head { flex-wrap: wrap; }
  .expr-in { font-size: 1.15rem; }
  .gen-result .expr-row .btn { flex: 1 1 100%; }
}
.gf-err-sub { font-weight: 400; color: var(--text2); }

.gen .chip-btn, .gen .btn-sm { min-height: 38px; }
.gen .link-btn { display: inline-block; padding: 8px 2px; min-height: 36px; }
.gen .expr-in { min-height: 36px; }
.gen-result .expr-row { padding: 8px 12px; }
.gen-quick .chip-btn { min-height: 36px; }
@media (min-width: 1001px) { .gen .chip-btn, .gen .btn-sm { min-height: 34px; } .gen .link-btn { padding: 2px; min-height: 0; } }
@media (max-width: 520px) { .gen-dock { padding-right: 64px; } }
@media (max-width: 560px) {
  .gen-quick { flex-wrap: wrap; }
  .gen-quick-c { flex-wrap: nowrap; overflow-x: auto; flex: 1 1 100%; margin: 0 -2px; padding: 2px 2px 6px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
  .gen-quick-c .chip-btn { flex: 0 0 auto; scroll-snap-align: start; white-space: nowrap; }
}

/* ── Content architecture: breadcrumbs, answer box, embeds, link blocks, footer columns ── */
.page-hero .crumbs { margin: 0 0 10px; }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 0; margin: 0; padding: 0; font-size: .8rem; }
.crumbs li { display: inline-flex; align-items: center; min-width: 0; color: var(--muted); }
.crumbs li + li::before { content: "/"; margin: 0 8px; color: var(--muted); opacity: .7; }
.crumbs a { display: inline-flex; align-items: center; min-height: 28px; padding: 2px 1px; color: var(--text2); text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px; }
.crumbs a:hover { color: var(--text); text-decoration-color: currentColor; opacity: 1; }
.crumbs [aria-current="page"] { color: var(--text); font-weight: 600; overflow-wrap: anywhere; }
.page-meta { font-size: .8rem; color: var(--muted); margin: 6px 0 0; }
.page-hero .page-sub { max-width: 46rem; }
.page-hero--content { padding: 28px 0 24px; }
.page-hero--content .page-title { font-size: clamp(1.7rem, 1.3rem + 1.6vw, 2.4rem); }
.page-hero--content .page-sub { font-size: 1rem; line-height: 1.65; color: var(--text); }

.answer { margin: 22px 0 6px; padding: 16px 18px 14px; border: 1px solid var(--accent-border); background: var(--accent-soft); border-radius: 12px; max-width: 52rem; }
.answer h2 { font-family: var(--font-body); font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--accent); margin: 0 0 8px; }
.answer p { margin: 0 0 10px; color: var(--text); line-height: 1.65; font-size: .96rem; }
.answer p:last-child { margin-bottom: 0; }
.answer .expr-row { margin: 4px 0 10px; }
.answer .expr { font-size: 1.15rem; }
.answer ul { margin: 0 0 10px 18px; padding: 0; color: var(--text); font-size: .94rem; line-height: 1.6; }
.answer .a-sentence { font-family: var(--font-display); font-weight: 700; letter-spacing: -.01em; }

.emb { margin: 22px 0 8px; padding: 16px; border: 1px solid var(--border2); background: var(--surface); border-radius: 12px; min-width: 0; }
.emb-h { font-family: var(--font-display); font-size: 1.05rem; letter-spacing: -.01em; margin: 0 0 4px; }
.emb-s { font-size: .86rem; color: var(--text2); margin: 0 0 12px; line-height: 1.55; }
.emb-presets { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.emb-presets .chip-btn { min-height: 36px; }
.emb-builder { margin: 0 0 12px; padding: 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg2); }
.emb-fields { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.emb-l, .emb-t { font-size: .88rem; color: var(--text2); }
.emb-days { display: flex; flex-wrap: wrap; gap: 5px; width: 100%; }
.emb-days .gf-tg { flex: 1 1 3.1rem; min-width: 3.1rem; --c: var(--accent); }
.emb-fields .gf-num { width: 5.2rem; }
.emb-fields .gf-sel { flex: 0 1 11rem; }
.emb-err { font-size: .82rem; color: var(--danger); margin-top: 6px; font-weight: 600; }
.emb-err:empty { display: none; }
.emb-env { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: 10px; margin: 0 0 14px; }
.emb-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-bottom: 12px; }
.emb-grow { flex: 1 1 16rem; }
.emb-in { width: 100%; font-size: 1.05rem; letter-spacing: .04em; }
.emb-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: 10px; margin: 12px 0; }
.emb-tzn { font-weight: 500; color: var(--text2); font-size: .85em; }
.emb-out .strip { margin-top: 2px; }
.emb-out .out-sentence { margin: 12px 0 4px; }
.emb-note { font-size: .82rem; color: var(--text2); margin: 12px 0 0; line-height: 1.55; }
.emb-gen { margin: 22px 0 8px; }
.emb-gen > .emb-h { margin-bottom: 10px; }

.callout { margin: 16px 0; padding: 12px 14px; border-left: 3px solid var(--info, var(--accent)); border-radius: 0 10px 10px 0; background: var(--surface); }
.callout.warn { border-left-color: var(--warn); }
.callout p { margin: 0; font-size: .92rem; line-height: 1.65; color: var(--text); }
.callout b:first-child { color: var(--text); }
.prose .ref-scroll { margin: 14px 0; }
.prose td .btn-sm, .prose td a.tbl-open { white-space: nowrap; }
.prose td a.tbl-open { font-weight: 600; }
.prose td code, .prose th code { white-space: nowrap; }
.ref-table td.num, .ref-table th.num { text-align: right; }
.prose h3 { font-family: var(--font-display); font-size: 1.08rem; margin: 22px 0 6px; letter-spacing: -.01em; }
.prose ol { padding-left: 22px; }
pre.code { max-width: 100%; box-sizing: border-box; margin: 12px 0; padding: 12px 14px; background: var(--bg2); border: 1px solid var(--border2); border-radius: 10px; overflow-x: auto; font-size: .82rem; line-height: 1.6; color: var(--text); }
pre.code code { background: none; border: 0; padding: 0; font-size: inherit; white-space: pre; }
.prose dl.defs { margin: 12px 0; display: grid; gap: 8px; }
.prose dl.defs dt { font-weight: 700; color: var(--text); }
.prose dl.defs dd { margin: 0 0 6px; color: var(--text2); line-height: 1.65; font-size: .96rem; }
.toc { margin: 18px 0 4px; padding: 12px 16px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); max-width: 52rem; }
.toc h2 { font-family: var(--font-body); font-size: .72rem; text-transform: uppercase; letter-spacing: .09em; color: var(--muted); margin: 0 0 6px; }
.toc ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 2px 18px; }
.toc a { display: inline-flex; align-items: center; min-height: 28px; font-size: .88rem; }
.sources { margin: 8px 0 0; padding-left: 20px; }
.link-blocks { display: grid; gap: 4px; margin-top: 4px; }
.link-blocks .related { margin-top: 8px; }
.link-blocks h2.doc-h3 { margin: 22px 0 2px; }
.link-blocks .lb-sub { margin: 0 0 4px; font-size: .88rem; color: var(--text2); }
.platform-card { text-decoration: none; color: inherit; }
a.platform-card:hover { border-color: var(--accent-border); opacity: 1; }
a.platform-card .platform-card-name { color: var(--text); }
.guide-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 10px; }
.guide-grid a { display: block; padding: 14px 16px; border: 1px solid var(--border2); border-radius: 10px; background: var(--surface); color: inherit; text-decoration: none; }
.guide-grid a:hover { border-color: var(--accent-border); opacity: 1; }
.guide-grid b { display: block; font-size: .95rem; margin-bottom: 3px; color: var(--text); }
.guide-grid span { display: block; font-size: .82rem; color: var(--text2); line-height: 1.5; }

.site-footer .footer-grid { grid-template-columns: minmax(0, 1.5fr) repeat(4, minmax(0, 1fr)); }
.site-footer .footer-links.cols { columns: 1; }
.site-footer .footer-copy .fc-links { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.site-footer .footer-copy .fc-links a { display: inline-flex; align-items: center; min-height: 28px; color: var(--text2); }
@media (max-width: 960px) { .site-footer .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .site-footer .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 420px) { .site-footer .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 16px; } }
@media (max-width: 640px) { .emb { padding: 12px; } .answer { padding: 14px; } }
.section-sub a, .lb-sub a, .emb-s a, .page-sub a, .answer a, .callout a { text-decoration: underline; text-underline-offset: 3px; }