:root { --ink:#17212b; --muted:#64717e; --paper:#fbfaf7; --lav:#ebe6ff; --purple:#6046d6; --mint:#ccefe0; --line:#dbe1e6; --warm:#fbf3e5; }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; } main { max-width:1150px; padding:0 34px 72px; margin:auto; }.topbar { height:88px; display:flex; align-items:center; justify-content:space-between; }.brand { color:var(--ink); text-decoration:none; font-weight:800; letter-spacing:-1.3px; font-size:24px; }.brand span { color:var(--purple); }.intro { max-width:720px; padding:95px 0 70px; }.eyebrow { margin:0 0 12px; color:var(--purple); text-transform:uppercase; letter-spacing:1.6px; font-size:12px; font-weight:800; }.intro h1,.meeting-head h1 { font-size:clamp(42px,6vw,72px); line-height:.98; letter-spacing:-3.6px; margin:0 0 24px; }.intro>p:not(.eyebrow) { max-width:600px; color:var(--muted); font-size:20px; line-height:1.5; }.primary,.secondary,.ghost { border:0; cursor:pointer; border-radius:7px; padding:13px 18px; font-weight:750; font-size:15px; transition:transform .12s, background .12s; }.primary:hover,.secondary:hover,.ghost:hover { transform:translateY(-1px); }.primary { background:var(--purple); color:white; box-shadow:0 5px 0 #44309f; }.primary span { font-size:20px; padding-left:8px; }.secondary { background:var(--lav); color:#44309f; }.ghost { background:transparent; color:var(--ink); border:1px solid var(--line); }.hidden { display:none!important; }.planner { padding-top:30px; }.meeting-head,.results-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; }.meeting-head h1 { font-size:42px; margin-bottom:8px; }.timezone,.selection-summary { color:var(--muted); margin:0; }.actions { display:flex; gap:10px; flex-wrap:wrap; }.notice { margin:34px 0 18px; padding:13px 15px; background:var(--warm); border-radius:7px; font-size:14px; }.identity { display:flex; align-items:center; gap:12px; margin:18px 0 22px; }.identity label { font-weight:750; }.identity input { width:190px; }.identity span { font-size:13px; color:var(--muted); } input,select { display:block; border:1px solid #cbd4dc; background:white; border-radius:6px; padding:10px; font:inherit; color:var(--ink); }.calendar-wrap { overflow:auto; border:1px solid var(--line); border-radius:10px; background:white; }.calendar { display:grid; min-width:670px; grid-template-columns:72px repeat(var(--days),1fr); }.day-head { position:sticky; top:0; background:#f5f7f8; padding:14px 10px; text-align:center; border-bottom:1px solid var(--line); font-weight:800; font-size:14px; }.time { padding:8px 12px; font-size:12px; color:var(--muted); text-align:right; border-bottom:1px solid var(--line); height:41px; }.slot { height:41px; border:0; border-left:1px solid var(--line); border-bottom:1px solid var(--line); background:white; cursor:crosshair; }.slot:hover { background:#f2efff; }.slot.selected { background:var(--purple); }.selection-summary { margin-top:14px; }.results { margin-top:42px; padding:28px; background:white; border:1px solid var(--line); border-radius:10px; }.results h2 { margin:0; font-size:28px; letter-spacing:-1px; }.best-times { display:grid; grid-template-columns:repeat(auto-fit,minmax(185px,1fr)); gap:12px; margin-top:25px; }.time-card { padding:16px; border-radius:8px; background:var(--mint); }.time-card strong { display:block; font-size:18px; margin-bottom:5px; }.time-card span { color:#395c4d; font-size:14px; }.legend { margin-top:20px; color:var(--muted); font-size:13px; display:flex; gap:8px; align-items:center; }.swatch { width:16px; height:16px; border-radius:3px; display:inline-block; }.low { background:#edf2f3; }.high { background:#6046d6; } dialog { width:min(540px,calc(100% - 30px)); border:0; border-radius:12px; padding:28px; box-shadow:0 24px 80px #17212b44; } dialog::backdrop { background:#17212b77; } dialog h2 { margin:0 0 24px; letter-spacing:-1px; }.close { position:absolute; right:16px; top:14px; background:transparent; border:0; font-size:26px; cursor:pointer; } form label { display:block; font-size:13px; font-weight:700; margin-bottom:16px; } form input,form select { width:100%; margin-top:7px; }.form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.full { width:100%; margin-top:6px; }.toast { visibility:hidden; position:fixed; bottom:28px; left:50%; transform:translateX(-50%); background:#17212b; color:white; padding:12px 16px; border-radius:7px; font-size:14px; }.toast.show { visibility:visible; } @media(max-width:650px) { main { padding:0 18px 48px; }.intro { padding:50px 0; }.meeting-head,.results-head { display:block; }.actions { margin-top:20px; }.identity { align-items:flex-start; flex-direction:column; }.identity input { width:100%; }.meeting-head h1 { font-size:35px; }.form-row { grid-template-columns:1fr; gap:0; } }