/* Single token layer for the whole product. No later :root redefinition. */
:root{
  font-family:Geist,"Noto Sans SC","Microsoft YaHei","PingFang SC",system-ui,sans-serif;
  color:#202322;
  background:#ffffff;
  font-size:16px;
  line-height:1.6;
  --ground:#ffffff;
  --surface:#f3f4f0;
  --field-1:#202322;
  --field-1-ink:#ffffff;
  --field-2:#edeFEB;
  --field-2-ink:#202322;
  --ink:#202322;
  --muted:#626665;
  --accent:#202322;
  --accent-ink:#ffffff;
  --line-soft:#e3e4e1;
  --line:var(--line-soft);
  --paper:var(--ground);
  --soft:var(--surface);
  --deep:var(--field-1);
  --radius:6px;
  --radius-control:6px;
  --canvas:#f6f6f4;
  --rule:#eef0eb;
  --control-line:#d8dcd5;
  --chart-1:#245cba;
  --positive:#216746;
  --negative:#9e3d32;
  --warning:#8a5f1b;
  --margin:clamp(16px,2.4vw,32px);
  --gutter:clamp(12px,1.6vw,24px);
  --space-section:clamp(36px,3.4vw,56px);
  --space-block:clamp(16px,1.6vw,24px);
  --step-small:14px;
  --step-body:16px;
  --step-lead:20px;
  --step-head:clamp(26px,2.4vw,36px);
  --step-page:clamp(22px,1.8vw,28px);
  --step-display:clamp(40px,4.6vw,64px);
  --heading:var(--step-head);
  --display:var(--step-display);
  --body:var(--step-body);
  --small:var(--step-small);
  --layer-nav:10;
  --layer-toast:100;
  --layer-skip:200
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth
}
body{
  margin:0
}
a{
  color:inherit;
  text-decoration:none
}
button,input,textarea,select{
  font:inherit
}
button,.button{
  cursor:pointer;
  min-height:44px;
  padding:11px 20px;
  border:1px solid var(--accent);
  background:var(--accent);
  color:var(--accent-ink);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius:var(--radius);
  font-size:var(--step-body);
  line-height:1.4;
  transition:background .16s,border-color .16s,color .16s;
  white-space:nowrap
}
button:hover,.button:hover{
  background:var(--field-1);
  border-color:var(--field-1)
}
button:active,.button:active{
  transform:translateY(1px)
}
button.secondary,.button.secondary{
  background:var(--ground);
  color:var(--ink);
  border-color:var(--line-soft)
}
button.secondary:hover,.button.secondary:hover{
  background:var(--surface);
  border-color:var(--muted)
}
button.danger{
  background:var(--ground);
  color:#8c2f1f;
  border-color:#c9a99f
}
button.small,.button.small{
  padding:8px 14px;
  min-height:44px;
  font-size:var(--step-small)
}
button:disabled{
  opacity:.55;
  cursor:wait
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px
}
h1,h2,h3,h4,p{
  margin-top:0
}
h1{
  font-size:var(--step-page);
  line-height:1.3;
  font-weight:600;
  letter-spacing:-.02em
}
h2{
  font-size:var(--step-head);
  line-height:1.35;
  font-weight:600;
  letter-spacing:-.02em
}
h3{
  font-size:var(--step-lead);
  font-weight:600;
  margin-bottom:10px
}
h4{
  font-size:var(--step-body)
}
p{
  margin-bottom:14px
}
.muted{
  color:var(--muted)
}
.text-action{
  border:0;
  background:transparent;
  color:var(--accent);
  font-size:14px;
  font-weight:600;
  padding:5px 0;
  min-height:36px;
  justify-content:flex-start;
  gap:22px;
  border-radius:0
}
.text-action:hover{
  background:transparent;
  border:0;
  color:#952e24
}






