:root{
  --ink:#2d291f;--muted:#746d5c;--yellow:#ffd94f;--cream:#fff8d9;
  --border:rgba(45,41,31,.12);--paper:rgba(255,255,255,.82);--danger:#a33a3a
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;min-height:100vh;font-family:"DM Sans",system-ui,sans-serif;color:var(--ink);
  background:radial-gradient(circle at top left,#fff1a8 0,transparent 35%),
  radial-gradient(circle at 90% 42%,#ffe0ea 0,transparent 32%),
  linear-gradient(160deg,#fffdf2,#fff8d9 55%,#f4f1ff);overflow-x:hidden
}
button,input{font:inherit}
button{color:inherit}
.hidden{display:none!important}
.shell{width:min(100% - 24px,720px);margin:auto;padding:42px 0 28px;position:relative;z-index:2}
.hero{text-align:center;padding:18px 8px 28px}
.bee-badge{
  border:0;width:66px;height:66px;display:grid;place-items:center;margin:0 auto 16px;font-size:36px;
  background:#fff;border-radius:22px;box-shadow:0 12px 30px #0001;cursor:default;
  animation:bob 3s ease-in-out infinite
}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-7px) rotate(5deg)}}
.eyebrow{letter-spacing:.16em;font-weight:700;font-size:.72rem;margin:0 0 12px}
h1,h2{font-family:"Fraunces",Georgia,serif;margin:0;line-height:.98}
h1{font-size:clamp(3rem,10vw,5.3rem);letter-spacing:-.055em}
h1 span{position:relative;z-index:1}
h1 span:after{content:"";position:absolute;left:-4px;right:-6px;bottom:4px;height:.22em;border-radius:99px;background:var(--yellow);z-index:-1;transform:rotate(-1.5deg)}
.intro{max-width:510px;margin:20px auto 0;color:var(--muted);line-height:1.65}
.card{padding:28px;border-radius:32px;background:var(--paper);border:1px solid #ffffffcc;box-shadow:0 22px 60px #3e31121f;backdrop-filter:blur(18px)}
.progress{display:flex;align-items:center;max-width:260px;margin:0 auto 32px}
.dot{width:12px;height:12px;border-radius:50%;background:#e7e0cc;transition:.2s}
.dot.active{background:#f5bf17;box-shadow:0 0 0 5px #f5bf1724}
.line{height:2px;flex:1;background:#e7e0cc}
.loading{text-align:center;color:var(--muted);padding:40px 12px}
.step{display:none;animation:fadeUp .24s ease}.step.active{display:block}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}}
.step-label{font-size:.7rem;letter-spacing:.16em;font-weight:800;color:#998b64;margin-bottom:8px}
h2{font-size:clamp(2.2rem,8vw,3.5rem);letter-spacing:-.04em}
.muted{color:var(--muted);line-height:1.55;margin:10px 0 24px}
.options{display:grid;gap:12px}
.option{width:100%;display:flex;gap:14px;align-items:center;text-align:left;padding:16px;border-radius:20px;background:#fff;border:1.5px solid var(--border);cursor:pointer;transition:.18s}
.option.selected,.option:hover{border-color:#edba19;background:#fff9df;transform:translateY(-1px)}
.icon{display:grid;place-items:center;flex:0 0 48px;height:48px;border-radius:15px;background:var(--cream);font-size:24px}
.option strong,.option small{display:block}.option small{color:var(--muted);margin-top:4px}
.next{width:100%;margin-top:22px;padding:16px 20px;border:0;border-radius:17px;background:var(--ink);color:#fff;font-weight:700;cursor:pointer;transition:.18s}
.next:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 25px #2d291f24}.next:disabled{opacity:.28;cursor:not-allowed}
.back,.secondary{border:0;background:transparent;cursor:pointer;color:var(--muted);font-weight:700}
.back{padding:0;margin-bottom:16px}.secondary{width:100%;padding:13px;margin-top:8px}
.date-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.date-option{border:1.5px solid var(--border);background:#fff;border-radius:18px;padding:15px 10px;cursor:pointer;text-align:left;transition:.18s}
.date-option:hover,.date-option.selected{background:#fff5c5;border-color:#edba19;transform:translateY(-1px)}
.date-top{display:flex;justify-content:space-between;align-items:start;gap:8px}
.dow{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.date-big{font-family:"Fraunces",Georgia,serif;font-size:1.75rem;line-height:1}
.date-note{display:block;color:#8e7a3f;font-size:.78rem;margin-top:8px;line-height:1.35}
.slot-count{font-size:.68rem;font-weight:700;background:#f8efbe;padding:5px 7px;border-radius:999px;white-space:nowrap}
.time-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.time{min-height:108px;padding:14px;border:1.5px solid var(--border);border-radius:19px;background:#fff;cursor:pointer;text-align:left;transition:.18s}
.time:hover,.time.selected{background:#fff5c5;border-color:#edba19;transform:translateY(-1px)}
.time .emoji{display:block;font-size:1.5rem;margin-bottom:8px}.time strong,.time small{display:block}.time small{color:var(--muted);font-size:.78rem;margin-top:3px}
.done{text-align:center}.confetti{font-size:1.8rem;margin-bottom:13px}
.summary{display:grid;gap:10px;text-align:left;margin:25px 0 16px}.summary div{padding:15px 17px;background:#fff;border:1px solid var(--border);border-radius:17px}
.summary span,.summary strong{display:block}.summary span{font-size:.68rem;letter-spacing:.13em;font-weight:800;color:#9b8d67;margin-bottom:5px}
.tiny{font-size:.86rem;color:var(--muted)}footer{text-align:center;color:#9c927a;font-size:.76rem;padding:24px 0 0}
.empty-state{padding:22px;background:#fff;border:1px dashed var(--border);border-radius:16px;color:var(--muted);text-align:center}

/* bees */
.bee-field{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.flying-bee{position:absolute;font-size:26px;opacity:.58;filter:drop-shadow(0 4px 8px #0001)}
.bee-a{top:15%;left:-50px;animation:flyA 15s linear infinite}.bee-b{top:42%;right:-50px;animation:flyB 19s linear infinite 2s}
.bee-c{top:68%;left:-60px;animation:flyC 22s linear infinite 6s}.bee-d{top:85%;right:-60px;animation:flyD 25s linear infinite 4s}
@keyframes flyA{0%{transform:translateX(0)}30%{transform:translateX(35vw) translateY(-30px) rotate(10deg)}65%{transform:translateX(70vw) translateY(25px) rotate(-8deg)}100%{transform:translateX(calc(100vw + 100px)) translateY(-10px)}}
@keyframes flyB{0%{transform:translateX(0) scaleX(-1)}40%{transform:translateX(-45vw) translateY(35px) scaleX(-1)}75%{transform:translateX(-78vw) translateY(-25px) scaleX(-1)}100%{transform:translateX(calc(-100vw - 100px)) scaleX(-1)}}
@keyframes flyC{0%{transform:translateX(0)}35%{transform:translateX(38vw) translateY(40px)}70%{transform:translateX(76vw) translateY(-35px)}100%{transform:translateX(calc(100vw + 120px)) translateY(20px)}}
@keyframes flyD{0%{transform:translateX(0) scaleX(-1)}45%{transform:translateX(-50vw) translateY(-45px) scaleX(-1)}100%{transform:translateX(calc(-100vw - 120px)) translateY(30px) scaleX(-1)}}

/* admin */
.admin-overlay{position:fixed;inset:0;z-index:100;background:#241f16b8;backdrop-filter:blur(10px);padding:18px;overflow:auto}
.admin-panel{width:min(100%,850px);margin:20px auto;background:#fffdf6;border-radius:28px;padding:24px;box-shadow:0 30px 90px #0004}
.admin-head{display:flex;justify-content:space-between;align-items:start;gap:20px}
.admin-head h2{font-size:2.6rem}.icon-btn{border:0;background:#f3eee0;width:42px;height:42px;border-radius:14px;cursor:pointer}
.admin-input,.field input{width:100%;padding:13px 14px;border:1.5px solid var(--border);border-radius:13px;background:#fff}
.error{color:var(--danger);min-height:1.2em}.admin-toolbar{display:flex;gap:8px;align-items:center;margin:10px 0 8px}
.compact{margin:0;width:auto}.save-status{min-height:1.4em;color:#6f6a56}
.admin-section{border-top:1px solid var(--border);padding-top:22px;margin-top:24px}
.section-title-row{display:flex;justify-content:space-between;align-items:start;gap:16px}
.section-title-row h3{margin:0;font-size:1.25rem}.section-title-row p{margin:5px 0 15px;color:var(--muted);font-size:.9rem}
.mini-btn{border:0;background:#2d291f;color:#fff;border-radius:12px;padding:9px 12px;font-weight:700;cursor:pointer;white-space:nowrap}
.admin-card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:15px;margin:10px 0}
.admin-grid{display:grid;grid-template-columns:90px 1fr 1.5fr auto;gap:8px;align-items:end}
.admin-grid.date-main{grid-template-columns:170px 1fr auto}
.field label{display:block;font-size:.7rem;font-weight:800;color:#8f846c;margin-bottom:5px;text-transform:uppercase;letter-spacing:.06em}
.remove-btn{border:0;background:#fff0ef;color:#9c3636;border-radius:11px;padding:11px 12px;cursor:pointer;font-weight:700}
.slot-list{margin:12px 0 0;padding-left:12px;border-left:3px solid #f3df81}
.slot-row{display:grid;grid-template-columns:72px 1fr 1.2fr 1.2fr auto;gap:7px;align-items:end;margin:8px 0}
.slot-actions{display:flex;justify-content:flex-end;margin-top:8px}
.slot-actions button{border:0;background:#fff6ce;border-radius:10px;padding:8px 10px;cursor:pointer;font-weight:700}
.hint{font-size:.78rem;color:var(--muted);margin:8px 0 0}

@media(max-width:680px){
  .shell{width:min(100% - 20px,720px);padding-top:24px}.card{padding:22px 17px}.date-grid{grid-template-columns:1fr}
  .admin-overlay{padding:8px}.admin-panel{margin:8px auto;padding:17px;border-radius:22px}
  .admin-grid,.admin-grid.date-main,.slot-row{grid-template-columns:1fr}
  .remove-btn{width:100%}.admin-toolbar{flex-wrap:wrap}.compact{flex:1}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}.bee-field{display:none}}