:root{
  --black:#0A0A0A;
  --charcoal:#1C1C1C;
  --gold:#FCB315;
  --gold-dark:#D89400;
  --paper:#FAFAF9;
  --paper-2:#FFFFFF;
  --ink:#141414;
  --ink-soft:#6B6B6B;
  --line:#E7E5E1;
}

*{box-sizing:border-box;min-width:0;}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
}

html,body{
  margin:0;padding:0;width:100%;max-width:100%;
  overflow-x:hidden;
}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',system-ui,sans-serif;
  min-height:100vh;
  -webkit-text-size-adjust:100%;
}
img,input,select,textarea,button{max-width:100%;}

.wrap{width:100%;max-width:680px;margin:0 auto;padding:28px 14px 50px;}

.hdr{text-align:center;margin-bottom:22px;}
.logo{height:52px;width:auto;}
.wordmark{
  font-family:'Oswald',sans-serif;font-weight:700;font-size:25px;
  text-transform:uppercase;letter-spacing:0.03em;margin:8px 0 2px;color:var(--black);
}
.wordmark span{color:var(--gold-dark);}
.tagline{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.07em;
  text-transform:uppercase;color:var(--ink-soft);margin:0;
}

/* Type picker */
.picker{
  display:flex;gap:4px;width:100%;
  background:var(--black);border-radius:6px 6px 0 0;padding:6px 6px 0;
}
.type-btn{
  flex:1 1 0;background:transparent;border:none;
  border-bottom:3px solid transparent;
  color:#8A8A8A;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:11px;
  letter-spacing:0.03em;text-transform:uppercase;
  padding:11px 2px;cursor:pointer;border-radius:4px 4px 0 0;
  white-space:nowrap;
}
.type-btn:hover{color:#fff;}
.type-btn.active{color:var(--gold);border-bottom-color:var(--gold);}
.type-btn:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;}

/* Card */
.card{
  width:100%;
  background:var(--paper-2);
  border:1px solid var(--line);
  border-top:none;
  border-radius:0 0 6px 6px;
  padding:20px 16px 22px;
}

.form{display:none;flex-direction:column;gap:14px;width:100%;}
.form.active{display:flex;}

.form-intro{margin:0 0 2px;font-size:13.5px;color:var(--ink-soft);line-height:1.5;}

.field-row{display:flex;flex-direction:column;gap:14px;width:100%;}
.field-row > label{flex:1;width:100%;}

.field-error{
  display:none;color:#C4291F;font-size:12px;margin:2px 0 0;
  font-family:'IBM Plex Mono',monospace;
}
.field-error.active{display:block;}

label{
  display:flex;flex-direction:column;gap:6px;width:100%;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:12px;
  letter-spacing:0.03em;text-transform:uppercase;color:var(--black);
}
.req{color:var(--gold-dark);}

input[type=text],
input[type=date],
select,
textarea{
  width:100%;
  border:1px solid var(--line);border-radius:4px;background:var(--paper-2);
  padding:11px 10px;
  font-family:'Inter',sans-serif;font-size:16px;font-weight:400;
  color:var(--ink);text-transform:none;letter-spacing:0;
}
textarea{resize:vertical;line-height:1.5;}
input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--gold-dark);outline-offset:1px;
}
::placeholder{color:#BDBAAF;}

.btn{
  width:100%;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:13.5px;
  letter-spacing:0.04em;text-transform:uppercase;
  border:none;border-radius:4px;padding:13px 18px;cursor:pointer;
  background:var(--black);color:var(--gold);
  margin-top:4px;
}
.btn:hover{background:var(--charcoal);}
.btn:focus-visible{outline:2px solid var(--gold-dark);outline-offset:2px;}
.btn:disabled{opacity:0.6;cursor:default;}
.btn-ghost{background:transparent;color:var(--ink-soft);border:1px solid var(--line);}
.btn-ghost:hover{background:var(--paper);color:var(--gold-dark);border-color:var(--gold-dark);}

/* Success */
.success{display:none;text-align:center;padding:12px 0 4px;width:100%;}
.success.active{display:block;}
.check{
  width:48px;height:48px;border-radius:50%;
  background:var(--gold);color:var(--black);
  font-size:24px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 14px;
}
.success h2{
  font-family:'Oswald',sans-serif;font-weight:600;font-size:18px;
  text-transform:uppercase;letter-spacing:0.03em;margin:0 0 8px;
}
.success p{font-size:13.5px;color:var(--ink-soft);line-height:1.6;margin:0 0 18px;}

.footnote{
  text-align:center;margin-top:20px;
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;
  letter-spacing:0.05em;color:#A8A49A;
}

/* ---------- Date picker ---------- */
.datepicker{position:relative;width:100%;}
.dp-trigger{
  width:100%;text-align:left;
  border:1px solid var(--line);border-radius:4px;background:var(--paper-2);
  padding:11px 12px;font-family:'Inter',sans-serif;font-size:16px;
  color:#BDBAAF;cursor:pointer;
}
.dp-trigger.has-value{color:var(--ink);font-weight:500;}
.dp-trigger:focus-visible{outline:2px solid var(--gold-dark);outline-offset:1px;}

.dp-popover{
  width:100%;max-width:340px;
  background:var(--paper-2);border:1px solid var(--line);border-radius:6px;
  margin-top:8px;
  padding:12px;
}
.dp-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.dp-month-label{
  font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;
  text-transform:uppercase;letter-spacing:0.03em;color:var(--black);
}
.dp-nav{
  background:transparent;border:1px solid var(--line);border-radius:4px;
  width:26px;height:26px;font-size:14px;cursor:pointer;color:var(--ink);
}
.dp-nav:hover{border-color:var(--gold-dark);color:var(--gold-dark);}

.dp-dow-row{
  display:grid;grid-template-columns:repeat(7,1fr);
  margin-bottom:2px;
}
.dp-dow-row span{
  text-align:center;font-family:'IBM Plex Mono',monospace;font-size:10px;
  color:var(--ink-soft);padding:4px 0;
}
.dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.dp-day{
  aspect-ratio:1;border:none;border-radius:4px;background:transparent;
  font-family:'Inter',sans-serif;font-size:13px;color:var(--ink);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.dp-day:hover:not(.dp-disabled):not(.dp-selected){background:var(--paper);}
.dp-day.dp-selected{background:var(--gold);color:#141414;font-weight:600;}
.dp-day.dp-disabled{color:#D8D5CB;cursor:default;}
.dp-day.dp-blank{visibility:hidden;cursor:default;}

.dp-footer{
  display:flex;align-items:center;justify-content:space-between;
  gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);
}
.dp-summary{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--ink-soft);}
.dp-done-btn{width:auto;padding:8px 14px;font-size:11.5px;margin-top:0;}

/* =========================================================
   Larger screens
   ========================================================= */
@media (min-width:700px){
  .wrap{padding:36px 18px 60px;}
  .logo{height:64px;}
  .wordmark{font-size:30px;}
  .tagline{font-size:12px;}
  .type-btn{font-size:12.5px;padding:12px 4px;}
  .card{padding:26px 24px 28px;}
  .form-intro{font-size:14px;}
  label{font-size:12.5px;}
  input[type=text],input[type=date],input[type=email],select,textarea{font-size:15px;}
  .btn{width:auto;font-size:14px;}
  .success h2{font-size:20px;}
  .success p{font-size:14px;}
  .check{width:52px;height:52px;font-size:26px;}

  .field-row{flex-direction:row;gap:16px;}
}