.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px 18px
}
.field{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:var(--step-body);
  margin-bottom:14px;
  min-width:0

}
.field>span{
  font-weight:600
}
.field.full{
  grid-column:1/-1
}
.field input,.field textarea,.field select{
  width:100%;
  background:var(--ground);
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  padding:11px 12px;
  color:var(--ink);
  font-size:var(--step-body);
  min-height:44px
}
.field input:hover,.field textarea:hover,.field select:hover{
  border-color:var(--muted)
}
.field input::placeholder,.field textarea::placeholder{
  color:var(--muted);
  opacity:1
}
.field textarea{
  min-height:98px;
  resize:vertical
}
.field small{
  color:var(--muted);
  font-size:var(--step-small);
  font-weight:400
}
.check{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-size:var(--step-body);
  margin:14px 0
}
.check input{
  margin-top:6px;
  accent-color:var(--accent)
}
.form-error{
  color:#8c2f1f;
  background:#fbeeea;
  padding:14px 16px;
  margin:14px 0;
  font-size:var(--step-body);
  overflow-wrap:anywhere
}
.form-error:empty{
  display:none
}
/* Material feedback stays adjacent to the field and never replaces its input. */
.field input[aria-invalid="true"]{border-color:#8c2f1f}
.field small.field-error{color:#8c2f1f;overflow-wrap:anywhere}
.field-error:empty,.demand-validation-summary:empty{display:none}
.demand-validation-summary{color:#8c2f1f;margin:0 0 16px;overflow-wrap:anywhere}
.demo-accounts{
  border-top:1px solid var(--line);
  margin-top:30px;
  padding-top:23px
}
.demo-accounts h3{
  font-size:16px
}
.demo-accounts p{
  font-size:13px;
  color:var(--muted)
}
.role-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:9px
}
.role-card{
  display:flex;
  flex-direction:column;
  align-items:start;
  background:#fff;
  color:var(--ink);
  border:1px solid var(--line);
  font-size:13px;
  padding:13px;
  gap:2px
}
.role-card:hover{
  color:var(--ink);
  background:var(--soft);
  border-color:#b1bec9
}
.role-card strong{
  font-weight:550
}
.role-card code{
  font-size:13px;
  color:var(--muted)
}
.badge{
  font-size:var(--step-small);
  padding:4px 9px;
  display:inline-block;
  border:0;
  background:var(--surface);
  white-space:nowrap;
  border-radius:var(--radius);
  font-weight:500;
  color:var(--field-2-ink);
  letter-spacing:0
}
.badge.warn{
  background:#f6e7dc;
  color:#7d4a20
}
.badge.ink{
  background:#e2e9e6;
  color:var(--field-1)
}
.row-actions{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  align-items:center
}
.empty{
  padding:28px 20px;
  color:var(--muted);
  background:var(--surface);
  font-size:var(--step-body);
  text-align:left;
  line-height:1.8
}
.notice{
  background:var(--surface);
  padding:14px 18px;
  font-size:var(--step-body);
  margin-bottom:20px;
  overflow-wrap:anywhere
}
.notice.warn{
  background:#f6e7dc;
  color:#5f3a1a
}
.detail-grid{
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  gap:20px
}
.detail-grid .panel{
  margin:0
}
.definition{
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:12px;
  font-size:var(--step-body)
}
.definition dt{
  color:var(--muted)
}
.definition dd{
  margin:0;
  overflow-wrap:anywhere
}
.table-wrap{
  min-width:0;
  overflow-x:auto;
  max-width:100%
}
table{
  width:100%;
  border-collapse:collapse;
  font-size:var(--step-small);
  text-align:left
}
th{
  background:var(--surface);
  font-size:var(--step-small);
  color:var(--field-2-ink);
  font-weight:600
}
td,th{
  padding:12px 14px;
  border-bottom:1px solid var(--line-soft);
  vertical-align:top
}
td small{
  display:block;
  color:var(--muted);
  font-size:var(--step-small);
  margin-top:4px
}
td strong{
  font-weight:600
}
td input,td select{
  width:100%;
  min-width:85px;
  padding:9px;
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  background:var(--ground);
  color:var(--ink);
  font-size:var(--step-small)
}
td input[type=checkbox]{
  width:auto;
  min-width:0;
  accent-color:var(--accent)
}
td:first-child{
  max-width:280px
}
.timeline{
  list-style:none;
  padding:0;
  margin:0
}
.timeline li{
  padding:14px 16px;
  background:var(--surface);
  margin-bottom:8px;
  font-size:var(--step-body);
  line-height:1.7
}
.timeline li:last-child{
  margin-bottom:0
}
.timeline time{
  display:block;
  color:var(--muted);
  font-size:var(--step-small)
}
.timeline p{
  font-size:var(--step-small);
  color:var(--muted);
  margin:4px 0 0
}
.subrecord{
  padding:18px;
  margin-top:14px;
  background:var(--surface);
  min-width:0
}
.subrecord h4{
  display:flex;
  justify-content:space-between;
  gap:14px;
  margin:0 0 12px;
  overflow-wrap:anywhere
}
.subrecord p{
  font-size:var(--step-body);
  overflow-wrap:anywhere
}
.amounts{
  display:flex;
  gap:28px;
  justify-content:flex-end;
  text-align:right;
  background:var(--surface);
  padding:20px;
  margin:16px 0
}
.amounts small{
  display:block;
  color:var(--muted);
  font-size:var(--step-small)
}
.amounts strong{
  font-size:var(--step-lead);
  font-weight:600;
  font-variant-numeric:tabular-nums
}
.amounts .total strong{
  color:var(--accent)
}
.attachment{
  display:inline-flex;
  align-items:center;
  margin:4px 9px 4px 0;
  gap:7px;
  font-size:var(--step-small);
  padding:7px 11px;
  background:var(--surface);
  word-break:break-all;
  max-width:100%
}
.attachment:before{
  content:'↗';
  color:var(--accent)
}
.import-panel{
  padding:20px;
  margin:18px 0;
  background:var(--surface);
  min-width:0
}
.import-panel .row-actions{
  margin-top:13px
}
.filters{
  display:flex;
  gap:12px;
  margin-bottom:18px;
  flex-wrap:wrap
}
.filters input,.filters select{
  padding:11px 13px;
  border:1px solid var(--line-soft);
  background:var(--ground);
  min-width:190px;
  border-radius:var(--radius);
  color:var(--ink);
  font-size:var(--step-body)
}
.search-status{
  font-size:var(--step-small);
  color:var(--muted);
  margin-bottom:12px
}
.toast{
  position:fixed;
  right:24px;
  bottom:24px;
  padding:15px 22px;
  background:var(--field-1);
  color:var(--field-1-ink);
  box-shadow:0 4px 24px #19232b28;
  max-width:min(500px,calc(100vw - 32px));
  z-index:var(--layer-toast);
  display:none;
  font-size:var(--step-body)
}
.toast.visible{
  display:block
}
dialog{
  border:0;
  border-radius:var(--radius);
  padding:0;
  width:min(700px,calc(100vw - 30px));
  max-height:90dvh;
  color:var(--ink);
  background:var(--ground);
  box-shadow:0 18px 48px #0f1a1552
}
dialog::backdrop{
  background:#0d1a15cc
}
.dialog-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 22px;
  background:var(--surface)

}
.dialog-head h2{
  margin:0;
  font-size:var(--step-lead);
  letter-spacing:0
}
.dialog-body{
  padding:18px 22px
}
.dialog-foot{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:18px
}
.close{
  background:none;
  border:none;
  color:var(--ink);
  padding:0 8px;
  font-size:25px
}
.close:hover{
  color:var(--accent);
  background:var(--surface);
  border-color:transparent
}
.skip{
  position:fixed;
  left:10px;
  top:0;
  transform:translateY(calc(-100% - 10px));
  background:#fff;
  padding:10px;
  z-index:var(--layer-skip)
}
.skip:focus{
  top:10px;
  transform:none
}
.history-details{
  font-size:var(--step-small);
  margin:16px 0
}
.history-details summary{
  cursor:pointer;
  color:var(--ink);
  min-height:44px;
  padding:10px 0;
  display:list-item;
  list-style-position:inside
}
.history-details summary::marker{
  color:var(--accent)
}
.history-details[open] summary{
  color:var(--accent);
  font-weight:600
}
.history-details p{
  margin:9px 0;
  font-size:var(--step-small)
}
.error-page{
  padding:64px 24px;
  max-width:600px;
  margin:auto
}
.two-column{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px
}
.inline-fields{
  display:flex;
  gap:15px;
  align-items:end
}
.inline-fields .field{
  flex:1
}
.flag{
  color:#8c4a22;
  font-size:var(--step-small)
}
.order-original{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font-size:var(--step-small);
  background:var(--surface);
  padding:16px
}
.image-preview{
  max-width:160px;
  max-height:120px;
  display:block
}
.file-row{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap
}
.footer-help{
  font-size:var(--step-small);
  color:var(--muted);
  margin-top:14px;
  line-height:1.7
}
.quote-selection{
  margin:13px 0
}
.quote-selection .field{
  margin:11px 0
}
.compact-list{
  padding-left:20px;
  font-size:var(--step-body)
}
.quote-table td{
  font-size:var(--step-small)
}
.order-list .panel{
  padding:20px
}
.priority{
  font-size:var(--step-small);
  color:var(--accent);
  margin-bottom:10px
}
.disabled-reason{
  font-size:var(--step-small);
  color:var(--muted);
  margin:11px 0
}
.supplementary-stats a{
  display:flex;
  justify-content:space-between;
  gap:14px;
  padding:7px 0;
  font-size:var(--step-body)
}
.supplementary-stats strong{
  font-variant-numeric:tabular-nums;
  font-weight:600
}
.overdue-summary{
  font-size:var(--step-small);
  color:var(--muted);
  margin-bottom:8px
}
@media(max-width:1280px){
  


.detail-grid{
  grid-template-columns:1fr
}
}
@media(max-width:760px){
.form-grid{
  grid-template-columns:1fr;
  gap:0
}
.notice{
  font-size:var(--step-body);
  padding:14px 16px
}
.two-column{
  grid-template-columns:1fr;
  gap:0
}
.row-actions{
  gap:8px
}
.row-actions button,.row-actions .button{
  font-size:var(--step-small);
  padding:10px 12px;
  white-space:normal
}
.definition{
  grid-template-columns:80px minmax(0,1fr);
  font-size:var(--step-body)
}
.amounts{
  gap:18px;
  padding:16px;
  flex-wrap:wrap
}
.amounts strong{
  font-size:var(--step-lead)
}
.dialog-head{
  padding:18px 20px
}
.dialog-body{
  padding:20px
}
.dialog-foot{
  justify-content:stretch;
  flex-wrap:wrap
}
.dialog-foot button{
  flex:1;
  white-space:normal
}
.toast{
  right:16px;
  bottom:16px;
  font-size:var(--step-body)
}
.inline-fields{
  display:block
}
.filters input,.filters select{
  min-width:0;
  width:100%
}
td,th{
  padding:10px
}
.mobile-cards table,.mobile-cards tbody,.mobile-cards tr,.mobile-cards td{
  display:block;
  width:100%
}
.mobile-cards thead{
  display:none
}
.mobile-cards tr{
  background:var(--surface);
  margin-bottom:10px;
  padding:14px
}
.mobile-cards td{
  border:none;
  padding:4px 0;
  max-width:none;
  overflow-wrap:anywhere
}
.mobile-cards td:before{
  content:attr(data-label);
  display:inline-block;
  min-width:84px;
  color:var(--muted);
  font-size:var(--step-small)
}
.mobile-cards td:first-child:before{
  display:none
}
.mobile-cards td:first-child{
  font-weight:600;
  margin-bottom:6px
}
.quote-selection select{
  width:100%
}
.subrecord{
  padding:15px
}
.subrecord h4{
  flex-wrap:wrap
}
.footer-help{
  font-size:var(--step-small)
}
.import-panel{
  padding:15px
}
.field input[type=file]{
  font-size:var(--step-small);
  padding:9px;
  min-width:0
}
.form-error{
  font-size:var(--step-body)
}
}
@media(prefers-reduced-motion:reduce){
  html{
  scroll-behavior:auto
}
*,*:before,*:after{
  transition:none!important;
  animation:none!important
}
button:active,.button:active{
  transform:none
}
}
/* Structural rules belong to the new layout rather than the retired portal. */
.mobile-only{
  display:none
}
@media(max-width:767px){
  .workspace-menu-toggle{
  position:absolute;
  right:16px;
  top:12px;
  width:auto;
  height:auto;
  min-width:44px;
  font-size:var(--step-small)
}
.mobile-only{
  display:initial
}
}
body{
  color:var(--ink)
}
.link-action{
  font-size:var(--step-body);
  display:inline-flex;
  align-items:center;
  gap:18px;
  min-height:44px
}
.prototype-note{
  font-size:var(--step-small);
  color:var(--muted);
  padding-bottom:30px
}
/* Workbench keeps original role controls and actual state;
   only information presentation changes. */
.breadcrumb{
  color:var(--muted);
  font-size:var(--step-small);
  margin-bottom:10px
}
@media(max-width:767px){
  .desktop-only{
  display:none
}
.link-action{
  font-size:var(--step-body);
  gap:10px
}
.prototype-note{
  font-size:var(--step-small)
}
.workspace-menu-toggle{
  min-height:44px!important
}
}
@media(max-width:359px){
  .link-action{
  font-size:var(--step-small)
}
}
@media(prefers-reduced-motion:reduce){
  html{
  scroll-behavior:auto
}
*,*:before,*:after{
  transition:none!important;
  animation:none!important
}
}
.action-icon{
  flex:none
}
.button .action-icon{
  filter:invert(1)
}
.text-action .action-icon{
  filter:none;
  width:18px
}
.text-action{
  padding:8px 0;
  min-height:44px;
  border:0;
  background:transparent;
  color:var(--accent);
  font-size:var(--step-body);
  justify-content:flex-start;
  border-radius:0
}
.text-action:hover{
  background:transparent;
  color:var(--field-1);
  border:0
}
.index-description{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px 24px;
  padding-top:20px
}
.index-description h3{
  font-size:var(--step-lead);
  margin:0;
  grid-column:1/-1
}
.index-description p{
  font-size:var(--step-body);
  margin:0;
  color:var(--muted)
}
.published-content article{
  padding:22px 0;
}
.supplier-public{
  padding-top:64px;
  padding-bottom:80px
}
.supplier-public h1{
  font-size:var(--step-head)
}
.supplier-public p{
  font-size:var(--step-body);
  line-height:1.8;
  max-width:38em
}
.space-top-16{
  margin-top:16px
}
.space-top-20{
  margin-top:20px
}
.space-top-24{
  margin-top:24px
}
@media(max-width:767px){
  .index-description{
  display:block;
  padding-top:19px
}
.index-description h3{
  font-size:var(--step-lead);
  margin-bottom:12px
}
.index-description p{
  font-size:var(--step-body);
  margin-bottom:10px
}
.supplier-public{
  padding-top:40px;
  padding-bottom:52px
}
.supplier-public h1{
  font-size:var(--step-head)
}
.supplier-public p{
  font-size:var(--step-body)
}
}
/* Policy surfaces use the existing industrial editorial system. */
.legal-footer{
  width:100%;
  margin-top:24px;
  padding-top:20px;
  color:var(--muted);
  font-size:var(--step-small);
  line-height:1.8
}
.legal-footer>div{
  display:flex;
  gap:24px;
  flex-wrap:wrap
}
.legal-footer a{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  text-decoration:underline;
  text-underline-offset:4px
}
.legal-footer p{
  margin:8px 0;
  overflow-wrap:anywhere
}
.registration-consent{
  margin:24px 0 12px;
  padding-top:20px;
  background:var(--surface);
  padding:18px
}
.registration-consent .check{
  align-items:flex-start;
  line-height:1.8
}
.registration-consent input{
  margin-top:5px;
  flex:0 0 auto;
  width:20px;
  height:20px
}
.registration-consent a{
  text-decoration:underline;
  text-underline-offset:3px
}
.registration-consent p{
  color:var(--muted);
  font-size:var(--step-small);
  line-height:1.8;
  margin:12px 0 0
}
.legal-page{
  padding-top:32px;
  padding-bottom:64px;
  max-width:1120px
}
.legal-back{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  color:var(--muted);
  font-size:var(--step-body)
}
.legal-title{
  padding:28px 0 32px;
  background:var(--field-2);
  color:var(--field-2-ink);
  padding-inline:var(--space-block)
}
.legal-title>p{
  color:var(--field-2-ink);
  font-size:var(--step-body)
}
.legal-title h1{
  font-size:var(--step-head);
  line-height:1.3;
  margin:12px 0 20px;
  letter-spacing:-.02em
}
.legal-meta{
  display:flex;
  gap:28px;
  flex-wrap:wrap;
  font-size:var(--step-small);
  color:var(--field-2-ink);
  margin-bottom:0
}
.legal-body{
  display:grid;
  grid-template-columns:240px minmax(0,1fr);
  gap:48px;
  padding-top:32px
}
.legal-body nav{
  align-self:start;
  position:sticky;
  top:24px
}
.legal-body nav a{
  display:block;
  min-height:44px;
  padding:10px 0;
  font-size:var(--step-small);
  color:var(--muted)
}
.legal-body article section{
  scroll-margin-top:30px;
  padding-bottom:28px;
  margin-bottom:26px
}
.legal-body h2{
  font-size:var(--step-lead);
  line-height:1.5;
  margin:0 0 14px
}
.legal-body p{
  font-size:var(--step-body);
  line-height:1.9;
  overflow-wrap:anywhere;
  color:var(--ink)
}
@media(max-width:700px){
  .legal-page{
  padding-top:20px;
  padding-bottom:36px
}
.legal-title{
  padding:20px 0 24px
}
.legal-title h1{
  font-size:var(--step-head)
}
.legal-body{
  grid-template-columns:minmax(0,1fr);
  gap:28px;
  padding-top:24px
}
.legal-body nav{
  position:static
}
.legal-body h2{
  font-size:var(--step-lead)
}
.legal-body p{
  font-size:var(--step-body)
}
.legal-footer{
  font-size:var(--step-small)
}
.legal-footer p{
  font-size:var(--step-small)!important
}
}
.privacy-request-history{
  display:grid;
  gap:20px
}
.panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  margin-bottom:16px
}
.panel-head h2{
  margin:0
}
.privacy-request-card{
  padding-bottom:20px;
  overflow-wrap:anywhere
}
.privacy-request-card header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px
}
.privacy-request-card h3{
  font-size:var(--step-lead)
}
.privacy-request-card p{
  line-height:1.9
}
.privacy-response{
  padding:12px 16px;
  background:var(--surface);
  font-size:var(--step-body)
}
.privacy-review-form{
  margin-top:20px
}
.privacy-request-card small{
  color:var(--muted)
}
/* Shared site container and navigation. */
.wrap{
  width:min(1360px,calc(100% - var(--margin)*2));
  margin-inline:auto
}
.brand{
  display:inline-flex;
  gap:12px;
  align-items:center;
  min-width:0
}
.brand>span{
  display:flex;
  flex-direction:column;
  gap:4px
}
.brand b{
  font-size:22px;
  font-weight:600;
  line-height:1.4
}
.brand small{
  font-size:13px;
  color:var(--muted)
}
.site-header{
  background:var(--paper);
  position:relative;
  z-index:var(--layer-nav)
}













