/* Colors from blessingboat.com: navy, deep blue, gold and cream */
:root{
  color-scheme:dark;
  --paper:#0A1628; --surface:#0D2045; --ink:#F5EFE0; --ink-2:#B5AF9F; --rule:rgba(201,168,76,.22);
  --field:#0B1A34; --focus:#F0D080; --danger:#FF8A80; --good:#7FE07F; --live:#E53935; --on-live:#FFFFFF;
  --gold:#C9A84C; --gold-2:#A87C2A; --gold-light:#F0D080; --white:#FFFFFF; --on-gold:#0A1628;
  --display:"Barlow Condensed","Arial Narrow","Roboto Condensed","Helvetica Neue",Arial,sans-serif;
  --body:"Barlow","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --line:#C9A84C;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{height:100%}
body{margin:0;min-height:100%;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:1rem;line-height:1.5;-webkit-text-size-adjust:100%}
h1,h2,h3,p{margin:0}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

/* top bar */
.top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 16px;padding:14px clamp(16px,4vw,40px);border-bottom:1px solid var(--rule)}
.mark{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;font-family:var(--display);font-weight:700;font-size:1.7rem;line-height:1;letter-spacing:.01em}
.mark svg{flex:none}
.account{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px}
.who-am-i{display:flex;align-items:center;gap:8px;font-weight:600}
.avatar{flex:none;width:32px;height:32px;border-radius:50%;background:var(--rule);object-fit:cover}
.avatar.big{width:40px;height:40px}
.avatar.blank{display:inline-flex;align-items:center;justify-content:center;color:var(--ink-2);font-family:var(--display);font-weight:700;font-size:1.1rem;text-transform:uppercase}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 16px;border:1.5px solid var(--ink);border-radius:6px;background:transparent;color:var(--ink);font:inherit;font-weight:600;line-height:1.3;text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--surface)}
.btn.primary{background:var(--ink);color:var(--paper)}
.btn.primary:hover{background:var(--ink);opacity:.88}
.btn.danger{border-color:var(--danger);color:var(--danger)}
.btn.small{padding:4px 10px;font-size:.9rem}
.btn[disabled]{opacity:.5;cursor:default}
.link{padding:0;border:0;background:none;color:var(--ink);font:inherit;font-size:.92rem;font-weight:500;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.link.danger{color:var(--danger)}

/* notices */
.notice{padding:10px clamp(16px,4vw,40px);background:var(--surface);border-bottom:1px solid var(--rule);font-size:.95rem}
.alert{margin:0 0 20px;padding:10px 14px;border:1.5px solid var(--danger);border-radius:6px;color:var(--danger);font-weight:500}

/* shell */
.shell{display:grid;grid-template-columns:minmax(200px,250px) minmax(0,1fr);gap:clamp(24px,4vw,56px);max-width:1180px;margin:0 auto;padding:28px clamp(16px,4vw,40px) 72px}
.shell.solo{grid-template-columns:minmax(0,1fr);max-width:720px}
.loading{color:var(--ink-2)}

/* event list */
.lines h2{margin-bottom:10px;color:var(--ink-2);font-size:.95rem;font-weight:600}
.lines-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.line-item{display:block;width:100%;padding:8px 12px;border:0;border-left:6px solid var(--line);border-radius:0 6px 6px 0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.line-item:hover,.line-item[aria-current="true"]{background:var(--surface)}
.line-item .lt{display:block;font-family:var(--display);font-weight:600;font-size:1.25rem;line-height:1.15;overflow-wrap:anywhere}
.line-item .lm{display:block;color:var(--ink-2);font-size:.875rem}
.line-item .live{color:var(--ink);font-weight:600}
@media (max-width:820px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .lines-list{display:flex;gap:8px;padding-bottom:6px;overflow-x:auto}
  .lines-list li{flex:0 0 auto;min-width:170px;max-width:240px}
}

/* event header */
.ev-head{border-top:8px solid var(--line);padding-top:18px}
.ev-title{font-family:var(--display);font-weight:700;font-size:clamp(2.3rem,6vw,3.6rem);line-height:.98;overflow-wrap:anywhere}
.ev-when{margin-top:12px;font-size:1.08rem;font-weight:500}
.ev-zone{color:var(--ink-2);font-size:.9rem;font-weight:400}
.ev-desc{margin-top:8px;max-width:62ch;color:var(--ink-2)}
.ev-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:16px}
.ev-status{display:inline-block;padding:4px 14px;border:1.5px solid var(--ink);border-radius:999px;font-size:.95rem;font-weight:600}
.ev-status.live{background:var(--ink);color:var(--paper)}
.ev-fill{color:var(--ink-2);font-size:.95rem}
.ev-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:14px}

