/* Kesey design system tokens (mirrors kesey.agency) + intake wizard styles. */
:root{
  --ink:#0E0D12; --ink2:#17151E; --line:#2A2733; --bone:#F4F1F7;
  --dim:#A9A3B8; --pink:#FF4D9D; --orange:#FF7A2F; --lime:#C8F542;
  --violet:#7C5CFF; --cyan:#3EE6E0;
  --display:'Bricolage Grotesque', sans-serif;
  --body:'Instrument Sans', sans-serif;
  --mono:'IBM Plex Mono', monospace;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--ink); color:var(--bone); font-family:var(--body);
  font-size:17px; line-height:1.6; overflow-x:hidden;}
a{color:inherit;} img{display:block; max-width:100%;}
.wrap{max-width:760px; margin:0 auto; padding:0 24px;}
.mono{font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase;}
.eyebrow{color:var(--lime);}

/* nav */
nav{position:sticky; top:0; z-index:50; background:rgba(14,13,18,.82);
  backdrop-filter:blur(12px); border-bottom:1px solid var(--line);}
.nav-in{display:flex; align-items:center; justify-content:space-between; height:60px;}
.wordmark{font-family:var(--display); font-weight:800; font-size:22px; letter-spacing:-.02em;}
.wordmark span{background:linear-gradient(90deg,var(--pink),var(--orange));
  -webkit-background-clip:text; background-clip:text; color:transparent;}
.nav-tag{color:var(--dim);}

main{padding:44px 0 30px;}
h1{font-family:var(--display); font-weight:800; font-size:34px; line-height:1.1; letter-spacing:-.02em; margin:.2em 0;}
h2{font-family:var(--display); font-weight:700; font-size:25px; line-height:1.15; letter-spacing:-.01em;}
.sub{color:var(--dim); font-size:17px; margin-top:6px;}
.fineprint{color:var(--dim); font-size:13px; line-height:1.5;}

.panel{padding:40px 0;}

/* intro + progress */
.intro{margin-bottom:26px;}
.progress{display:flex; gap:8px; margin-top:22px; flex-wrap:wrap;}
.progress .dot{display:flex; align-items:center; gap:8px; font-family:var(--mono);
  font-size:11px; letter-spacing:.08em; color:var(--dim);
  border:1px solid var(--line); border-radius:999px; padding:5px 12px;}
.progress .dot.active{color:var(--ink); background:linear-gradient(90deg,var(--pink),var(--orange)); border-color:transparent; font-weight:600;}
.progress .dot.done{color:var(--lime); border-color:var(--lime);}
.progress .dot.skipped{color:var(--orange); border-color:var(--orange);}

/* step card */
.step-card, .done-card{background:var(--ink2); border:1px solid var(--line);
  border-radius:18px; padding:30px;}
.step-kicker{color:var(--dim); margin-bottom:8px;}
.step-purpose{color:var(--dim); font-size:15px; margin:6px 0 4px;}
.phi-note{margin:16px 0 0; padding:12px 14px; border-radius:12px;
  background:rgba(200,245,66,.07); border:1px solid rgba(200,245,66,.3);
  color:var(--bone); font-size:13.5px;}

form{margin-top:22px; display:flex; flex-direction:column; gap:22px;}
.q{display:flex; flex-direction:column; gap:9px;}
.q-prompt{font-size:16.5px; font-weight:600;}
.q-note{color:var(--dim); font-size:13px;}
.q-req{color:var(--orange); font-size:11px; font-family:var(--mono); letter-spacing:.1em;}

label{font-size:13px; color:var(--dim);}
input[type=text], input[type=email], input[type=tel], input[type=url],
input[type=number], input[type=date], select, textarea{
  width:100%; background:var(--ink); border:1px solid var(--line);
  border-radius:10px; padding:11px 13px; color:var(--bone);
  font-family:var(--body); font-size:15.5px;}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--violet);}
textarea{min-height:84px; resize:vertical;}
select{cursor:pointer;}
.row{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.row-3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px;}
.subrow{display:grid; grid-template-columns:1fr 1fr auto; gap:8px; align-items:center;}

.chips{display:flex; flex-wrap:wrap; gap:8px;}
.chip{cursor:pointer; border:1px solid var(--line); border-radius:999px;
  padding:8px 14px; font-size:14px; color:var(--dim); user-select:none;}
.chip.on{color:var(--ink); background:var(--lime); border-color:var(--lime); font-weight:600;}
.chip.on.dontfit{background:var(--orange);}

.yesno{display:flex; gap:8px;}
.yesno .chip{min-width:64px; text-align:center;}

.slider-row{display:grid; grid-template-columns:120px 1fr 48px; gap:12px; align-items:center;}
input[type=range]{width:100%; accent-color:var(--pink);}

.repeat-add{align-self:flex-start; background:none; border:1px dashed var(--line);
  color:var(--dim); border-radius:10px; padding:8px 14px; cursor:pointer; font-family:var(--body); font-size:14px;}
