/* Official IHS brand theme (IH Colour Palette, 2026 assets): Forest Green #3B4B40 (Pantone
   4202 C), Charcoal #1A1A1A (Black 6 C), Marble Cream #D6CBB7 (482 C), White — plus derived
   cream/grey tints. --tm is a deepened Forest Green for hover/link accents (the palette has no
   secondary hue). Poppins is the bundled stand-in for the brand's licensed Galano Grotesque.
   Red is reserved for required marks and errors, exactly like the official registration form. */
@font-face{font-family:'Poppins';src:url('fonts/poppins-300.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('fonts/poppins-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}

:root {
  --td: #3b4b40; --tm: #2e3b32; --tl: #f0ece4;
  --am: #d6cbb7; --af: #f4efe6; --ab: #b8a184;
  --bg: #efece6; --gl: #d4d4d0; --gm: #999;
  --white: #fff; --text: #1a1a1a; --body: #444;
  --err: #d63f3f;
  --shadow: 0 0 40px rgba(20,20,18,.25); --r: 4px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Poppins','Century Gothic','Segoe UI',system-ui,sans-serif;font-weight:300;color:var(--text);min-height:100vh;display:flex;flex-direction:column;
  background:linear-gradient(rgba(20,20,18,.14),rgba(20,20,18,.14)),var(--bg) url('img/backdrop.jpg') center/cover no-repeat fixed}
b,strong{font-weight:600}

/* Screen-reader-only (chat.js still writes the event name/venue here) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Masthead — the official lockup left, the headline partner's mark right */
.mast{padding:20px 26px 14px;background:var(--white);flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.mast-logo{display:block;width:min(100%,420px);height:auto}
.mast-partner{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0}
.mast-partner-lbl{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#777}
.mast-partner-logo{display:block;width:150px;height:auto}

/* Layout */
.layout{display:grid;grid-template-columns:1fr 220px;gap:20px;max-width:1020px;margin:0 auto;width:100%;padding:28px 16px;align-items:start}

/* Conversation column — flat white over the photo */
.conv{display:flex;flex-direction:column;background:var(--white);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;height:calc(100vh - 56px);position:sticky;top:28px}
.chat-hdr{padding:11px 26px;background:#e8e8e6;border-bottom:1px solid var(--gl);flex-shrink:0}
.chat-hdr .wl{font-size:13.5px;font-weight:600;color:var(--text)}
.chat-hdr .ws{font-size:12px;color:#555;margin-top:1px}
.thread{flex:1;overflow-y:auto;padding:20px 26px;display:flex;flex-direction:column;gap:14px;scroll-behavior:smooth}

/* Bubbles */
.msg{display:flex;flex-direction:column;max-width:82%}
.msg.ai{align-self:flex-start}
.msg.usr{align-self:flex-end}
.bub{padding:10px 14px;border-radius:12px;font-size:14px;line-height:1.55}
.ai .bub{background:var(--tl);color:var(--text);border-radius:2px 12px 12px 12px}
.usr .bub{background:var(--td);color:#fff;border-radius:12px 2px 12px 12px}
.wa{margin-top:8px}

/* Typing */
.typ{display:flex;align-items:center;gap:4px;padding:10px 14px;background:var(--tl);border-radius:2px 12px 12px 12px;width:fit-content}
.dot{width:6px;height:6px;background:var(--ab);border-radius:50%;animation:bounce 1.2s infinite}
.dot:nth-child(2){animation-delay:.2s}.dot:nth-child(3){animation-delay:.4s}
@keyframes bounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}
@media(prefers-reduced-motion:reduce){.dot{animation:none;opacity:.7}}

/* Chips */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:9px 16px;border:1px solid var(--gl);border-radius:var(--r);background:var(--white);color:var(--text);font-size:13px;cursor:pointer;transition:all .2s;user-select:none}
.chip:hover:not(:disabled){border-color:var(--tm)}
.chip.on{border-color:var(--td);background:var(--td);color:#fff}
.chip:focus{outline:2px solid var(--tm);outline-offset:2px}
.chip:disabled{opacity:.5;cursor:default}

/* Option cards */
.ocards{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.ocard{padding:13px;border:1px solid var(--gl);border-radius:var(--r);background:var(--white);cursor:pointer;transition:all .2s;text-align:left}
.ocard:hover:not(:disabled){border-color:var(--tm);background:var(--af)}
.ocard.on{border-color:var(--td);background:var(--af)}
.ocard:disabled{opacity:.5;cursor:default}
.ocard .ci{font-size:19px;margin-bottom:3px}
.ocard .cl{font-size:13px;font-weight:600;color:var(--td)}
.ocard:focus{outline:2px solid var(--tm);outline-offset:2px}

/* Action button */
.abtn{margin-top:10px;padding:11px 24px;background:var(--td);color:#fff;border:none;border-radius:var(--r);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;transition:background .2s}
.abtn:hover:not(:disabled){background:var(--tm)}
.abtn:disabled{background:#ccc;cursor:default}
.abtn.gold{background:var(--am);color:var(--text)}
.abtn.gold:hover:not(:disabled){background:var(--ab)}

/* Skip link */
.skip-lnk{background:none;border:none;color:#999;font-size:12px;cursor:pointer;padding:2px 0;margin-left:10px}

/* Interest groups */
.ig{margin-bottom:12px}
.ig-lbl{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#888;margin-bottom:7px}

/* Almost-there cue */
.atcue{background:var(--af);border:1px solid var(--ab);border-radius:var(--r);padding:10px 14px;font-size:13px;color:#6b5a3c;margin-bottom:14px;display:flex;align-items:center;gap:8px}

/* Details panel — hairline fields, red required marks, like the official form */
.dpanel{background:var(--white);border:1px solid var(--gl);border-radius:var(--r);padding:18px}
.dsec{margin-bottom:18px}
.dsec:last-child{margin-bottom:0}
.dsec-ttl{font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;padding-bottom:7px;border-bottom:1px solid #ecece9}
.dgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dgrid.f{grid-template-columns:1fr}
.dgrid.t{grid-template-columns:1fr 1fr 1fr}
.df{display:flex;flex-direction:column;gap:3px}
.df label{font-size:11.5px;font-weight:600;color:#555}
.df .req{color:var(--err)}
.df input,.df select{border:1px solid var(--gl);border-radius:var(--r);padding:11px 13px;font-size:13px;color:var(--text);background:var(--white);width:100%;outline:none;transition:border-color .2s;font-family:inherit}
.df input::placeholder{color:#8b95a5}
.df input:focus,.df select:focus{border-color:var(--tm)}
.df input.pre,.df select.pre{background:var(--af);color:var(--td)}
.unlock-btn{margin-top:14px;width:100%;padding:12px;background:var(--td);color:#fff;border:none;border-radius:var(--r);font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}
.unlock-btn:hover{background:var(--tm)}
.unlock-btn:disabled{background:#ccc;cursor:default;color:#666}
.err-msg{color:var(--err);font-size:12px;margin-top:6px}
/* Sits under its own input so the reason is next to the field it is about. Collapsed when empty, or
   the .df gap would shift every field in the panel to reserve room for a message nobody needs. */
.df .field-err{color:var(--err);font-size:11.5px}
.df .field-err:empty{display:none}

/* Consent */
.cpanel{display:flex;flex-direction:column;gap:9px}
.crow{background:#faf9f7;border:1px solid var(--gl);border-radius:var(--r);padding:11px 13px;display:flex;align-items:flex-start;gap:9px;transition:border-color .2s}
.crow.req{background:var(--af);border-color:var(--ab)}
.crow:hover{border-color:var(--tm)}
.crow input[type=checkbox]{margin-top:2px;accent-color:var(--td);flex-shrink:0;width:15px;height:15px;cursor:pointer}
.ctext{font-size:13px;color:#333;line-height:1.5}
.ctext strong{color:var(--td);display:block;margin-bottom:1px;font-size:13px}
.cterms-h{font-weight:600;font-size:13px;margin:10px 0 4px}
.cterms-p{font-size:12.5px;color:#555;margin:0 0 6px;line-height:1.45}
.cterms-a{color:var(--tm)}

/* Landing screen */
.landing{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px 28px;text-align:center}
.landing .li{font-size:44px;margin-bottom:14px}
.landing .lt{font-size:21px;font-weight:600;color:var(--td);margin-bottom:6px}
.landing .ls{font-size:13px;color:#666;margin-bottom:24px;line-height:1.6;max-width:340px}
.landing .le{display:flex;gap:9px;width:100%;max-width:380px}
.landing .le input{flex:1;border:1px solid var(--gl);border-radius:var(--r);padding:11px 13px;font-size:14px;outline:none;transition:border-color .2s;font-family:inherit}
.landing .le input:focus{border-color:var(--tm)}
.landing .le button{padding:10px 18px;background:var(--td);color:#fff;border:none;border-radius:var(--r);font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap}
.landing .le button:hover{background:var(--tm)}
.landing .lc{display:flex;align-items:flex-start;gap:8px;margin-top:14px;max-width:380px;font-size:12px;color:#666;text-align:left}
.lu{font-size:13px;color:var(--tm);margin-top:10px;display:none}

/* Confirm screen */
.cscreen{padding:4px 0}
.cs-top{text-align:center;padding:18px 0 22px}
.cs-icon{font-size:46px;margin-bottom:10px}
.cs-title{font-size:22px;font-weight:600;color:var(--td);margin-bottom:6px}
.cs-badge{display:inline-block;margin-top:10px;background:var(--td);color:var(--am);font-size:17px;font-weight:600;letter-spacing:.1em;padding:8px 20px;border-radius:var(--r)}
.cs-sub{font-size:13px;color:#666;margin-top:7px}
.pg{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.ps-title{font-size:13px;font-weight:600;color:var(--td);margin-bottom:8px;padding-bottom:5px;border-bottom:2px solid var(--am)}
.pi{background:#faf8f4;border:1px solid #e7e0d2;border-radius:var(--r);padding:9px 11px;margin-bottom:7px}
.pi-name{font-size:13px;font-weight:600;color:var(--text)}
.pi-why{font-size:12px;color:#777;margin-top:2px;line-height:1.4}
.pi-more{display:block;background:none;border:none;color:var(--tm);font-size:12px;cursor:pointer;padding:4px 0 0;text-decoration:underline;text-align:left}
.cs-update{font-size:13px;color:var(--tm);cursor:pointer;text-decoration:underline;margin-top:14px;display:inline-block}

/* Rail */
.rail{display:flex;flex-direction:column;gap:14px;position:sticky;top:28px}
.rc{background:var(--white);border-radius:var(--r);box-shadow:var(--shadow);padding:14px}
.rc-ttl{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:#888;margin-bottom:10px}
.rbar{height:6px;background:#e8e6e0;border-radius:3px;overflow:hidden;margin-bottom:8px}
.rfill{height:100%;background:linear-gradient(90deg,var(--td),var(--tm));border-radius:3px;transition:width .4s ease}
.rlbl{display:inline-block;background:var(--td);color:#fff;font-size:11.5px;font-weight:600;padding:4px 12px;border-radius:3px}
.rsub{font-size:11px;color:#888;margin-top:4px}
.rcount-row{display:flex;align-items:center;gap:8px;font-size:13px;margin-bottom:7px}
.rcount-lbl{color:#666}
.rbadge{background:var(--tm);color:#fff;border-radius:3px;padding:2px 8px;font-size:12px;font-weight:600;min-width:28px;text-align:center;transition:all .3s}
.rempty{font-size:12px;color:#aaa;font-style:italic;margin-top:4px}
.rk-field{display:flex;justify-content:space-between;font-size:12px;margin-bottom:5px}
.rk-k{color:#888}.rk-v{color:var(--td);font-weight:600;max-width:58%;text-align:right}
.rk-review{font-size:12px;color:var(--tm);cursor:pointer;text-decoration:underline;margin-top:4px;display:inline-block}
#railKnown{display:none}

/* Organiser note card */
.rn-hint{font-size:11px;color:#888;font-style:italic;margin-bottom:8px}
.rn-item{font-size:12px;color:var(--td);padding:4px 0;border-bottom:1px solid #f0ede6;overflow-wrap:anywhere}
.rn-ack{font-size:11px;color:#2e7d5e;margin:4px 0}
#rnInput{width:100%;border:1px solid var(--gl);border-radius:var(--r);padding:8px 10px;font-size:12px;color:var(--text);outline:none;resize:vertical;font-family:inherit;transition:border-color .2s;box-sizing:border-box;margin-top:4px}
#rnInput:focus{border-color:var(--tm)}
#rnInput:disabled{background:#f5f5f3;color:#999}
#rnAdd{width:100%;margin-top:6px;background:var(--white);color:var(--td);border:1px solid var(--td);border-radius:var(--r);padding:8px 0;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s}
#rnAdd:hover:not(:disabled){background:var(--af)}
#rnAdd:disabled{border-color:var(--gl);color:#aaa;cursor:default}

/* Show-more */
.smore{background:none;border:none;color:var(--tm);font-size:12px;cursor:pointer;padding:3px 0;text-decoration:underline;margin-top:3px}

/* Mini text input */
.mini-inp{width:100%;border:1px solid var(--gl);border-radius:var(--r);padding:10px 13px;font-size:13px;outline:none;transition:border-color .2s;color:var(--text);font-family:inherit}
.mini-inp:focus{border-color:var(--tm)}
/* The "Please specify" box when Continue refuses it blank. The details form has the same mark at
   :208, but scoped to .df, so a mini-inp outside a form had nowhere to show it — and a Continue
   that does nothing with no visible reason reads as broken. */
.mini-inp.err{border-color:var(--err);background:#fdf3f2}
.mini-area{width:420px;max-width:100%;border:1px solid var(--gl);border-radius:var(--r);padding:10px 13px;font-size:13px;outline:none;transition:border-color .2s;color:var(--text);resize:vertical;font-family:inherit;box-sizing:border-box}
.mini-area:focus{border-color:var(--tm)}

/* Pre-fill note */
.pfnote{font-size:11px;color:#888;margin-bottom:6px;font-style:italic}

/* Responsive */
@media(max-width:760px){
  .layout{grid-template-columns:1fr;padding:0;gap:0}
  .rail{display:none}
  .conv{border-radius:0;height:100vh;position:fixed;top:0;left:0;right:0;box-shadow:none}
  .mast{padding:12px 16px 8px}
  .mast-logo{max-width:300px}
  .chat-hdr{padding:9px 16px}
  .thread{padding:16px}
  .ocards{grid-template-columns:1fr}
  .dgrid.t{grid-template-columns:1fr 1fr}
  .pg{grid-template-columns:1fr}
}

/* Field error highlighting (server validation) */
.df input.err,.df select.err{border-color:var(--err);background:#fdf3f2}

/* Restart bubble button */
.restart-btn{margin-top:8px;padding:9px 18px;background:var(--td);color:#fff;border:none;border-radius:var(--r);font-size:13px;font-weight:600;cursor:pointer}
.restart-btn:hover{background:var(--tm)}

/* Unlocked ledger */
.ul-line{font-size:12px;color:var(--td);padding:4px 0;border-bottom:1px solid #f0ede6;animation:ulIn .35s ease}
.ul-line:last-child{border-bottom:none}
@keyframes ulIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.ul-line{animation:none}}

/* Top-3 cards */
.t3card{border:1px solid var(--gl);border-radius:var(--r);padding:12px;margin-bottom:8px;background:var(--white)}
.t3card.liked{border-color:#2e7d5e;background:#f2f8f4}
.t3card.rejected{border-color:var(--err);background:#fdf3f2;opacity:.75}
.t3name{font-size:14px;font-weight:600;color:var(--td)}
.t3why{font-size:12px;color:#777;margin-top:2px}
.t3row{display:flex;gap:8px;margin-top:8px;align-items:center}
.t3btn{border:1px solid var(--gl);background:var(--white);border-radius:var(--r);padding:5px 12px;font-size:14px;cursor:pointer;transition:all .15s}
.t3btn.on{border-color:var(--td);background:var(--af)}
.t3info{background:none;border:none;color:var(--tm);font-size:12px;cursor:pointer;text-decoration:underline;margin-left:auto}

/* Entry modal */
.modal-backdrop{position:fixed;inset:0;background:rgba(26,26,26,.5);display:flex;align-items:center;justify-content:center;z-index:200}
.modal{background:var(--white);border-radius:var(--r);max-width:440px;width:calc(100% - 40px);padding:20px;box-shadow:0 8px 40px rgba(0,0,0,.3)}
.modal h3{font-size:16px;color:var(--td);margin-bottom:8px;font-weight:600}
.modal p{font-size:13px;color:#444;line-height:1.55;margin-bottom:10px}
.modal ul{margin:0 0 12px 18px;font-size:13px;color:#444}
.modal a{color:var(--tm);font-size:13px}
.modal-close{float:right;background:none;border:none;font-size:18px;cursor:pointer;color:#999}

/* Share row + keep-fresh */
.share-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;align-items:center}
.share-note{font-size:12px;color:#2e7d5e;margin-top:6px}
.kf-row{margin-top:10px;font-size:13px;color:#444;display:flex;align-items:center;gap:8px}