.site-footer{background:var(--soft);padding-block:32px 24px}
/* Business pages: readable data, compact navigation, deliberate action hierarchy. */
.work-header{
  min-height:64px;
  padding:10px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background:var(--surface);
  border-bottom:0

}
.work-header .brand b{
  font-size:20px
}
.work-header .brand img{
  width:32px;
  height:32px
}
.work-header .brand small{
  font-size:13px
}
.account{
  display:flex;
  align-items:center;
  gap:20px;
  font-size:13px
}
.work-body{
  display:grid;
  grid-template-columns:196px minmax(0,1fr);
  min-height:calc(100dvh - 64px);
  background:var(--soft)

}
.sidebar{
  background:var(--surface);
  border-right:0;
  padding:18px 8px;
  min-width:0

}
.sidebar-label{
  padding:0 12px 16px;
  font-size:13px;
  color:var(--muted)
}
.sidebar a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  min-height:44px;
  font-size:14px;
  margin-block:2px;
  border-left:3px solid transparent

}
.sidebar a:hover{
  background:var(--soft)
}
.sidebar a.active{
  background:var(--field-2);
  color:var(--ink);
  border-left-color:transparent;
  font-weight:600
}
.nav-group{
  margin-bottom:10px
}
.nav-group h2{
  font-size:13px;
  font-weight:400;
  color:var(--muted);
  padding:0 12px;
  margin:12px 0 8px;
  letter-spacing:0
}
.sidebar-note{
  padding:16px 12px 0;
  font-size:13px;
  color:var(--muted);
  line-height:1.8
}
.work-main{
  padding:22px 24px 36px;
  min-width:0;
  max-width:none;
  width:calc(100% - 8px);
  margin:0 8px 8px 0;
  background:var(--ground);
  border:1px solid var(--line-soft);
  border-radius:16px

}
.page-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px
}
.page-heading h1{
  overflow-wrap:anywhere;
  font-size:25px;
  line-height:1.4;
  letter-spacing:-.02em;
  margin:0

}
.page-heading>div{min-width:0}
.page-heading p{
  font-size:var(--step-body);
  line-height:1.65;
  color:var(--muted);
  margin:6px 0 0;
  max-width:65ch

}
.panel{
  background:var(--ground);
  border:0;
  padding:22px 24px;
  margin-bottom:14px;
  min-width:0;
  border-radius:var(--radius)

}
.panel h2,.panel-head h2{
  font-size:var(--step-lead);
  line-height:1.5;
  letter-spacing:0;
  margin:0
}
.panel>h2{
  margin-bottom:16px
}
.panel-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
  margin-bottom:14px
}
.panel-head>a{
  font-size:14px;
  color:var(--accent)
}
.panel-head h3{
  margin:0
}
.panel-head>.muted{
  font-size:13px
}
.stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:16px 0
}
.stat{
  display:flex;
  flex-direction:row;
  gap:6px;
  background:var(--surface);
  padding:14px 16px;
  min-width:0;
  align-items:center;
  justify-content:space-between
}
.stat span{
  font-size:var(--step-small);
  color:var(--muted)
}
.stat strong{
  font-size:var(--step-head);
  font-weight:600;
  line-height:1.2;
  font-variant-numeric:tabular-nums

}
.dashboard-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:14px;
  align-items:start;
  margin-bottom:14px
}
.dashboard-grid .panel{
  margin:0
}
.dashboard-reminders p{
  font-size:var(--step-body)
}
.recent-events a{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  padding:12px 0;
  font-size:var(--step-body);
  line-height:1.7
}
.recent-events time{
  color:var(--muted);
  font-size:var(--step-small);
  white-space:nowrap
}
.task-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:14px 0;
  min-width:0

}
.task-row>div{
  min-width:0
}
.task-row h3{
  font-size:var(--step-body);
  line-height:1.6;
  margin:0 0 4px;
  overflow-wrap:anywhere

}
.task-row p,.task-next{
  font-size:var(--step-small);
  line-height:1.8;
  color:var(--muted);
  margin:0
}
.task-row .button{
  background:transparent;
  color:var(--accent);
  border-color:transparent;
  min-height:44px
}
.task-row .button:hover{
  background:var(--surface)
}
.dashboard-orders td{
  padding:14px
}
.dashboard-orders td small{
  display:block;
  margin-top:6px
}
.workspace-service-note{
  font-size:var(--step-small);
  color:var(--muted);
  margin-top:20px;
  line-height:1.8
}
.draft-items{
  margin:20px 0
}
.draft-item{
  display:grid;
  grid-template-columns:minmax(180px,2fr) minmax(150px,1.5fr) minmax(90px,.7fr) minmax(75px,.6fr) auto;
  gap:14px;
  background:var(--surface);
  padding:20px;
  margin-bottom:14px
}
.draft-item .field{
  margin:0
}
.draft-item details{
  grid-column:1/-1;
  font-size:var(--step-body)
}
.draft-item details>.form-grid{
  margin-top:18px
}
.draft-item button{
  align-self:end
}
.draft-item summary{
  cursor:pointer;
  min-height:44px;
  padding-top:12px
}
.status-line{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap
}
.work-main input,.work-main textarea,.work-main select{
  border-radius:var(--radius)
}
.work-main th{
  font-size:var(--step-small)
}
.work-main td{
  overflow-wrap:anywhere;
  font-size:var(--step-body);
  line-height:1.7
}
.work-main td small{
  font-size:var(--step-small)
}
.work-main .empty{
  background:var(--surface);
  padding:26px 20px;
  font-size:var(--step-body);
  text-align:left
}
.work-main .notice{
  font-size:var(--step-body);
  line-height:1.8
}
.auth-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  width:min(1360px,calc(100% - var(--margin)*2));
  margin:24px auto 40px;
  align-items:start;
  background:var(--ground)
}
.auth-aside{
  background:var(--field-1);
  color:var(--field-1-ink);
  padding:36px;
  position:relative;
  overflow:hidden
}
.auth-kicker{
  font-size:var(--step-body);
  margin-bottom:24px
}
.auth-aside h1{
  font-size:var(--step-head);
  line-height:1.25;
  font-weight:600;
  letter-spacing:-.02em;
  max-width:11em
}
.auth-aside p{
  font-size:var(--step-body);
  max-width:38ch;
  line-height:1.9
}
.auth-aside .footer-help{
  font-size:var(--step-small);
  margin-top:32px
}
.auth-main{
  padding:32px 36px;
  max-width:800px;
  align-self:start;
  width:100%
}
.auth-main h2{
  font-size:var(--step-head);
  margin-bottom:12px
}
.auth-main>p{
  font-size:var(--step-body);
  line-height:1.8;
  margin-bottom:26px
}
.auth-main form>a{
  display:inline-flex;
  min-height:44px;
  align-items:center;
  margin-left:20px;
  font-size:var(--step-body)
}
.auth-main form>.button,.auth-main form>button{
  min-width:150px
}
.auth-main .field{
  font-size:var(--step-body)
}
.auth-main .field small{
  font-size:var(--step-small)
}
.auth-main .form-grid{
  gap:20px
}
.auth-main .auth-methods{
  gap:10px
}
.auth-main .legal-footer{
  font-size:var(--step-small)
}