/* boarding pass: where a streamer stands */
.pass{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:22px;padding:14px 16px;border:1.5px solid var(--ink);border-radius:8px;background:var(--surface)}
.pass p{flex:1 1 260px}
.pass strong{font-weight:600}
.pass .ok{color:var(--good);font-weight:600}
.pass .bad{color:var(--danger);font-weight:500}
.pass-note{flex:1 1 100%;color:var(--ink-2);font-size:.95rem}
.pass-form{display:flex;flex:1 1 280px;flex-wrap:wrap;gap:8px}
.pass-form input{flex:1 1 160px;min-width:0;text-transform:uppercase;letter-spacing:.04em}
.notice .codeword{white-space:normal;overflow-wrap:anywhere}
.codeword{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.95em;letter-spacing:.04em;white-space:nowrap}

/* tabs */
.tabs{display:flex;gap:2px;margin-top:28px;border-bottom:1px solid var(--rule);overflow-x:auto}
.tab{margin-bottom:-1px;padding:10px 14px;border:0;border-bottom:3px solid transparent;background:none;color:var(--ink-2);font:inherit;font-weight:600;white-space:nowrap;cursor:pointer}
.tab[aria-selected="true"]{border-bottom-color:var(--ink);color:var(--ink)}

/* the route */
.stops{margin:10px 0 0;padding:0;list-style:none}
.stop{--tint:var(--rule);--rail:calc(5.4rem + 28px);position:relative;display:grid;grid-template-columns:5.4rem 28px minmax(0,1fr);column-gap:14px;padding:16px 0}
@supports (background:color-mix(in srgb,red 50%,blue)){
  .stop{--tint:color-mix(in srgb,var(--line) 28%,var(--paper))}
}
.stop::before{content:"";position:absolute;left:calc(var(--rail) - 3px);top:0;bottom:0;width:6px;background:var(--tint)}
.stop:first-child::before{top:31px}
.stop:last-child::before{bottom:auto;height:31px}
.stop:first-child:last-child::before{display:none}
.stop.is-past::before{background:var(--line)}
.stop.is-now::before{background:linear-gradient(to bottom,var(--line) 0,var(--line) var(--fill,31px),var(--tint) var(--fill,31px))}
.t{padding-top:5px;line-height:1.2;text-align:right;font-variant-numeric:tabular-nums}
.t .clock{display:block;font-weight:600;white-space:nowrap}
.t .mil{display:block;color:var(--ink-2);font-size:.85rem}
.t .day{display:block;color:var(--ink-2);font-size:.8rem}
.dot{position:relative;z-index:1;display:block;width:22px;height:22px;margin:4px auto 0;border:5px solid var(--line);border-radius:50%;background:var(--line)}
.stop.is-open .dot{background:var(--paper)}
.boat{position:absolute;z-index:2;left:var(--rail);top:var(--fill,31px);display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--paper);transform:translate(-50%,-50%);transition:top 1s linear}
@media (prefers-reduced-motion:reduce){.boat{transition:none}}
.who{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px}
.name{font-family:var(--display);font-weight:600;font-size:1.8rem;line-height:1.1;color:inherit;text-decoration:none;overflow-wrap:anywhere}
a.name:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.stop.is-open .name{color:var(--ink-2);font-weight:500}
.badge{padding:2px 10px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:.8rem;font-weight:600;white-space:nowrap}
.badge.you{border:1.5px solid var(--ink);background:none;color:var(--ink)}
.badge.live{display:inline-flex;align-items:center;gap:6px;background:var(--live);color:var(--on-live)}
.badge.live::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.twitch-line{margin-top:2px;font-size:.92rem;font-weight:500}
.twitch-line.off{color:var(--ink-2);font-weight:400}
.ready{flex:1 1 100%;font-size:.92rem;font-weight:500}
.ready.yes{color:var(--good)}
.ready.no{color:var(--danger)}
.loc{margin-top:2px;color:var(--ink-2);font-size:.92rem}
.loc .pin{margin-right:5px}
.loc svg{vertical-align:-1px}
.note{margin-top:2px;color:var(--ink-2);overflow-wrap:anywhere}
.row-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-top:8px}
.stop.is-past .t,.stop.is-past .body{opacity:.58}
.handoff{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:12px}
.handoff code{padding:6px 10px;border:1.5px solid var(--rule);border-radius:6px;background:var(--surface);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9rem}
.slot-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:10px 12px;max-width:560px;padding-top:2px}
.slot-form .wide{grid-column:1 / -1;max-width:260px}
.slot-form .field{margin:0}
.slot-form .btns{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
@media (max-width:560px){
  .stop{--rail:calc(4.7rem + 24px);grid-template-columns:4.7rem 28px minmax(0,1fr);column-gap:10px}
  .t .clock{font-size:.9rem}
  .slot-form{grid-template-columns:minmax(0,1fr)}
  .name{font-size:1.5rem}
}

/* forms */
.form{max-width:560px}
.form h1,.plain h1{font-family:var(--display);font-weight:700;font-size:clamp(2rem,5vw,2.8rem);line-height:1}
.form .lead,.plain .lead{max-width:56ch;margin:10px 0 26px;color:var(--ink-2)}
.field{display:block;margin:0 0 18px}
.field .lab{display:block;margin-bottom:4px;font-weight:600}
.field .hint{display:block;margin-top:4px;color:var(--ink-2);font-size:.875rem}
.field .err{display:block;margin-top:4px;color:var(--danger);font-size:.875rem;font-weight:500}
input[type=text],input[type=number],input[type=email],input[type=password],input[type=datetime-local],select,textarea{width:100%;padding:9px 11px;border:1.5px solid var(--rule);border-radius:6px;background:var(--field);color:var(--ink);font:inherit}
.pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px}
@media (max-width:480px){.pair{grid-template-columns:minmax(0,1fr)}}
.check{display:flex;align-items:flex-start;gap:10px;margin:0 0 18px;cursor:pointer}
.check input{flex:none;width:18px;height:18px;margin:3px 0 0}
.check small{display:block;color:var(--ink-2);font-size:.875rem}
.swatches{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 22px;padding:0;border:0}
.swatches legend{margin-bottom:6px;padding:0;font-weight:600}
.swatch{position:relative;display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 6px;border:1.5px solid var(--rule);border-radius:999px;font-size:.92rem;cursor:pointer}
.swatch input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.swatch i{display:block;width:20px;height:20px;border-radius:50%;background:var(--line)}
.swatch.on{border-color:var(--ink);font-weight:600}
.swatch:focus-within{outline:3px solid var(--focus);outline-offset:2px}
.form-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
/* organizers only: private notes */
.private{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:6px;padding:6px 10px;border-left:3px solid var(--ink-2);background:var(--surface);font-size:.92rem}
.private-tag{color:var(--ink-2);font-size:.8rem;font-weight:600}
.private-text{overflow-wrap:anywhere}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.shell.wide{max-width:1180px}
.members .m-top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px}
.members h1{font-family:var(--display);font-weight:700;font-size:clamp(2rem,5vw,2.8rem);line-height:1}
.members .lead{max-width:70ch;margin:10px 0 24px;color:var(--ink-2)}
.m-grid{display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);gap:28px;align-items:start}
@media (max-width:820px){.m-grid{grid-template-columns:minmax(0,1fr)}}
.m-list input{margin-bottom:10px}
.m-add{display:grid;gap:6px;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--rule)}
.m-add .lab{font-weight:600}
.m-add textarea{resize:vertical}
.m-add .btn{justify-self:start}
.m-add .err{color:var(--danger);font-size:.9rem;font-weight:500}
.m-addmsg{color:var(--ink-2);font-size:.9rem;overflow-wrap:anywhere}
.m-rows{display:grid;gap:4px;margin:0;padding:0;list-style:none;max-height:70vh;overflow-y:auto}
.m-row{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;border-radius:6px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.m-row:hover,.m-row[aria-current="true"]{background:var(--surface)}
.m-who{display:flex;flex-direction:column;flex:1;min-width:0}
.m-name{font-weight:600;overflow-wrap:anywhere}
.m-meta{color:var(--ink-2);font-size:.88rem}
.m-count{padding:1px 8px;border:1.5px solid var(--ink-2);border-radius:999px;color:var(--ink-2);font-size:.78rem;font-weight:600;white-space:nowrap}
.m-detail{padding:20px 22px 24px;border:1px solid var(--rule);border-radius:10px;background:var(--surface)}
.m-detail.m-empty{color:var(--ink-2)}
.m-head{display:flex;align-items:center;gap:14px;margin-bottom:8px}
.m-head h2{font-size:1.6rem}
.m-detail h3{margin:22px 0 4px;font-size:1rem;font-weight:600}
.m-detail .hint{margin-bottom:10px;color:var(--ink-2);font-size:.9rem}
.m-detail textarea{resize:vertical}
.m-detail .field{margin-bottom:10px}
.notes,.history{margin:14px 0 0;padding:0;list-style:none}
.notes li{padding:10px 0;border-top:1px solid var(--rule)}
.note-text{white-space:pre-line;overflow-wrap:anywhere}
.note-meta{margin-top:2px;color:var(--ink-2);font-size:.85rem}
.history li{display:flex;flex-wrap:wrap;gap:2px 12px;padding:7px 0;border-top:1px solid var(--rule);font-size:.95rem}
.h-when{min-width:9.5em;font-weight:600;font-variant-numeric:tabular-nums}
.h-title{flex:1;min-width:0;overflow-wrap:anywhere}
.history .gone .h-when,.history .gone .h-title{color:var(--ink-2)}
.h-left{color:var(--danger);font-size:.88rem}
.m-remove{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:26px;padding-top:16px;border-top:1px solid var(--rule)}
/* event banners */
.ev-banner{display:block;width:100%;height:auto;max-height:440px;margin-bottom:22px;border-radius:10px;object-fit:cover}
.banner-preview{display:block;width:100%;max-width:520px;height:auto;margin:6px 0 10px;border:1px solid var(--rule);border-radius:8px}
.banner-field .form-actions{margin-top:4px}
.banner-field .saved-hint{color:var(--good)}
.settings .sub{margin-top:6px;font-size:1.15rem;font-weight:600}
.settings .lead{margin-top:6px}
.settings .opts{margin-top:4px}
.settings textarea{resize:vertical}
.test-row{margin-top:30px;padding-top:20px;border-top:1px solid var(--rule)}
.test-row h3{font-size:1rem;font-weight:600}
.test-row .hint{display:block;margin:2px 0 10px;color:var(--ink-2);font-size:.9rem}
.test-row .pass-form input{text-transform:none;letter-spacing:normal}

/* invite codes */
.panel{padding-top:22px}
.panel h3{margin-bottom:10px;font-size:1rem;font-weight:600}
.panel .intro{max-width:66ch;margin-bottom:20px}
.code-form{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0 14px;align-items:start;max-width:820px}
.code-form .wide{grid-column:span 2}
.code-form .go{grid-column:1 / -1}
@media (max-width:700px){.code-form{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.codes-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;margin:30px 0 8px}
.codes-head h3{margin:0}
.codes{margin:0;padding:0;list-style:none;border-top:1px solid var(--rule)}
.code-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--rule)}
.code-row .codeword{font-size:1.05rem;font-weight:600}
.code-row .meta{color:var(--ink-2);font-size:.9rem}
.code-row .acts{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px 12px}
.code-row.spent .codeword{text-decoration:line-through;color:var(--ink-2)}
.empty{padding:16px 0;color:var(--ink-2)}
@media (max-width:560px){.code-row{grid-template-columns:minmax(0,1fr)}.code-row .acts{justify-content:flex-start}}

