:root { --ink:#10172f; --ink-soft:#65708f; --paper:#f5f6fb; --white:#fffdf9; --mint:#b9f3dd; --yellow:#ffd166; --violet:#7769f2; --line:rgba(16,23,47,.12); --shadow:0 20px 55px rgba(16,23,47,.10); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:linear-gradient(180deg,#f4f5ff 0%,var(--paper) 60%,#fff 100%); font:16px/1.55 Inter,ui-sans-serif,system-ui,sans-serif; }
a { color:inherit; }
button,input,select,textarea { font:inherit; }
.topbar { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:1rem max(1.25rem,calc((100% - 1180px)/2)); color:var(--white); background:var(--ink); }
.brand { display:flex; gap:.75rem; align-items:center; color:inherit; text-decoration:none; }
.brand-mark { display:grid; width:2.45rem; height:2.45rem; place-items:center; border-radius:.7rem; color:var(--ink); background:var(--yellow); font-size:1.2rem; }
.brand strong,.brand small { display:block; }.brand strong { font-family:Georgia,serif; font-size:1.2rem; font-weight:500; }.brand small { color:rgba(255,255,255,.62); font-size:.72rem; }
.topbar nav { display:flex; gap:1rem; }.topbar nav a { color:var(--mint); font-size:.86rem; font-weight:800; text-decoration:none; }
.page-shell { width:min(1180px,calc(100% - 2rem)); margin:auto; padding:3.5rem 0 5rem; }
footer { padding:1.5rem; color:rgba(255,255,255,.68); background:var(--ink); font-size:.82rem; text-align:center; } footer a { color:var(--mint); }
.eyebrow { color:#d05d70; font-size:.73rem; font-weight:900; letter-spacing:.15em; text-transform:uppercase; }.eyebrow::before { display:inline-block; width:1.4rem; height:2px; margin:0 .5rem .2rem 0; background:currentColor; content:""; }
h1,h2,h3 { margin-top:0; font-family:Georgia,serif; font-weight:500; letter-spacing:-.04em; line-height:1.05; } h1 { font-size:clamp(3rem,7vw,6.8rem); } h2 { font-size:clamp(2rem,4vw,3.2rem); } h3 { font-size:1.6rem; }
p { color:var(--ink-soft); }
.button { display:inline-flex; min-height:2.8rem; align-items:center; justify-content:center; padding:.72rem 1.05rem; border:1px solid transparent; border-radius:999px; font-weight:850; text-decoration:none; cursor:pointer; transition:transform .2s ease,box-shadow .2s ease,background .2s ease; }.button:hover { transform:translateY(-2px); box-shadow:0 10px 25px rgba(16,23,47,.14); }.button--primary { color:var(--ink); background:var(--mint); }.button--dark { color:var(--white); background:var(--ink); }.button--ghost { border-color:var(--line); color:var(--ink); background:transparent; }.button--small { min-height:2.25rem; padding:.5rem .75rem; font-size:.8rem; }
.studio-hero,.form-hero,.editor-top { display:flex; justify-content:space-between; gap:2rem; align-items:end; margin-bottom:2.5rem; }.studio-hero > div:first-child { max-width:700px; }.studio-hero p,.form-hero p { max-width:34rem; font-size:1.1rem; }.section-heading { display:flex; justify-content:space-between; gap:1rem; align-items:end; margin:2rem 0 1.1rem; }.section-heading h2 { margin:.5rem 0 0; }.counter { color:var(--ink-soft); font-size:.85rem; font-weight:800; }
.event-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }.event-card { min-height:250px; display:flex; flex-direction:column; justify-content:space-between; padding:1.3rem; border:1px solid var(--line); border-radius:1.25rem; background:var(--white); box-shadow:var(--shadow); }.event-card h3 { margin:2.4rem 0 .35rem; }.event-card p { margin:0; font-size:.9rem; }.event-card__top,.event-card__actions { display:flex; justify-content:space-between; gap:.5rem; align-items:center; }.theme-pill,.status-pill { display:inline-flex; padding:.35rem .6rem; border-radius:999px; background:rgba(16,23,47,.08); font-size:.7rem; font-weight:900; }.status-pill--live { color:#206644; background:var(--mint); }.theme-minecraft { --theme-accent:#7769f2; background:linear-gradient(145deg,rgba(119,105,242,.18),rgba(185,243,221,.24)); }.theme-elegant { --theme-accent:#c58b5c; background:linear-gradient(145deg,rgba(197,139,92,.18),rgba(255,253,249,.9)); }.theme-floral { --theme-accent:#d56b89; background:linear-gradient(145deg,rgba(213,107,137,.16),rgba(255,230,235,.7)); }
.empty-state { padding:4rem 2rem; border:1px dashed rgba(16,23,47,.22); border-radius:1.4rem; text-align:center; }.empty-state__icon { display:grid; width:4rem; height:4rem; margin:0 auto 1rem; place-items:center; border-radius:1rem; color:var(--ink); background:var(--yellow); font-size:1.8rem; }.empty-state p { max-width:32rem; margin:0 auto 1.4rem; }.logout-form { margin-top:2rem; text-align:right; }.link-button { border:0; color:var(--ink-soft); background:transparent; text-decoration:underline; cursor:pointer; }
.auth-card { width:min(540px,100%); margin:5rem auto; padding:2rem; border:1px solid var(--line); border-radius:1.4rem; background:rgba(255,255,255,.82); box-shadow:var(--shadow); }.auth-card h1 { margin:1rem 0; font-size:clamp(2.7rem,7vw,5rem); }.stack-form,.form-section,.side-stack { display:grid; gap:1rem; }label { display:grid; gap:.35rem; color:var(--ink); font-size:.85rem; font-weight:850; }input,select,textarea { width:100%; padding:.8rem .85rem; border:1px solid var(--line); border-radius:.7rem; color:var(--ink); background:#fbfbff; }textarea { resize:vertical; }.form-error { color:#b13b32; font-size:.85rem; font-weight:800; }.notice { margin:1rem 0; padding:.85rem 1rem; border-radius:.7rem; font-weight:800; }.notice--success { color:#206644; background:var(--mint); }.notice--error { color:#9a382f; background:#ffd9d2; }
.editor-card { padding:1.5rem; border:1px solid var(--line); border-radius:1.3rem; background:rgba(255,255,255,.86); box-shadow:var(--shadow); }.form-section { grid-template-columns:220px 1fr; display:grid; gap:2rem; padding:1.2rem 0 1.8rem; border-bottom:1px solid var(--line); }.form-section:last-of-type { border-bottom:0; }.form-section h2 { margin:.45rem 0 .3rem; font-size:1.55rem; }.form-section p { margin:0; font-size:.86rem; }.step-number { color:var(--violet); font-size:.73rem; font-weight:900; letter-spacing:.1em; }.form-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:1rem; }.form-grid > label { grid-column:span 2; }.form-grid .field--wide { grid-column:span 3; }.template-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; }.template-option { display:grid; gap:.45rem; padding:.8rem; border:1px solid var(--line); border-radius:.9rem; background:var(--white); cursor:pointer; }.template-option input { position:absolute; opacity:0; }.template-option:has(input:checked) { border:2px solid var(--violet); box-shadow:0 8px 22px rgba(119,105,242,.15); }.template-option__preview { min-height:5.2rem; border-radius:.6rem; }.template-option strong { font-size:.9rem; }.template-option small { color:var(--ink-soft); font-size:.75rem; font-weight:500; }.editor-actions { display:flex; justify-content:flex-end; gap:.7rem; margin-top:1.25rem; }.editor-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:1.2rem; }.side-card { padding:1.2rem; border:1px solid var(--line); border-radius:1.1rem; background:rgba(255,255,255,.82); box-shadow:var(--shadow); }.side-card h2 { margin:.7rem 0; font-size:1.55rem; }.side-card p { font-size:.88rem; }.side-card code { display:block; overflow:auto; padding:.7rem; border-radius:.6rem; color:var(--ink); background:var(--paper); font-size:.76rem; }
.guest-panel { margin-top:1.3rem; padding:1.3rem; border:1px solid var(--line); border-radius:1.2rem; background:rgba(255,255,255,.86); box-shadow:var(--shadow); }.guest-add { margin-bottom:1rem; }.inline-form { display:grid; grid-template-columns:1.4fr 1fr .65fr auto; gap:.6rem; }.table-scroll { overflow:auto; }table { width:100%; min-width:850px; border-collapse:collapse; }th,td { padding:.8rem .55rem; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }th { color:var(--ink-soft); font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; }td { font-size:.86rem; }td small { display:block; color:var(--ink-soft); }.comment-cell { max-width:220px; color:var(--ink-soft); white-space:pre-wrap; }.empty-cell { padding:2rem; color:var(--ink-soft); text-align:center; }
.public-body { min-height:100vh; color:var(--white); background:#10172f; }.public-shell { min-height:100vh; background:linear-gradient(180deg,rgba(16,23,47,.08),rgba(16,23,47,.85)),url('/assets/voxel-journey.png') center/cover fixed; }.public-hero { position:relative; min-height:630px; display:grid; align-content:end; overflow:hidden; padding:clamp(2rem,8vw,7rem) max(1.5rem,calc((100% - 1080px)/2)); }.public-hero h1 { max-width:780px; margin:.8rem 0 1rem; color:#fff; }.public-hero p { max-width:540px; color:rgba(255,255,255,.86); font-size:1.15rem; }.public-date { display:flex; flex-wrap:wrap; gap:1rem; margin-top:1.4rem; color:var(--yellow); font-weight:900; text-transform:uppercase; }.public-character { position:absolute; right:8%; bottom:-1rem; width:min(37vw,28rem); filter:drop-shadow(0 1rem 1rem rgba(0,0,0,.3)); }.public-content { padding:5rem max(1.5rem,calc((100% - 1080px)/2)); background:rgba(16,23,47,.52); }.public-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:3rem; align-items:start; }.public-grid h2 { color:#fff; }.lead { color:rgba(255,255,255,.8); font-size:1.2rem; }.public-card { padding:1.4rem; border:1px solid rgba(255,255,255,.25); border-radius:1.2rem; background:rgba(255,255,255,.1); backdrop-filter:blur(12px); }.public-card h3 { color:#fff; }.public-card p { color:rgba(255,255,255,.78); }.public-card strong { color:var(--yellow); }.rsvp-form { display:grid; gap:.9rem; }.rsvp-form label { color:#fff; }.rsvp-form input,.rsvp-form select,.rsvp-form textarea { color:var(--ink); background:rgba(255,255,255,.92); }.button-row { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.5rem; }.button--light { color:var(--ink); background:#fff; }.button--outline { border-color:rgba(255,255,255,.5); color:#fff; }.success-mark { display:grid; width:3rem; height:3rem; place-items:center; border-radius:50%; color:var(--ink); background:var(--mint); font-size:1.5rem; font-weight:900; }.public-modal-note { margin-top:1rem; padding:.8rem; color:var(--ink); border-radius:.7rem; background:var(--mint); font-weight:800; }.public-body footer { background:rgba(16,23,47,.8); }
@media (max-width:850px) { .topbar nav { display:none; }.studio-hero,.form-hero,.editor-top { display:block; }.studio-hero .button,.editor-top__actions { margin-top:1rem; }.event-grid { grid-template-columns:1fr 1fr; }.editor-layout,.public-grid { grid-template-columns:1fr; }.form-section { grid-template-columns:1fr; gap:1rem; }.public-character { right:-2rem; width:16rem; opacity:.65; } }
@media (max-width:600px) { .page-shell { padding-top:2.2rem; }.event-grid,.template-grid { grid-template-columns:1fr; }.form-grid { grid-template-columns:1fr; }.form-grid > label,.form-grid .field--wide { grid-column:1/-1; }.inline-form { grid-template-columns:1fr; }.public-hero { min-height:560px; }.public-hero h1 { font-size:3.8rem; }.public-character { right:-3rem; width:15rem; }.button-row,.editor-actions { align-items:stretch; flex-direction:column; }.button { width:100%; } }