/* GENERATED FILE — DO NOT EDIT. Source: lib/tokens.js (TOKENS_CSS). Regenerate: python3 tools/gen-tokens.py */ /* ---------------------------------------------------------------- tokens -- */ :root{ /* brand canon */ --bgs-green:#0e5c67; --bgs-green-deep:#0a4750; --bgs-mint:#cee0d7; --bgs-gold:#c9a45c; /* light theme surfaces + ink */ --bg:#eaeeed; --paper:#ffffff; --surface:#f4f8f6; --surface-2:#e7f0ea; --line:#d5e3db; /* hairlines between rows/sections (decorative) */ --line-strong:#789689; /* borders of interactive controls — AA 3:1 vs paper */ --ink:#16292f; --ink-muted:#4a5f65; --ink-faint:#5f7379; /* roles */ --primary:#0e5c67; --primary-hover:#0a4750; --on-primary:#ffffff; --accent-surface:#e2eee8; --accent-ink:#08383f; --accent-line:#5f8878; --rule:#c9a45c; --gold-ink:#6b5214; --gold-surface:#f8f1e2; --heading:#0e5c67; --band:#0e5c67; --band-ink:#ffffff; --band-kicker:#cee0d7; --link:#0b525c; /* status */ --ok:#146348; --ok-surface:#e2f0e9; --warn:#7d5a12; --warn-surface:#fbf1da; --err:#96292c; --err-surface:#fbeaea; /* type */ --f-display:'Cormorant Garamond','Iowan Old Style',Georgia,serif; --f-body:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif; --fs-micro:0.8125rem; --fs-small:0.875rem; --fs-body:1rem; --fs-lead:1.0625rem; --fs-h4:1.125rem; --fs-h3:1.375rem; --fs-h2:1.6875rem; --fs-h1:2.125rem; --fs-display:2.625rem; --lh-tight:1.25; --lh-body:1.65; --ls-label:0.09em; --ls-kicker:0.18em; --ls-wide:0.03em; /* space scale */ --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s7:32px; --s8:40px; --s9:48px; --s10:64px; /* radii + elevation */ --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:22px; --r-pill:999px; --sh-1:0 1px 2px rgba(11,40,45,.06),0 1px 3px rgba(11,40,45,.05); --sh-2:0 2px 6px rgba(11,40,45,.07),0 6px 16px rgba(11,40,45,.06); --sh-3:0 10px 34px rgba(11,40,45,.14); /* controls */ --tap:44px; --focus:0 0 0 2px var(--paper),0 0 0 4px var(--primary); /* user preferences (set on by the admin toolbar) */ --ui-scale:1; --density:1; } [data-theme="dark"]{ --bg:#0a1416; --paper:#122226; --surface:#16292d; --surface-2:#1b3339; --line:#28474d; --line-strong:#628a90; --ink:#e2ecea; --ink-muted:#a8bfbd; --ink-faint:#93aaa8; --primary:#7fc4bd; --primary-hover:#a4d8d1; --on-primary:#052a30; --accent-surface:#1d3a40; --accent-ink:#cfe6df; --accent-line:#77a6a9; --rule:#c9a45c; --gold-ink:#e0be7d; --gold-surface:#2c2718; --heading:#a9d8d1; --band:#0a3238; --band-ink:#e2ecea; --band-kicker:#a9d8d1; --link:#8fd0c8; --ok:#6cc39c; --ok-surface:#14302a; --warn:#deb977; --warn-surface:#30290f; --err:#f0a3a3; --err-surface:#331a1b; --sh-1:0 1px 2px rgba(0,0,0,.4); --sh-2:0 2px 8px rgba(0,0,0,.45); --sh-3:0 12px 34px rgba(0,0,0,.55); --focus:0 0 0 2px var(--paper),0 0 0 4px var(--primary); } /* ------------------------------------------------------------------ base -- */ *,*::before,*::after{box-sizing:border-box} html{font-size:calc(16px * var(--ui-scale));-webkit-text-size-adjust:100%} body{ margin:0;background:var(--bg);color:var(--ink); font-family:var(--f-body);font-size:var(--fs-body);font-weight:400; line-height:var(--lh-body);-webkit-font-smoothing:antialiased; } h1,h2,h3,h4{font-family:var(--f-display);color:var(--heading);font-weight:600;line-height:var(--lh-tight);margin:0} h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3)} h4{font-size:var(--fs-h4)} p{margin:0 0 var(--s4)} a{color:var(--link)} img{max-width:100%} hr{border:none;border-top:1px solid var(--line);margin:var(--s6) 0} :focus-visible{outline:none;box-shadow:var(--focus);border-radius:var(--r-sm)} .bgs-rule::after{content:"";display:block;width:44px;height:2px;background:var(--rule);margin:var(--s2) 0 var(--s3)} .muted{color:var(--ink-muted);font-size:var(--fs-small)} .micro{font-size:var(--fs-micro)} .num{font-variant-numeric:tabular-nums;text-align:right} /* ---------------------------------------------------------------- labels -- */ .label,label.fl{ display:block;font-size:var(--fs-micro);font-weight:500;text-transform:uppercase; letter-spacing:var(--ls-label);color:var(--heading);margin:0 0 var(--s1); } /* ----------------------------------------------------------------- bands -- */ header.bgs{background:var(--band);color:var(--band-ink);padding:var(--s7) var(--s6);text-align:center} header.bgs img{width:76px;margin-bottom:var(--s1)} header.bgs .kicker{font-size:var(--fs-micro);letter-spacing:var(--ls-kicker);text-transform:uppercase;color:var(--band-kicker)} header.bgs h1{color:var(--band-ink);font-size:var(--fs-h1);margin:var(--s2) 0 var(--s1)} header.bgs p{color:var(--band-ink);opacity:.95;font-weight:300;font-size:var(--fs-small);margin:0} footer.bgs{background:var(--band);color:var(--band-ink);text-align:center;font-size:var(--fs-micro);font-weight:300;padding:var(--s4);letter-spacing:var(--ls-wide)} footer.bgs a{color:var(--band-kicker);text-decoration:none} /* ----------------------------------------------------------------- cards -- */ .card,.panel{ background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg); padding:calc(var(--s5) * var(--density)) calc(var(--s6) * var(--density)); box-shadow:var(--sh-1);margin-bottom:var(--s4); } .card h2,.panel h2{margin:0 0 var(--s3)} /* ----------------------------------------------------------------- chips -- */ .chip{ display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center; border:1px solid var(--line-strong);background:var(--paper);color:var(--ink); border-radius:var(--r-md);padding:var(--s3) var(--s4);min-height:var(--tap); font-family:inherit;font-size:var(--fs-body);line-height:1.35;text-align:left;cursor:pointer; transition:border-color .15s,background-color .15s,box-shadow .15s; } .chip:hover{border-color:var(--accent-line);background:var(--surface)} .chip[aria-pressed="true"],.chip.sel{ background:var(--accent-surface);border-color:var(--primary);color:var(--accent-ink); box-shadow:inset 0 0 0 1px var(--primary); } .chip small{display:block;color:var(--ink-muted);font-size:var(--fs-micro);margin-top:2px} .chip.wide{width:100%} /* --------------------------------------------------------------- badges --- */ .badge{ display:inline-block;border:1px solid var(--line-strong);border-radius:var(--r-pill); padding:2px var(--s3);font-size:var(--fs-micro);font-weight:500;color:var(--ink-muted); background:var(--paper);letter-spacing:var(--ls-wide); } .badge.ok{color:var(--ok);border-color:var(--ok);background:var(--ok-surface)} .badge.warn{color:var(--warn);border-color:var(--warn);background:var(--warn-surface)} .badge.err{color:var(--err);border-color:var(--err);background:var(--err-surface)} .badge.accent{color:var(--accent-ink);border-color:var(--accent-line);background:var(--accent-surface)} .badge.gold{color:var(--gold-ink);border-color:var(--rule);background:var(--gold-surface)} /* -------------------------------------------------------------- buttons --- */ .btn{ display:inline-flex;align-items:center;justify-content:center;gap:var(--s2); min-height:var(--tap);padding:var(--s3) var(--s6); font-family:inherit;font-size:var(--fs-small);font-weight:500;letter-spacing:var(--ls-wide); border-radius:var(--r-pill);border:1.5px solid var(--primary); background:var(--primary);color:var(--on-primary);cursor:pointer;text-decoration:none; transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s; } .btn:hover{background:var(--primary-hover);border-color:var(--primary-hover)} .btn.ghost{background:var(--paper);color:var(--primary);border-color:var(--line-strong)} .btn.ghost:hover{background:var(--accent-surface);border-color:var(--accent-line);color:var(--accent-ink)} .btn.danger{background:var(--paper);color:var(--err);border-color:var(--err)} .btn.danger:hover{background:var(--err-surface)} .btn.block{width:100%} .btn:disabled{opacity:.45;cursor:not-allowed} /* ---------------------------------------------------------------- forms --- */ input,select,textarea{ width:100%;padding:var(--s3) var(--s4);min-height:var(--tap); border:1.5px solid var(--line-strong);border-radius:var(--r-sm); font-family:inherit;font-size:var(--fs-body); /* 16px+ — no iOS zoom */ color:var(--ink);background:var(--paper); } textarea{min-height:88px;resize:vertical;line-height:var(--lh-body)} input:hover,select:hover,textarea:hover{border-color:var(--accent-line)} input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:var(--focus)} input[type=checkbox]{width:auto;min-height:auto;margin-right:var(--s2)} .row{display:flex;gap:var(--s3);flex-wrap:wrap} .row>div{flex:1;min-width:150px} /* --------------------------------------------------------------- tables --- */ table{width:100%;border-collapse:collapse;font-size:var(--fs-small)} th{ text-align:left;font-weight:500;font-size:var(--fs-micro);text-transform:uppercase; letter-spacing:var(--ls-label);color:var(--ink-muted); padding:var(--s2) var(--s3);border-bottom:1px solid var(--line-strong); } td{padding:calc(var(--s3) * var(--density)) var(--s3);border-bottom:1px solid var(--line);vertical-align:top} tbody tr:nth-child(even) td{background:var(--surface)} tbody tr:hover td{background:var(--accent-surface)} table .num{font-variant-numeric:tabular-nums;text-align:right} /* ------------------------------------------------------------ timelines --- */ .day{border-left:2px solid var(--line-strong);padding:2px 0 var(--s4) var(--s5);margin-left:var(--s2);position:relative} .day::before{content:"";position:absolute;left:-7px;top:9px;width:12px;height:12px;border-radius:50%;background:var(--rule)} .day b{color:var(--heading);font-weight:500} .day p{margin:2px 0 0;font-size:var(--fs-small);color:var(--ink-muted)} /* ---------------------------------------------------------------- price --- */ .price{ background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg); padding:var(--s5) var(--s6);margin-top:var(--s6);text-align:center; } .price .from{font-size:var(--fs-micro);letter-spacing:var(--ls-kicker);text-transform:uppercase;color:var(--ink-muted)} .price .amt{font-family:var(--f-display);font-size:var(--fs-h1);color:var(--heading);font-weight:600} .price small{display:block;color:var(--ink-muted);font-size:var(--fs-micro);margin-top:var(--s2)} /* --------------------------------------------------------------- glance --- */ .glance{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s1) 0 var(--s6)} .glance span{ border:1px solid var(--line-strong);border-radius:var(--r-pill); padding:var(--s1) var(--s4);font-size:var(--fs-micro);color:var(--accent-ink);background:var(--accent-surface); } /* ---------------------------------------------------------- empty state --- */ .empty{ text-align:center;color:var(--ink-muted);font-size:var(--fs-small); border:1px dashed var(--line-strong);border-radius:var(--r-md); padding:var(--s7) var(--s5);background:var(--surface); } /* ---------------------------------------------------------------- notes --- */ .note{font-size:var(--fs-micro);color:var(--ink-muted);text-align:center;margin-top:var(--s4)} .callout{ border-left:3px solid var(--rule);background:var(--surface); padding:var(--s3) var(--s4);border-radius:0 var(--r-md) var(--r-md) 0; font-size:var(--fs-small);margin:var(--s4) 0; } @media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}