/* intake.css: the /plan intake game. Mobile first. Color and font tokens come from styles.css. */
.intake-main{min-height:100vh;padding:104px 16px 48px;display:flex;justify-content:center;position:relative;z-index:10}
#intake{width:100%;max-width:640px;display:flex;flex-direction:column;gap:20px}
.intake-main:has(.opening),.intake-main:has(.thanks){align-items:center}
#intake:has(.opening),#intake:has(.thanks){max-width:760px}
#intake [tabindex="-1"]:focus{outline:none}
#intake .eyebrow{font-family:var(--f-body);font-size:10px;font-weight:600;letter-spacing:.35em;color:var(--gold);text-transform:uppercase}
#intake .q{font-family:var(--f-display);font-weight:300;font-size:34px;line-height:1.12;color:var(--off-white);overflow-wrap:anywhere}
#intake .q.big{font-size:44px}
#intake .q em{font-style:italic;color:var(--gold-lt)}
#intake .lead{font-family:var(--f-body);font-size:15px;font-weight:300;line-height:1.8;color:var(--gray-lt)}
#intake .muted{font-family:var(--f-body);font-size:12px;color:var(--gray)}
#intake .slate{display:flex;justify-content:space-between;gap:12px;font-family:var(--f-body);font-size:10px;letter-spacing:.24em;color:var(--gray);border:1px solid rgba(245,240,232,.18);padding:8px 12px}
#intake .slate-num{color:var(--gold)}
#intake .scene{display:flex;flex-direction:column;gap:18px;background:rgba(13,21,37,.72);border:1px solid rgba(201,168,76,.18);padding:24px 18px}
#intake .opening,#intake .thanks{display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px}
#intake .eyebrow.ruled{display:flex;align-items:center;gap:16px}
#intake .eyebrow.ruled::before,#intake .eyebrow.ruled::after{content:"";width:40px;height:1px;background:rgba(201,168,76,.5)}
#intake .opening .lead,#intake .thanks .lead{max-width:540px;font-size:16px}
#intake .meta{font-family:var(--f-body);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-lt)}
#intake .board.preview{width:100%;max-width:420px;margin:6px 0 4px}
#intake .board.preview .frame{color:var(--gray-lt);font-size:10px;letter-spacing:.1em;border-color:rgba(201,168,76,.4)}
#intake .board.preview .frame.done{color:var(--gold-lt)}
#intake .field{display:flex;flex-direction:column;gap:8px;border:none;padding:0;margin:0}
#intake .field label,#intake .field .label{font-family:var(--f-body);font-size:10px;font-weight:600;letter-spacing:.24em;color:var(--gold-dk);text-transform:uppercase}
#intake .field input,#intake .field textarea,#intake .field select{font-family:var(--f-body);font-size:16px;color:var(--off-white);background:rgba(13,21,37,.85);border:1px solid rgba(201,168,76,.6);padding:13px 14px;border-radius:0;width:100%}
#intake .field select option{background:#0F1828;color:var(--off-white)}
#intake .field textarea{min-height:96px;resize:vertical;line-height:1.6}
#intake .field input:focus,#intake .field textarea:focus,#intake .field select:focus{border-color:var(--gold)}
#intake .field :is(input,textarea,select):focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px}
#intake .chips{display:flex;flex-wrap:wrap;gap:8px}
#intake .chip{font-family:var(--f-body);font-size:13px;color:var(--gray-lt);background:transparent;border:1px solid rgba(201,168,76,.3);padding:10px 14px;cursor:pointer;min-height:44px;text-align:left}
#intake .chip.on{color:var(--off-white);border-color:var(--gold-lt);background:rgba(201,168,76,.14)}
#intake .chip:focus-visible,#intake .btn:focus-visible,#intake .btn-ghost:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px}
#intake .channel{display:grid;gap:8px;padding:12px;border:1px solid rgba(201,168,76,.12)}
#intake .channel-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#intake .field .consent{display:flex;gap:10px;align-items:flex-start;font-family:var(--f-body);font-size:13px;line-height:1.6;color:var(--gray-lt);text-transform:none;letter-spacing:0;font-weight:400}
#intake .field .consent input{width:22px;height:22px;flex:none;margin-top:2px;padding:0;border:none;background:none;accent-color:var(--gold)}
#intake .field .consent a{color:var(--gold-lt)}
#intake .scene-nav{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:flex-end;margin-top:6px}
#intake .btn{font-family:var(--f-body);font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--bg);background:var(--g-gold-btn);border:none;padding:16px 26px;cursor:pointer;min-height:48px}
#intake .btn[disabled]{opacity:.6;cursor:wait}
#intake .btn-ghost{font-family:var(--f-body);font-size:12px;text-transform:none;letter-spacing:0;font-weight:400;transition:none;color:var(--gray-lt);background:none;border:none;padding:12px 8px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;min-height:44px}
#intake .btn-ghost:hover{transform:none;color:var(--off-white)}
#intake .err{font-family:var(--f-body);font-size:12px;color:#E8A08A}
#intake .board{list-style:none;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:4px;padding:0;margin:8px 0 0}
#intake .frame{aspect-ratio:1;border:1px solid #2a3448;display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--f-body);font-size:10px;line-height:1.15;color:var(--gold-lt);padding:2px;overflow:hidden;word-break:break-word}
#intake .frame.current{border-color:var(--gold-lt)}
#intake .frame.done{background:#152035;border-color:var(--gold)}
#intake .frame.just{animation:clap .5s ease-out}
@keyframes clap{0%{transform:scaleY(.2);background:var(--gold)}60%{transform:scaleY(1.08)}100%{transform:scaleY(1)}}
#intake .thanks .board{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:100%;max-width:300px}
#intake .thanks .frame{font-size:12px}
.privacy{max-width:560px;margin:0 auto 64px;padding:0 16px;font-family:var(--f-body);font-size:12px;line-height:1.8;color:var(--gray);position:relative;z-index:10;scroll-margin-top:96px}
.privacy h2{font-family:var(--f-display);font-weight:400;font-size:22px;color:var(--off-white);margin-bottom:8px}
.privacy a{color:var(--gold-lt)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (min-width:768px){#intake .q{font-size:42px}#intake .q.big{font-size:68px}#intake .frame{font-size:11px}#intake .scene{padding:36px 40px}#intake .opening .lead,#intake .thanks .lead{font-size:17px}}
#intake [hidden]{display:none !important}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}#intake .frame.just{animation:none}}