:root{
  --ink:#1F1A2E; --plum:#2E2440; --plum-light:#3B2E52;
  --gold:#D4A857; --gold-soft:#e8caa0; --rose:#E8B4B8;
  --cream:#F7F3ED; --ivory:#FAF7F2; --line:rgba(247,243,237,0.14);
}
*{box-sizing:border-box;}
body{margin:0; background:var(--ivory); color:var(--ink); font-family:'Inter',sans-serif; -webkit-font-smoothing:antialiased;}
h1,h2,h3,.serif{font-family:'Fraunces',serif;}
.mono{font-family:'JetBrains Mono',monospace;}
a{color:inherit;}
.wrap{max-width:920px; margin:0 auto; padding:0 24px;}

nav.appnav{background:var(--ink); color:var(--cream); border-bottom:1px solid var(--line);}
nav.appnav .wrap{display:flex; align-items:center; justify-content:space-between; height:68px;}
.logo{display:flex; align-items:center; gap:10px; font-family:'Fraunces',serif; font-weight:500; font-size:19px;}
.logo-mark{width:24px;height:24px;border-radius:50%;background:conic-gradient(from 200deg, var(--gold), var(--rose), var(--gold));}
.navlinks{display:flex; gap:24px; font-size:14px;}
.navlinks a{text-decoration:none; opacity:0.75;}
.navlinks a:hover{opacity:1;}

main{padding:56px 0 90px;}
.eyebrow{font-family:'JetBrains Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.06em; color:#a9803f; display:block; margin-bottom:10px;}
h1.page-title{font-size:clamp(26px,3.4vw,38px); font-weight:500; margin:0 0 8px;}
p.page-sub{color:#5c5346; font-size:15px; margin:0 0 36px; max-width:520px;}

.card{background:#fff; border:1px solid rgba(31,26,46,0.1); border-radius:20px; padding:30px;}
.card + .card{margin-top:20px;}

label{display:block; font-size:13px; font-weight:600; margin-bottom:6px; color:#443b30;}
input, select, textarea{
  width:100%; padding:12px 14px; border-radius:12px; border:1px solid rgba(31,26,46,0.15);
  font-family:'Inter',sans-serif; font-size:14.5px; margin-bottom:18px; background:#fff; color:var(--ink);
}
input:focus, select:focus, textarea:focus{outline:2px solid var(--gold); outline-offset:1px; border-color:transparent;}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:13px 24px; border-radius:100px;
  font-weight:600; font-size:14.5px; text-decoration:none; border:1px solid transparent; cursor:pointer; width:100%;
}
.btn-primary{background:var(--ink); color:var(--cream);}
.btn-primary:hover{background:#332a48;}
.btn-gold{background:var(--gold); color:var(--ink);}
.btn-gold:hover{background:var(--gold-soft);}
.btn-ghost{background:transparent; border-color:rgba(31,26,46,0.18); color:var(--ink);}

.tabs{display:flex; gap:6px; background:#efe9df; border-radius:100px; padding:4px; margin-bottom:28px; width:fit-content;}
.tab{padding:9px 20px; border-radius:100px; font-size:13.5px; font-weight:600; cursor:pointer; color:#5c5346;}
.tab.active{background:var(--ink); color:var(--cream);}

.alert{padding:13px 16px; border-radius:12px; font-size:14px; margin-bottom:18px;}
.alert-error{background:#fbe4e4; color:#8a3a3a;}
.alert-ok{background:#e3f0e6; color:#2f6b3d;}

.event-row{display:flex; align-items:center; justify-content:space-between; padding:16px 0; border-bottom:1px solid rgba(31,26,46,0.08);}
.event-row:last-child{border-bottom:none;}
.badge{font-family:'JetBrains Mono',monospace; font-size:11px; padding:4px 10px; border-radius:100px; text-transform:uppercase;}
.badge-draft{background:#efe9df; color:#8a6b3a;}
.badge-activ{background:#e3f0e6; color:#2f6b3d;}
.badge-platit{background:#e6ecf5; color:#33507a;}

.plan-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:10px;}
@media (max-width:700px){.plan-grid{grid-template-columns:1fr;}}
.plan-option{border:2px solid rgba(31,26,46,0.12); border-radius:16px; padding:20px; cursor:pointer;}
.plan-option.selected{border-color:var(--gold); background:#fdf6ea;}
.plan-option h4{margin:0 0 6px; font-size:15px;}
.plan-option .p{font-family:'Fraunces',serif; font-size:22px; margin:0;}

.qr-box{display:flex; gap:24px; align-items:center; flex-wrap:wrap;}
.qr-box img{width:160px; height:160px; border-radius:14px; border:1px solid rgba(31,26,46,0.1);}
.upload-link{font-family:'JetBrains Mono',monospace; font-size:13px; background:#efe9df; padding:10px 14px; border-radius:10px; word-break:break-all;}

.memories-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px;}
.memory-tile{position:relative; aspect-ratio:1; border-radius:12px; overflow:hidden; background:var(--plum);}
.memory-tile img, .memory-tile video{width:100%; height:100%; object-fit:cover;}
.memory-tile .cap{position:absolute; bottom:0; left:0; right:0; background:linear-gradient(transparent,rgba(0,0,0,0.6)); color:#fff; font-size:11px; padding:6px 8px;}

.dark-page{background:var(--ink); color:var(--cream); min-height:100vh;}
.dark-page nav.appnav{background:transparent;}

.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,0.4); border-top-color:#fff; border-radius:50%; animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}