@font-face { font-family: "Inter"; src: url("/static/Inter.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
:root {
  --canvas: #fffaf0; --soft: #faf5e8; --card: #f5f0e0; --strong: #ebe6d6; --hair: #e5e5e5; --hair-soft: #f0f0f0;
  --ink: #0a0a0a; --body: #3a3a3a; --muted: #6a6a6a; --muted-soft: #9a9a9a; --btn: #0a0a0a; --btn-ink: #fff; --btn-hover: #1f1f1f;
  --pink: #ff4d8b; --teal: #1a3a3a; --lavender: #b8a4ed; --peach: #ffb084; --ochre: #e8b94a; --mint: #a4d4c5; --coral: #ff6b5a;
  --ok: #22c55e; --warn: #f59e0b; --err: #ef4444; --shadow: rgba(10,10,10,.12);
}
@media (prefers-color-scheme: dark) { :root {
  --canvas: #0a1a1a; --soft: #102121; --card: #1a2a2a; --strong: #243737; --hair: #2b3d3d; --hair-soft: #1f3030;
  --ink: #fffaf0; --body: #d9d5c8; --muted: #a0a0a0; --muted-soft: #7c8c8c; --btn: #fffaf0; --btn-ink: #0a0a0a; --btn-hover: #e9e3d2; --shadow: rgba(0,0,0,.4);
} }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--canvas); color: var(--body); font: 400 16px/1.55 "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--ink); text-underline-offset: 3px; }
h1, h2, h3, h4 { color: var(--ink); margin: 0; font-weight: 500; }
.display-xl { font-size: clamp(44px, 7vw, 72px); line-height: 1; letter-spacing: -.035em; }
.display-lg { font-size: clamp(34px, 5vw, 56px); line-height: 1.05; letter-spacing: -.035em; }
.display-md { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.1; letter-spacing: -.025em; }
.display-sm { font-size: 28px; line-height: 1.15; letter-spacing: -.02em; }
.title-lg { font-size: 24px; font-weight: 600; letter-spacing: -.01em; } .title-md { font-size: 18px; font-weight: 600; } .title-sm { font-size: 16px; font-weight: 600; color: var(--ink); }
.lead { font-size: 19px; color: var(--body); max-width: 34em; } .muted { color: var(--muted); } .small { font-size: 14px; }
.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.section { padding: 80px 0; } .section.tight { padding: 48px 0; }
/* nav */
.nav { position: sticky; top: 0; z-index: 10; background: var(--canvas); border-bottom: 1px solid var(--hair); }
.nav .wrap { display: flex; align-items: center; height: 64px; gap: 28px; }
.brand { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 20px; letter-spacing: -.02em; text-decoration: none; color: var(--ink); }
.brand img { width: 34px; height: 34px; }
.nav a.link { text-decoration: none; font-size: 14px; font-weight: 500; color: var(--muted); padding: 8px 4px; } .nav a.link:hover, .nav a.link.on { color: var(--ink); }
.nav .grow { flex: 1; } .nav form { margin: 0; display: inline; }
/* buttons — 12px radius, 44px tall */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 20px; border-radius: 12px; border: 1px solid transparent; background: var(--btn); color: var(--btn-ink); font: 600 14px/1 "Inter", sans-serif; text-decoration: none; cursor: pointer; transition: background .15s; }
.btn:hover { background: var(--btn-hover); } .btn.secondary { background: var(--canvas); color: var(--ink); border-color: var(--hair); } .btn.secondary:hover { background: var(--card); }
.btn.on-color { background: #fffaf0; color: #0a0a0a; } .btn.ink { background: #0a0a0a; color: #fff; } .btn.small { height: 34px; padding: 0 14px; font-size: 13px; } .btn.danger { background: var(--err); color: #fff; } .btn.block { width: 100%; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
/* cards */
.card { background: var(--canvas); border: 1px solid var(--hair); border-radius: 16px; padding: 24px; } .card.cream { background: var(--card); border-color: transparent; } .card.soft { background: var(--soft); border-color: transparent; }
.fc { border-radius: 24px; padding: 32px; color: #0a0a0a; } .fc.pink { background: var(--pink); color: #fff; } .fc.teal { background: var(--teal); color: #fff; } .fc.lavender { background: var(--lavender); } .fc.peach { background: var(--peach); } .fc.ochre { background: var(--ochre); } .fc.cream { background: var(--card); color: var(--ink); }
.fc h3 { color: inherit; font-size: 20px; font-weight: 600; margin: 14px 0 8px; } .fc p { margin: 0; color: inherit; opacity: .85; }
.fc .ico { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.22); font-size: 20px; }
.fc.lavender .ico, .fc.peach .ico, .fc.ochre .ico { background: rgba(10,10,10,.1); }
.grid { display: grid; gap: 20px; } .g2 { grid-template-columns: repeat(2, 1fr); } .g3 { grid-template-columns: repeat(3, 1fr); } .g4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .g3, .g4 { grid-template-columns: repeat(2, 1fr); } .hero { grid-template-columns: 1fr !important; } }
@media (max-width: 620px) { .g2, .g3, .g4 { grid-template-columns: 1fr; } .section { padding: 56px 0; } .nav .hide-sm { display: none; } }
/* hero */
.hero { display: grid; grid-template-columns: 7fr 5fr; gap: 40px; align-items: center; padding: 72px 0 56px; }
.hero .cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; } .hero-art { background: var(--soft); border-radius: 24px; overflow: hidden; aspect-ratio: 13 / 10; } .hero-art svg { width: 100%; height: 100%; display: block; }
.kbd { display: inline-block; padding: 1px 8px; border-radius: 6px; background: var(--card); color: var(--ink); border: 1px solid var(--hair); font-weight: 600; font-size: .9em; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; } .chip, .badge { display: inline-block; padding: 4px 12px; border-radius: 9999px; background: var(--card); color: var(--ink); font-size: 13px; font-weight: 500; }
.badge.pro { background: var(--pink); color: #fff; } .badge.ok { background: rgba(34,197,94,.18); color: var(--ok); } .badge.warn { background: rgba(245,158,11,.2); color: var(--warn); } .badge.err { background: rgba(239,68,68,.16); color: var(--err); }
/* pricing */
.price { display: flex; flex-direction: column; gap: 14px; } .price .amt { font-size: 44px; font-weight: 500; letter-spacing: -.03em; line-height: 1; } .price ul { list-style: none; margin: 6px 0 10px; padding: 0; display: grid; gap: 10px; } .price li { display: flex; gap: 10px; font-size: 15px; } .price li::before { content: "✓"; font-weight: 700; } .price li.no { opacity: .55; } .price li.no::before { content: "–"; }
.fc.teal .price .amt, .fc.teal h3 { color: #fff; }
/* forms */
.form { display: grid; gap: 16px; max-width: 440px; } .form label { display: grid; gap: 6px; font-size: 14px; font-weight: 600; color: var(--ink); }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], select, textarea { width: 100%; height: 44px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--hair); background: var(--canvas); color: var(--ink); font: 400 16px "Inter", sans-serif; }
textarea { height: auto; padding: 12px 16px; min-height: 160px; font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 13px; } input:focus, select:focus, textarea:focus { outline: none; border: 1.5px solid var(--ink); padding-left: 15.5px; }
.err-box, .ok-box, .info-box { padding: 12px 16px; border-radius: 12px; font-size: 14px; margin: 0 0 16px; } .err-box { background: rgba(239,68,68,.12); color: var(--err); } .ok-box { background: rgba(34,197,94,.14); color: var(--ok); } .info-box { background: var(--card); color: var(--ink); }
.license { font: 600 22px ui-monospace, "SF Mono", Menlo, monospace; letter-spacing: .04em; background: var(--card); padding: 16px 20px; border-radius: 12px; color: var(--ink); display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
/* tables (admin) */
table { width: 100%; border-collapse: collapse; font-size: 14px; } th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; padding: 10px 12px; border-bottom: 1px solid var(--hair); } td { padding: 12px; border-bottom: 1px solid var(--hair-soft); vertical-align: middle; color: var(--ink); } tr:hover td { background: var(--soft); }
.toolbar { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-bottom: 20px; } .toolbar input, .toolbar select { width: auto; min-width: 150px; }
.stat { font-size: 40px; font-weight: 500; letter-spacing: -.03em; line-height: 1; color: inherit; } .stats .fc { padding: 24px; }
.admin-nav { background: var(--teal); } .admin-nav .wrap { display: flex; align-items: center; gap: 22px; height: 56px; } .admin-nav a, .admin-nav button { color: #fff; font-size: 14px; font-weight: 500; text-decoration: none; opacity: .8; background: none; border: 0; cursor: pointer; font-family: inherit; } .admin-nav a:hover, .admin-nav a.on { opacity: 1; } .admin-nav .grow { flex: 1; } .admin-nav form { margin: 0; }
.pager { display: flex; gap: 10px; align-items: center; margin-top: 18px; justify-content: space-between; }
.row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; } code, .mono { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 13px; }
footer { border-top: 1px solid var(--hair); padding: 40px 0; color: var(--muted); font-size: 14px; background: var(--soft); } footer a { color: var(--muted); } footer .wrap { display: flex; gap: 24px; flex-wrap: wrap; justify-content: space-between; }
.prose { max-width: 720px; } .prose h2 { font-size: 22px; margin: 32px 0 8px; } .prose p, .prose li { color: var(--body); }
details { border-top: 1px solid var(--hair); padding: 18px 0; } details:last-of-type { border-bottom: 1px solid var(--hair); } summary { cursor: pointer; font-weight: 600; color: var(--ink); } details p { margin: 10px 0 0; }

