/* Comedian accounts (COMIC): sign-up, sign-in, profile editor, public profile, line-up.
   Used only by comic-*.html and comic.html. Nothing here touches another page. Colours come from the tokens the Comedy side already uses
   (--court-txt / --court-rgb), the same ones as the existing .badge-comic in style.css. */

/* ---- The panel (same shape as the DJ sign-in panel) ---- */
.cm-door{max-width:540px;margin:18px auto 0;padding:0;}
.cm-door.cm-wide{max-width:680px;}
.cm-door .door-stub{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px 12px;border-bottom:1px solid var(--line);}
.cm-door .door-stub h2{margin:0;font:500 12px/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--txt-2);}
.cm-body{padding:20px 22px 22px;}
.cm-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:0 18px;margin-top:16px;padding-top:4px;border-top:1px solid var(--line);}
.cm-note{margin:0 0 14px;font:500 16px/1.5 var(--f-ui);color:var(--txt-2);}
.cm-note a{color:#fff;text-decoration-color:var(--seam);}
.cm-hint{margin:6px 0 0;font:600 15px/1.4 var(--f-ui);color:var(--muted);}
.cm-hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden;}
.cm-bot{margin:0 0 14px;}
.cm-bot:empty{display:none;}
.cm-count{float:right;font:600 14px/1 var(--f-mono);color:var(--muted);}
.cm-agree{display:flex;align-items:flex-start;gap:10px;margin:4px 0 16px;font:500 16px/1.45 var(--f-ui);color:var(--txt-2);}
.cm-agree input{flex:none;width:22px;height:22px;margin-top:2px;}
.cm-agree a{color:#fff;}
.cm-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;}
.cm-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:6px;}
.cm-actions .submitbtn{width:auto;min-width:200px;}
.cm-sep{margin:22px 0 0;padding-top:18px;border-top:1px solid var(--line);}
.cm-sep h3{margin:0 0 10px;font:700 18px/1.3 var(--f-ui);color:var(--txt);}
.cm-resend{margin-top:12px;}
.cm-resend .cta{width:100%;}
.cm-ok{padding:18px 22px;}
.cm-ok h2{margin:0 0 8px;}
.cm-ok p{margin:0 0 12px;font:500 17px/1.5 var(--f-ui);color:var(--txt-2);}

/* ---- The COMIC badge (the existing .badge-comic colour, so it matches the forum) ---- */
.cm-badge{display:inline-flex;align-items:center;gap:8px;padding:5px 9px;border:1px solid rgba(var(--court-rgb),.5);font:500 11px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--court-txt);white-space:nowrap;}

/* ---- Picture + name block on the account page ---- */
.cm-me{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap;margin:0 0 18px;}
.cm-av{position:relative;flex:none;display:flex;align-items:center;justify-content:center;width:96px;height:96px;overflow:hidden;border:1px solid var(--line-2);background:var(--glass-2);font:400 34px/1 var(--f-display);color:var(--txt);}
.cm-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.cm-me-id{flex:1 1 220px;min-width:0;}
.cm-me-name{margin:0 0 6px;font:700 22px/1.25 var(--f-ui);color:var(--txt);overflow-wrap:anywhere;}
.cm-me-tag{margin:0 0 10px;font:500 16px/1.45 var(--f-ui);color:var(--txt-2);overflow-wrap:anywhere;}
.cm-linkrow{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;}
.cm-linkrow a,.cm-linkrow button{font:600 16px/1.4 var(--f-ui);color:var(--court-txt);background:none;border:0;padding:8px 0;cursor:pointer;text-decoration:underline;}
.cm-photo{margin:0 0 16px;}
.cm-status{min-height:1.4em;margin:8px 0 0;font:600 16px/1.4 var(--f-ui);color:var(--txt-2);}
.cm-status.err{color:var(--signal-txt,#ff8a7a);}
.cm-status.ok{color:var(--court-txt);}

/* ---- The line-up ---- */
.cm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin:18px 0 0;padding:0;list-style:none;}
.cm-card{display:flex;flex-direction:column;gap:10px;height:100%;padding:16px;background:var(--glass);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--txt);text-decoration:none;}
.cm-card .cm-av{width:72px;height:72px;font-size:26px;}
.cm-card b{font:700 19px/1.25 var(--f-ui);overflow-wrap:anywhere;}
.cm-card .cm-tag{margin:0;font:500 15px/1.4 var(--f-ui);color:var(--txt-2);overflow-wrap:anywhere;}
@media (hover:hover) and (pointer:fine){
  .cm-card{transition:box-shadow .2s var(--ease-out),background .2s var(--ease-out);}
  .cm-card:hover{background:rgba(var(--court-rgb),.1);box-shadow:inset 0 0 0 1px var(--court-txt);}
}
.cm-card .cm-badge{align-self:flex-start;margin-top:auto;}
.cm-card:focus-visible{outline:2px solid var(--seam);outline-offset:2px;}
.cm-lead{max-width:40rem;margin:6px auto 0;text-align:center;font:500 18px/1.5 var(--f-ui);color:var(--txt-2);}
.cm-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 14px;margin:16px 0 0;}
.cm-state{margin:24px auto 0;max-width:640px;}

