/* CLEAR Voice in the clearuk.org style. Loaded after chrome.css, hub.css and voice.css. */

/* Brand colours and solid (not gradient) buttons, like clearuk.org */
body.ck{--purple:#3d2b96;--purple-d:#2e2073;--grad:linear-gradient(#3d2b96,#3d2b96);--cream:#fff;--lav:#ebe9f9;--line:#e6e3f3;--line2:#cfcbe4;--radius:28px;--focus:#0b6fd6}
body.ck .btn{border-radius:8px}
body.ck .btn.primary{background:var(--ck-purple);color:#fff}
body.ck .btn.primary:hover{background:var(--ck-purple-d);box-shadow:none}
body.ck .btn.line{border-color:var(--ck-purple);color:var(--ck-purple)}
body.ck .panel,body.ck .card,body.ck .rev,body.ck .themecard,body.ck .chartcard,body.ck .tile,body.ck .resp,body.ck .filters{border-radius:24px}
body.ck main{flex:1}
.ck-menu .main li:nth-child(5) svg{stroke:var(--ck-pink)}


/* topic cards (lavender section) */
.ck-cards3{display:flex;flex-wrap:wrap;justify-content:center;gap:28px}
.ck-topiccard{flex:0 1 calc((100% - 56px)/3);min-width:0;padding:40px 30px 34px}
.ck-topiccard .ck-circle{width:112px;height:112px}
.ck-topiccard .ck-circle svg{width:50px;height:50px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ck-topiccard .cat{font-size:.9rem!important;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 8px!important;flex:0!important}
.ck-topiccard h3{font-size:1.45rem;color:var(--ck-ink);margin:0 0 12px}
.ck-topiccard p{font-size:1.05rem}
.ck-cardbtns{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
.ck-cardbtns .ck-btn{padding:12px 10px;font-size:1rem;min-height:52px;white-space:nowrap}
.ck-cardbtns svg.i{width:1.15em;height:1.15em;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ck-btn.outline{background:#fff;color:var(--ck-purple);border-color:var(--ck-purple)}
.ck-btn.outline:hover{background:var(--ck-lav)}
.t-purple .ck-circle{background:var(--ck-purple)}.t-purple .cat{color:var(--ck-purple)}
.t-amber .ck-circle{background:var(--ck-orange)}.t-amber .cat{color:#a8550f}
.t-blue .ck-circle{background:var(--ck-teal)}.t-blue .cat{color:#2c6f86}
.t-rose .ck-circle{background:var(--ck-pink)}.t-rose .cat{color:var(--ck-pink)}
.t-green .ck-circle{background:#2f9e78}.t-green .cat{color:#1f7a5b}

/* other ways to take part (mint section) */
.ck-ways{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.ck-way{display:flex;flex-direction:column;gap:6px;background:#fff;border-radius:24px;padding:24px 26px;text-decoration:none;color:var(--ck-body);box-shadow:0 2px 10px #0a7a5c12}
.ck-way strong{font-size:1.25rem;color:var(--ck-purple);text-decoration:underline;text-underline-offset:4px}
.ck-way:hover{background:#f7fffb}

/* inner pages: lavender background, white panels, like the clearuk.org card sections */
body.ck:not(:has(.ck-hero)) main{background:var(--ck-lav);padding-bottom:56px}
body.ck .page{padding-top:56px}
body.ck .page h1,body.ck .adm h1{color:var(--ck-ink)}
body.ck .page > h1 + p,body.ck .page .panel{font-size:1.05rem}
body.ck .chatwrap{padding-top:8px}
body.ck .chat{border-radius:32px;border:0;box-shadow:0 2px 14px #3d2b9614}
body.ck .conf{color:var(--ck-body)}
body.ck .msg .av{background:var(--ck-purple)}
body.ck .msg.me .bubble{background:var(--ck-purple);border-color:var(--ck-purple)}
body.ck .tag-fu{color:var(--ck-pink)}
body.ck .chip{background:var(--ck-lav);color:var(--ck-purple);border-color:#d8d3f2}
body.ck .side button[aria-current=true]{background:#fff;color:var(--ck-purple)}
body.ck .adm{padding-top:40px}
body.ck .er,body.ck .paper{background:#fff;border-radius:32px;margin-top:40px;margin-bottom:0}
body.ck .page:not(.er):not(.paper){background:#fff;border-radius:32px;margin-top:40px}
body.ck .page:has(.two),body.ck .page:has(#staffForm){background:transparent}

@media (max-width:980px){.ck-topiccard{flex-basis:calc((100% - 28px)/2)}}
@media (max-width:700px){
  .ck-topiccard{flex-basis:100%}
  .ck-ways{grid-template-columns:1fr}
  body.ck .page:not(.er):not(.paper),body.ck .er,body.ck .paper{border-radius:0;margin-top:0}
  .ck-cardbtns .ck-btn{width:auto}
}

/* admin on phones: keep everything inside the screen */
.adm>*{min-width:0}
@media (max-width:960px){.adm{grid-template-columns:minmax(0,1fr)}.side{max-width:100%}}
.filters>div{min-width:0;max-width:100%}
.filters select{width:100%}
@media (max-width:700px){.filters>div{flex:1 1 100%}}

/* ---- chat: the CLEAR mark beside each question, and photos in the conversation ---- */
body.ck .msg .av{background:#fff;border:1px solid var(--line2);padding:8px}
.av svg{display:block;width:100%;height:100%}
.bubble.photo{margin:0;padding:8px;width:min(296px,100%)}
body.ck .msg.me .bubble.photo{background:#fff;color:var(--ink);border-color:var(--line2)}
.bubble.photo img{display:block;width:100%;height:auto;border-radius:14px}
.bubble.photo figcaption{font-size:.95rem;padding:8px 6px 2px}
.stg{flex:1 1 260px;min-width:0}
.stg input{flex:1;min-width:0}
@media (max-width:480px){
  .chatwrap{padding:0 8px}
  .chat-h{padding:12px 14px;gap:10px}
  .log{padding:18px 14px;gap:16px}
  .msg{gap:10px}
  body.ck .msg .av{width:36px;height:36px;padding:6px}
  .bubble{padding:14px 16px;font-size:1.05rem}
  .composer{padding:12px 12px 10px}
  .rev{padding:14px}
  .stars label{min-width:0;flex:1 1 56px;padding:8px 6px}
}

/* ---- staff sign-in ---- */
.page.signin{max-width:540px}
.signin-card{padding:36px}
.signin-card h1{margin:.1em 0 .25em}
.signin-card .lead{color:var(--muted);margin:0 0 20px}
.signin-card .fine{font-size:.9rem;color:var(--muted);margin:22px 0 0;padding-top:16px;border-top:1px solid var(--line)}
.btn.block{display:flex;width:100%;justify-content:center;margin-top:8px}
@media (max-width:480px){body.ck .page.signin{padding:24px 12px}.signin-card{padding:24px 18px}}

/* ---- admin layout: sidebar (who, sections, sign out) and main column ---- */
.adm{grid-template-columns:240px minmax(0,1fr)}
.side{background:#fff;border-radius:24px;padding:14px;gap:12px;box-shadow:0 2px 14px #3d2b9614}
.side nav{display:flex;flex-direction:column;gap:4px}
.side .who{display:grid;gap:2px;padding:6px 12px 14px;border-bottom:1px solid var(--line)}
.side .who strong{color:var(--ck-ink);overflow-wrap:anywhere}
.side .signout{border-top:1px solid var(--line);border-radius:0 0 14px 14px;padding-top:14px}
body.ck .side button[aria-current=true]{background:var(--ck-lav)}
.adm-head{margin:0 0 20px}
.adm-head h1{font-size:clamp(1.5rem,3vw,1.9rem);margin:0}
.adm-head p{margin:.4em 0 0;color:var(--muted);max-width:70ch}
.adm-h2{font-size:1.15rem;margin:28px 0 12px}
.panel.empty h2,.tryit .adm-h2{margin-top:0}
.chartcard header{flex-wrap:wrap}
.chartcard .note{margin:10px 0 0}
.more{margin:12px 0 0}
.filters .grow{flex:1 1 240px}
.filters .grow input{width:100%}
.filters .check{display:flex;align-items:center;gap:8px;font-size:1rem;margin:0;min-height:44px}
.filters .check input{width:20px;height:20px;margin:0}
.report-acts{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.tryit{margin-top:24px}
.tryit textarea{width:100%;font:inherit;padding:12px;border:2px solid var(--line2);border-radius:12px}
#pout{margin-top:14px}#pout .bubble{max-width:100%}
.resp-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin:12px 0}
.photos:empty{display:none}
.photos figure{margin:0;background:var(--ck-lav);border-radius:14px;padding:8px}
.photos img{display:block;width:100%;height:auto;border-radius:10px}
.photos figcaption{font-size:.9rem;padding:6px 4px 2px;overflow-wrap:anywhere}
table.data{overflow-wrap:anywhere}
@media (max-width:960px){
  .adm{grid-template-columns:minmax(0,1fr);gap:18px;padding:20px 16px 48px}
  .side{position:static;flex-direction:column;flex-wrap:nowrap}
  .side nav{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .side .who{grid-template-columns:auto 1fr;align-items:baseline;gap:8px;padding:4px 12px 12px}
}
@media (max-width:560px){
  .side nav{grid-template-columns:1fr 1fr}
  .side button{padding:10px 12px;font-size:.95rem}
  .chartcard,.themecard{padding:16px}
  .hbar{grid-template-columns:minmax(0,1fr) auto}
  .hbar .lbl{grid-column:1/-1}
  .conn{grid-template-columns:auto minmax(0,1fr)}
  .conn .pill{grid-column:2;justify-self:start}
  .report{padding:20px 16px}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tile{padding:14px}
  .tile b{font-size:1.6rem}
}

/* ---- fit on a laptop screen (cv-app = every Voice page; the header is slimmed in hub.css) ---- */
/* home: the topics heading and count on one line, and smaller cards with the icon beside the title */
.cv-app #consultations{padding:36px 0 48px}
.cv-app #consultations .ck-sechead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 24px;text-align:left;max-width:none;margin:0 0 20px}
.cv-app #consultations .ck-sechead h2{font-size:clamp(1.6rem,2.6vw,2rem);margin:0}
.cv-app #consultations .ck-sechead p{font-size:1.05rem}
.cv-app .ck-cards3{gap:20px}
.ck-card.ck-topiccard{display:grid;grid-template-columns:56px minmax(0,1fr);grid-template-rows:auto auto 1fr auto;grid-template-areas:"ic cat" "ic h" "p p" "b b";column-gap:16px;align-items:center;text-align:left;padding:22px 22px 20px;border-radius:24px;flex-basis:calc((100% - 40px)/3)}
.ck-topiccard .ck-circle{grid-area:ic;width:56px;height:56px;margin:0}
.ck-topiccard .ck-circle svg{width:26px;height:26px}
.ck-topiccard .cat{grid-area:cat;align-self:end;font-size:.78rem!important;margin:0 0 2px!important}
.ck-topiccard h3{grid-area:h;align-self:start;font-size:1.2rem;line-height:1.25;margin:0}
.ck-topiccard>p:not(.cat){grid-area:p;align-self:start;font-size:1rem;line-height:1.55;margin:12px 0 16px}
.ck-topiccard .ck-cardbtns{grid-area:b}
.ck-topiccard .ck-cardbtns .ck-btn{min-height:48px;padding:10px;font-size:.98rem}
@media (max-width:980px){.ck-card.ck-topiccard{flex-basis:calc((100% - 20px)/2)}}
@media (max-width:700px){.ck-card.ck-topiccard{flex-basis:100%}}
/* home: "How it works" a little tighter */
.cv-app .ck-mint{padding:48px 0}
.cv-app .ck-mintbox{padding:36px 32px}
.cv-app .ck-topic{padding:24px 22px}

/* chat: the answer box is pinned to the bottom of the screen; the question count sits under the topic title */
.chat{overflow:clip}
.chat-h .title h1{font-size:1.15rem;margin:0;line-height:1.3}
.chat-h .qc{display:block;font-size:.88rem;font-weight:500;color:var(--muted)}
.chat-h .qc:empty{display:none}
.composer{position:sticky;bottom:0;z-index:5;box-shadow:0 -10px 24px -18px #3d2b9640;padding:12px 18px 8px}
.cbox textarea{min-height:64px;max-height:35vh;overflow-y:auto;padding:12px 16px}
.crow{padding:6px 10px}
.status{min-height:1.3em;margin-top:4px}
.status:empty{min-height:0;margin:0}
.cfoot{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:2px 14px;margin-top:4px}
.cfoot .help{margin:0;text-align:center;font-size:.85rem}
.cfoot details.mini{margin:0;font-size:.85rem}
.cfoot details.mini[open]{flex-basis:100%;text-align:center}
.cfoot details.mini p{margin:4px 0 0}
body.ck .chat{min-height:0}
/* keep the floating buttons clear of the pinned answer box */
body:has(#composer) .ck-top{display:none}
@media (max-width:1240px){body:has(#composer) .ck-a11yfab{bottom:calc(var(--comp-h,0px) + 12px)}}
@media (max-width:480px){.composer{padding:10px 10px 6px}}
/* three topic cards across on laptops (voice.css sets #topics{gap:24px}, which is too wide for three) */
#topics.ck-cards3{gap:20px}
/* a slightly smaller logo keeps the one-row header short on laptops */
@media (min-width:1280px){.cv-app .ck-logo img{height:46px}}
body.ck .chatwrap{margin-top:20px}
/* the shared header gives every .ck-wrap min-height:96px; in the one-row layout the tab row only needs its own height */
@media (min-width:1280px){.cv-app .ck-head .ck-wrap{min-height:0}.cv-app .ck-head{min-height:64px}}
@media (pointer:coarse){.kbd-only{display:none}}

/* ---- home: slim intro band, then the topics ---- */
.cv-app .cv-intro .ck-wrap{display:block;padding-top:26px;padding-bottom:22px}
.cv-app .cv-intro .eyebrow{margin:0 0 6px}
.cv-app .cv-intro h1{font-size:clamp(1.8rem,3vw,2.4rem);margin:0 0 8px}
.cv-app .cv-intro .lead{font-size:1.1rem;line-height:1.55;margin:0 0 16px;max-width:none}
.cv-intro-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 28px;border-top:1px solid #ffffff33;padding-top:14px}
.cv-app .cv-intro .ck-trust{margin:0!important}
.cv-app .cv-intro .cv-other{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;margin:0;font-size:1rem;color:#dcd6f7}
.cv-other a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:4px;padding:6px 0}
.cv-other a:hover{text-decoration-thickness:2px}
.cv-app #consultations{padding-top:24px}
/* laptops: one row per topic (icon, title, description, buttons), so every topic and button fits on one screen */
.cv-app .cv-intro .ck-trust{max-width:none}
@media (min-width:1100px){
  .cv-app .cv-intro .ck-wrap{padding-top:22px;padding-bottom:18px}
  .cv-app .cv-intro h1{font-size:clamp(1.8rem,2.6vw,2.2rem)}
  .cv-app .cv-intro .lead{margin-bottom:12px}
  .cv-intro-row{padding-top:10px}
  .cv-app #consultations{padding:14px 0 40px}
  .cv-app #consultations .ck-sechead{margin-bottom:10px}
  .cv-app #consultations .ck-sechead h2{font-size:1.6rem}
  #topics.ck-cards3{flex-direction:column;flex-wrap:nowrap;gap:8px}
  /* the category label repeats the title, and the eyebrow repeats the active "CLEAR Voice" tab, so both go on wide screens */
  .cv-app .cv-intro .eyebrow,.ck-topiccard .cat{display:none}
  .ck-card.ck-topiccard{flex:none;width:100%;grid-template-columns:44px 230px minmax(0,1fr) auto;grid-template-rows:auto;grid-template-areas:"ic h p b";column-gap:20px;align-items:center;padding:8px 18px;border-radius:18px;min-height:68px}
  .ck-topiccard .ck-circle{width:44px;height:44px}
  .ck-topiccard .ck-circle svg{width:22px;height:22px}
  .ck-topiccard .cat{align-self:end;margin:0!important;font-size:.7rem!important}
  .ck-topiccard h3{align-self:center;font-size:1.05rem;line-height:1.3;margin:0}
  .ck-topiccard>p:not(.cat){font-size:.95rem;line-height:1.45;margin:0;align-self:center}
  .ck-topiccard .ck-cardbtns{grid-template-columns:auto auto;gap:8px;width:auto}
  .ck-topiccard .ck-cardbtns .ck-btn{min-height:44px;padding:8px 16px;font-size:.95rem}
}
/* the category label is plain text on topic cards (voice.css styles .cat as a padded badge) */
.ck-topiccard .cat{padding:0;background:none;border:0;border-radius:0}
@media (max-width:560px){.cv-app .cv-intro .cv-other{gap:2px 18px}.cv-app .cv-intro .cv-other .lbl{flex-basis:100%}}

/* ---- home: topic list polish (laptops). One panel with dividers, tinted icon tiles, quieter text, lighter buttons ---- */
.t-purple{--tc:#3d2b96;--tbg:#ecebfa}.t-amber{--tc:#b4530e;--tbg:#fdf0e2}.t-blue{--tc:#256b82;--tbg:#e2f1f6}.t-rose{--tc:#b0285f;--tbg:#fbe8f0}.t-green{--tc:#1f7a5b;--tbg:#e1f4eb}
.cv-app #consultations .ck-sechead{align-items:flex-end}
.cv-app #consultations .ck-sechead p{color:var(--muted)}
@media (min-width:1100px){
  #topics.ck-cards3{gap:0;background:#fff;border-radius:22px;box-shadow:0 1px 2px #3d2b960d,0 8px 28px #3d2b9612;overflow:hidden}
  .ck-card.ck-topiccard{border-radius:0;box-shadow:none;background:none;border-top:1px solid #ecebf4;padding:12px 22px;grid-template-columns:44px 220px minmax(0,1fr) auto;column-gap:22px;transition:background .15s}
  .ck-card.ck-topiccard:first-child{border-top:0}
  .ck-card.ck-topiccard:hover,.ck-card.ck-topiccard:focus-within{background:#f8f7fd}
  .ck-topiccard .ck-circle{border-radius:12px;background:var(--tbg)!important}
  .ck-topiccard .ck-circle svg{stroke:var(--tc)}
  .ck-topiccard h3{font-size:1.04rem;font-weight:600;letter-spacing:-.005em;color:var(--ck-ink)}
  .ck-topiccard>p:not(.cat){font-size:.92rem;line-height:1.5;color:#5d5872}
  .ck-topiccard .ck-cardbtns{grid-template-columns:1fr 1fr;gap:8px;width:262px}
  .ck-topiccard .ck-cardbtns .ck-btn{min-height:44px;padding:8px 12px;font-size:.92rem;font-weight:500;border-radius:10px;border-width:1.5px}
  .ck-topiccard .ck-cardbtns .ck-btn.outline{border-color:#cfc9ec;background:#fff}
  .ck-topiccard .ck-cardbtns .ck-btn.outline:hover{border-color:var(--ck-purple);background:var(--ck-lav)}
}

/* ---- home: time estimate under each topic title; shorter Type / Speak buttons; smaller heading ---- */
.ck-topiccard .tt{grid-area:h;align-self:start;min-width:0}
.ck-topiccard .tt h3{margin:0}
.ck-topiccard .meta{margin:3px 0 0;font-size:.85rem;font-weight:500;color:var(--muted)}
.cv-app #consultations{padding-bottom:28px}
@media (min-width:1100px){
  .cv-app .cv-intro h1{font-size:clamp(1.6rem,2.3vw,1.95rem)}
  .ck-topiccard .tt{align-self:center}
  .ck-topiccard .ck-cardbtns{width:212px}
}

/* ---- home: How it works, a slim strip on the same background ---- */
.cv-how{background:var(--ck-lav);padding:4px 0 56px}
.cv-how h2{font-size:1.35rem;margin:0 0 12px}
.cv-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cv-steps li{display:flex;gap:14px;align-items:flex-start;background:#fff;border-radius:18px;padding:16px 18px;box-shadow:0 1px 2px #3d2b960d,0 6px 20px #3d2b960d}
.cv-steps .step-ic{flex:none;width:44px;height:44px;border-radius:12px;background:var(--tbg);display:grid;place-items:center}
.cv-steps svg{width:22px;height:22px;fill:none;stroke:var(--tc);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cv-steps strong{display:block;color:var(--ck-ink);font-size:1rem}
.cv-steps p{margin:2px 0 0;font-size:.92rem;line-height:1.5;color:#5d5872}
@media (max-width:860px){.cv-steps{grid-template-columns:1fr}}
/* a bigger main heading on laptops: two balanced lines on the left, the intro line beside it on the right,
   so the band stays about the same height and all 5 topics still fit a 1280x720 screen */
@media (min-width:1100px){
  .cv-app .cv-intro .ck-wrap{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:0 48px;align-items:center;padding-top:18px;padding-bottom:18px}
  .cv-app .cv-intro h1{font-size:clamp(2.2rem,3.05vw,2.6rem);letter-spacing:-.015em;line-height:1.08;margin:0;text-wrap:balance}
  /* the description sits directly under the heading; the reassurances and other ways to take part go in the right-hand column */
  .cv-app .cv-intro-main{grid-column:1}
  .cv-app .cv-intro .lead{font-size:1.1rem;line-height:1.5;margin:10px 0 0;color:#e9e5fb}
  .cv-app .cv-intro .cv-intro-row{grid-column:2;align-self:center;flex-direction:column;align-items:flex-start;gap:12px;margin:0;border-top:0;border-left:1px solid #ffffff33;padding:2px 0 2px 32px}
  .cv-app .cv-intro .ck-trust{flex-direction:column;gap:4px}
  .cv-app .cv-intro .cv-other{gap:2px 18px}
  .cv-app .cv-intro .cv-other .lbl{flex-basis:100%}
}
/* the open "Share your story" topic: CLEAR yellow */
.t-gold .ck-circle{background:#e9a92a}.t-gold .cat{color:#8a5a00}
.t-gold{--tc:#8a5a00;--tbg:#fdf3dc}
/* six topics: slightly tighter rows so they all fit a laptop screen */
@media (min-width:1100px){
  .ck-card.ck-topiccard{padding-top:6px;padding-bottom:6px;min-height:60px}
  .ck-topiccard>p:not(.cat){line-height:1.4}
}
@media (min-width:1100px){
  .cv-app .cv-intro .ck-wrap{padding-top:14px;padding-bottom:14px}
  .cv-app #consultations{padding-top:8px}
}
/* How it works is information, not something to press: no card, no shadow, just icon and text under a thin rule */
.cv-steps{gap:32px}
.cv-steps li{background:none;box-shadow:none;border-radius:0;padding:16px 0 0;border-top:1px solid #d6d1ee}
.cv-steps .step-ic{width:40px;height:40px;border-radius:50%}
.er-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

/* ---- paper copies: a list of topics, then one printable sheet per topic ---- */
.paper .lead{font-size:1.1rem;color:var(--ck-body)}
.paper-list{list-style:none;margin:20px 0 24px;padding:0;display:grid;gap:10px}
.paper-list li{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:16px;align-items:center;border:1px solid #e6e3f3;border-radius:16px;padding:14px 18px}
.pl-ic{width:44px;height:44px;border-radius:12px;background:var(--tbg);display:grid;place-items:center}
.pl-ic svg{width:22px;height:22px;fill:none;stroke:var(--tc);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pl-tx h2{font-size:1.1rem;margin:0}
.pl-tx p{margin:2px 0 0;font-size:.95rem;color:#5d5872}
@media (max-width:640px){.paper-list li{grid-template-columns:44px minmax(0,1fr)}.paper-list .btn{grid-column:1/-1;justify-self:start}}
.sheet-acts{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px}
.sheet{color:#111}
.sheet-h{display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:3px solid var(--ck-purple);padding-bottom:12px;margin-bottom:18px}
.sheet-h img{height:40px;width:auto}
.sheet-h p{margin:0;font-weight:600;color:var(--ck-purple)}
.sheet h1{font-size:1.9rem;margin:0 0 8px}
.sheet-intro{font-size:1.05rem;margin:0 0 6px}
.sheet-how{font-size:.95rem;color:#444;margin:0 0 18px}
.sheet-qs{margin:0;padding-left:1.4em}
.sheet-qs li{margin:0 0 20px;break-inside:avoid}
.sheet-qs li p{font-weight:600;margin:0 0 4px}
.wl{display:block;height:32px;border-bottom:1px solid #777}
.sheet-about{border-top:2px solid #ddd;margin-top:24px;padding-top:14px;break-inside:avoid}
.sheet-about h2{font-size:1.25rem;margin:0 0 4px}.sheet-about h2 span{font-weight:400;font-size:1rem;color:#555}
.sheet-about>p{margin:0 0 6px;font-size:.95rem;color:#444}
.sheet-about h3{font-size:1rem;margin:14px 0 6px}
.opts{display:flex;flex-wrap:wrap;gap:8px 22px}
.opts.cols{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px 16px}
.opt{display:inline-flex;align-items:center;gap:8px;font-size:.95rem}
.box{width:16px;height:16px;border:1.5px solid #333;border-radius:3px;flex:none}
.sheet-f{border-top:2px solid #ddd;margin-top:24px;padding-top:12px;font-size:.95rem}
.sheet-f p{margin:0 0 6px}
@media print{
  @page{margin:14mm}
  .ck-help,.ck-head,.ck-nav,.ck-foot,.ck-top,.ck-a11yfab,.hubbar,.no-print{display:none!important}
  body.ck main,body.ck .paper{background:#fff!important;padding:0!important;margin:0!important;border-radius:0!important;max-width:none}
  .sheet{font-size:11pt}.sheet h1{font-size:18pt}
  .sheet .todo{background:none}
}

/* ---- admin: delete responses ---- */
.panel.mg{margin-bottom:18px;padding:22px 24px}
.panel.mg .adm-h2{margin-top:0}
.mg-find{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.mg-find .fld{flex:1 1 280px;margin:0}
.mg-found{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;background:#fdf2f5;border:1px solid #f1c6d5;border-radius:14px;padding:12px 16px;margin-top:14px}
.mg-found p{margin:0}
#mgOne .err,#mgOne .notice,#mgClean .notice,#mgClean .help{margin:12px 0 0}
.mg-filters{box-shadow:none;border:1px solid var(--line);margin-bottom:12px}
.mg-bar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;margin:0 0 8px}
.mg-bar .sp{flex:1}
.mg-bar .check{display:flex;align-items:center;gap:8px;font-weight:600;min-height:44px}
.mg-bar .check input,.mg-table input{width:20px;height:20px}
.mg-tablewrap{overflow-x:auto}
.mg-table td,.mg-table th{white-space:nowrap}
.mg-table code{font-size:.85rem;color:var(--muted)}
.mg-find .fld:has(#mgOld){flex:0 1 260px}
@media (max-width:560px){.side nav{grid-template-columns:repeat(2,minmax(0,1fr))}.side nav button{min-width:0;white-space:normal;line-height:1.25}}
/* chat: the helpline offer, when the chat can't follow what someone means */
.bubble.helpline{background:#eef6fb;border-color:#b9d9ea}
.callbtn{display:flex;width:fit-content;align-items:center;gap:8px;margin-top:12px;background:var(--ck-purple);color:#fff;font-weight:600;text-decoration:none;border-radius:10px;padding:10px 16px;min-height:44px}
.callbtn svg.i{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
.callbtn:hover{background:var(--ck-purple-d)}

/* ---- admin: flagged personal details (nothing is changed; staff see what might identify someone) ---- */
mark.flag{background:#fff1c2;color:inherit;border-bottom:2px solid #d99a00;border-radius:3px;padding:0 2px}
mark.flag .flag-l{font-size:.78em;font-weight:600;color:#7a5600}
mark.flag.gone{background:#ede9fb;border-bottom-color:var(--ck-purple);color:var(--ck-purple);font-weight:600}
mark.flag[role=button]{cursor:pointer}
mark.flag[role=button]:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.pill.flagpill{background:#fff1c2;color:#7a5600}
/* overview */
.tile small{display:block;color:var(--muted);font-size:.8rem;margin-top:2px}
.panel.live{padding:18px 22px;margin-bottom:8px}
.panel.live .adm-h2{margin-top:0}
.livedot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#1cbf8a;margin-right:10px;box-shadow:0 0 0 3px #1cbf8a33}
/* charts */
.chartcard header{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap}
.chartcard header .help{margin:2px 0 0}
.cc-acts{display:flex;gap:8px;flex-wrap:wrap}
.cc-acts .btn svg.i{width:16px;height:16px}
.vc{position:relative;width:100%}
.vc-svg{display:block;width:100%;height:auto;overflow:visible}
.vc-mark.on path,.vc-mark.on rect[rx]{filter:brightness(1.18)}
.vc-mark.vc-click{cursor:pointer}
.vc-tip{position:absolute;z-index:5;pointer-events:none;background:#1d1838;color:#fff;font-size:.85rem;font-weight:600;padding:6px 10px;border-radius:8px;white-space:nowrap;box-shadow:0 6px 18px #1d183840}
/* reports: review before sharing */
.review-box{background:#fffaf0;border:2px solid #f0d28a;border-radius:20px;padding:18px 22px;margin:0 0 18px}
.review-box h2{font-size:1.2rem;margin:0 0 6px}
.review-box p{margin:0 0 10px}
.rv-check{display:flex;gap:10px;align-items:flex-start;padding:6px 0;font-weight:500;cursor:pointer}
.rv-check input{width:20px;height:20px;margin-top:2px;flex:none}
.rv-state{font-weight:600;color:#7a5600;margin:8px 0 0!important}
.rstatus{font-weight:700;border-radius:10px;padding:10px 14px;margin:0 0 18px}
.rstatus.draft{background:#fdecef;border:2px solid #c0264f;color:#9b1c3d}
.rstatus.ok{background:#e6f6f0;border:2px solid #0f8f6c;color:#0b6b51}
.report blockquote.rq{margin:8px 0;padding:6px 0 6px 14px;border-left:4px solid #d6d1ee}
.report h3{margin-top:1em}
@media print{mark.flag{background:none!important;border:0!important;color:inherit!important;padding:0}.flag-l{display:none}}

/* ---- home (v1.9): calmer list of consultations, Share your story on its own, recently closed ---- */
.cv-home{padding:28px 0 40px}
.cv-sechead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:4px 24px;margin:0 0 14px}
.cv-sechead h2{font-size:clamp(1.5rem,2.4vw,1.85rem);margin:0;color:var(--ck-ink)}
.cv-sechead p{margin:0;color:var(--muted);font-size:1rem}
.cv-list{list-style:none;margin:0;padding:0;background:#fff;border-radius:22px;box-shadow:0 1px 2px #3d2b960d,0 8px 28px #3d2b9612;overflow:hidden}
.cv-list>li+li{border-top:1px solid #ecebf4}
.cv-loading,.cv-none{padding:22px 24px;color:var(--muted)}
.cv-row{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:20px;align-items:center;padding:18px 24px;color:inherit;text-decoration:none;transition:background .15s}
.cv-row:hover{background:#f8f7fd}
.cv-row:focus-visible{outline:3px solid var(--focus);outline-offset:-3px}
.cv-ic{width:48px;height:48px;border-radius:14px;background:var(--tbg,#ecebfa);display:grid;place-items:center;flex:none}
.cv-ic svg.i{width:24px;height:24px;fill:none;stroke:var(--tc,#3d2b96);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cv-tx{display:grid;gap:3px;min-width:0}
.cv-t{font-weight:600;font-size:1.1rem;color:var(--ck-ink);line-height:1.3}
.cv-d{color:#5d5872;font-size:.97rem;line-height:1.5;max-width:62ch}
.cv-m{color:var(--muted);font-size:.86rem}
.cv-m:empty{display:none}
.cv-go{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--ck-purple);border:1.5px solid #cfc9ec;border-radius:10px;padding:10px 16px;white-space:nowrap;transition:background .15s,border-color .15s}
.cv-go svg.i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cv-row:hover .cv-go{background:var(--ck-purple);border-color:var(--ck-purple);color:#fff}
/* Share your story: separate from the consultations */
.cv-story{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:20px;align-items:center;margin-top:28px;background:#fffaf0;border:1.5px solid #f3dca0;border-radius:22px;padding:22px 24px;--tc:#8a5a00;--tbg:#fdecc2}
.cv-story h2{font-size:1.25rem;margin:0 0 4px;color:var(--ck-ink)}
.cv-story p{margin:0;color:#5d5872;max-width:62ch}
.cv-story .ck-btn{min-height:48px;padding:12px 22px;font-size:1rem}
/* recently closed: quiet */
.cv-closed{margin-top:28px}
.cv-closed h2{font-size:1.1rem;margin:0 0 4px;color:var(--ck-ink)}
.cv-closed>.help{margin:0 0 10px}
.cv-closed ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cv-closed li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px;background:#ffffff99;border-radius:12px;padding:10px 16px}
@media (max-width:700px){
  .cv-row{grid-template-columns:40px minmax(0,1fr);gap:14px;padding:16px}
  .cv-ic{width:40px;height:40px;border-radius:12px}
  .cv-go{grid-column:2;justify-self:start;padding:8px 14px}
  .cv-story{grid-template-columns:40px minmax(0,1fr);gap:14px;padding:18px 16px}
  .cv-story .ck-btn{grid-column:1/-1;justify-self:start}
}
/* chat: first screen, type or speak; and closed / not found */
.cv-choose{padding:28px 8px 12px;max-width:640px}
.cv-choose h2{font-size:1.4rem;margin:0 0 6px}
.cv-choose-opts{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.cv-opt{display:flex;gap:14px;align-items:flex-start;text-align:left;font:inherit;color:inherit;background:#fff;border:2px solid #d6d1ee;border-radius:18px;padding:18px;cursor:pointer;transition:border-color .15s,background .15s}
.cv-opt:hover{border-color:var(--ck-purple);background:#f8f7fd}
.cv-opt:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.cv-opt strong{display:block;font-size:1.08rem;color:var(--ck-ink);margin-bottom:4px}
.cv-opt span span{color:#5d5872;font-size:.95rem}
.cv-opt-ic{width:44px;height:44px;border-radius:12px;background:var(--ck-lav);display:grid;place-items:center;flex:none}
.cv-opt-ic svg.i{width:22px;height:22px;fill:none;stroke:var(--ck-purple);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cv-notice{padding:28px 8px}.cv-notice h2{font-size:1.35rem;margin:0 0 8px}
@media (max-width:640px){.cv-choose-opts{grid-template-columns:1fr}}

/* ---- admin: consultations list and editor ---- */
.cn-bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin:8px 0 12px}
.cn-bar .adm-h2{margin:0}
.cn-list{list-style:none;margin:0 0 24px;padding:0;background:#fff;border-radius:20px;box-shadow:0 1px 2px #3d2b960d,0 6px 20px #3d2b960d;overflow:hidden}
.cn-list>li+li{border-top:1px solid #ecebf4}
.cn-item{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 20px}
.cn-tx{display:grid;gap:4px;min-width:0}
.cn-top{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.cn-top strong{font-size:1.05rem;color:var(--ck-ink)}
.cn-acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
@media (max-width:760px){.cn-item{grid-template-columns:40px minmax(0,1fr)}.cn-item .cv-ic{width:40px;height:40px}.cn-acts{grid-column:1/-1;justify-content:flex-start}}
.ed-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:1100px){.ed-grid{grid-template-columns:minmax(0,1fr)}}
.panel.ed{padding:22px 24px}
.ed .fld{margin:0 0 18px}
.ed .fld>.help{display:block;margin:-2px 0 4px}
.ed textarea,.ed input[type=text],.ed input[type=date]{width:100%;font:inherit;padding:10px 12px;border:2px solid var(--line2);border-radius:12px;background:#fff;color:var(--ink)}
.ed fieldset{border:0;padding:0;margin:0 0 18px;min-width:0}
.ed legend{font-weight:600;padding:0;margin-bottom:6px}
.ed-icons,.ed-tones{display:flex;flex-wrap:wrap;gap:8px}
.ed-pick label{position:relative;cursor:pointer}
.ed-pick input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.ed-icons label>span{display:grid;place-items:center;width:46px;height:46px;border:2px solid #d6d1ee;border-radius:12px;background:#fff}
.ed-icons svg.i{width:22px;height:22px;fill:none;stroke:var(--ck-purple);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ed-tones label>span{display:inline-flex;align-items:center;gap:8px;border:2px solid #d6d1ee;border-radius:999px;padding:6px 12px;background:#fff;font-size:.92rem}
.ed-tones i{width:16px;height:16px;border-radius:50%;background:var(--tc)}
.ed-pick input:checked+span{border-color:var(--ck-purple);background:var(--ck-lav);box-shadow:0 0 0 2px var(--ck-purple) inset}
.ed-pick input:focus-visible+span{outline:3px solid var(--focus);outline-offset:2px}
.ed-qs{margin:8px 0 10px;padding-left:1.4em;display:grid;gap:10px}
.ed-qs li{display:grid;gap:6px}
.ed-qbtns{display:flex;gap:6px;flex-wrap:wrap}
.ed-qbtns .btn{min-height:36px;padding:4px 12px}
.ed-dates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:6px}
.ed-dates label{font-weight:600;font-size:.92rem;display:block;margin-bottom:4px}
.ed-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.ed-prev{position:sticky;top:20px}
.ed-prev .adm-h2{margin-top:0}
.ed-prev .cv-list{box-shadow:0 1px 2px #3d2b960d,0 6px 20px #3d2b960d}
@media (max-width:700px){.cv-row{align-items:start}}
.ed-prev .cv-row{grid-template-columns:48px minmax(0,1fr)}
.ed-prev .cv-go{grid-column:2;justify-self:start}
.cv-choose h2:focus{outline:none}

/* ---------- the one-page dashboard (Overview) ---------- */
.dtiles{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:14px}
.dtiles .tile{padding:12px 16px;border-top:4px solid var(--purple)}
.dtiles .tile:nth-child(2){border-top-color:#d12e74}.dtiles .tile:nth-child(3){border-top-color:#0f97b5}.dtiles .tile:nth-child(4){border-top-color:#f9b93e}.dtiles .tile:nth-child(5){border-top-color:#43c59e}
.dtiles .tile b{font-size:1.7rem}
.tile .delta .up{color:#1f7a4d;font-weight:700}.tile .delta .down{color:#b4233c;font-weight:700}
.dash{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:16px}
.dash .dp-days{grid-column:span 2}
@media (max-width:1240px){.dash{grid-template-columns:repeat(2,minmax(0,1fr))}.dash .dp-days{grid-column:auto}}
@media (max-width:760px){.dash{grid-template-columns:minmax(0,1fr)}}
.dpanel{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:14px 16px 10px;display:flex;flex-direction:column;min-width:0}
.dpanel header{margin-bottom:8px}
.dpanel h2{font-size:1.02rem;margin:0;color:var(--ck-ink,#2a1d6a)}
.dpanel header p{margin:2px 0 0;font-size:.82rem;color:var(--muted)}
.dp-body{flex:1;min-width:0}
.dp-note{font-size:.8rem;margin:8px 0 0}
.dp-more{margin-top:8px;align-self:flex-start;background:none;border:0;padding:6px 0;font:600 .88rem var(--font);color:var(--purple);cursor:pointer}
.dp-more:hover{text-decoration:underline}
.dbars{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.dbars li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;align-items:center;font-size:.86rem;border-radius:8px;padding:2px 4px;line-height:1.3}
.dbars li.click{cursor:pointer}
.dbars li.click:hover,.dbars li.click:focus-visible{background:var(--lav)}
.dbars .l{min-width:0;overflow-wrap:anywhere}
.dbars .b{grid-column:1/-1}
.dbars .b{height:8px;background:#efedf7;border-radius:5px;overflow:hidden}
.dbars .b i{display:block;height:100%;background:var(--purple);border-radius:0 5px 5px 0}
.dbars .v{font-weight:600;font-variant-numeric:tabular-nums;font-size:.84rem;text-align:right;white-space:nowrap}
.dbars .v .help{font-weight:400}
.dconsult{list-style:none;margin:0;padding:0}
.dconsult li{display:grid;grid-template-columns:minmax(0,1fr) auto 2.4em;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line);font-size:.88rem}
.dconsult li:last-child{border-bottom:0}
.dconsult .t{font-weight:600;min-width:0}.dconsult .t .help{display:block;font-weight:400;font-size:.78rem}
.dconsult b{text-align:right;font-variant-numeric:tabular-nums}
.tmap{display:block;width:100%;height:auto;max-height:240px}
.tmap .tm.on{cursor:pointer}
.tmap .tm.on:hover rect,.tmap .tm.on:focus rect{filter:brightness(1.08)}
.tmap .tm:focus{outline:none}.tmap .tm:focus-visible rect{stroke:#d12e74;stroke-width:3}
.dstack{display:flex;gap:2px;height:22px;border-radius:6px;overflow:hidden;margin:4px 0 10px}
.dstack i{display:block;height:100%}
.dlegend{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;font-size:.86rem}
@media (max-width:480px){.dlegend{grid-template-columns:minmax(0,1fr)}}
.dlegend li{display:flex;align-items:center;gap:6px}
.dlegend .sw{width:12px;height:12px;border-radius:3px;flex:none}
.dlegend b{margin-left:auto}
.dlegend .help{font-size:.78rem;min-width:2em;text-align:right}
table.data.compact{font-size:.84rem}
table.data.compact th,table.data.compact td{padding:5px 6px}
.dmore{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:6px 16px;margin-bottom:16px}
.dmore summary{cursor:pointer;font-weight:700;padding:8px 0}
.dmore .insights{margin:6px 0 14px}
/* ---------- users ---------- */
table.users th,table.users td{vertical-align:top}
table.users tr.off th,table.users tr.off td{color:var(--muted)}
table.users .acts{display:flex;flex-wrap:wrap;gap:6px}
@media (max-width:760px){
  table.users thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  table.users,table.users tbody{display:block}
  table.users tr{display:block;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:12px}
  table.users th,table.users td{display:block;border:0;padding:3px 0}
  table.users td[data-label]::before{content:attr(data-label) ": ";font-weight:600;color:var(--muted)}
  table.users .acts{padding-top:8px}
}
.userform fieldset{border:0;padding:0;margin:0 0 14px;min-width:0}
.userform legend{font-weight:600;margin-bottom:4px}
.userform .opt{display:flex;align-items:flex-start;gap:8px;font-weight:400;margin:4px 0}
.userform .opt input{flex:none;width:20px;height:20px;margin:2px 0 0}
.areapick{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:10px;margin-top:8px}
.areapick .ap{border:1px solid var(--line);border-radius:12px;padding:8px 12px}
.areapick .whole{border-bottom:1px solid var(--line);padding-bottom:6px}
.passbox{border-left:6px solid var(--purple);margin-bottom:20px}
.passbox .pass{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.passbox code{font-size:1.4rem;letter-spacing:.08em;background:var(--lav);padding:6px 12px;border-radius:10px}
.side .who #whoRole:empty{display:none}

/* ---------- admin: compact sidebar (can shrink to icons), slim filters, dashboard that fits the screen ---------- */
body.cv-admin .ck-help{display:none}
body.cv-admin .adm{grid-template-columns:200px minmax(0,1fr);gap:18px;padding:14px 20px 28px;max-width:none}
body.cv-admin.rail .adm{grid-template-columns:64px minmax(0,1fr)}
body.cv-admin .side{padding:10px 8px;gap:4px;border-radius:18px;top:12px}
.side .who{display:flex;align-items:center;gap:8px;padding:2px 2px 10px;border-bottom:1px solid var(--line)}
.side .who .av{flex:none;width:34px;height:34px;border-radius:50%;background:var(--purple);color:#fff;display:grid;place-items:center;font:700 .8rem var(--font);letter-spacing:.02em}
.side .who .wt{display:grid;min-width:0;flex:1;line-height:1.25}
.side .who strong{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side .who .wt .help{font-size:.74rem}
.side .railbtn{flex:none;width:28px;height:28px;min-height:0;padding:0;border-radius:8px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;cursor:pointer;color:var(--muted)}
.side .railbtn:hover{color:var(--purple);border-color:var(--line2)}
.side .railbtn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
body.cv-admin .side nav{gap:1px;padding-top:6px}
body.cv-admin .side nav button,body.cv-admin .side .signout{min-height:38px;padding:7px 10px;font-size:.9rem;border-radius:10px;gap:10px;white-space:nowrap}
body.cv-admin .side nav button svg,body.cv-admin .side .signout svg{flex:none}
body.cv-admin .side .signout{margin-top:6px;padding-top:9px;border-radius:0 0 10px 10px}
body.cv-admin.rail .side .wt,body.cv-admin.rail .side .lbl{display:none}
body.cv-admin.rail .side .who{flex-direction:column;gap:8px}
body.cv-admin.rail .side nav button,body.cv-admin.rail .side .signout{justify-content:center;padding:7px 0}
body.cv-admin.rail .side .railbtn svg{transform:rotate(180deg)}
@media (max-width:960px){
  body.cv-admin .adm,body.cv-admin.rail .adm{grid-template-columns:minmax(0,1fr)}
  body.cv-admin.rail .side .wt{display:grid}body.cv-admin.rail .side .lbl{display:inline}
  body.cv-admin.rail .side .who{flex-direction:row}body.cv-admin.rail .side nav button{justify-content:flex-start;padding:7px 10px}
  .side .railbtn{display:none}
}
body.cv-admin .filters{padding:8px 12px;gap:10px;margin-bottom:12px;border-radius:16px;align-items:flex-end}
body.cv-admin .filters label{font-size:.72rem;margin-bottom:2px;color:var(--muted)}
body.cv-admin .filters select{min-height:36px;padding-top:4px;padding-bottom:4px;font-size:.9rem}
body.cv-admin .filters .check{min-height:36px;font-size:.88rem}
.dhead{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;margin:0 0 10px}
.dhead>div{flex:1 1 280px;min-width:0}
.dhead h1{font-size:1.35rem}
.dhead p{margin:1px 0 0;font-size:.84rem}
@media (min-width:1100px) and (min-height:600px){
  body.dash-fit .filters{padding:6px 10px;margin-bottom:8px}
  body.dash-fit .filters label:not(.check){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  body.dash-fit .dhead{margin-bottom:8px}
  body.dash-fit .dhead h1{font-size:1.2rem}
  body.dash-fit .dhead p{font-size:.8rem}
  body.dash-fit .dtiles .tile{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px}
  body.dash-fit .dtiles .tile small.delta{flex-basis:100%;margin-top:0}
  body.dash-fit .dpanel header p,body.dash-fit .dp-areas .dp-note,body.dash-fit .dp-feel .dp-note{display:none}
  body.dash-fit .dbars .l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.dash-fit .dbars .b{height:6px}
  body.dash-fit .dtiles{gap:10px;margin-bottom:10px}
  body.dash-fit .dtiles .tile{padding:7px 12px;border-top-width:3px}
  body.dash-fit .dtiles .tile b{font-size:1.35rem}
  body.dash-fit .dtiles .tile span{font-size:.84rem}
  body.dash-fit .dtiles .tile small:not(.delta){display:none}
  body.dash-fit .dtiles .tile small.delta{font-size:.74rem}
  body.dash-fit .dash{grid-template-columns:repeat(var(--dcols,4),minmax(0,1fr));grid-template-rows:repeat(var(--drows,2),minmax(0,1fr));gap:10px;margin-bottom:10px}
  body.dash-fit .dash .dp-days{grid-column:auto}
  body.dash-fit .dpanel{overflow:hidden;padding:10px 12px 6px;border-radius:14px}
  body.dash-fit .dpanel header{margin-bottom:6px}
  body.dash-fit .dpanel h2{font-size:.95rem}
  body.dash-fit .dpanel header p{font-size:.76rem}
  body.dash-fit .dp-body{min-height:0;overflow:auto;scrollbar-width:thin}
  body.dash-fit .dbars{gap:2px}
  body.dash-fit .dbars li{font-size:.8rem;padding:1px 2px}
  body.dash-fit .dp-note{font-size:.74rem;margin-top:4px}
  body.dash-fit .dp-more{margin-top:2px;padding:3px 0;font-size:.82rem}
  body.dash-fit .dp-areas .dp-body,body.dash-fit .dp-days .dp-body{display:flex;flex-direction:column;overflow:hidden}
  body.dash-fit .tmap{flex:1;min-height:0;max-height:none;height:auto}
  body.dash-fit .dp-days .vc{flex:1;min-height:0}
  body.dash-fit .dp-days .vc-svg{height:100%}
  body.dash-fit .dconsult li{padding:4px 0;font-size:.8rem;grid-template-columns:minmax(0,1fr) auto 2em}
  body.dash-fit .dconsult .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.dash-fit .dconsult .t .help{display:none}
  body.dash-fit .dconsult .pill{font-size:.7rem;padding:1px 8px}
  body.dash-fit .dp-who .dbars li{grid-template-columns:5.2em minmax(0,1fr) auto;line-height:1.2}
  body.dash-fit .dp-who .dbars .b{grid-column:2;grid-row:1;height:8px}
  body.dash-fit .dp-who .dbars .v{grid-column:3;grid-row:1}
  body.dash-fit .dlegend{font-size:.8rem;gap:4px 10px}
}

/* chosen dates in the filter bar */
.fdates{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.fdates[hidden]{display:none}
.fdates input[type=date]{min-height:36px;font:inherit;font-size:.9rem;padding:4px 8px;border:2px solid var(--line2);border-radius:10px;background:#fff}
.fdates>div{display:flex;align-items:center;gap:6px}
body.cv-admin .filters .fdates label,body.dash-fit .filters .fdates label{position:static;width:auto;height:auto;overflow:visible;clip:auto;margin:0;font-size:.82rem;color:var(--muted)}
/* customise the dashboard */
.dcust{padding:12px 16px;margin-bottom:10px}
.dc-head{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-bottom:6px}
.dc-head .adm-h2{margin:0;font-size:1.05rem}
.dc-head .help{flex:1;font-size:.82rem}
.dc-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:8px 24px}
@media (max-width:760px){.dc-cols{grid-template-columns:minmax(0,1fr)}}
.dcust fieldset{border:0;padding:0;margin:0;min-width:0}
.dcust legend{font-weight:700;font-size:.88rem;margin-bottom:4px}
.dcust .opt{display:flex;align-items:center;gap:8px;font-size:.88rem;margin:3px 0}
.dcust .opt input{width:18px;height:18px;margin:0;flex:none}
.dc-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:2px 16px}
.dc-list li{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid var(--line);padding:2px 0}
.dc-list .mv{display:flex;gap:4px}
.dc-list .mv .btn{min-height:30px;padding:2px 9px}
/* ring (doughnut) charts on the dashboard */
.ddonut{display:flex;align-items:center;gap:14px;min-height:0}
.ddonut svg{flex:0 0 auto;width:min(40%,140px);height:auto;display:block}
.ddonut .dlegend{flex:1;grid-template-columns:minmax(0,1fr);gap:5px}
.ddonut .dlegend li{display:grid;grid-template-columns:12px minmax(0,1fr) auto auto;gap:6px;align-items:center}
.ddonut .dlegend .help{min-width:1.6em}
.ddonut .dlegend .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ddonut .dlegend b{margin:0;text-align:right}
.ddonut path:hover,.ddonut circle:hover{filter:brightness(1.1)}
.tile .delta .up{color:#13997c}.tile .delta .down{color:#d63c3c}.tile .delta .flat{color:var(--muted);font-weight:700}
@media (min-width:1100px) and (min-height:600px){body.dash-fit .dp-feel .dp-body,body.dash-fit .dp-who .dp-body{display:flex;flex-direction:column;justify-content:center}body.dash-fit .ddonut svg{width:min(38%,130px)}body.dash-fit .ddonut{gap:10px}body.dash-fit .ddonut .dlegend .help{display:none}body.dash-fit .ddonut .dlegend li{grid-template-columns:12px minmax(0,1fr) auto}}
@media (max-width:420px){.ddonut{flex-direction:column}.ddonut svg{width:60%}}
/* v1.50: the testing strip at the top of the Voice pages while only signed-in staff can see them (js/gate.js) */
.cv-testing{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;max-width:1152px;margin:10px auto 0;padding:8px 14px;box-sizing:border-box;border-radius:12px;background:#fff7ec;border:1.5px solid #f3c98f;color:#2b2540;font-size:.92rem;line-height:1.4}
.cv-testing .pill{flex:none;background:#c25e10;color:#fff;font-weight:700;font-size:.78rem;letter-spacing:.03em;text-transform:uppercase;padding:2px 10px;border-radius:99px}
.cv-testing .tx{flex:1 1 320px;min-width:0}
.cv-testing .who{flex:none;display:flex;align-items:center;gap:4px;color:var(--muted)}
.cv-testing .linkbtn{min-height:36px;padding:6px 8px;color:var(--purple);text-decoration:underline;font-size:.92rem}
@media (max-width:1180px){.cv-testing{margin:10px 16px 0;width:auto}}
/* v1.50: phones: the photo and microphone buttons on one line, then "Skip question / Next question" and "Submit answer"
   side by side, the same width, under them */
@media (max-width:600px){.crow .sp{flex-basis:100%;height:0}.crow #skipBtn,.crow #sendBtn{flex:1 1 0;justify-content:center;min-width:0;padding-left:10px;padding-right:10px;white-space:nowrap}}
@media (max-width:360px){.crow #skipBtn,.crow #sendBtn{font-size:.88rem}.crow #skipBtn .i,.crow #sendBtn .i{display:none}}
/* v1.52: the AI's tags in Admin (Responses, AI usage) */
.ai-sum{margin:0 0 12px;padding:10px 12px;border-radius:10px;background:#f4f1ff;color:#2b2540;line-height:1.5}
.ai-sum .tag-ai{display:inline-block;margin-right:6px;padding:1px 8px;border-radius:99px;background:var(--purple);color:#fff;font-size:.74rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;vertical-align:1px}
.ai-tagging p{margin:0 0 10px}
.feel-fix{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 12px}
.feel-fix label{font-weight:600}
.feel-fix select{min-height:36px;border:1.5px solid var(--line);border-radius:8px;padding:4px 8px;font:inherit;background:#fff}
.feel-fix .linkbtn{min-height:32px;padding:4px 6px;color:var(--purple);text-decoration:underline;font-size:inherit}