@media(max-width:1250px){
.brand b{
  font-size:var(--step-body)
}
.work-body{
  grid-template-columns:190px minmax(0,1fr)
}
.work-main{
  padding:24px
}
.dashboard-grid{
  grid-template-columns:minmax(0,1fr) 280px
}
.draft-item{
  grid-template-columns:1.5fr 1fr .7fr .6fr
}
.draft-item>button{
  grid-column:4;
  justify-self:end
}
}
@media(max-width:1100px){
.dashboard-grid{
  grid-template-columns:1fr
}
.auth-main{
  padding:36px 28px
}
.auth-main .form-grid{
  grid-template-columns:1fr
}
.auth-aside{
  padding-top:32px
}
}
@media(max-width:767px){
.brand{
  gap:10px
}
.brand b{
  font-size:var(--step-body)
}
.brand img{
  width:30px;
  height:30px
}
.brand small{
  font-size:var(--step-small)
}
.work-header{
  display:block;
  position:sticky;
  top:0;
  z-index:var(--layer-nav);
  padding:12px 16px;
  min-height:0
}
.work-header .brand{
  max-width:calc(100% - max(64px,3em))
}
.work-header .brand b{
  font-size:var(--step-body)
}
.account{
  margin-top:10px;
  gap:10px 14px;
  flex-wrap:wrap;
  font-size:var(--step-small)
}
.account button{
  min-height:44px
}
.work-body{
  display:block
}
.sidebar{
  display:none;
  padding:16px
}
.sidebar.is-open{
  display:block
}
.sidebar-label,.sidebar-note{
  display:none
}
.work-main{
  padding:18px 16px 28px
}
.page-heading{
  flex-wrap:wrap;
  align-items:start;
  gap:14px;
  margin-bottom:20px
}
.page-heading h1{
  overflow-wrap:anywhere;
  font-size:var(--step-page)
}
.page-heading>div{min-width:0}
.page-heading p{
  font-size:var(--step-body)
}
.stats{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px
}
.stat{
  padding:14px;
  gap:8px
}
.stat strong{
  font-size:var(--step-head)
}
.panel{
  padding:18px 16px
}
.dashboard-grid{
  grid-template-columns:1fr;
  gap:14px
}
.dashboard-reminders{
  display:block
}
.recent-events a{
  display:block
}
.recent-events time{
  display:block;
  margin-bottom:4px
}
.task-row{
  align-items:start;
  flex-wrap:wrap;
  gap:12px;
  padding:14px 0
}
.task-row h3{
  font-size:var(--step-body)
}
.task-row .button{
  padding-left:0
}
.draft-item{
  grid-template-columns:1fr 1fr;
  padding:18px 16px;
  gap:16px
}
.draft-item .field:first-child,.draft-item .field:nth-child(2){
  grid-column:1/-1
}
.draft-item>button{
  grid-column:1/-1;
  justify-self:end
}
.draft-item details{
  grid-column:1/-1
}
.auth-layout{
  grid-template-columns:1fr;
  min-height:0
}
.auth-aside{
  padding:32px 20px 28px
}
.auth-aside h1{
  font-size:var(--step-head);
  margin-bottom:18px
}
.auth-kicker{
  margin-bottom:20px
}
.auth-aside p{
  font-size:var(--step-body)
}
.auth-aside .footer-help{
  margin-top:22px
}
.auth-main{
  padding:32px 20px 44px
}
.auth-main .form-grid{
  grid-template-columns:1fr
}
.auth-main form>a{
  margin-left:12px
}
.mobile-only{
  display:initial
}
}
@media(prefers-reduced-motion:reduce){
html{
  scroll-behavior:auto
}
button,.button,a{
  transition:none
}
}