/* ---- A public profile ---- */
.cm-profile{max-width:640px;margin:18px auto 0;padding:24px 22px;}
.cm-profile .cm-av{width:120px;height:120px;font-size:42px;}
.cm-profile-head{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap;}
.cm-profile h2{margin:0 0 8px;font:700 28px/1.2 var(--f-ui);overflow-wrap:anywhere;}
.cm-profile .cm-tag{margin:10px 0 0;font:500 19px/1.5 var(--f-ui);color:var(--txt-2);overflow-wrap:anywhere;}
.cm-links{display:flex;flex-direction:column;gap:2px;margin:18px 0 0;padding:0;list-style:none;}
.cm-links a{display:inline-block;padding:10px 0;font:600 18px/1.4 var(--f-ui);color:var(--court-txt);overflow-wrap:anywhere;}

@media (max-width:700px){
  .cm-door{margin-top:14px;}
  .cm-door .door-stub{padding:13px 16px 11px;}
  .cm-body{padding:18px 16px;}
  .cm-two{grid-template-columns:1fr;}
  .cm-actions .submitbtn{width:100%;}
  .cm-profile{padding:18px 16px;}
  .cm-profile .cm-av{width:96px;height:96px;}
}
/* Delete my account: set apart from the profile controls, never the loud primary button */
.cm-danger{margin-top:34px;border-top:2px solid var(--seam,#7a2a2a);}
.cm-dellist{margin:0 0 14px;padding-left:20px;}
.cm-dellist li{margin:0 0 6px;}
.cm-danger-btn{border-color:#d9534f;color:#ffb3ae;}
.cm-danger-btn:disabled{opacity:.5;cursor:not-allowed;}

/* ---- Profile extras (style, credits, stage photos, Laugh Meter placeholder) and the spotlight (Oct 2026) ---- */
/* Spotlight checklist on the account page */
.cm-spot{margin:0 0 20px;padding:16px 18px;background:rgba(var(--court-rgb),.07);box-shadow:inset 0 0 0 1px rgba(var(--court-rgb),.35);}
.cm-spot[hidden]{display:none;}
.cm-spot.is-ready{box-shadow:inset 0 0 0 1px var(--court-txt);}
.cm-spot-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 10px;}
.cm-spot h3{margin:0;font:700 18px/1.3 var(--f-ui);color:var(--txt);}
.cm-spot-pct{font:600 14px/1 var(--f-mono);color:var(--court-txt);white-space:nowrap;}
.cm-meter{height:8px;margin:0 0 12px;background:var(--glass-2);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;}
.cm-meter-fill{height:100%;width:0;background:var(--court-txt);transition:width .5s var(--ease-out);}
@media (prefers-reduced-motion:reduce){ .cm-meter-fill{transition:none;} }
.cm-spot .cm-note{margin:0 0 10px;}
.cm-check{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px 16px;margin:0;padding:0;list-style:none;}
.cm-check li{display:flex;align-items:center;gap:10px;min-height:32px;font:600 15px/1.35 var(--f-ui);color:var(--muted);}
.cm-check li.is-done{color:var(--txt);}
.cm-tick{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;box-shadow:inset 0 0 0 1px var(--line-2);font:700 14px/1 var(--f-ui);color:var(--court-txt);}
.cm-check li.is-done .cm-tick{box-shadow:inset 0 0 0 1px var(--court-txt);background:rgba(var(--court-rgb),.15);}
.cm-need{margin-left:auto;padding:3px 6px;border:1px solid rgba(var(--court-rgb),.5);font:500 10px/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--court-txt);}

/* Choice chips (checkboxes / radios that look like pills) */
.cm-set{border:0;margin:0 0 16px;padding:0;min-width:0;}
.cm-legend{padding:0;margin:0 0 8px;font:600 16px/1.4 var(--f-ui);color:var(--txt);}
.cm-chips{display:flex;flex-wrap:wrap;gap:8px;}
.cm-chips[hidden]{display:none;}
.cm-chip{position:relative;display:inline-flex;cursor:pointer;}
.cm-chip input{position:absolute;opacity:0;width:1px;height:1px;}
.cm-chip span{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;box-shadow:inset 0 0 0 1px var(--line-2);font:600 15px/1 var(--f-ui);color:var(--txt-2);}
.cm-chip input:checked + span{background:rgba(var(--court-rgb),.18);box-shadow:inset 0 0 0 1px var(--court-txt);color:var(--txt);}
.cm-chip input:checked + span::before{content:"\2713";margin-right:8px;color:var(--court-txt);}
.cm-chip input:focus-visible + span{outline:2px solid var(--seam);outline-offset:2px;}
textarea#cmExpect{width:100%;resize:vertical;min-height:84px;}

/* Credits editor */
.cm-credits{margin:0 0 6px;padding:0;list-style:none;}
.cm-credit{display:flex;gap:10px;align-items:center;margin:0 0 8px;}
.cm-credit input{flex:1 1 auto;min-width:0;}
.cm-x{flex:none;background:none;border:0;padding:8px 2px;font:600 14px/1.2 var(--f-ui);color:var(--muted);text-decoration:underline;cursor:pointer;}
.cm-x[hidden]{display:none;}
.cm-linkrow button:disabled{opacity:.45;cursor:not-allowed;}
.cm-linkrow button[hidden]{display:none;}

/* Stage photo slots */
.cm-stage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.cm-slot{display:flex;flex-direction:column;gap:8px;min-width:0;}
.cm-slot-pic{aspect-ratio:4/3;overflow:hidden;background:var(--glass-2);box-shadow:inset 0 0 0 1px var(--line-2);}
.cm-slot-pic[hidden]{display:none;}
.cm-slot-pic img{width:100%;height:100%;object-fit:cover;display:block;}
.cm-slot-drop{aspect-ratio:4/3;min-height:0;justify-content:center;}
.cm-slot.is-filled .cm-slot-drop{aspect-ratio:auto;min-height:44px;padding:8px 12px;}
.cm-slot.is-filled .cm-slot-drop .dz-hint{display:none;}
@media (max-width:700px){ .cm-stage{grid-template-columns:1fr;} }

/* Laugh Meter placeholder */
.cm-meter-soon{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;background:var(--glass);box-shadow:inset 0 0 0 1px var(--line-2);}
.cm-meter-soon p{margin:0;font:500 16px/1.5 var(--f-ui);color:var(--txt-2);}
.cm-soon{flex:none;padding:6px 9px;background:rgba(var(--court-rgb),.15);border:1px solid var(--court-txt);font:500 11px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--court-txt);white-space:nowrap;}
@media (max-width:520px){ .cm-meter-soon{flex-direction:column;} }

