@font-face{font-family:Inter;src:url(/assets/inter.a8131201ca.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url(/assets/manrope.355a5bb623.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
/* Dybng portal – built from Design's UX sketch (dybng-design/portal-mvp/style.css, profile "Fjord").
   Tokens first; components keep the sketch's class names so Design can swap this file. */
:root{--g:#26855C;--gd:#1F6F4C;--tint:#E8F3ED;--text:#1A2230;--muted:#5B6573;--sand:#F4EFE6;--border:#DDD5C8;--line:#7A828E;--err:#B42318;--warn-bg:#FFF1C9;--warn-fg:#7A5300;--warn-line:#D9B550}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--text);background:#fff;font-size:16px;line-height:1.45;min-height:100vh;display:flex;flex-direction:column}
h1,h2,h3{font-family:Manrope,Inter,system-ui,sans-serif;letter-spacing:-.02em}
button{font-family:inherit;cursor:pointer}
a{color:var(--gd)}
:focus-visible{outline:3px solid var(--gd);outline-offset:2px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:12px 16px;z-index:10}.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.envbar{background:var(--warn-bg);color:#5C3F00;font-size:13px;text-align:center;padding:4px 12px;border-bottom:1px solid var(--warn-line)}
/* App bar */
.appbar{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 8px 0 12px;border-bottom:1px solid var(--border);background:#fff}
.appbar .home{display:flex;align-items:center;min-height:44px}
.iconbtn{min-width:44px;min-height:44px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:none;color:var(--text);font:600 15px Inter,system-ui,sans-serif;padding:0 10px;text-decoration:none}
.iconbtn.back{color:var(--gd)}
.menu{position:relative}.menu summary{list-style:none}.menu summary::-webkit-details-marker{display:none}
.menu-panel{position:absolute;right:0;top:calc(100% + 4px);background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 24px rgba(26,34,48,.12);padding:6px;min-width:220px;z-index:5;display:flex;flex-direction:column}
.menu-panel a,.menu-panel button{display:flex;align-items:center;min-height:44px;padding:0 12px;border-radius:8px;color:var(--text);text-decoration:none;font:600 15px Inter,system-ui,sans-serif;background:none;border:0;text-align:left;width:100%}
.menu-panel a:hover,.menu-panel button:hover{background:var(--tint)}
.menu-panel a[aria-current=page]{color:var(--gd);text-decoration:underline;text-underline-offset:3px}
.menu-panel .who{font-size:13px;color:var(--muted);padding:8px 12px;margin:0;border-bottom:1px solid var(--border)}
.dnav{display:none}
/* Content */
main{flex:1;display:flex;flex-direction:column}
.content{padding:24px 20px;display:flex;flex-direction:column;gap:18px;width:100%;max-width:560px;margin:0 auto}
.content.center{text-align:center}.content.center .link{align-self:center}
.spacer{flex:1}
.t{font-size:28px;line-height:1.15;font-weight:800}.t.sm{font-size:22px}
.lead{font-size:16px;color:var(--muted)}
.lbl{display:block;font-weight:600;font-size:15px;margin-bottom:6px;color:var(--text)}.opt{font-weight:400;color:var(--muted)}
.hint{font-size:14px;color:var(--muted);margin-top:6px}.hint.c{text-align:center}
.input{width:100%;min-height:48px;border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;font:16px Inter,system-ui,sans-serif;color:var(--text);background:#fff}
.input::placeholder{color:var(--muted)}.ta{min-height:96px;resize:vertical;line-height:1.45}
.input.err{border:2px solid var(--err)}
.errmsg{color:var(--err);font-size:14px;font-weight:600;display:flex;gap:6px;align-items:flex-start;margin-top:8px}
.errbox{display:flex;gap:10px;text-align:left;border:1.5px solid var(--err);background:#FDF0EE;color:var(--text);border-radius:10px;padding:12px 14px;font-size:14px}.errbox svg{color:var(--err);flex:none;margin-top:1px}
.errbox.soft{border-color:#E9CF7F;background:#FFF8E1}.errbox.soft svg{color:var(--warn-fg)}
.errbox ul{margin:4px 0 0 18px}
.okbox{display:flex;gap:10px;background:var(--tint);color:var(--gd);border-radius:10px;padding:12px 14px;font-size:14px;font-weight:600}
.btn{min-height:48px;border-radius:10px;font:700 16px Inter,system-ui,sans-serif;padding:12px 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1.5px solid transparent;text-decoration:none;cursor:pointer}
.btn-p{background:var(--g);color:#fff}.btn-p:hover{background:var(--gd);color:#fff}
.btn-s{background:#fff;color:var(--gd);border-color:var(--gd)}.btn-s:hover{background:var(--tint)}
.btn[disabled]{color:var(--muted);border-color:var(--border);background:#F7F5F1;cursor:not-allowed}
.btn-block{width:100%}.btn.sm{min-height:44px;padding:8px 14px;font-size:15px}.btn.dash{border-style:dashed}
.link{color:var(--gd);font-weight:600;text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center;background:none;border:0;font-size:inherit}
.info .link,.errbox .link{min-height:0;display:inline}
.info{display:flex;gap:10px;text-align:left;background:var(--sand);border-radius:10px;padding:12px 14px;font-size:14px}.info svg{flex:none;color:var(--gd);margin-top:1px}
.foot{display:flex;gap:20px;justify-content:center;border-top:1px solid var(--border);padding:4px 0;font-size:14px}
.foot a[aria-current=true]{text-decoration:none;color:var(--text)}
.bigicon{width:72px;height:72px;border-radius:50%;background:var(--tint);color:var(--gd);display:flex;align-items:center;justify-content:center;align-self:center}
.bigicon.warn{background:var(--warn-bg);color:var(--warn-fg)}
/* Status badges: always icon + text */
.badge{display:inline-flex;align-items:center;gap:6px;font:700 13px/1 Inter,system-ui,sans-serif;padding:6px 10px;border-radius:999px;white-space:nowrap;border:1px solid}
.b-received{background:#EEF2F7;color:#1A2230;border-color:#AEB8C6}
.b-in_progress{background:var(--tint);color:var(--gd);border-color:#8CC3A5}
.b-waiting_on_customer{background:var(--warn-bg);color:var(--warn-fg);border-color:var(--warn-line)}
.b-resolved{background:var(--gd);color:#fff;border-color:var(--gd)}
.b-closed{background:#F1EEE8;color:#4F5967;border-color:#C9C0B1}
.h-row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.quota{border:1px solid var(--border);border-radius:12px;padding:12px 14px;background:var(--sand)}
.q-row{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:15px}
.qbar{display:flex;gap:4px;margin:8px 0 6px}.qbar i{flex:1;height:8px;border-radius:4px;background:#fff;border:1px solid var(--line)}.qbar i.on{background:var(--gd);border-color:var(--gd)}
.meta{font-size:14px;color:var(--muted)}
.seg{display:flex;background:#F1EEE8;border-radius:10px;padding:4px;gap:4px}
.seg a{flex:1;min-height:44px;display:flex;align-items:center;justify-content:center;border-radius:8px;font:600 15px Inter,system-ui,sans-serif;color:var(--muted);text-decoration:none}
.seg a[aria-current=page]{background:#fff;color:var(--text);box-shadow:0 1px 2px rgba(26,34,48,.15);border:1px solid var(--border)}
.list{display:flex;flex-direction:column;gap:10px;list-style:none}
.req,.card{display:block;border:1px solid var(--border);border-radius:12px;padding:12px 14px;text-decoration:none;color:inherit;background:#fff;text-align:left}
a.req:hover h3{text-decoration:underline}
.req.attn{border-left:5px solid var(--warn-line)}.req.sel{border:2px solid var(--gd);background:var(--tint)}.req.sel.attn{border-left:5px solid var(--warn-line)}
.req-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.rid{font:600 13px Inter,system-ui,sans-serif;color:var(--muted);font-variant-numeric:tabular-nums}
.req h3,.card h3{font:700 17px/1.3 Inter,system-ui,sans-serif;letter-spacing:0;margin:0 0 4px}
.needs{color:var(--warn-fg)}
.empty{text-align:center;border:1.5px dashed var(--border);border-radius:14px;padding:28px 20px;display:flex;flex-direction:column;gap:12px;align-items:center}
.empty h2{font-size:22px}.empty p{color:var(--muted)}
fieldset{border:0}legend{font-weight:600;font-size:15px;margin-bottom:6px}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:8px}.choices.one{grid-template-columns:1fr}
.choice{position:relative;display:flex;align-items:center;gap:10px;min-height:52px;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;font-weight:600;font-size:15px;cursor:pointer}
.choice input{width:20px;height:20px;accent-color:var(--gd);flex:none;margin:0}
.choice:has(input:checked){border:2px solid var(--gd);background:var(--tint)}
.choice:has(input:focus-visible){outline:3px solid var(--gd);outline-offset:2px}
.note{font-size:14px;background:var(--sand);border-radius:10px;padding:10px 12px}
.files{list-style:none;display:flex;flex-direction:column;gap:8px;margin-top:8px}
.file{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:10px;padding:8px 12px;font-size:14px;background:#fff}
.file .fn{flex:1;display:flex;flex-direction:column;min-width:0;font-weight:600;overflow-wrap:anywhere}.file small{font-weight:400;color:var(--muted);font-size:13px}
.file.bad{border:1.5px solid var(--err);background:#FDF0EE}.file.bad small{color:var(--err);font-weight:600}
.file a{color:var(--gd)}
.receipt{display:flex;gap:8px;align-items:center;background:var(--tint);color:var(--gd);border-radius:10px;padding:8px 12px;font-size:14px;font-weight:600;margin-top:8px}.receipt svg{flex:none}
/* Thread */
.thread{display:flex;flex-direction:column;flex:1;min-width:0}
.thead{padding:14px 20px 12px;border-bottom:1px solid var(--border)}
.thead h1{font-size:22px;line-height:1.2;margin:6px 0 4px}
.stepper{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);margin-top:14px}
.stepper li{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;font-size:12px;color:var(--muted)}
.stepper li:not(:last-child):after{content:"";position:absolute;top:10px;left:calc(50% + 14px);right:calc(-50% + 14px);height:2px;background:var(--border)}
.stepper li.done:not(:last-child):after{background:var(--gd)}
.dot{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.done .dot{background:var(--gd);border-color:var(--gd);color:#fff}.cur .dot{border:3px solid var(--gd);color:var(--gd)}
.stepper b{font-weight:600;color:var(--text)}.cur b{font-weight:800}.todo b{font-weight:500;color:var(--muted)}
.stepper small{font-size:12px;min-height:16px}
.banner{display:flex;gap:10px;align-items:center;background:var(--warn-bg);color:#5C3F00;padding:10px 20px;font-size:15px;border-bottom:1px solid var(--warn-line)}.banner svg{color:var(--warn-fg);flex:none}
.stream{flex:1;padding:16px;display:flex;flex-direction:column;gap:12px;background:#FBFAF7;list-style:none}
.msg{max-width:88%;border-radius:14px;padding:10px 14px;font-size:15px}
.msg.me{align-self:flex-end;background:#F1EEE8;border:1px solid var(--border)}
.msg.dyb{align-self:flex-start;background:#fff;border:1.5px solid #8CC3A5}
.msg.internal{align-self:stretch;max-width:none;background:#FFF8E1;border:1.5px dashed var(--warn-line)}
.msg .body{white-space:pre-wrap;overflow-wrap:anywhere}
.who{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:4px}.who strong{color:var(--text)}
.av{width:24px;height:24px;border-radius:50%;flex:none;display:inline-flex}.av img{display:block;width:24px;height:24px}
.event{align-self:center;font-size:13px;color:var(--muted);display:flex;gap:6px;align-items:center}
.composer{border-top:1px solid var(--border);padding:12px 16px 14px;background:#fff}.composer .ta{min-height:72px}
.comp-actions{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:8px;flex-wrap:wrap}
.fixcard{border:2px solid var(--gd);border-radius:14px;padding:14px;background:var(--tint)}.fixcard h2{font-size:19px;margin-bottom:10px}
.two{display:flex;gap:8px}.two form{flex:1}.two .btn{width:100%;padding:12px 8px}
/* Admin tables */
.wide{max-width:1200px}
table{width:100%;border-collapse:collapse;font-size:15px}th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--border);vertical-align:top}
.table-wrap{overflow-x:auto}
.inline{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end}.inline>*{flex:1 1 160px}.inline .btn{flex:0 0 auto}
/* Desktop: list left (440px), thread right */
@media (min-width:1024px){
  .appbar{padding:0 28px;min-height:72px}.menu{display:none}
  .dnav{display:flex;align-items:center;gap:24px;margin-left:40px;flex:1}
  .dnav a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--text);text-decoration:none;border-bottom:3px solid transparent}
  .dnav a[aria-current=page]{border-bottom-color:var(--gd)}
  .dright{margin-left:auto;display:flex;align-items:center;gap:16px;font-size:15px}
  .split{display:grid;grid-template-columns:440px 1fr;flex:1;min-height:0}
  .split .side{border-right:1px solid var(--border);padding:24px;display:flex;flex-direction:column;gap:14px;max-width:none;margin:0}
  .split .thead{display:grid;grid-template-columns:1fr 360px;gap:32px;align-items:start;padding:20px 28px}.split .stepper{margin-top:4px}
  .split .stream{padding:20px 28px}.split .composer{padding:14px 28px 16px}.split .msg{max-width:70%}
  .split .banner{padding:10px 28px}
}
@media (max-width:1023px){.split .side{display:none}.split .side.solo{display:flex}}
.footwrap{padding-top:0;flex:0}
.gap16{height:16px}
.inthread{margin:12px 16px 0}

.composer .btn-block{margin-top:10px}
.fixcard{list-style:none}
.content form.card{display:flex;flex-direction:column;gap:10px}
.desk-only{display:none}
@media (min-width:1024px){.appbar .desk-only{display:flex}.appbar .back{display:none}}

/* QA2: Add files button (48 px label for a visually hidden input), Attach + Send on one row */
.fileinput.sr{opacity:0}
.addfiles{min-height:48px;cursor:pointer;gap:8px}
.fileinput:focus-visible+.addfiles{outline:3px solid var(--gd);outline-offset:2px}
.comp-actions .addfiles{min-height:48px}.comp-actions .btn.sm{min-height:48px}
.composer .hint{margin-top:6px}
/* quota over the plan: yellow, never red, never blocking */
.quota.over{background:#FFF8E1;border-color:var(--warn-line)}.quota.over strong{color:#7A5300;display:inline-flex;gap:6px;align-items:center}
.qbar i.on.over{background:#E0A800;border-color:#C99700}
.note.over{background:#FFF8E1;border:1px solid var(--warn-line);color:#5C3F00}
.choices .choice:last-child:nth-child(odd){grid-column:1/-1}
/* Check your email: address inside the sentence, wraps anywhere */
.lead strong.addr{color:var(--text);overflow-wrap:anywhere}
/* K1/K2: language links are at least 48 px; desktop header link looks like a link */
.foot a{min-width:48px;min-height:48px;display:inline-flex;align-items:center;justify-content:center}
.dright a.link{min-height:48px;min-width:48px;display:inline-flex;align-items:center;justify-content:center;color:var(--gd);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.req .var,.receipt .var{text-decoration:underline dashed;text-underline-offset:3px;text-decoration-color:var(--line)}
.pane-empty{display:flex;align-items:center;justify-content:center}.pane-empty .empty{border:0;color:var(--muted)}
.pane-empty .empty svg{width:40px;height:40px}

/* QA3 */
.rid{white-space:nowrap}
.req-top{flex-wrap:wrap;row-gap:4px}
@media (max-width:1023px){.pane-empty{display:none!important}}
.file .rm{flex:none;width:44px;height:44px;margin:-6px -8px -6px 0;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:8px;background:none;color:var(--text);cursor:pointer}
.file .rm:hover{background:var(--tint)}.file .rm:focus-visible{outline:3px solid var(--gd);outline-offset:0}