/* share */
.seg{display:inline-flex;flex-wrap:wrap;border:1.5px solid var(--ink);border-radius:8px;overflow:hidden}
.seg button{padding:8px 14px;border:0;background:none;color:var(--ink);font:inherit;font-weight:600;cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.share-intro{max-width:66ch;margin-top:16px}
.share-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start;margin-top:22px}
@media (max-width:980px){.share-grid{grid-template-columns:minmax(0,1fr)}}
.opts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px}
.opts .wide{grid-column:1 / -1}
.mock{position:sticky;top:16px;padding:14px 14px 16px;border:1.5px dashed var(--rule);border-radius:10px;overflow-x:auto}
@media (max-width:980px){.mock{position:static}}
input[type=color]{display:block;width:100%;height:42px;padding:3px;border:1.5px solid var(--rule);border-radius:6px;background:var(--field);cursor:pointer}
.look{margin-top:34px;padding-top:22px;border-top:1px solid var(--rule)}
.look-intro{margin:-4px 0 18px;color:var(--ink-2);font-size:.95rem}
.checks{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px;margin-top:4px}
@media (max-width:480px){.checks{grid-template-columns:minmax(0,1fr)}}
.look-note{margin-top:12px;color:var(--ink-2);font-size:.92rem}
.look-note.saved{color:var(--good);font-weight:500}
textarea.code{min-height:120px;resize:vertical;white-space:pre;overflow:auto;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.82rem;line-height:1.5}
textarea.code.tall{min-height:240px}
.copy-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:10px}