/* Public profile additions */
.cm-banner{margin:-24px -22px 18px;aspect-ratio:16/7;overflow:hidden;background:#07060a;}
.cm-banner img{width:100%;height:100%;object-fit:cover;display:block;}
.cm-banner.is-art img{object-position:50% 30%;opacity:.85;}
.cm-pill{display:inline-flex;align-items:center;min-height:30px;padding:0 10px;box-shadow:inset 0 0 0 1px rgba(var(--court-rgb),.45);font:600 13px/1 var(--f-ui);color:var(--txt);}
.cm-pill--rate{box-shadow:inset 0 0 0 1px var(--line-2);color:var(--txt-2);}
.cm-chips--show{margin:14px 0 0;gap:6px;}
.cm-psec{margin:22px 0 0;padding-top:16px;border-top:1px solid var(--line);}
.cm-psec[hidden]{display:none;}
.cm-psec h3{margin:0 0 10px;font:500 12px/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--txt-2);}
.cm-psec > p{margin:0 0 8px;font:500 18px/1.5 var(--f-ui);color:var(--txt);overflow-wrap:anywhere;}
.cm-psec > p[hidden]{display:none;}
.cm-psec .cm-lens{font-size:16px;color:var(--txt-2);}
.cm-credlist{margin:0;padding:0;list-style:none;}
.cm-credlist li{position:relative;padding:8px 0 8px 22px;font:600 17px/1.4 var(--f-ui);color:var(--txt);border-bottom:1px solid var(--line);overflow-wrap:anywhere;}
.cm-credlist li:last-child{border-bottom:0;}
.cm-credlist li::before{content:"";position:absolute;left:2px;top:50%;width:8px;height:8px;margin-top:-4px;background:var(--court-txt);transform:rotate(45deg);}
.cm-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;}
.cm-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;}
.cm-card .cm-chips--show{margin:0;}
@media (max-width:700px){ .cm-banner{margin:-18px -16px 16px;} }

