@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');

:root { --ink:#1f2924; --muted:#6f7972; --paper:#f7f5ef; --card:#fffef9; --line:#e5e1d7; --moss:#315d49; --sage:#dce9de; --clay:#eacdb9; --amber:#c48529; --blue:#6e8da8; --shadow:0 12px 40px rgba(35,42,35,.08); }
* { box-sizing:border-box } body { margin:0; color:var(--ink); background:var(--paper); font-family:'DM Sans',sans-serif; } a { color:inherit; text-decoration:none }
.shell { max-width:1220px; margin:auto; padding:0 28px }.top { height:76px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line) }.brand { font-family:'Playfair Display'; font-size:25px; font-weight:700; letter-spacing:-.04em }.brand span { color:var(--moss) }.nav { display:flex; gap:24px; color:var(--muted); font-size:14px }.nav a.active { color:var(--ink); font-weight:700 }.avatar { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--sage); color:var(--moss); font-size:13px; font-weight:700; border:0; cursor:pointer }
.hero { display:flex; justify-content:space-between; align-items:end; padding:58px 0 35px }.eyebrow { font:500 11px 'DM Mono'; letter-spacing:.12em; text-transform:uppercase; color:var(--moss) } h1 { font:600 clamp(36px,5vw,58px) 'Playfair Display'; letter-spacing:-.055em; margin:8px 0 0; line-height:1 }.weather { text-align:right; color:var(--muted); font-size:14px }.weather b { color:var(--ink); font-size:22px; display:block; margin-bottom:3px }.grid { display:grid; grid-template-columns:1.3fr .9fr .9fr; gap:18px; padding-bottom:42px }.card { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:23px; box-shadow:var(--shadow) }.card h2 { margin:0 0 18px; font-size:14px }.card-head { display:flex; align-items:center; justify-content:space-between }.soft { color:var(--muted); font-size:13px }.schedule { grid-row:span 2 }.event { display:grid; grid-template-columns:72px 1fr; padding:17px 0; border-top:1px solid var(--line) }.event time { color:var(--moss); font:500 12px 'DM Mono' }.event b { font-size:14px }.event span { display:block; color:var(--muted); font-size:13px; margin-top:3px }.home-item { display:flex; align-items:center; gap:11px; padding:12px 0; border-top:1px solid var(--line); font-size:14px }.dot { height:9px; width:9px; border-radius:50%; background:var(--amber) }.dot.blue { background:var(--blue) }.dot.green { background:var(--moss) }.home-item small { margin-left:auto; color:var(--muted); font-size:12px }.travel { background:var(--moss); color:white; border:none; background-image:linear-gradient(135deg, #315d49, #244233) }.travel p { color:#d7e4d8; font-size:14px; line-height:1.5; max-width:220px }.travel .eyebrow { color:#b7d2bd }.record { display:flex; justify-content:space-between; padding:11px 0; border-top:1px solid var(--line); font-size:14px }.record span { color:var(--muted); font-size:12px }.section-title { font:600 28px 'Playfair Display'; margin:36px 0 20px }.empty { color:var(--muted); font-size:14px; line-height:1.5 }
.landing { min-height:100vh; background:radial-gradient(circle at 80% 20%,#e2efdf 0,transparent 28%),var(--paper) }.landing .top { border:0 }.landing-hero { max-width:720px; padding:115px 0 100px }.landing h1 { font-size:clamp(50px,8vw,86px); line-height:.95; margin:16px 0 24px }.landing p { max-width:560px; color:var(--muted); line-height:1.65; font-size:18px }.button { display:inline-block; margin-top:24px; padding:13px 20px; background:var(--moss); color:#fff; border-radius:9px; font-weight:700; font-size:14px }.promise { display:flex; gap:26px; color:var(--muted); font-size:13px; margin-top:50px }.promise b { color:var(--ink); display:block; margin-bottom:4px }
.auth-page { min-height:100vh; display:grid; place-items:center; padding:24px; background:radial-gradient(circle at 20% 15%,#e1ecdf 0,transparent 34%),var(--paper) }.auth-card { width:100%; max-width:400px; background:var(--card); padding:38px; border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow) }.auth-card h1 { font-size:38px; margin:10px 0 8px }.auth-card p { color:var(--muted); font-size:14px; margin:0 0 26px }.field { margin:15px 0 }.field label { display:block; font-size:13px; font-weight:700; margin-bottom:7px }.field input, .field select { width:100%; padding:12px; font:inherit; border:1px solid var(--line); background:white; border-radius:8px; outline-color:var(--moss) }.form-button { width:100%; padding:13px; border:0; background:var(--moss); color:white; font:700 14px inherit; border-radius:8px; cursor:pointer; margin-top:8px }.error { min-height:18px; color:#a44b32; font-size:13px; margin-top:13px }
.admin-wrap { max-width:850px; margin:48px auto; padding:0 28px }.admin-head { display:flex; justify-content:space-between; align-items:end; margin-bottom:26px }.admin-head h1 { font-size:46px }.users { width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--line); border-radius:14px; overflow:hidden }.users th,.users td { padding:15px; text-align:left; border-bottom:1px solid var(--line); font-size:14px }.users th { color:var(--muted); font-size:12px }.pill { display:inline-block; padding:4px 8px; background:var(--sage); color:var(--moss); border-radius:20px; font-size:11px; font-weight:700 }.modal { display:none; position:fixed; inset:0; background:rgba(31,41,36,.35); place-items:center; padding:20px }.modal.open { display:grid }.modal-box { width:100%; max-width:420px; background:white; padding:28px; border-radius:16px; box-shadow:var(--shadow) }.modal-box h2 { margin:0 0 15px; font-family:'Playfair Display' }.small-button { border:1px solid var(--line); background:white; padding:9px 12px; border-radius:8px; cursor:pointer; font:600 13px inherit }.logout { color:var(--muted); font-size:13px; background:none; border:0; cursor:pointer }
@media (max-width:720px) { .nav { display:none }.hero { align-items:start; gap:20px; flex-direction:column }.weather{text-align:left}.grid { grid-template-columns:1fr }.schedule { grid-row:auto }.promise{flex-direction:column; gap:14px}.users th:nth-child(2),.users td:nth-child(2){display:none} }