/* ---- Blessing Boat brand: gold on navy, as on blessingboat.com ---- */
.top{background:rgba(10,22,40,.95);border-bottom-color:rgba(201,168,76,.25)}
.mark{color:var(--gold)}
.ev-title,.form h1,.plain h1,.members h1,.m-head h2 .name{color:var(--white)}
.btn{border-color:rgba(201,168,76,.5);color:var(--gold-light)}
.btn:hover{background:rgba(201,168,76,.1)}
.btn.primary,.btn.primary:hover{background:linear-gradient(135deg,var(--gold),var(--gold-2));border-color:transparent;color:var(--on-gold)}
.btn.primary:hover{opacity:1;box-shadow:0 4px 16px rgba(201,168,76,.35)}
.btn.danger{border-color:var(--danger);color:var(--danger)}
.ev-status{border-color:rgba(201,168,76,.5);color:var(--gold-light)}
.ev-status.live{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}
.badge{background:var(--gold);color:var(--on-gold)}
.badge.you{border-color:var(--gold-light);background:none;color:var(--gold-light)}
.badge.live{background:var(--live);color:var(--on-live)}
.tab[aria-selected="true"]{border-bottom-color:var(--gold);color:var(--white)}
.seg{border-color:rgba(201,168,76,.5)}
.seg button{color:var(--gold-light)}
.seg button[aria-pressed="true"]{background:var(--gold);color:var(--on-gold)}
.pass{border-color:rgba(201,168,76,.45);background:var(--surface)}
.pass .ok{color:var(--gold-light)}
.boat{background:var(--gold);color:var(--on-gold)}
.stop.is-now .dot{border-color:var(--gold-light)}
.swatch{border-color:rgba(201,168,76,.3)}
.swatch.on{border-color:var(--gold-light)}
input[type=text],input[type=number],input[type=email],input[type=password],input[type=datetime-local],select,textarea{border-color:rgba(201,168,76,.32)}
input[type=color]{border-color:rgba(201,168,76,.32)}
.private{border-left-color:var(--gold)}
.private-tag{color:var(--gold)}
.m-row:hover,.m-row[aria-current="true"],.line-item:hover,.line-item[aria-current="true"]{background:var(--surface)}
.m-detail{border-color:rgba(201,168,76,.22)}
.link{text-decoration-color:rgba(201,168,76,.6)}
.link.danger{text-decoration-color:currentColor}

