@font-face{font-family:Manrope;src:url('/fonts/manrope-vietnamese.woff2') format('woff2');font-weight:400 800;font-display:swap;unicode-range:U+0102-0103,U+0110-0111,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:Manrope;src:url('/fonts/manrope-latin.woff2') format('woff2');font-weight:400 800;font-display:swap}
:root{font-family:Manrope,system-ui,sans-serif;color:#191c2b;background:#e9ebed;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0}
button{font:inherit;cursor:pointer}
button:disabled{cursor:not-allowed}
a{color:inherit}
:focus-visible{outline:3px solid #b9ff70;outline-offset:3px}
[hidden]{display:none!important}
.skip-link{position:absolute;top:-70px;left:15px;z-index:10;padding:10px 15px;background:#fff}
.skip-link:focus{top:10px}
.app{width:min(100%,1700px);min-height:100vh;margin:auto;background:#f6f7f7;box-shadow:0 0 45px #1416260d}
.topbar{display:flex;align-items:center;gap:25px;height:67px;padding:0 26px;border-bottom:1px solid #e0e1e4;background:#fff}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap;font-size:20px;font-weight:800;letter-spacing:-.06em}
.brand>span>span{color:#5948e7}
.brand img{border-radius:9px}
.product-name{display:flex;align-items:center;gap:16px;font-size:12px;font-weight:750;color:#5b6070}
.product-divider{width:1px;height:22px;background:#dedfe3}
.preview-tag{padding:6px 8px;border:1px solid #d6d1ff;color:#5646db;font-size:9px;font-weight:800;letter-spacing:.09em}
.top-actions{display:flex;align-items:center;gap:24px;margin-left:auto}
.back-site{font-size:11px;font-weight:700;text-decoration:none;color:#5d6471}
.back-site:hover{text-decoration:underline}
.reset-button{border:0;background:none;font-size:11px;font-weight:800;color:#4d40c5}
.reset-button span{font-size:17px;vertical-align:-1px}
.app-body{display:grid;grid-template-columns:245px minmax(0,1fr);min-height:calc(100vh - 107px)}
.rail{display:flex;flex-direction:column;min-width:0;padding:30px 18px 25px;background:#171d32;color:#fff}
.eyebrow,.micro-label,.progress-label,.conversation-meta{font-size:10px;font-weight:800;letter-spacing:.1em}
.rail-heading{padding:0 10px}
.rail-heading .eyebrow{color:#baff6b}
.rail h1{margin:28px 0 15px;font-size:24px;line-height:1.2;letter-spacing:-.055em}
.rail h1 span{color:#c5ff82}
.rail-heading p{margin:0;color:#b5bdce;font-size:11px;line-height:1.7}
.steps{display:grid;gap:5px;margin-top:52px}
.step{display:grid;grid-template-columns:30px 1fr;align-items:center;gap:12px;min-height:68px;padding:12px 10px;border:1px solid transparent;background:transparent;text-align:left;color:#aeb7ca}
.step.is-current{border-color:#7465e8;background:#3b376c;color:#fff}
.step:not(:disabled):hover{background:#2a3151}
.step-index{display:grid;place-items:center;width:28px;height:28px;border:1px solid #667088;border-radius:50%;font-size:10px;font-weight:800}
.step.is-current .step-index{border-color:#c5ff82;background:#c5ff82;color:#172034}
.step-copy{display:grid;gap:3px}
.step-copy strong{font-size:12px}
.step-copy small{font-size:10px;font-weight:500;opacity:.8}
.rail-bottom{margin-top:auto;padding:25px 10px 0;border-top:1px solid #424963}
.progress-label{display:flex;justify-content:space-between;color:#b6bfce}
.progress-label #step-number{color:#c5ff82}
.progress-label small{color:#b6bfce}
.rail-bottom>strong{display:block;margin:11px 0;font-size:13px}
.rail-bottom p{margin:0;color:#a6afc0;font-size:10px;line-height:1.6}
.main{min-width:0;padding:26px}
.workspace-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:18px}
.workspace-heading .eyebrow{color:#5746de}
.workspace-heading h2{margin:3px 0 4px;font-size:29px;letter-spacing:-.055em}
.workspace-heading p{margin:0;color:#747987;font-size:11px}
.demo-pill{display:inline-flex;align-items:center;gap:7px;flex-shrink:0;padding:7px 10px;border:1px solid #d4ccfa;background:#f2f0ff;color:#5141cb;font-size:9px;font-weight:800;letter-spacing:.08em}
.demo-pill span{width:6px;height:6px;border-radius:50%;background:#644fe6}
.disclosure{display:flex;gap:9px;padding:11px 13px;border-left:3px solid #9285e8;background:#eeedfa;color:#656878;font-size:10px;line-height:1.5}
.disclosure strong{flex-shrink:0;color:#38315e}
.workgrid{display:grid;grid-template-columns:214px minmax(0,1fr) 218px;align-items:stretch;gap:12px;margin-top:16px}
.inbox,.case,.request-card{min-width:0;border:1px solid #e1e2e6;background:#fff}
.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:20px 15px;border-bottom:1px solid #e5e6e9}
.micro-label{color:#747b89}
.panel-heading h3{margin:5px 0 0;font-size:15px;letter-spacing:-.035em}
.inbox-count{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#efedff;color:#5746dc;font-size:10px;font-weight:800}
.conversation{display:flex;gap:9px;padding:16px 12px;border-left:3px solid #6251e2;background:#f2f0ff}
.avatar{display:grid;place-items:center;flex:0 0 auto;width:31px;height:31px;border-radius:7px;background:#d9d4ff;color:#493bb9;font-size:10px;font-weight:800}
.conversation-copy{min-width:0}
.conversation-top{display:flex;justify-content:space-between;gap:6px;font-size:11px}
.conversation-top time{font-size:9px;color:#7f8491}
.conversation-copy p{margin:5px 0 8px;color:#626777;font-size:10px;line-height:1.5}
.conversation-meta{font-size:8px;color:#6656cc}
.inbox-footnote{margin:0;padding:16px;color:#8b8e98;font-size:10px;line-height:1.55}
.case{display:flex;flex-direction:column;min-height:562px}
.case-head{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;padding:22px 24px 19px;border-bottom:1px solid #e7e7eb}
.case-head .micro-label{color:#5b4be0}
.case-head h3{margin:6px 0 0;font-size:20px;letter-spacing:-.045em}
.status{flex-shrink:0;padding:6px 8px;background:#f7f3e8;color:#826628;font-size:9px;font-weight:800}
.status.is-ready{background:#edebff;color:#5848d3}
.status.is-recorded{background:#ebf7e7;color:#287440}
.case-body{flex:1;min-width:0;padding:28px 24px 25px}
.message-label{display:flex;align-items:center;gap:8px;color:#6b7180;font-size:10px;font-weight:750}
.message-mark{display:grid;place-items:center;width:24px;height:24px;border-radius:5px;background:#eeebff;color:#5240d5;font-size:9px;font-weight:800}
blockquote{margin:22px 0 0;color:#25293a;font-size:clamp(18px,1.6vw,24px);font-weight:670;line-height:1.55;letter-spacing:-.035em}
.context-note{display:flex;gap:8px;margin-top:29px;padding-top:16px;border-top:1px solid #e5e6e9;color:#697080;font-size:11px;line-height:1.5}
.context-note span{color:#5948db;font-size:17px}
.translation-grid{display:grid;gap:12px}
.translation-block{padding:16px;border:1px solid #e6e7eb}
.translation-block p{margin:16px 0 0;font-size:13px;line-height:1.65}
.draft-block{border-color:#d7d1fb;background:#f6f4ff}
.decision-note{margin-top:14px;padding:13px 14px;background:#f3f4f6;color:#646b78;font-size:10px;line-height:1.6}
.decision-note strong{color:#292d3d}
.appointment-layout{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.appointment-card{padding:16px;border:1px solid #e2e3e7;border-left:3px solid #5a48e4}
.appointment-data{display:grid;gap:14px;margin-top:19px}
.appointment-data>div{display:grid;gap:4px}
.appointment-data span,.request-details span{color:#858a96;font-size:9px;font-weight:800;letter-spacing:.07em}
.appointment-data strong,.request-details strong{font-size:11px;line-height:1.45}
.schedule{padding:16px;border:1px solid #e2e3e7}
.schedule-slot{display:flex;justify-content:space-between;align-items:center;gap:7px;min-height:42px;border-bottom:1px solid #e8e9ec;color:#818694;font-size:10px}
.schedule-slot:first-of-type{margin-top:15px}
.schedule-slot:last-of-type{border-bottom:0}
.schedule-slot span:first-child{font-weight:800;color:#5c6372}
.schedule-slot.selected{margin:0 -7px;padding:0 7px;background:#edf5df;color:#2d5232}
.schedule-slot strong{font-size:10px;text-align:right}
.record-note{margin:15px 0 0;color:#787e89;font-size:10px;line-height:1.6}
.record-note.is-recorded{color:#26703f}
.case-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:73px;padding:14px 20px;border-top:1px solid #e6e7eb}
.back-button{border:0;background:none;color:#6254ba;font-size:11px;font-weight:800;white-space:nowrap}
.footer-actions{display:flex;justify-content:flex-end;align-items:center;gap:12px;margin-left:auto}
.demo-safety{max-width:130px;color:#9295a0;font-size:9px;line-height:1.4;text-align:right}
.primary-button{min-height:39px;padding:10px 13px;border:0;background:#5947e4;color:#fff;font-size:10px;font-weight:800;white-space:nowrap}
.primary-button:hover{background:#3e2fc1}
.request-card{align-self:start}
.request-card-head{display:flex;justify-content:space-between;gap:8px;padding:20px 15px;border-bottom:1px solid #e5e6e9}
.ticket-id{color:#5746db;font-size:9px;font-weight:800}
.request-client{display:flex;align-items:center;gap:10px;padding:18px 15px}
.ticket-avatar{display:grid;place-items:center;width:34px;height:34px;background:#e8e4ff;color:#5541d5;font-size:16px;font-weight:800}
.request-client strong,.request-client small{display:block}
.request-client strong{font-size:12px}
.request-client small{margin-top:3px;color:#8b8f99;font-size:9px}
.request-details{display:grid;gap:0;padding:0 15px}
.request-details>div{display:grid;gap:5px;padding:12px 0;border-top:1px solid #ebebee}
.request-next{margin-top:15px;padding:16px 15px;background:#f4f5f3}
.request-next p{margin:7px 0 0;color:#606776;font-size:10px;line-height:1.55}
.scope{display:flex;gap:12px;padding:13px 26px;border-top:1px solid #e2e3e5;background:#f6f7f7;color:#777d88;font-size:10px;line-height:1.5}
.scope strong{flex-shrink:0;color:#404659}
.next-step{display:flex;align-items:center;justify-content:space-between;gap:45px;padding:34px max(26px,calc((100vw - 1280px)/2));border-top:1px solid #d7d9dc;background:#eef1ec}
.next-step>div:first-child{max-width:610px}
.next-step .micro-label{color:#397669}
.next-step h2{margin:9px 0 8px;font-size:clamp(22px,2.4vw,33px);letter-spacing:-.045em;line-height:1.2}
.next-step p{margin:0;color:#5c6570;font-size:12px;line-height:1.7}
.next-step-action{display:grid;justify-items:start;gap:11px;min-width:250px}
.next-step-action a{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;min-width:250px;padding:15px 18px;background:#5746df;color:white;font-size:12px;font-weight:800;text-decoration:none}
.next-step-action a:hover{background:#3e2fc1}
.next-step-action span{max-width:290px;color:#707781;font-size:10px;line-height:1.5}
@media(max-width:1260px){.app-body{grid-template-columns:210px minmax(0,1fr)}.workgrid{grid-template-columns:200px minmax(0,1fr)}.request-card{display:grid;grid-column:1/-1;grid-template-columns:180px 1fr 220px;align-items:center}.request-card-head{border-bottom:0}.request-client{padding:14px}.request-details{grid-template-columns:repeat(4,1fr);gap:10px;padding:10px}.request-details>div{border-top:0}.request-next{margin:0;padding:13px}}
@media(max-width:850px){.app-body{grid-template-columns:1fr}.rail{padding:18px 20px}.rail-heading h1,.rail-heading p,.rail-bottom{display:none}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:12px}.step{min-height:54px;padding:8px}.main{padding:18px}.workgrid{grid-template-columns:1fr}.request-card{grid-column:auto;grid-template-columns:1fr}.request-card-head{border-bottom:1px solid #e6e7eb}.request-details{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 15px}.request-details>div{border-top:1px solid #e6e7eb}.request-next{margin-top:4px}}
@media(max-width:650px){.topbar{height:61px;padding:0 14px;gap:10px}.brand{font-size:16px}.brand img{width:28px;height:28px}.product-name{display:none}.top-actions{gap:8px}.back-site{display:none}.reset-button{font-size:10px}.rail{padding:14px}.steps{margin:0}.step{display:block;min-height:56px;padding:8px 6px}.step-index{display:none}.step-copy strong{font-size:10px}.step-copy small{font-size:9px}.main{padding:14px}.workspace-heading h2{font-size:24px}.workspace-heading p{max-width:27ch;line-height:1.5}.demo-pill{font-size:8px}.disclosure{display:block;font-size:9px}.disclosure strong{display:block;margin-bottom:3px}.workgrid{grid-template-columns:1fr}.inbox .panel-heading{padding:11px 14px}.inbox .panel-heading h3{font-size:13px}.conversation{padding:11px 14px}.inbox-footnote{display:none}.case{min-height:500px}.case-head{padding:16px}.case-head h3{font-size:18px}.case-body{padding:19px 16px}.case-footer{padding:12px}.demo-safety{display:none}.translation-block p{font-size:12px}.appointment-layout{grid-template-columns:1fr}.request-card{grid-column:auto;grid-template-columns:1fr}.request-card-head{padding:13px;border-bottom:1px solid #e6e7eb}.request-client{padding:13px}.request-details{grid-template-columns:repeat(2,1fr);padding:0 13px}.request-details>div{border-top:1px solid #e6e7eb}.request-next{margin-top:4px}.scope{display:block;padding:14px}.scope strong{display:block;margin-bottom:4px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media(max-width:850px){.next-step{align-items:flex-start;flex-direction:column;gap:19px;padding:26px 20px}}
@media(min-width:651px){
  .workspace-heading p,.rail-heading p,.rail-bottom p,.inbox-footnote,.request-next p{font-size:12px}
  .disclosure,.context-note,.record-note{font-size:12px}
  .step-copy strong,.conversation-top,.request-client strong,.appointment-data strong,.request-details strong{font-size:13px}
  .step-copy small,.conversation-copy p,.translation-block .message-label,.case-head .micro-label,.demo-safety{font-size:11px}
  .translation-block p{font-size:14px}
  .schedule-slot,.schedule-slot strong,.primary-button,.back-button{font-size:12px}
  .request-details span,.appointment-data span{font-size:10px}
}