.repeat-add:hover{border-color:var(--violet); color:var(--bone);}
.repeat-row{display:flex; gap:8px; align-items:center;}
.repeat-row .rm{background:none; border:none; color:var(--dim); cursor:pointer; font-size:20px; line-height:1; padding:0 4px;}
.repeat-row .rm:hover{color:var(--orange);}

.field-error{color:var(--orange); font-size:13px;}
.colorpick{display:flex; gap:6px; align-items:center;}
input[type=color]{width:44px; height:36px; border:1px solid var(--line); border-radius:8px; background:var(--ink); padding:2px; cursor:pointer;}

/* actions */
.step-actions{display:flex; gap:10px; margin-top:26px; flex-wrap:wrap; align-items:center;}
.btn{font-family:var(--body); font-weight:600; font-size:15px; padding:12px 24px;
  border-radius:999px; border:1px solid transparent; cursor:pointer;}
.btn-hot{background:linear-gradient(90deg,var(--pink),var(--orange)); color:var(--ink);}
.btn-hot:hover{transform:translateY(-1px);}
.btn-ghost{background:none; border-color:var(--line); color:var(--bone);}
.btn-ghost:hover{border-color:var(--dim);}
.btn-skip{background:none; border:none; color:var(--dim); text-decoration:underline; padding:12px 8px;}
.btn-skip:hover{color:var(--bone);}
.btn:disabled{opacity:.5; cursor:default; transform:none;}
.save-state{color:var(--lime); margin-left:auto;}

.ctx-line{display:flex; gap:8px; flex-wrap:wrap; margin-top:4px;}
.pill{font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:var(--dim);
  border:1px solid var(--line); border-radius:999px; padding:4px 10px;}

footer{padding:22px 0 50px;}

/* Step 6 assets */
.q-note-inline{color:var(--dim); font-size:11px; font-family:var(--mono); letter-spacing:.1em;}
.asset-slot.filled .q-prompt{color:var(--lime);}
input[type=file]{width:100%; font-family:var(--body); font-size:14px; color:var(--dim);
  border:1px dashed var(--line); border-radius:10px; padding:12px; background:var(--ink); cursor:pointer;}
input[type=file]::file-selector-button{font-family:var(--body); font-weight:600; font-size:13px;
  background:var(--ink2); color:var(--bone); border:1px solid var(--line); border-radius:999px;
  padding:7px 14px; margin-right:12px; cursor:pointer;}
.asset-files{display:flex; flex-direction:column; gap:6px;}
.asset-file{display:flex; align-items:center; gap:8px; font-size:14px;
  background:var(--ink); border:1px solid var(--line); border-radius:10px; padding:8px 12px;}
.asset-file .asset-check{color:var(--lime); font-weight:700;}
.asset-file span:nth-child(2){flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.asset-file .rm{background:none; border:none; color:var(--dim); cursor:pointer; font-size:20px; line-height:1;}
.asset-file .rm:hover{color:var(--orange);}

/* Step 7 review summary */
.summary-card{margin-top:20px;}
.summary-h{font-size:19px; margin-bottom:12px;}
.sum-group{border-top:1px solid var(--line); padding:16px 0;}
.sum-group:first-of-type{border-top:none;}
.sum-head{display:flex; align-items:center; gap:10px; margin-bottom:10px;}
.sum-step{font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--ink);
  background:var(--lime); border-radius:999px; padding:3px 9px;}
.sum-title{font-family:var(--display); font-weight:700; font-size:16px;}
.sum-edit{margin-left:auto; background:none; border:1px solid var(--line); color:var(--bone);
  border-radius:999px; padding:5px 14px; font-family:var(--body); font-size:13px; cursor:pointer;}
.sum-edit:hover{border-color:var(--violet);}
.sum-skip{font-family:var(--mono); font-size:10px; letter-spacing:.1em; color:var(--orange);
  border:1px solid var(--orange); border-radius:999px; padding:2px 8px;}
.sum-body{display:flex; flex-direction:column; gap:7px;}
.sum-row{display:grid; grid-template-columns:1fr 1fr; gap:12px; font-size:14px;}
.sum-k{color:var(--dim);}
.sum-v{color:var(--bone); word-break:break-word;}

.review-open{margin-top:18px; padding:14px 16px; border-radius:12px;
  background:rgba(255,122,47,.07); border:1px solid rgba(255,122,47,.3);}
.open-list{margin:8px 0 0 18px; font-size:14px; color:var(--bone);}
.open-list li{margin:4px 0;}

/* submitted / checklist */
#checklist{margin-top:18px; padding-top:16px; border-top:1px solid var(--line);}

@media (max-width:560px){
  h1{font-size:28px;} .row,.row-3{grid-template-columns:1fr;}
  .slider-row{grid-template-columns:90px 1fr 40px;}
  .sum-row{grid-template-columns:1fr;}
}