/* generated from former inline styles (CSP forbids inline style) */
.u1{margin-top:40px}
.u2{margin:0}
.u3{opacity:.8}
.u4{margin-top:14px}
.u5{margin-top:20px}
.u6{margin-top:36px}
.u7{padding:48px}
.u8{margin:8px 0 6px}
.u9{margin-bottom:20px}
.u10{padding:56px;text-align:center}
.u11{color:#fff}
.u12{margin:12px 0 24px;opacity:.9}
.u13{margin-top:12px}
.u14{margin:24px 0}
.u15{margin-top:24px}
.u16{align-items:center}
.u17{margin:10px 0 20px}
.u18{margin:8px 0 28px}
.u19{margin:0;font-size:24px}
.u20{margin:10px 0 18px}
.u21{margin:6px 0 14px}
.u22{margin-top:16px}
.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}.mt24{margin-top:24px}.mt32{margin-top:32px}.mb16{margin-bottom:16px}.mb24{margin-bottom:24px}.right{margin-left:auto}.nowrap{white-space:nowrap}.w100{width:100%}.center{text-align:center}.mw560{max-width:560px}.mw760{max-width:760px}.stack{display:grid;gap:16px}.flex1{flex:1}
.scroll{overflow-x:auto}.cb{width:auto;height:auto}.inline{display:inline}.sm-input{width:auto;height:34px;font-size:13px}.break{word-break:break-all}.pre{white-space:pre-wrap}

.admin-nav strong{color:#fff;font-weight:600;margin-right:6px}.admin-nav .small{color:#fff;opacity:.7}
.wrap>.form.card,.wrap>form.card.mw560{margin-left:auto;margin-right:auto}