:root{color-scheme:dark;--base:#090809;--panel:#161215;--line:#463438;--text:#fff8f2;--muted:#d0c3bf;--accent:#ffcf75;--red:#e83d43;--field:#100d0f;--secondary:#241a1d}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 0%,#40151b 0%,transparent 520px),radial-gradient(ellipse at 85% 0%,#3d2913 0%,transparent 540px),var(--base);min-height:100vh;color:var(--text);font:16px/1.5 system-ui,sans-serif}
.shell{width:min(1060px,100% - 40px);margin:auto}.guest{max-width:520px}
.tag,.status{font-size:11px;font-weight:750;letter-spacing:.06em;white-space:nowrap;background:#262d39;border-radius:99px;padding:4px 9px;color:#d7deec}.status.active{color:var(--accent);background:#304018}
.hero{padding:38px 0 29px}.eyebrow{color:var(--accent);font-size:12px;font-weight:750;letter-spacing:.15em;text-transform:uppercase;overflow-wrap:anywhere}.hero h1{font-size:clamp(42px,8vw,77px);line-height:1;letter-spacing:-.065em;margin:8px 0 13px}.hero em{color:var(--accent);font-style:normal}.hero p{margin:0}
p,time,.wishes span{color:var(--muted)}.dashboard{display:grid;grid-template-columns:minmax(245px,.83fr) minmax(0,1.75fr);gap:16px;align-items:start}.details{display:grid;gap:16px}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;min-width:0}.card-head{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-bottom:12px}.card-head h2{margin:0}.card p:last-child{margin-bottom:0}h2,h3{overflow-wrap:anywhere}h2{font-size:21px;margin:0 0 12px;line-height:1.25}h3{font-size:15px;margin:0 0 6px}
form,label{display:grid;gap:7px}form{gap:14px}label{font-size:14px;font-weight:650}input,button{font:inherit;border-radius:9px;min-height:44px}input{background:#10141b;color:var(--text);border:1px solid var(--line);padding:10px 12px;min-width:0;width:100%;font-size:16px}button{cursor:pointer;background:var(--accent);color:#141711;border:1px solid transparent;padding:8px 13px;font-weight:750}button:disabled{opacity:.55;cursor:wait}button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.secondary,.event{background:#222936;color:var(--text);border-color:var(--line)}.danger{background:#38242b;color:#ffb4bf;border-color:#704452}.events{display:grid;gap:8px;margin-top:16px}.event{display:flex;justify-content:space-between;align-items:center;text-align:left;gap:6px;font-size:14px;overflow-wrap:anywhere}.event[aria-pressed=true]{border-color:var(--accent)}.share{border-top:1px solid var(--line);margin-top:16px;padding-top:16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px}.url{display:block;overflow-wrap:anywhere;margin-bottom:10px;font-size:13px}.qr{text-align:center;font-size:13px}.qr img{display:block;background:white;border-radius:5px;margin:0 auto 6px}.notice,.error{font-size:14px}.error{color:#ffadb9}.wishes{padding:0;margin:0;list-style:none}.wishes li{display:flex;gap:12px;justify-content:space-between;border-top:1px solid var(--line);padding:11px 0;overflow-wrap:anywhere}.wishes time{font-size:12px;flex-shrink:0}.empty{min-height:210px}.feedback strong,a{color:var(--accent)}footer{padding:24px 0 32px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.12em}footer span{color:var(--accent)}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:680px){.dashboard{grid-template-columns:1fr}.shell{width:calc(100% - 28px)}.card{padding:16px}.hero{padding-top:28px}}
@media(max-width:400px){.share{grid-template-columns:1fr}.qr{text-align:left}.qr img{margin-left:0}.guest form button{width:100%}}
.wish-group + .wish-group{margin-top:18px}.wish-meta{margin:5px 0 0;font-size:13px}.wishes button{align-self:center;flex-shrink:0;font-size:13px}
@media(max-width:400px){.wishes li{flex-wrap:wrap}}
.guest textarea{font:inherit;font-size:16px;background:#10141b;color:var(--text);border:1px solid var(--line);border-radius:9px;padding:10px 12px;width:100%;resize:vertical}
.guest textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wish-notes{list-style:none;padding:0;margin:6px 0}.wishes .wish-notes li{display:block;border:0;padding:3px 0;font-size:14px}.wish-notes strong{display:block}.wish-notes span{white-space:pre-wrap}
.guest-mode{min-width:0;margin:0;padding:0;border:0;display:flex;gap:8px;flex-wrap:wrap}.guest-mode legend{font-size:14px;font-weight:650;margin-bottom:7px}.guest-mode label{display:flex;align-items:center;gap:7px;min-height:44px;padding:6px 10px;border:1px solid var(--line);border-radius:9px;cursor:pointer}.guest-mode label:has(input:checked){border-color:var(--accent)}.guest-mode input{min-height:0;width:auto;accent-color:var(--accent)}.guest-message{margin:4px 0;white-space:pre-wrap;color:var(--text)}
.guest-replies { margin-top: 16px; }
.guest-reply { border-top: 1px solid var(--line); padding-top: 10px; margin-top: 10px; overflow-wrap: anywhere; }
.guest-reply ul { margin: 6px 0 0; padding-left: 20px; white-space: pre-wrap; }

.guest { max-width: 600px; }

.dj-brand {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 15px 0;
  border-bottom: 1px solid var(--red);
  border-image: linear-gradient(90deg, #73181f, var(--red), #ffb450, #73181f) 1;
  font-size: clamp(21px, 6vw, 29px);
  font-weight: 950;
  letter-spacing: .045em;
}

.dj-brand-label {
  color: var(--accent);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-align: right;
}

.guest-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 14px 0;
  padding: clamp(143px, 42vw, 223px) clamp(18px, 5vw, 32px) 20px;
  background: #0b090a;
  border: 1px solid #704044;
  border-bottom-color: var(--red);
  border-radius: 14px;
  box-shadow: 0 4px 26px #6d151e3b;
}

.guest-hero-copy {
  position: relative;
  z-index: 1;
}

.guest-hero h1 {
  margin: 6px 0 8px;
  color: var(--accent);
  font-size: clamp(33px, 9vw, 66px);
  font-weight: 950;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.guest-hero .eyebrow {
  display: inline-block;
  padding: 4px 8px;
  border-left: 2px solid var(--red);
  background: #46151c;
  color: #fff1ed;
  font-size: 10px;
}

.guest-hero-copy > p:last-child { font-size: 14px; }

.guest-poster {
  position: absolute;
  inset: 0 0 auto;
  height: clamp(183px, 57vw, 295px);
  overflow: hidden;
}

.guest-poster img {
  display: block;
  width: 100%;
  height: auto;
  transform: translateY(-12.5%);
}

.guest-poster::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, #0b090a, transparent 62%);
}

.guest-portrait {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid #b78959;
  border-radius: 15px;
}

:is(.guest, .dj-panel) .card { border-top-color: #873138; }
:is(.guest, .dj-panel) button:not(.secondary, .event, .danger) {
  background: linear-gradient(180deg, #ffe4a4, #f6b74f);
  color: #1e1307;
}

:is(.guest, .dj-panel) input:not([type=radio]), .guest textarea { background: var(--field); }
:is(.guest, .dj-panel) input::placeholder, .guest textarea::placeholder { color: #b4a5a7; }
.secondary, .event { background: var(--secondary); }
.danger { background: #4a1c23; border-color: #8a4249; color: #ffd6d9; }
.tag, .status { background: #30252a; }
:is(.guest, .dj-panel) .status.active { color: #cbf7bf; background: #263b26; }
:is(.guest, .dj-panel) .status.active::before { content: "●"; margin-right: 5px; font-size: 8px; }

.guest-mode {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 2px;
}

.guest-mode label { position: relative; justify-content: center; padding-inline: 6px; text-align: center; }
.guest-mode label:has(input:checked) { color: var(--accent); background: #38251b; }
.guest-mode input { position: absolute; inset: 0; margin: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.guest-mode label:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 3px; }
.mode-symbol { margin-right: 3px; }
.guest form > button { min-height: 48px; }
.guest-footer { display: flex; gap: 12px; flex-wrap: wrap; justify-content: space-between; align-items: baseline; }
.guest-footer > span { color: var(--muted); }

@media (max-width: 380px) {
  .guest-mode label { font-size: 13px; }
  .guest-hero-copy > p:last-child { font-size: 13px; }
}


.panel-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(76px, 17vw, 112px);
  align-items: center;
  gap: clamp(14px, 4vw, 30px);
  padding-block: 28px;
}

.panel-hero h1 {
  font-size: clamp(32px, 7.2vw, 62px);
  overflow-wrap: anywhere;
}

.dj-panel .event[aria-pressed=true] { background: #38251b; }