/* Existing order content, with one compact section index. */
.order-section-index{display:flex;flex-wrap:wrap;gap:6px;padding:0 0 16px;margin-bottom:18px}.order-section-index button{min-height:44px;padding:8px 12px;background:var(--surface);border-color:transparent;color:var(--ink);font-size:var(--step-small)}.order-section-index button:hover{background:var(--field-2);color:var(--field-2-ink)}[id^="order-section-"]{scroll-margin-top:20px}

/* BEGIN official Taste V2 landing scope. One motif: bearing/gear concentric geometry. */
.purchase-showcase,.showcase-header,.showcase-footer{
  --showcase-ground:#ffffff;
  --showcase-surface:#f4f6f8;
  --showcase-field-1:#17212b;
  --showcase-field-1-ink:#ffffff;
  --showcase-field-2:#eef1f4;
  --showcase-field-2-ink:#17212b;
  --showcase-ink:#17212b;
  --showcase-muted:#55606c;
  --showcase-accent:#123a6b;
  --showcase-inverse:#ffffff;
  --showcase-small:14px;
  --showcase-body:16px;
  --showcase-lead:20px;
  --showcase-head:clamp(26px,2.4vw,36px);
  --showcase-display:clamp(56px,6.6vw,96px);
  --showcase-gutter:clamp(16px,2.4vw,32px);
  --showcase-space:clamp(36px,3.4vw,56px);
  --showcase-ease:cubic-bezier(.2,.7,.2,1);
  background:var(--showcase-ground);
  color:var(--showcase-ink);
  font-family:"Noto Sans SC","Microsoft YaHei",sans-serif;
  font-size:var(--showcase-body);
  line-height:1.65;
}
.showcase-wrap{width:min(1280px,calc(100% - var(--showcase-gutter)*2));margin-inline:auto}
.purchase-showcase :is(h1,h2,h3,p,figure,dl,dd,ol){margin:0}
.purchase-showcase :is(section,div,article,figure){min-width:0}
.purchase-showcase :is(h1,h2,h3){font-weight:600;letter-spacing:-.025em;text-wrap:balance;color:var(--showcase-ink)}
.purchase-showcase h1{font-size:var(--showcase-display);line-height:1.15}
.purchase-showcase h2{font-size:var(--showcase-head);line-height:1.35}
.purchase-showcase h3{font-size:var(--showcase-lead);line-height:1.5}
.purchase-showcase p{max-width:100%;color:var(--showcase-ink)}
.purchase-showcase figure{overflow:hidden}
.purchase-showcase .showcase-generated-figure{display:grid;gap:8px;overflow:visible}
.purchase-showcase .showcase-generated-figure>div{overflow:hidden}
.purchase-showcase .showcase-generated-caption{font-size:14px;line-height:1.6;color:var(--showcase-muted);margin:0;overflow-wrap:anywhere}
.purchase-showcase img{display:block;width:100%;height:100%;object-fit:cover}
.purchase-showcase [id]{scroll-margin-top:24px}
.purchase-showcase a,.showcase-header a,.showcase-footer a{transition:transform .18s var(--showcase-ease),opacity .18s}
.purchase-showcase a:hover,.showcase-header a:hover,.showcase-footer a:hover{text-decoration:underline;text-underline-offset:.22em}
.purchase-showcase :is(a,button):active,.showcase-header :is(a,button):active{transform:translateY(2px)}
.purchase-showcase :is(a,button,[tabindex]):focus-visible,.showcase-header :is(a,button):focus-visible,.showcase-footer a:focus-visible{outline:3px solid var(--showcase-accent);outline-offset:4px}
.showcase-masthead{min-height:68px;display:flex;align-items:center;gap:28px}
.showcase-name{min-width:0;font-size:var(--showcase-lead);font-weight:600;letter-spacing:-.025em;overflow-wrap:anywhere}
.showcase-nav{display:flex;align-items:center;gap:24px;margin-left:auto}
.showcase-nav a,.showcase-account{font-size:var(--showcase-small);white-space:nowrap;display:inline-flex;align-items:center;min-height:44px;flex-shrink:0}
.showcase-menu-toggle{display:none;flex-shrink:0;min-width:44px;min-height:44px;padding:8px;border:0;border-radius:0;background:var(--showcase-field-1);color:var(--showcase-field-1-ink);font-size:var(--showcase-small)}
.showcase-menu{position:absolute;inset-inline:0;top:100%;background:var(--showcase-field-2);color:var(--showcase-field-2-ink);max-height:calc(100dvh - 76px);overflow:auto}
.showcase-menu[hidden]{display:none}
.showcase-menu-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 24px;padding-block:18px}
.showcase-menu a{display:flex;align-items:center;min-height:44px;font-size:var(--showcase-small)}
/* Hero: bounded motif field on the right, copy on the left. No viewport cropping. */
.showcase-hero{width:min(1280px,calc(100% - var(--showcase-gutter)*2));margin-inline:auto;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(24px,3vw,48px);align-items:center;padding-block:clamp(24px,3vw,44px) clamp(28px,3.4vw,52px)}
.showcase-hero-copy{display:grid;gap:18px;align-content:center}
.showcase-hero-side{display:grid;width:100%;gap:12px;align-content:center}
.showcase-hero-image{height:clamp(220px,26vw,340px);background:var(--showcase-surface)}
.showcase-hero-image img{object-position:50% 52%}
.purchase-showcase .showcase-lead{font-size:var(--showcase-lead);line-height:1.6;max-width:23em;color:var(--showcase-muted)}
.showcase-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.showcase-action{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-width:0;max-width:100%;min-height:48px;padding:12px 22px;background:var(--showcase-accent);color:var(--showcase-inverse);border-radius:0;font-size:var(--showcase-body);font-weight:500;white-space:normal;overflow-wrap:anywhere}
.purchase-showcase .showcase-action:hover{background:#113ca3;text-decoration:none}
.showcase-action span{display:inline-block;transition:transform .18s var(--showcase-ease)}
.showcase-action:hover span{transform:translate(2px,-2px)}
.showcase-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--showcase-accent);font-size:var(--showcase-body);font-weight:500}
/* The one motif: concentric bearing rings, flat filled, bounded inside its own field. */
.showcase-motif{position:relative;background:var(--showcase-field-1);color:var(--showcase-field-1-ink);min-height:0;display:grid;grid-template-columns:64px minmax(0,1fr);align-items:center;gap:18px;padding:18px 24px;overflow:hidden}
.showcase-motif-rings{position:relative;width:64px;aspect-ratio:1;margin-inline:auto}
.showcase-motif-rings span{position:absolute;inset:0;border-radius:50%;background:var(--showcase-field-2)}
.showcase-motif-rings span:nth-child(1){inset:0;background:#0b3aa8}
.showcase-motif-rings span:nth-child(2){inset:18%;background:#1a52c4}
.showcase-motif-rings span:nth-child(3){inset:36%;background:#eef1f4}
.showcase-motif-rings span:nth-child(4){inset:54%;background:var(--showcase-accent)}
.purchase-showcase .showcase-motif-caption{font-size:var(--showcase-small);line-height:1.7;color:var(--showcase-field-1-ink);text-align:left}
.showcase-motif-caption strong{color:var(--showcase-field-1-ink);font-weight:600}
.showcase-section{padding-block:var(--showcase-space)}
.showcase-section-heading{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:36px;margin-bottom:32px}
.showcase-section-heading>p{max-width:35em;color:var(--showcase-muted)}
.showcase-services{background:var(--showcase-surface)}
.showcase-service-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}
.showcase-service-list{display:grid;gap:24px}
.showcase-service-list article{display:grid;grid-template-columns:6em minmax(0,1fr);gap:24px;align-items:start}
.showcase-service-list h3{font-size:var(--showcase-body)}
.showcase-service-image{height:clamp(260px,25vw,360px);background:#d0dcd5}
.showcase-service-image img{object-position:50% 53%}
.showcase-ai{background:var(--showcase-ground)}
.showcase-ai-intro{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(40px,6vw,88px);align-items:center}
.showcase-ai-image{height:clamp(220px,22vw,320px);background:var(--showcase-surface)}
.purchase-showcase .showcase-ai-description{margin-block:24px;max-width:30em}
.showcase-preparation{margin-top:32px;padding:24px;background:var(--showcase-surface)}
.showcase-guide{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:32px;margin-top:20px;align-items:start}
.showcase-tabs{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.showcase-tabs[hidden]{display:none}
.showcase-tabs button{display:inline-flex;justify-content:flex-start;min-height:48px;padding:10px 18px;background:transparent;border:0;border-radius:0;color:var(--showcase-muted);font-size:var(--showcase-body);white-space:normal;text-align:left;transition:transform .18s var(--showcase-ease)}
.showcase-tabs button:hover{background:#eef1f4;color:var(--showcase-ink)}
.showcase-tabs button[aria-selected="true"]{background:var(--showcase-ink);color:var(--showcase-inverse)}
.showcase-guide-content{grid-column:2}
.showcase-tabs[hidden]+.showcase-guide-content{grid-column:1 / -1}
.showcase-guide-panel[hidden]{display:none}
.showcase-guide-panel{margin-bottom:20px}
.showcase-guide-panel:last-child{margin-bottom:0}
.showcase-guide-panel ul{margin:12px 0 0;padding-left:1.15em;color:var(--showcase-ink)}
.showcase-guide-panel li+li{margin-top:6px}
.showcase-process{--showcase-ink:#ffffff;--showcase-muted:#c3ccd6;background:#17212b}
.purchase-showcase .showcase-process :is(h2,h3){color:var(--showcase-ink)}
.purchase-showcase .showcase-process p,.purchase-showcase .showcase-process li{color:var(--showcase-muted)}
.showcase-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;padding:0;list-style:none}
.showcase-flow h3{margin-bottom:12px}
.showcase-culture{background:var(--showcase-surface)}
.showcase-culture-layout{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,4vw,56px);align-items:center}
.showcase-culture-image{height:clamp(280px,27vw,390px);background:#d0dcd5}
.showcase-culture-image img{object-position:48% 50%}
.showcase-principles{display:grid;gap:20px;padding-top:28px}
.showcase-principles>div{display:grid;grid-template-columns:5em minmax(0,1fr);gap:20px}
.showcase-principles dt{font-weight:600}
.showcase-principles dd{color:var(--showcase-ink)}
.purchase-showcase .showcase-boundary{font-size:var(--showcase-small);margin-top:28px;max-width:32em}
.showcase-records{background:var(--showcase-ground)}
.showcase-events article{display:grid;grid-template-columns:13em minmax(0,1fr) auto;gap:24px;align-items:center;padding-block:16px}
.showcase-events time{font-size:var(--showcase-small);color:var(--showcase-muted)}
.showcase-events h3{font-size:var(--showcase-body);overflow-wrap:anywhere}
.showcase-empty{font-size:var(--showcase-small)}
.showcase-published:empty{display:none}
.showcase-published:not(:empty){margin-block:0 32px;display:grid;grid-template-columns:1fr 2fr;gap:24px 40px}
.showcase-published>h2{font-size:var(--showcase-lead)}
.showcase-published>article{grid-column:2;min-width:0;overflow-wrap:anywhere}
.showcase-published>article:nth-child(2){grid-row:1}
.showcase-published h3{margin-bottom:10px}
.showcase-published .content-type-label{font-size:var(--showcase-small);color:var(--showcase-muted);margin-top:10px}
.showcase-close{background:var(--showcase-surface);padding-block:40px}
.showcase-close>.showcase-wrap{display:flex;align-items:center;justify-content:space-between;gap:32px}
.purchase-showcase .showcase-close h2{color:var(--showcase-ink)}
.purchase-showcase .showcase-close p{color:var(--showcase-muted);margin-top:14px}
.showcase-close .showcase-action{background:var(--showcase-accent);color:var(--showcase-inverse)}
.purchase-showcase .showcase-close .showcase-action:hover{background:var(--showcase-field-1)}
.showcase-close .showcase-link{color:var(--showcase-accent)}
.showcase-close :is(a,button):focus-visible{outline-color:var(--showcase-accent)}
.showcase-footer{border:0;padding-block:32px}
.showcase-footer-row{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.showcase-footer-row nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px 24px;max-width:820px}
.showcase-footer-row nav a{font-size:var(--showcase-small);min-height:44px;display:inline-flex;align-items:center}
.showcase-footer .legal-footer{border:0;margin-top:20px;padding:0;color:var(--showcase-muted);font-size:var(--showcase-small);display:flex;flex-wrap:wrap;gap:8px 20px}
.showcase-footer .legal-footer a{font-size:var(--showcase-small)}
@keyframes showcase-arrive{from{transform:translateY(12px)}to{transform:translateY(0)}}
.showcase-enter{animation:showcase-arrive .5s var(--showcase-ease) both;animation-delay:var(--reveal-delay,0ms)}
@media(min-width:768px) and (max-width:1100px){
  .showcase-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .showcase-hero-copy{gap:16px}
  .purchase-showcase{--showcase-display:52px;--showcase-lead:22px}
  .showcase-hero-image{height:clamp(200px,26vw,300px)}
  .showcase-hero-copy .showcase-actions{gap:10px}
  .showcase-service-list{gap:20px}
  .showcase-service-list article{display:block}
  .showcase-service-list h3{margin-bottom:8px}
  .showcase-service-layout,.showcase-ai-intro,.showcase-culture-layout{gap:28px}
  .showcase-flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 40px}
  .showcase-principles>div{display:block}
  .showcase-principles dd{margin-top:8px}
}
@media(max-width:1100px){
  .showcase-nav{display:none}
  .showcase-account{margin-left:auto}
  .showcase-menu-toggle{display:inline-flex}
  .showcase-footer-row{display:block}
  .showcase-footer-row nav{justify-content:flex-start;margin-top:16px;max-width:none}
}
@media(max-width:767px){
  .purchase-showcase,.showcase-header,.showcase-footer{--showcase-small:16px;--showcase-body:16px;--showcase-lead:20px;--showcase-head:26px;--showcase-display:36px;--showcase-space:20px;--showcase-gutter:16px;line-height:1.6}
  .showcase-masthead{min-height:64px;gap:12px}
  .showcase-masthead .showcase-name{font-size:var(--showcase-body)}
  .showcase-menu-toggle{min-width:44px;min-height:44px;padding:8px}
  .showcase-menu{max-height:calc(100dvh - 64px)}
  .showcase-menu-links{grid-template-columns:1fr}
  .showcase-hero{display:flex;flex-direction:column;gap:16px}
  .showcase-hero-copy{order:-1;align-self:stretch;width:100%;gap:12px}
  .purchase-showcase .showcase-lead{font-size:var(--showcase-body);line-height:1.6}
  .showcase-hero-side{gap:10px}
  .showcase-hero-image{position:relative;width:100%;height:clamp(150px,46vw,210px);background:var(--showcase-surface)}
  .showcase-hero-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 56%}
  .showcase-hero-copy .showcase-actions{gap:8px 18px}
  .showcase-action{min-height:52px;padding:12px 20px;gap:12px}
  .showcase-section-heading{display:block;margin-bottom:16px}
  .showcase-section-heading>p{margin-top:8px}
  .showcase-service-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
  .showcase-service-list{display:block;margin-bottom:0}
  .showcase-service-list article{display:grid;grid-template-columns:5.5em minmax(0,1fr);gap:12px}.showcase-service-list article+article{margin-top:20px}
  .showcase-service-list h3{font-size:var(--showcase-body);margin-bottom:0}
  .showcase-service-image{display:block;height:clamp(150px,42vw,210px);margin-top:16px}
  .showcase-ai-intro{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
  .showcase-ai-image{display:block;height:clamp(140px,38vw,190px);margin-top:16px}
  .purchase-showcase .showcase-ai-description{margin-block:12px}
  .showcase-preparation{margin-top:20px;padding:16px}
  .showcase-preparation>h3{font-size:var(--showcase-body)}
  .showcase-guide{display:block;margin-top:16px}
  .showcase-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin-bottom:16px}
  .showcase-tabs button{font-size:var(--showcase-small);padding:10px 4px;justify-content:center}
  .showcase-guide-panel h3{font-size:var(--showcase-lead)}
  .showcase-flow{grid-template-columns:1fr;gap:20px}.showcase-flow li{display:grid;grid-template-columns:5.5em minmax(0,1fr);gap:12px}
  .showcase-flow h3{font-size:var(--showcase-body);margin-bottom:0}
  .showcase-culture-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
  .showcase-culture-image{display:block;height:clamp(150px,42vw,210px);margin-top:16px}
  .showcase-motif{min-height:0;grid-template-columns:48px minmax(0,1fr);padding:16px;gap:12px}
  .showcase-motif-rings{width:48px}
  .showcase-motif-caption{text-align:left}
  .showcase-principles{gap:16px;padding-top:12px}
  .showcase-principles>div{grid-template-columns:4.5em minmax(0,1fr);gap:12px}
  .showcase-principles dd{margin-top:0}
  .showcase-events article{display:block;padding-block:16px}
  .showcase-events h3{margin-top:6px}
  .showcase-published:not(:empty){display:block;margin-bottom:24px}
  .showcase-published>h2{margin-bottom:20px}
  .showcase-published>article+article{margin-top:24px}
  .showcase-close{padding-block:20px}
  .showcase-close>.showcase-wrap{display:block}
  .showcase-close .showcase-actions{margin-top:16px;gap:8px 16px}
  .showcase-footer-row .showcase-name{font-size:var(--showcase-body)}
  .showcase-footer{padding-block:20px}.showcase-footer-row nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}
}
@media(max-width:380px){
  .showcase-masthead{gap:12px}
  .showcase-account{display:none}
  .showcase-menu-toggle{margin-left:auto}
}
@media(prefers-reduced-motion:no-preference){@supports(animation-timeline:view()){.showcase-hero-image img{animation:showcase-photo-drift linear both;animation-timeline:view();animation-range:entry 0% exit 100%}@keyframes showcase-photo-drift{from{transform:scale(1.035)}to{transform:scale(1)}}}}
@media(prefers-reduced-motion:reduce){
  .purchase-showcase *,.showcase-header *,.showcase-footer *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
/* END official Taste V2 landing scope. */

/* Chinese native controls: V12 */
/* Native input remains the focusable, clickable file control and the FormData source. */
.form-locale-file{position:relative;display:flex;align-items:center;gap:12px;min-height:46px;width:100%;max-width:100%;padding:0;background:#fff;border:1px solid #c3ccd6;border-radius:2px;overflow:hidden}
.form-locale-file-action{flex:none;align-self:stretch;display:flex;align-items:center;padding:10px 14px;background:#e8eeea;color:#15231e;font-size:16px}
.form-locale-file-status{min-width:0;padding:8px 12px 8px 0;overflow-wrap:anywhere;color:#4c5a52;font-size:14px;line-height:1.5}
.form-locale-file input.form-locale-file-native{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer}
.form-locale-file:focus-within{outline:3px solid #086449;outline-offset:3px}
.form-locale-file.is-disabled{opacity:.6}
.form-locale-file.is-disabled input{cursor:not-allowed}
.form-locale-error{display:block;margin:6px 0 0;color:#a12d25;font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.form-locale-date-hint{display:block;margin-top:5px;color:#53605a;font-size:14px;line-height:1.5}
@media(forced-colors:active){.form-locale-file:focus-within{outline:3px solid Highlight}.form-locale-file-action{border-inline-end:1px solid ButtonText}.form-locale-error{color:CanvasText}}

/* Mobile business pages share a compact content rail; scroll wide data inside its own region. */
@media(max-width:767px){
  .work-header{min-height:0;padding:10px 16px;gap:12px}
  .work-header .account{margin-top:6px;gap:8px 12px}
  .work-body{min-height:0}
  .work-main{padding:18px 16px 24px}
  .page-heading{gap:12px;margin-bottom:16px}
  .panel{padding:16px;margin-bottom:12px}
  .panel-head{flex-wrap:wrap;gap:8px 12px}
  .panel-head>*{min-width:0;max-width:100%}
  .stat{padding:12px;gap:4px}
  .work-main .empty{padding:20px 16px}
  .work-main :is(.row-actions,.table-wrap,.task-row,.detail-grid,.two-column,.draft-items){min-width:0;max-width:100%}
  .work-main :is(.row-actions,.panel-head)>:is(button,.button){white-space:normal;text-align:left;overflow-wrap:anywhere;min-height:44px}
  .table-wrap{overscroll-behavior-inline:contain}
  .task-row p,.work-main .file-row{overflow-wrap:anywhere}
  .auth-layout{width:calc(100% - 32px);margin:16px auto 24px}
  .auth-aside{padding:24px 20px}
  .auth-main{padding:24px 20px}
  .auth-main>p{margin-bottom:20px}
  .auth-main .form-grid{gap:12px}
  .supplier-public{padding-block:28px 36px}
  .supplier-public h1{font-size:30px}
}

/* Business components: one shared shell, list, form-step and record-strip pattern for all 37 routes. */
.work-context{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
  font-size:var(--step-small);
  color:var(--muted)
}
.work-context-role{
  background:var(--field-2);
  color:var(--field-2-ink);
  padding:4px 10px
}
.work-context-page{
  color:var(--ink);
  font-weight:600
}
.list-toolbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:10px 16px;
  margin-bottom:12px
}
.list-toolbar .filters{
  flex:1 1 320px;
  min-width:0
}
.list-toolbar .search-status{
  margin:0;
  white-space:nowrap
}
.list-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:16px;
  padding:0 0 10px;
  border-bottom:1px solid var(--line-soft);
  font-size:var(--step-small);
  color:var(--muted)
}
.list-head span:last-child{
  text-align:right
}
.step-no{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  margin-right:10px;
  background:var(--field-1);
  color:var(--field-1-ink);
  font-size:var(--step-small);
  font-weight:600;
  vertical-align:middle
}
.record-strip{
  display:block;
  background:var(--field-1);
  color:var(--field-1-ink);
  padding:16px 20px;
  margin-bottom:16px
}
.record-strip-main{
  display:grid;
  gap:4px;
  min-width:0
}
.record-strip-label{
  font-size:var(--step-small);
  color:var(--field-2)
}
.record-strip-main strong{
  font-size:var(--step-lead);
  line-height:1.5;
  overflow-wrap:anywhere
}
.record-strip-main .flag{
  color:var(--field-2)
}
.auth-submit{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px 20px
}
.auth-submit>a{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  font-size:var(--step-body)
}
@media(max-width:1100px){
  .work-header{position:sticky;top:0;z-index:var(--layer-nav)}
  .work-header .workspace-menu-toggle{display:inline-flex;flex:none;padding:8px 12px;min-width:44px;justify-content:center}
  .work-body{display:block;min-height:calc(100dvh - 74px)}
  .work-body .sidebar{display:none}
  .work-body .sidebar.is-open{
    display:block;position:fixed;inset:var(--workspace-menu-top,74px) 0 0;
    z-index:calc(var(--layer-nav) - 1);overflow-y:auto;overscroll-behavior:contain;
    padding:16px 20px 24px;border-top:1px solid var(--line-soft)
  }
  .work-body .sidebar.is-open .sidebar-label{display:block;padding:0 12px 8px}
  .work-body .sidebar.is-open a{min-height:44px}
  body.menu-open:has(.work-header){overflow:hidden}
  .work-main{width:calc(100% - 16px);margin:0 8px 8px}
  .work-main .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .work-main .stat:nth-child(2n){border-inline-end:0}
  .work-main .stat:nth-child(n+3){border-top:1px solid var(--line-soft)}
  .work-main .stat{flex-direction:column;align-items:stretch;gap:6px}
  .work-main .stat strong{min-width:0;text-align:right;overflow-wrap:anywhere}
}
@media(max-width:767px){
  .work-main{width:100%;margin:0;border:0;border-radius:0}
  .work-main .panel{
    padding:16px 14px
  }
  .work-header .workspace-menu-toggle{padding:8px 12px}
}
@media(max-width:767px){
  .work-context{
    margin-bottom:12px
  }
  .list-head{
    display:none
  }
  .list-toolbar{
    align-items:stretch
  }
  .list-toolbar .search-status{
    white-space:normal
  }
  .record-strip{
    padding:14px 16px
  }
  .auth-submit{
    gap:10px 16px
  }
  .auth-submit>a{
    margin-left:0
  }
}
/* Multi-question editing stays readable without widening the dialog on phones. */
form[data-action^="question-batch-"] fieldset{min-width:0;border:1px solid var(--line,#d4dce0);border-radius:12px;padding:16px;margin:0 0 16px}
form[data-action^="question-batch-"] legend{max-width:100%;font-weight:700;overflow-wrap:anywhere}
form[data-action^="question-batch-"] p,form[data-action^="question-batch-"] .check span{overflow-wrap:anywhere}
form[data-action^="question-batch-"] .field{margin-top:12px}
@media(max-width:600px){form[data-action^="question-batch-"] fieldset{padding:12px}form[data-action^="question-batch-"] .check{align-items:flex-start;min-height:44px}form[data-action^="question-batch-"] .dialog-foot{flex-direction:column}form[data-action^="question-batch-"] .dialog-foot button{width:100%;min-height:44px}}

/* Demand recovery remains a form state, with no additional nested panel. */
.demand-fields{border:0;padding:0;margin:0;min-width:0}
[data-demand-recovery] p{margin:0 0 10px}
[data-demand-recovery] p:last-child{margin-bottom:0}
[data-demand-recovery] li,[data-demand-pending-files] li{overflow-wrap:anywhere}
[data-demand-pending-files]{padding-left:20px}
[data-demand-pending-files] li{margin-bottom:8px}

/* Saving is temporarily unavailable, while its label and evidence remain readable. */
#dialog .dialog-foot button:disabled{opacity:1;color:var(--muted);background:var(--ground);border-color:var(--line)}
#dialog .operation-status,#dialog .platform-action-status{font-size:16px;line-height:1.65;margin:16px 0;color:var(--ink);overflow-wrap:anywhere}
#dialog .operation-status:empty,#dialog .platform-action-status:empty{display:none}
#dialog .form-error:focus{outline:2px solid var(--accent);outline-offset:4px}

/* Shared route states retain their heading, navigation and a useful next step. */
.page-feedback{max-width:760px;padding:28px 24px;background:var(--surface,#fff);border:1px solid var(--line);overflow-wrap:anywhere}
.page-feedback h1{font-size:clamp(22px,3vw,28px);line-height:1.35;margin:0 0 12px}
.page-feedback h2{font-size:18px;line-height:1.5;margin:0 0 8px}
.page-feedback p{font-size:16px;line-height:1.7;margin:0 0 20px;color:var(--muted)}
.page-feedback-inline{max-width:none;padding:14px 18px;margin-bottom:20px}
.page-feedback-inline p{margin-bottom:0;font-size:14px}
.page-feedback-inline .feedback-lines{display:none}
.feedback-lines{display:grid;gap:12px;max-width:560px;margin-top:24px}
.feedback-lines span{display:block;background:#e9edf0;height:16px;width:100%}
.feedback-lines span:nth-child(2){width:82%}.feedback-lines span:nth-child(3){width:62%}
.route-state-page{padding-block:32px;min-height:55vh}
.route-state-page .page-feedback{margin-inline:auto}
.work-main :is(h1,h2,h3,h4,p,dd,dt,li,.breadcrumb,.subrecord,.task-row>div){overflow-wrap:anywhere;min-width:0}
.work-main .definition{min-width:0}.work-main .definition dd{min-width:0}
.work-main .row-actions{flex-wrap:wrap}
@media(max-width:767px){.page-feedback{padding:20px 16px}.page-feedback-inline{padding:12px 14px}.page-feedback .row-actions>*{min-height:44px}.route-state-page{padding-block:20px}}
.work-header .account-role{min-width:0;max-width:340px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
@media(max-width:600px){.work-main .definition{grid-template-columns:minmax(0,1fr);gap:6px}.work-main .definition dt:not(:first-child){margin-top:10px}.work-header .account-role{max-width:min(100%,340px)}}
@media(min-width:1101px){.work-body>.sidebar{position:sticky;align-self:start;top:0;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain}}


/* Quiet diagrams keep the workbench readable without repeating method paragraphs. */
.dashboard-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start;margin:16px 0}
.dashboard-charts>.panel{margin:0;min-width:0}
.workload-chart{margin:0;min-width:0}
.workload-chart .panel-head{align-items:start;gap:12px;margin-bottom:20px}
.workload-chart .panel-head h2{font-size:18px;font-weight:600;line-height:1.5;margin:0}
.chart-total{flex-shrink:0;font-size:14px;font-variant-numeric:tabular-nums;color:var(--muted)}
.chart-empty,.chart-method p{font-size:14px;line-height:1.6;color:var(--muted);margin:0;overflow-wrap:anywhere}
.chart-empty{padding:24px 0}
.chart-footer{display:flex;justify-content:space-between;align-items:start;gap:12px;margin-top:16px;flex-wrap:wrap}
.chart-method{margin-left:auto;min-width:0;max-width:100%}
.chart-method>summary,.chart-link{display:flex;align-items:center;min-height:44px;font-size:14px;margin:0}
.chart-method>summary{cursor:pointer;color:var(--muted);list-style:revert}
.chart-method[open]{flex-basis:100%;margin-left:0}
.chart-method[open]>div{padding:8px 0 0}
.chart-scale{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin:0 0 8px;font-variant-numeric:tabular-nums}
.chart-bars{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.chart-bar-copy{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px;font-size:14px;line-height:1.5}
.chart-bar-copy>span{min-width:0;overflow-wrap:anywhere}
.chart-bar-copy strong{flex-shrink:0;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.chart-bar-track{height:12px;width:100%;background:#edf1f4}
.chart-bar-track svg{display:block;width:100%;height:100%}
.chart-bar-fill{fill:var(--accent)}
.chart-unavailable{font-size:12px;color:var(--muted)}
.flow-diagram{list-style:none;margin:0;padding:12px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:20px 16px}
.flow-diagram li{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;min-width:0}
.flow-diagram svg{width:32px;height:32px;stroke:var(--accent);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.flow-diagram strong{font-size:28px;line-height:1.2;font-weight:600;font-variant-numeric:tabular-nums}
.flow-diagram li>span{font-size:14px;line-height:1.5;overflow-wrap:anywhere}
.coverage-layout{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-around;gap:20px;padding:4px 0}
.coverage-dial{width:8.5em;max-width:100%;height:auto;aspect-ratio:1;position:relative;flex-shrink:0;display:grid;place-items:center}
.coverage-dial svg{position:absolute;inset:0;width:100%;height:100%;fill:none}
.ring-track{stroke:#e6ebef;stroke-width:6}
.ring-value{stroke:var(--accent);stroke-width:6;stroke-linecap:butt}
.coverage-dial>strong{white-space:nowrap;font-size:28px;line-height:1.2;font-weight:600;font-variant-numeric:tabular-nums}
.coverage-legend{list-style:none;padding:0;margin:0;display:grid;gap:16px;min-width:0}
.coverage-legend li{display:grid;gap:4px}
.coverage-legend li>span{font-size:14px;color:var(--muted);overflow-wrap:anywhere}
.coverage-legend strong{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.coverage-legend small{font-size:12px;font-weight:400;color:var(--muted)}
.dashboard-orders>summary,.recent-events>summary{min-height:44px;display:flex;align-items:center;gap:12px;cursor:pointer;font-size:16px;font-weight:600}
.dashboard-orders>summary>span{margin-left:auto;color:var(--muted);font-weight:400;font-size:14px}
.dashboard-orders[open]>.panel-head{margin-top:12px}
.recent-events>summary{font-size:14px;font-weight:400;color:var(--muted)}
@media(max-width:700px){.dashboard-charts{grid-template-columns:1fr}.workload-chart .panel-head{flex-wrap:wrap}.chart-total{margin-left:auto}.coverage-dial{width:8.5em;height:auto}.coverage-layout{gap:16px}.flow-diagram{grid-template-columns:repeat(auto-fit,minmax(76px,1fr))}.chart-footer{gap:8px}}
@media(max-width:360px){.coverage-dial{width:8em;height:auto}.coverage-dial>strong{font-size:24px}.coverage-legend strong{font-size:18px}}

.dashboard-empty{display:flex;align-items:center;justify-content:center;gap:24px;padding:12px 0}.dashboard-empty img{width:150px;height:100px;object-fit:contain;flex-shrink:0}.dashboard-empty .empty{padding:0;max-width:24em}@media(max-width:600px){.dashboard-empty{flex-direction:column;gap:12px;text-align:center}.dashboard-empty img{width:132px;height:88px}}