/* ---- Inbox: the contact and apply form ---- */
.ib-count{display:inline-block;min-width:20px;margin-left:6px;padding:0 6px;border-radius:999px;background:var(--gold);color:var(--on-gold);font-size:.78rem;font-weight:700;line-height:20px;text-align:center;text-decoration:none}
.inbox .notice{margin:0 0 18px;border:1px solid var(--rule);border-radius:8px}
.ib-filters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.ib-filter{padding:5px 11px;border:1px solid var(--rule);border-radius:999px;background:none;color:var(--ink-2);font:inherit;font-size:.88rem;font-weight:600;cursor:pointer}
.ib-filter:hover{color:var(--ink)}
.ib-filter[aria-pressed="true"]{border-color:var(--gold);background:var(--gold);color:var(--on-gold)}
.ib-row{align-items:flex-start}
.ib-preview{margin-top:2px;color:var(--ink-2);font-size:.88rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ib-dot{flex:none;width:9px;height:9px;margin-top:7px;border-radius:50%;background:var(--gold)}
.ib-kind{display:inline-block;padding:0 8px;border:1px solid currentColor;border-radius:999px;font-size:.72rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase;vertical-align:2px;white-space:nowrap}
.ib-kind.apply{color:var(--gold-light)}
.ib-kind.info{color:#9DBBF5}
.ib-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:12px}
.ib-head h2{margin-right:4px;color:var(--white);font-size:1.6rem;overflow-wrap:anywhere}
.ib-status{padding:2px 10px;border-radius:999px;background:var(--paper);color:var(--ink-2);font-size:.82rem;font-weight:600}
.ib-status.awaiting,.ib-status.pending{background:var(--gold);color:var(--on-gold)}
.ib-status.approved,.ib-status.replied{color:var(--good)}
.ib-status.denied{color:var(--danger)}
.ib-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;margin:0 0 6px;font-size:.95rem}
.ib-facts dt{color:var(--ink-2)}
.ib-facts dd{margin:0;overflow-wrap:anywhere}
.ib-facts a{color:var(--gold-light)}
.ib-message{padding:12px 14px;border-left:3px solid var(--gold);background:var(--paper);border-radius:0 6px 6px 0}
.ib-discord{margin-top:10px}
.ib-actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 6px}
.ib-decide,.ib-reply{margin-top:20px;padding:16px 18px;border:1px solid var(--rule);border-radius:8px;background:var(--paper)}
.ib-decide.approved{border-color:rgba(127,224,127,.45)}
.ib-decide.denied{border-color:rgba(255,138,128,.45)}
.ib-decide h3,.ib-reply h3{margin-top:0}
.ib-decided{margin:20px 0 4px;padding:12px 14px;border-radius:8px;background:var(--paper)}
.ib-decided p{margin:0 0 6px}
.ib-decided.approved strong{color:var(--good)}
.ib-decided.denied strong{color:var(--danger)}
.ib-replied{margin-top:20px}
.ib-replylink{margin-top:14px}
.ib-code{margin-top:28px;padding-top:16px;border-top:1px solid var(--rule)}
.ib-code .hint{margin:10px 0;max-width:70ch;color:var(--ink-2);font-size:.9rem}
.ap-settings{margin-top:36px;padding-top:24px;border-top:1px solid var(--rule)}
.ap-letter{margin-top:8px}
.ap-letter h3{margin:16px 0 8px;font-size:1rem;font-weight:600}
.ap-letter textarea{resize:vertical}
.ap-settings > .hint{color:var(--ink-2);font-size:.9rem;margin:14px 0}