/* "Meet the comics" spotlight on jesters-court.html */
.cm-spotlight{margin:0 0 34px;}
.cm-spotlight[hidden]{display:none;}
.cm-spot-stage{min-height:200px;}
.cm-spot-card{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:var(--glass);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--txt);text-decoration:none;overflow:hidden;animation:cmSpotIn .45s var(--ease-out) both;}
@keyframes cmSpotIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .cm-spot-card{animation:none;} }
.cm-spot-art{position:relative;min-height:240px;background:#07060a;overflow:hidden;}
.cm-spot-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.cm-spot-art.is-art img{object-position:40% 30%;opacity:.8;}
.cm-spot-body{display:flex;flex-direction:column;gap:12px;padding:22px 24px;}
.cm-spot-head{display:flex;gap:14px;align-items:center;}
.cm-spot-head .cm-av{width:64px;height:64px;font-size:24px;}
.cm-spot-head > div{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;}
.cm-spot-name{font:700 22px/1.2 var(--f-ui);overflow-wrap:anywhere;}
.cm-spot-tag{margin:0;font:500 18px/1.45 var(--f-ui);color:var(--txt-2);overflow-wrap:anywhere;}
.cm-spot-body .cm-chips--show{margin:0;}
.cm-spot-credit{margin:0;font:600 15px/1.4 var(--f-ui);color:var(--muted);}
.cm-spot-go{margin-top:auto;font:600 16px/1.4 var(--f-ui);color:var(--court-txt);text-decoration:underline;}
@media (hover:hover) and (pointer:fine){
  .cm-spot-card{transition:box-shadow .2s var(--ease-out);}
  .cm-spot-card:hover{box-shadow:inset 0 0 0 1px var(--court-txt);}
}
.cm-spot-card:focus-visible{outline:2px solid var(--seam);outline-offset:2px;}
.cm-spot-nav{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:14px;}
.cm-spot-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;background:var(--glass);border:0;box-shadow:inset 0 0 0 1px var(--line-2);font:400 26px/1 var(--f-ui);color:var(--txt);cursor:pointer;}
.cm-spot-btn[hidden],.cm-spot-count[hidden],.cm-spot-dots[hidden]{display:none;}
.cm-spot-count{font:600 14px/1 var(--f-mono);color:var(--muted);}
.cm-spot-dots{display:flex;gap:2px;}
.cm-spot-dot{width:28px;height:44px;background:none;border:0;padding:0;cursor:pointer;position:relative;}
.cm-spot-dot::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;margin:-4px 0 0 -4px;background:var(--line-2);transform:rotate(45deg);}
.cm-spot-dot[aria-current="true"]::after{background:var(--court-txt);}
.cm-spot-all{margin-left:auto;}
@media (max-width:820px){
  .cm-spot-card{grid-template-columns:1fr;}
  .cm-spot-art{min-height:0;aspect-ratio:16/9;}
  .cm-spot-body{padding:18px 16px;}
  .cm-spot-all{margin-left:0;width:100%;}
}
