/* Compatibility bridge, UI only. Generated from assets/components.css. */
@import url("tokens.css");
*,*::before,*::after{box-sizing:border-box}
html{color-scheme:light;scroll-padding-top:24px}
body{margin:0;background:var(--wai-paper);color:var(--wai-ink);font:var(--wai-regular) var(--wai-text-md)/var(--wai-leading) var(--wai-font);font-synthesis:none}
h1,h2,h3,p,figure{margin:0}h1,h2,h3{color:var(--wai-blue);font-weight:var(--wai-bold);line-height:var(--wai-leading-title)}
h1{font-size:var(--wai-text-2xl);letter-spacing:-.7px}h2{font-size:var(--wai-text-xl);letter-spacing:-.3px}h3{font-size:var(--wai-text-lg)}
p{color:var(--wai-muted);max-width:70ch}a{color:var(--wai-blue)}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}
button,input,select,textarea,a,summary{touch-action:manipulation}img,svg{max-width:100%}button:disabled{cursor:not-allowed}
:focus-visible{outline:var(--wai-focus);outline-offset:4px}[hidden]{display:none!important}
:is(.wai-sr-only,.sr-only){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wai-skip{position:fixed;top:-120px;left:12px;padding:12px 20px;background:white;border:2px solid var(--wai-blue);z-index:100}.wai-skip:focus{top:12px}
.wai-icon{width:22px;height:22px;flex:none;vertical-align:middle}
:is(.wai-btn,.btn){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--wai-hit);padding:10px 20px;border:1px solid transparent;border-radius:var(--wai-radius-button);font-size:var(--wai-text-sm);font-weight:700;line-height:1.4;text-align:center;text-decoration:none;background:var(--wai-blue);color:white;overflow-wrap:anywhere}
:is(.wai-btn,.btn):hover{background:var(--wai-hover)}:is(.wai-btn,.btn):active{transform:translateY(1px)}
:is(.wai-btn--secondary,.btn--secondary){background:white;border-color:var(--wai-control);color:var(--wai-blue)}:is(.wai-btn--secondary,.btn--secondary):hover{background:var(--wai-soft)}
:is(.wai-btn--quiet,.btn--link){background:transparent;color:var(--wai-blue)}:is(.wai-btn--quiet,.btn--link):hover{background:var(--wai-info-bg)}
:is(.wai-btn--danger,.btn--danger){background:var(--wai-error-ink)}:is(.wai-btn--danger,.btn--danger):hover{background:var(--wai-ink)}
:is(.wai-btn,.btn):disabled{background:var(--wai-bg);color:var(--wai-muted);border-color:var(--wai-control);transform:none}
:is(.wai-btn,.btn)[aria-busy="true"]{pointer-events:none}.wai-btn--icon{width:var(--wai-hit);padding:10px;flex:none}
.wai-link{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:4px;font-weight:700}
.wai-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.wai-row--between{justify-content:space-between}:is(.wai-stack,.stack){display:grid;gap:20px}.wai-stack--sm{gap:12px}
:is(.wai-muted,.muted){color:var(--wai-muted)}.wai-small{font-size:var(--wai-text-sm)}.wai-caption{font-size:var(--wai-text-xs);color:var(--wai-muted)}
:is(.wai-card,.card){padding:28px;border:1px solid var(--wai-line);border-radius:var(--wai-radius-md);background:var(--wai-paper);min-width:0}
.wai-card--soft{background:var(--wai-soft)}:is(.wai-card,.card) p{margin-top:12px}.wai-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.wai-card__head>.wai-icon{color:var(--wai-teal-ink);width:40px;height:40px}
:is(.wai-badge,.badge){display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:6px 12px;border-radius:var(--wai-radius-pill);font-size:var(--wai-text-xs);line-height:1.4;background:var(--wai-success-bg);color:var(--wai-teal-ink);font-weight:400}
.wai-badge--info{background:var(--wai-info-bg);color:var(--wai-blue)}.wai-badge--neutral{background:var(--wai-warning-bg);color:var(--wai-warning-ink)}.wai-badge--error{background:var(--wai-error-bg);color:var(--wai-error-ink)}
:is(.wai-notice,.alert){display:flex;align-items:flex-start;gap:12px;padding:16px 20px;background:var(--wai-info-bg);border-radius:var(--wai-radius-sm);font-size:var(--wai-text-sm);color:var(--wai-ink)}:is(.wai-notice,.alert) p{color:inherit;margin:0}:is(.wai-notice,.alert) .wai-icon{color:var(--wai-blue)}
:is(.wai-notice--error,.alert--error){background:var(--wai-error-bg);border-left:3px solid var(--wai-error-ink)}
:is(.wai-field,.field){display:grid;gap:8px;min-width:0}:is(.wai-field,.field)>label,:is(.wai-field,.field)>legend{font-size:var(--wai-text-sm);font-weight:700}:is(.wai-field__hint,.field__hint){font-size:var(--wai-text-xs);color:var(--wai-muted)}
:is(.wai-input,.input,.select,.textarea){width:100%;min-width:0;min-height:var(--wai-hit);padding:10px 13px;border:1px solid var(--wai-control);border-radius:var(--wai-radius-sm);background:white;font-size:1rem;line-height:1.5}
textarea:is(.wai-input,.input,.select,.textarea){resize:vertical;min-height:116px}:is(.wai-input,.input,.select,.textarea)::placeholder{color:var(--wai-muted)}:is(.wai-input,.input,.select,.textarea):hover:not(:disabled){border-color:var(--wai-blue)}
:is(.wai-input,.input,.select,.textarea)[aria-invalid="true"]{border:2px solid var(--wai-error-ink);padding:9px 12px}:is(.wai-field__error,.field__error){font-size:var(--wai-text-sm);color:var(--wai-error-ink);display:flex;gap:8px;align-items:start}
:is(.wai-input,.input,.select,.textarea):disabled{background:var(--wai-bg);color:var(--wai-muted);cursor:not-allowed}:is(.wai-input,.input,.select,.textarea)[readonly]{background:var(--wai-bg)}
:is(.wai-choice,.checkbox){display:flex;align-items:center;gap:10px;min-height:var(--wai-hit);cursor:pointer;font-size:var(--wai-text-sm)}:is(.wai-choice,.checkbox) input{width:20px;height:20px;accent-color:var(--wai-blue);flex:none;margin:0}
.wai-fieldset{border:0;padding:0;margin:0;min-width:0}.wai-fieldset legend{font-size:var(--wai-text-sm);font-weight:700;margin-bottom:8px}
:is(.wai-table-scroll,.table-wrap){overflow:auto;border:1px solid var(--wai-line);border-radius:var(--wai-radius-md);background:white}
:is(.wai-table,.table){width:100%;min-width:580px;border-collapse:collapse;text-align:left;font-size:var(--wai-text-sm)}:is(.wai-table,.table) caption{text-align:left;padding:18px 20px;font-weight:700;color:var(--wai-blue)}
:is(.wai-table,.table) th,:is(.wai-table,.table) td{padding:16px 20px;border-bottom:1px solid var(--wai-line);vertical-align:middle}:is(.wai-table,.table) th{background:var(--wai-bg);font-weight:700;color:var(--wai-muted)}:is(.wai-table,.table) tr:last-child td{border-bottom:0}:is(.wai-table,.table) td small{display:block;color:var(--wai-muted);font-size:var(--wai-text-xs);margin-top:4px}
.wai-table-hint{display:none;font-size:var(--wai-text-xs);color:var(--wai-muted);margin-bottom:8px}
:is(.wai-state,.empty){padding:36px 24px;text-align:center;border:1px dashed var(--wai-control);border-radius:var(--wai-radius-md);background:white;display:grid;justify-items:center;gap:16px;min-width:0}
:is(.wai-state,.empty)>.wai-icon{width:44px;height:44px;color:var(--wai-teal-ink)}:is(.wai-state,.empty) p{max-width:46ch;margin:0}:is(.wai-state,.empty) h3{font-size:var(--wai-text-lg)}
.wai-spinner{display:inline-block;width:20px;height:20px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:wai-spin .8s linear infinite;flex:none}
@keyframes wai-spin{to{transform:rotate(360deg)}}.wai-skeleton{width:100%;height:16px;background:var(--wai-line);border-radius:4px}.wai-skeleton--short{width:65%}
:is(.wai-price,.price){font-size:2rem;line-height:1.25;letter-spacing:-.6px;color:var(--wai-blue);font-weight:700;font-variant-numeric:tabular-nums}:is(.wai-price,.price) small{display:block;font-size:var(--wai-text-xs);font-weight:400;letter-spacing:0;color:var(--wai-muted);margin-top:6px}
.wai-plan{display:flex;flex-direction:column;gap:18px}.wai-plan h2{font-size:1.75rem}.wai-plan .wai-icon{color:var(--wai-teal-ink)}.wai-plan ul{list-style:none;padding:18px 0;margin:0;border-block:1px solid var(--wai-line);display:grid;gap:12px;font-size:var(--wai-text-sm)}.wai-plan :is(.wai-btn,.btn){margin-top:auto}
:is(.wai-kv,.kv){margin:20px 0;display:grid;gap:12px;font-size:var(--wai-text-sm)}:is(.wai-kv,.kv)>div{display:flex;justify-content:space-between;gap:16px}:is(.wai-kv,.kv) dt{color:var(--wai-muted)}:is(.wai-kv,.kv) dd{margin:0;text-align:right;overflow-wrap:anywhere}
.wai-progress{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:24px}.wai-progress li{display:flex;align-items:center;gap:14px;position:relative}.wai-progress li:not(:last-child)::after{content:"";position:absolute;width:1px;height:22px;background:var(--wai-line);top:38px;left:17px}
.wai-progress__mark{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--wai-control);border-radius:50%;background:var(--wai-bg);color:var(--wai-muted);flex:none}
.wai-progress li[data-done] .wai-progress__mark{background:var(--wai-blue);border-color:var(--wai-blue);color:white}.wai-progress [aria-current="step"] .wai-progress__mark{background:var(--wai-success-bg);border-color:var(--wai-teal-ink);color:var(--wai-teal-ink)}
.wai-progress strong{font-size:var(--wai-text-sm);font-weight:400}.wai-progress [aria-current="step"] strong{font-weight:700;color:var(--wai-blue)}.wai-progress small{display:block;color:var(--wai-muted);font-size:var(--wai-text-xs);margin-top:3px}
.wai-shortcut{display:flex;align-items:center;gap:16px;width:100%;padding:20px;border:1px solid var(--wai-line);border-radius:12px;background:white;text-align:left;text-decoration:none;color:var(--wai-blue)}.wai-shortcut:hover{background:var(--wai-soft)}.wai-shortcut>.wai-icon{width:28px;height:28px;color:var(--wai-teal-ink)}.wai-shortcut span{flex:1}.wai-shortcut small{display:block;color:var(--wai-muted);margin-top:5px;font-size:var(--wai-text-xs)}
.wai-order{padding:20px 24px}.wai-order h3{margin:12px 0 5px}.wai-order p{margin:0;font-size:var(--wai-text-sm)}.wai-order :is(.wai-btn,.btn){margin-top:10px}
.wai-dialog{width:min(540px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:28px;border:1px solid var(--wai-line);border-radius:var(--wai-radius-lg);color:var(--wai-ink);background:white;font-family:var(--wai-font);overflow:auto}
.wai-dialog::backdrop{background:rgba(3,40,65,.6)}.wai-dialog__heading{display:flex;justify-content:space-between;align-items:start;gap:16px;margin-bottom:20px}.wai-dialog h2{padding-top:8px}.wai-dialog__actions{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap}.wai-dialog__actions>*{flex:1}body:has(.wai-dialog[open]){overflow:hidden}
.wai-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);padding:16px 20px;border-radius:12px;background:var(--wai-blue);color:white;z-index:var(--wai-layer-toast);font-size:var(--wai-text-sm);box-shadow:0 6px 24px #054f8820}
@media(max-width:640px){:is(.wai-card,.card){padding:22px}.wai-table-hint{display:block}:is(.wai-price,.price){font-size:1.875rem}.wai-dialog{padding:22px}.wai-order{padding:20px}:is(.wai-btn,.btn){padding-inline:16px}:is(.wai-state,.empty){padding:28px 20px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.wai-spinner{border-style:dotted}}


/* Layout and helper names explicitly required by section 8 of the technical contract. */
.container{max-width:1200px;margin-inline:auto;padding-inline:40px}
.page-header{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:28px}.page-header p{margin-top:12px}
.page-actions,.form-actions,.toolbar,.pagination{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.toolbar{margin-block:24px}
.grid{display:grid;gap:24px}.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.section{margin-top:32px}.card__title{font-size:var(--wai-text-xl);margin-bottom:16px}.card__body{min-width:0}.form{display:grid;gap:20px}.field__label{font-size:var(--wai-text-sm);font-weight:700}.field--invalid :is(.input,.select,.textarea){border:2px solid var(--wai-error-ink);padding:9px 12px}
.btn--small{font-size:var(--wai-text-xs);padding:10px 14px}.btn--primary{background:var(--wai-blue);color:white}.btn--primary:hover{background:var(--wai-hover)}.btn--primary:disabled{background:var(--wai-bg);color:var(--wai-muted)}
.table__num{text-align:right;font-variant-numeric:tabular-nums}.pagination>*{min-height:46px;min-width:46px;display:grid;place-items:center}.pagination [aria-current=page]{font-weight:700;text-decoration:underline}
.steps{list-style:none;margin:24px 0;padding:0;display:flex;gap:12px;flex-wrap:wrap}.steps__item{padding:10px 14px;border:1px solid var(--wai-control);border-radius:8px;color:var(--wai-muted)}.steps__item--done{background:var(--wai-blue);color:white;border-color:var(--wai-blue)}.steps__item--current{background:var(--wai-success-bg);color:var(--wai-teal-ink);border-color:var(--wai-teal-ink);font-weight:700}
.progress{height:12px;background:var(--wai-line);border-radius:999px;overflow:hidden}.progress__bar{display:block;height:100%;background:var(--wai-teal-ink)}
.alert--success{background:var(--wai-success-bg)}.alert--info{background:var(--wai-info-bg)}.alert--warning{background:var(--wai-warning-bg);color:var(--wai-warning-ink)}.mock-note{padding:12px 16px;background:var(--wai-info-bg);border-left:3px solid var(--wai-teal);font-size:var(--wai-text-xs);color:var(--wai-ink)}
.badge--active,.badge--approved,.badge--paid,.badge--done,.badge--completed{background:var(--wai-info-bg);color:var(--wai-blue)}.badge--rejected,.badge--expired,.badge--overdue,.badge--failed,.badge--locked{background:var(--wai-error-bg);color:var(--wai-error-ink)}.badge--draft,.badge--cancelled{background:var(--wai-warning-bg);color:var(--wai-warning-ink)}
.price__amount{font-size:inherit;font-weight:700;font-variant-numeric:tabular-nums}.price__unit,.price__vat{display:block;font-size:var(--wai-text-xs);color:var(--wai-muted);font-weight:400;letter-spacing:0;margin-top:6px}
.pre-wrap{white-space:pre-wrap;overflow-wrap:anywhere}.hp-field{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(max-width:900px){.container{padding-inline:24px}.grid{gap:18px}.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.container{padding-inline:20px}.page-header{display:block}.page-actions{margin-top:16px}.grid--2,.grid--3,.grid--4{grid-template-columns:1fr}.form-actions>*{flex:1}.toolbar{align-items:stretch;flex-direction:column}.steps{flex-direction:column}.price{font-size:1.875rem}}

/* Kiểu chữ 1.1.0, đủ bốn file font thật, không giả lập độ đậm. */
.wai-weight-regular{font-weight:var(--wai-regular)}.wai-weight-medium{font-weight:var(--wai-medium)}.wai-weight-semibold{font-weight:var(--wai-semibold)}.wai-weight-bold{font-weight:var(--wai-bold)}
