#app{--ut-navy:#192743;--ut-blue:#3f5fb0;--ut-bg:#f4f6f9;--ut-white:#fff;--ut-ink:#24364a;--ut-muted:#6b7f94;--ut-line:#dce5f0;--ut-soft:#f4f7fb;--ut-row:#fafcff;--ut-active:#eaf0fc;--ut-green:#28745c;--ut-green-bg:#edf7f1;--ut-amber:#8c621f;--ut-amber-bg:#fbf4e7;--ut-red:#a44646;--ut-red-bg:#fceeee;--ut-radius:16px;color-scheme:light;background:var(--ut-bg);color:var(--ut-ink);font:14px/1.55 "Segoe UI","Microsoft YaHei","PingFang SC","Noto Sans SC",sans-serif;position:relative;border-radius:16px;isolation:isolate;overflow:clip}
#app *{box-sizing:border-box}
#app button,#app input,#app select,#app textarea{font:inherit}
#app button{color:inherit}
#app button:focus-visible,#app input:focus-visible,#app select:focus-visible,#app textarea:focus-visible{outline:3px solid #9ab5f2;outline-offset:3px}
#app [hidden]{display:none!important}
#app .ut-topbar{background:var(--ut-navy);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 24px;min-height:82px}
#app .ut-brand{display:flex;align-items:center;gap:13px}
#app .ut-monogram{width:43px;height:43px;border:2px solid #94acd4;border-radius:12px;display:grid;place-items:center;font-size:29px;font-weight:700;line-height:1}
#app .ut-brand-name{font-size:19px;font-weight:700;letter-spacing:2px;line-height:1.3}
#app .ut-brand-caption{font-size:11px;letter-spacing:2px;color:#b9cae6;margin-top:2px}
#app .ut-account{display:flex;align-items:center;gap:14px}
#app .ut-demo-label{border:1px solid #6b82a8;color:#d3e0f6;padding:5px 11px;border-radius:20px;font-size:12px;white-space:nowrap}
#app .ut-avatar{display:grid;place-items:center;background:#314462;width:32px;height:32px;border-radius:50%;font-size:12px;color:#e7efff}
#app .ut-user{display:flex;align-items:center;gap:8px;white-space:nowrap}
#app .ut-layout{display:grid;grid-template-columns:168px minmax(0,1fr);min-height:680px}
#app .ut-sidebar{background:var(--ut-white);border-right:1px solid var(--ut-line);padding:22px 12px;display:flex;flex-direction:column}
#app .ut-nav-caption{font-size:11px;letter-spacing:1px;color:var(--ut-muted);padding:0 12px;margin:0 0 9px}
#app .ut-nav-caption.ut-gap{margin-top:22px}
#app .ut-nav-item{border:0;background:transparent;display:flex;align-items:center;gap:10px;text-align:left;padding:10px 11px;border-radius:8px;width:100%;font-weight:500;margin:2px 0;min-height:40px}
#app .ut-nav-item i,#app .ut-nav-item svg{width:17px;height:17px;flex:none}
#app .ut-nav-item.is-active{color:var(--ut-blue);background:var(--ut-active)}
#app .ut-nav-item:not(:disabled):hover{background:var(--ut-soft)}
#app .ut-nav-item:disabled{color:#7d8ca0}
#app .ut-sidebar-bottom{margin-top:auto;padding-top:22px}
#app .ut-mobile-nav{display:none}
#app .ut-main{padding:23px 25px 27px;min-width:0}
#app .ut-breadcrumb{display:flex;align-items:center;gap:8px;color:var(--ut-muted);font-size:12px;margin-bottom:15px;flex-wrap:wrap}
#app .ut-text-button{background:none;border:0;color:var(--ut-blue);padding:0;font-weight:500}
#app .ut-page-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}
#app h2{font-size:24px;line-height:1.35;font-weight:700;color:var(--ut-ink);margin:0}
#app h3{font-size:16px;line-height:1.4;font-weight:650;color:var(--ut-ink);margin:0}
#app .ut-description{color:var(--ut-muted);margin:5px 0 0;font-size:13px}
#app .ut-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
#app .ut-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:39px;padding:8px 14px;border:1px solid #c4d4ef;border-radius:9px;background:var(--ut-white);color:var(--ut-blue);font-weight:600;white-space:nowrap;text-decoration:none}
#app .ut-button i,#app .ut-button svg{height:16px;width:16px;flex:none}
#app .ut-button.ut-primary{background:var(--ut-blue);color:#fff;border-color:var(--ut-blue)}
#app .ut-button.ut-primary:hover{background:#355296}
#app .ut-button:not(.ut-primary):hover{background:var(--ut-active)}
#app .ut-button:disabled{background:#e7ebf2;color:#8995a5;border-color:#e0e6ee}
#app .ut-panel{background:var(--ut-white);border:1px solid var(--ut-line);border-radius:var(--ut-radius);padding:20px;box-shadow:0 5px 18px #23375305}
#app .ut-filter{background:var(--ut-soft);border:1px solid var(--ut-line);border-radius:12px;padding:15px;margin-bottom:19px}
#app .ut-filter-grid{display:grid;grid-template-columns:minmax(140px,1.55fr) minmax(110px,1fr) minmax(110px,1fr) auto;gap:12px;align-items:end}
#app .ut-field label{display:block;color:#526a81;font-size:12px;font-weight:600;margin-bottom:6px}
#app .ut-input,#app .ut-select,#app .ut-textarea{border:1px solid #becde1;border-radius:8px;background:#fff;color:var(--ut-ink);width:100%;min-width:0;min-height:40px;padding:8px 11px;box-shadow:0 1px 2px #24364a02}
#app .ut-input::placeholder{color:#8a98aa}
#app .ut-select{padding-right:23px}
#app .ut-select option{color:#24364a;background:#fff}
#app .ut-list-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}
#app .ut-count{font-size:12px;color:var(--ut-muted);font-variant-numeric:tabular-nums}
#app .ut-table-scroll{overflow-x:auto}
#app .ut-table{border-collapse:separate;border-spacing:0 8px;width:100%;font-size:13px;min-width:590px}
#app .ut-table th{font-size:12px;font-weight:600;color:#587088;text-align:left;background:#eff4fa;padding:10px 12px;white-space:nowrap}
#app .ut-table th:first-child{border-radius:8px 0 0 8px}
#app .ut-table th:last-child{border-radius:0 8px 8px 0}
#app .ut-table td{background:var(--ut-row);padding:14px 12px;border-top:1px solid var(--ut-line);border-bottom:1px solid var(--ut-line);vertical-align:middle}
#app .ut-table tr:hover td{background:#f3f7ff}
#app .ut-table td:first-child{border-left:1px solid var(--ut-line);border-radius:9px 0 0 9px}
#app .ut-table td:last-child{border-right:1px solid var(--ut-line);border-radius:0 9px 9px 0}
#app .ut-table .ut-row-title{font-size:14px;font-weight:650;display:block}
#app .ut-sub{color:var(--ut-muted);font-size:12px;margin-top:2px}
#app .ut-table .ut-row-action{white-space:nowrap;color:var(--ut-blue);border:0;background:none;font-weight:600;padding:7px 0}
#app .ut-status{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;border-radius:20px;padding:3px 9px;font-size:11px;font-weight:600;background:var(--ut-green-bg);color:var(--ut-green)}
#app .ut-status::before{content:"";height:5px;width:5px;border-radius:50%;background:currentColor}
#app .ut-status.ut-pending{color:var(--ut-amber);background:var(--ut-amber-bg)}
#app .ut-status.ut-paused{color:var(--ut-red);background:var(--ut-red-bg)}
#app .ut-list-footer{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--ut-muted);border-top:1px solid #edf1f6;padding-top:14px;margin-top:11px;gap:12px}
#app .ut-page-number{color:var(--ut-blue);background:var(--ut-active);border-radius:6px;padding:4px 10px}
#app .ut-empty{padding:40px 15px;text-align:center;color:var(--ut-muted)}
#app .ut-client-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
#app .ut-code{font-size:12px;color:var(--ut-muted);font-weight:500}
#app .ut-tabs{display:flex;gap:23px;border-bottom:1px solid var(--ut-line);margin-bottom:20px;flex-wrap:wrap}
#app .ut-tab{background:transparent;border:0;border-bottom:3px solid transparent;padding:10px 0 12px;color:var(--ut-muted);white-space:nowrap;font-weight:500}
#app .ut-tab.is-active{border-bottom-color:var(--ut-blue);color:var(--ut-blue);font-weight:600}
#app .ut-detail-columns{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(195px,1fr);gap:16px;align-items:start}
#app .ut-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:21px 25px;margin-top:22px}
#app .ut-value-label{font-size:12px;color:var(--ut-muted);margin-bottom:5px}
#app .ut-value{font-size:14px;color:var(--ut-ink);font-weight:500;word-break:break-word}
#app .ut-panel-divider{border:0;border-top:1px solid var(--ut-line);margin:22px 0 18px}
#app .ut-detail-side{display:grid;gap:16px}
#app .ut-person{display:flex;align-items:center;gap:10px;margin:15px 0}
#app .ut-person-avatar{width:33px;height:33px;border-radius:50%;display:grid;place-items:center;background:var(--ut-active);color:var(--ut-blue);font-size:12px;flex:none}
#app .ut-person .ut-value-label{margin:0}
#app .ut-quiet-line{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #edf1f6;font-size:12px}
#app .ut-quiet-line:last-child{border:0}
#app .ut-quiet-line span:first-child{color:var(--ut-muted)}
#app .ut-group-chip{background:var(--ut-soft);padding:4px 9px;border-radius:6px;font-size:12px;color:#526a81;display:inline-block}
#app .ut-tab-content .ut-table{min-width:540px}
#app .ut-gallery-filter{display:grid;grid-template-columns:1.5fr 1fr auto;gap:12px;align-items:end}
#app .ut-category-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:17px 0}
#app .ut-category-buttons{display:flex;gap:7px;flex-wrap:wrap}
#app .ut-category{background:#fff;border:1px solid var(--ut-line);border-radius:7px;padding:6px 12px;color:#61778b;font-size:12px}
#app .ut-category.is-active{background:var(--ut-active);border-color:#bdceee;color:var(--ut-blue);font-weight:600}
#app .ut-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
#app .ut-sample{border:1px solid var(--ut-line);border-radius:12px;background:#fff;min-width:0;transition:border-color .15s,box-shadow .15s}
#app .ut-sample:hover{border-color:#b5c6e4;box-shadow:0 5px 15px #23375308}
#app .ut-sample-image{position:relative;border:0;padding:0;width:100%;display:block;background:#fff;border-radius:12px 12px 0 0}
#app .ut-sample-image img{width:100%;aspect-ratio:1.35;object-fit:contain;display:block;border-radius:12px 12px 0 0;padding:5px}
#app .ut-sample-content{padding:12px 13px 13px}
#app .ut-sample-code{font-size:14px;font-weight:700;margin-bottom:4px}
#app .ut-sample-name{font-size:12px;color:#61768b;min-height:19px}
#app .ut-tags{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0 12px}
#app .ut-tag{background:#f0f4f9;color:#5b7189;font-size:11px;padding:3px 6px;border-radius:5px}
#app .ut-sample-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px}
#app .ut-sample-bottom .ut-button{min-height:32px;padding:5px 9px;font-size:11px}
#app .ut-image-source{font-size:11px;color:var(--ut-muted);margin-top:16px}
#app .ut-overlay{position:fixed;inset:0;z-index:20;background:#19274366;display:flex;align-items:center;justify-content:center;padding:24px 22px;overflow:hidden;overscroll-behavior:contain}
#app .ut-dialog{background:#fff;border:1px solid var(--ut-line);box-shadow:0 20px 60px #14243e26;border-radius:15px;width:min(650px,100%);max-height:100%;min-height:0;padding:23px;display:flex;flex-direction:column;overflow:hidden}
#app .ut-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px;flex:none}
#app #ut-dialog-content{min-height:0;overflow-y:auto;overscroll-behavior:contain}
#app .ut-close{border:0;background:var(--ut-soft);color:var(--ut-muted);width:32px;height:32px;display:grid;place-items:center;border-radius:8px;flex:none}
#app .ut-close i,#app .ut-close svg{height:17px;width:17px}
#app .ut-dialog-actions{display:flex;justify-content:flex-end;gap:9px;align-items:center;margin-top:23px;flex-wrap:wrap}
#app .ut-error{color:var(--ut-red);font-size:12px;margin:10px 0 0}
#app .ut-dialog-note{color:var(--ut-muted);font-size:12px;margin-right:auto}
#app .ut-modal-product{display:grid;grid-template-columns:1fr 1fr;gap:24px}
#app .ut-modal-product img{width:100%;object-fit:contain;aspect-ratio:1}
#app .ut-modal-product .ut-info-grid{grid-template-columns:1fr;gap:14px}
#app .ut-modal-selection{display:grid;gap:10px}
#app .ut-selection-row{display:flex;gap:14px;align-items:center;background:var(--ut-soft);padding:9px 12px;border-radius:9px}
#app .ut-selection-row img{height:52px;width:68px;object-fit:contain;background:#fff;border-radius:6px}
#app .ut-toast{position:absolute;z-index:30;top:98px;right:23px;max-width:calc(100% - 46px);background:#24364a;color:#fff;border-radius:9px;padding:11px 16px;box-shadow:0 5px 18px #19274320;font-size:13px}
@media(max-width:1000px){#app .ut-layout{grid-template-columns:148px minmax(0,1fr)}#app .ut-main{padding:20px 19px}#app .ut-filter-grid{grid-template-columns:1.35fr 1fr 1fr}#app .ut-filter-actions{grid-column:1/-1;justify-content:flex-end}#app .ut-detail-columns{grid-template-columns:1fr}#app .ut-detail-side{grid-template-columns:1fr 1fr}#app .ut-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){#app{border-radius:12px}#app .ut-layout{display:block;min-height:0}#app .ut-sidebar{display:none}#app .ut-topbar{padding:15px 18px;min-height:76px}#app .ut-account{gap:8px}#app .ut-user-name{display:none}#app .ut-mobile-nav{display:flex;background:#fff;border-bottom:1px solid var(--ut-line);padding:5px 13px;gap:5px}#app .ut-mobile-nav .ut-nav-item{width:auto;padding:8px 12px}#app .ut-main{padding:19px 16px}#app .ut-page-heading{margin-bottom:18px;align-items:flex-start}#app h2{font-size:22px}#app .ut-panel{padding:16px}#app .ut-filter-grid{grid-template-columns:1fr 1fr}#app .ut-filter-grid .ut-field:first-child{grid-column:1/-1}#app .ut-gallery-filter{grid-template-columns:1fr 1fr}#app .ut-gallery-filter .ut-field:first-child{grid-column:1/-1}#app .ut-gallery-filter .ut-actions{justify-content:flex-end;grid-column:1/-1}#app .ut-detail-side{grid-template-columns:1fr 1fr}#app .ut-overlay{padding-top:35px}#app .ut-tabs{gap:18px}#app .ut-tab{font-size:13px}}
@media(max-width:550px){#app .ut-brand-caption{font-size:11px;letter-spacing:1.3px}#app .ut-brand-name{font-size:17px}#app .ut-brand{gap:9px}#app .ut-monogram{width:36px;height:36px;font-size:25px}#app .ut-demo-label{font-size:11px;padding:4px 7px}#app .ut-user{display:none}#app .ut-page-heading{display:block}#app .ut-page-heading>.ut-actions{margin-top:13px}#app .ut-button{min-height:42px}#app .ut-input,#app .ut-select,#app .ut-textarea{font-size:16px;min-height:43px}#app .ut-table{min-width:0;display:block;border-spacing:0}#app .ut-table thead{display:none}#app .ut-table tbody{display:grid;gap:11px}#app .ut-table tr{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ut-line);border-radius:10px;padding:12px;background:var(--ut-row)}#app .ut-table td,#app .ut-table td:first-child,#app .ut-table td:last-child{display:block;border:0;border-radius:0;padding:6px 3px;background:transparent}#app .ut-table td:first-child{grid-column:1/-1}#app .ut-table td[data-label]::before{content:attr(data-label);display:block;color:var(--ut-muted);font-size:11px;margin-bottom:4px}#app .ut-table td:last-child{text-align:right;align-self:end}#app .ut-row-action{min-height:36px}#app .ut-detail-side{grid-template-columns:1fr}#app .ut-info-grid{gap:20px 14px}#app .ut-gallery{gap:11px}#app .ut-sample-content{padding:10px}#app .ut-sample-code{font-size:12px}#app .ut-sample-name{font-size:11px;min-height:34px}#app .ut-sample-bottom{display:block}#app .ut-sample-bottom .ut-button{width:100%;margin-top:6px;min-height:38px}#app .ut-modal-product{grid-template-columns:1fr;gap:10px}#app .ut-modal-product img{aspect-ratio:1.8;max-height:180px}#app .ut-dialog{padding:17px}#app .ut-dialog .ut-info-grid{grid-template-columns:1fr}#app .ut-overlay{padding:25px 12px}#app .ut-tabs{gap:14px}#app .ut-dialog-actions .ut-dialog-note{width:100%}}
@media(max-width:550px){#app .ut-topbar{padding:14px;gap:8px}#app .ut-brand-caption{display:none}#app .ut-filter-grid,#app .ut-gallery-filter{grid-template-columns:1fr}#app .ut-gallery .ut-empty{grid-column:1/-1}}
@media(max-width:760px){
  #app{width:100%;min-height:100dvh;border-radius:0}
  #app .ut-topbar{min-height:64px;padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left))}
  #app .ut-brand{gap:8px}
  #app .ut-monogram{width:36px;height:36px;flex:none;font-size:25px;border-radius:10px}
  #app .ut-brand-name{letter-spacing:.75px}
  #app .ut-brand-caption{display:none}
  #app .ut-main{padding:18px 0 24px}
  #app .ut-breadcrumb,#app .ut-page-heading{margin-left:max(12px,env(safe-area-inset-left));margin-right:max(12px,env(safe-area-inset-right))}
  #app .ut-mobile-nav{padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right))}
  #app .ut-panel{padding:16px max(12px,env(safe-area-inset-right)) 16px max(12px,env(safe-area-inset-left));border-left:0;border-right:0;border-radius:0;box-shadow:none}
  #app .ut-filter{background:transparent;border:0;border-bottom:1px solid var(--ut-line);border-radius:0;padding:0 0 18px;margin-bottom:18px}
  #app .ut-tabs{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  #app .ut-gallery{grid-template-columns:minmax(0,1fr);gap:16px}
  #app .ut-sample-image img{aspect-ratio:1.45;max-height:290px}
  #app .ut-sample-content{padding:14px 16px 16px}
  #app .ut-sample-code{font-size:16px}
  #app .ut-sample-name{font-size:14px;min-height:0}
  #app .ut-sample .ut-tag{font-size:12px}
  #app .ut-sample-bottom{display:flex;gap:16px}
  #app .ut-sample-bottom .ut-text-button{font-size:14px;min-height:42px}
  #app .ut-sample-bottom .ut-button{width:auto;margin:0;min-height:42px;padding:8px 16px;font-size:13px}
  #app .ut-overlay{padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
  #app .ut-modal-product{grid-template-columns:1fr;gap:10px}
  #app .ut-modal-product img{aspect-ratio:1.8;max-height:min(160px,24dvh)}
  #app .ut-modal-product .ut-info-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
}
@media(prefers-reduced-motion:reduce){#app *{transition:none!important}}
/* Existing business controls use the same approved visual system. */
:root{--navy:#192743;--blue:#3f5fb0;--blue-dark:#355296;--blue-light:#eaf0fc;--text:#24364a;--muted:#6b7f94;--line:#dce5f0;--bg:#f4f6f9;font:14px/1.55 "Segoe UI","Microsoft YaHei","PingFang SC","Noto Sans SC",sans-serif}
body{min-width:300px}#app{border-radius:0;min-height:100dvh;--navy:var(--ut-navy);--blue:var(--ut-blue);--text:var(--ut-ink);--muted:var(--ut-muted);--line:var(--ut-line);--bg:var(--ut-bg)}
button,.button{min-height:39px;padding:8px 14px;border-color:#c4d4ef;border-radius:9px;color:#3f5fb0;font-weight:600}
#app .app-shell{display:block;min-height:100dvh;max-width:none;margin:0;padding:0}#app .ut-layout{min-height:calc(100dvh - 82px)}#app .ut-sidebar{position:static;width:auto;height:auto}#app .ut-main{width:auto;max-width:none;margin:0;min-width:0;grid-column:auto;grid-row:auto}#app .ut-account-control{position:relative}#app .ut-account-toggle{background:transparent;border:0;color:white;padding:4px;font-size:12px;min-height:32px}#app .account-menu{top:calc(100% + 12px);color:var(--ut-ink)}
#app .ut-nav-item{justify-content:flex-start;cursor:pointer}#app .ut-nav-item:disabled{cursor:default;opacity:1}#app .ut-sidebar-bottom{font-size:14px}#app .ut-mobile-nav{overflow-x:auto;scrollbar-width:thin}#app .ut-mobile-nav .ut-nav-item{flex:none;white-space:nowrap}
#app h1{font-size:24px;line-height:1.35;font-weight:700;letter-spacing:0}#app h2{font-size:16px;font-weight:650;line-height:1.4}#app h3{font-size:15px;line-height:1.4}#app .page-heading{margin-bottom:22px;align-items:center;gap:16px}#app .page-heading p{font-size:13px;color:var(--ut-muted);line-height:1.55;margin:5px 0 0}#app .page-heading .eyebrow{display:none}#app .heading-actions{gap:9px;flex-wrap:wrap}#app .panel{background:#fff;border:1px solid var(--ut-line);border-radius:16px;padding:20px;box-shadow:0 5px 18px #23375305;min-width:0}#app .customer-list-panel{margin:0}#app .panel h2 .count{font-size:12px}#app .workspace-footer{padding:20px 0 0;margin:0;font-size:10px;color:var(--ut-muted)}
#app label{font-size:12px;font-weight:600;color:#526a81;gap:6px;margin:0}#app input:not([type=checkbox]):not([type=radio]),#app select,#app textarea{border:1px solid #becde1;border-radius:8px;background:#fff;color:#24364a;min-width:0;min-height:40px;padding:8px 11px;box-shadow:0 1px 2px #24364a02;font-size:14px;font-weight:400}#app input::placeholder{color:#8a98aa}#app select option{color:#24364a;background:#fff}#app input[readonly],#app input:disabled,#app select:disabled{background:#f4f7fb;color:#647b91}#app .search-box{min-width:0;border-color:#becde1;border-radius:8px;min-height:40px}#app .search-box input{border:0;box-shadow:none}#app .extra-filters{margin-top:12px}#app .extra-filters summary{font-size:12px;color:var(--ut-blue);cursor:pointer}#app .extra-filters .form-grid{margin:12px 0}#app .extra-filters>.check{margin:10px 0}#app .form-grid{gap:16px}#app .badge{font-size:11px;padding:3px 9px;border-radius:20px;background:#eef2f8;color:#61778b}#app .badge.green{background:#edf7f1;color:#28745c}#app .badge.amber{background:#fbf4e7;color:#8c621f}#app .badge.red{background:#fceeee;color:#a44646}
#app .customer-table{min-width:590px}#app .customer-table td{max-width:none;cursor:default}#app .customer-table .ut-row-title{font-size:14px}#app .customer-table .ut-row-action{padding:7px 0;min-height:32px}#app .customer-table td small{font-size:12px}#app .ut-list-footer{flex-wrap:wrap}#app .pagination{gap:7px}#app .pagination button{padding:5px 9px;min-height:30px;font-size:12px}#app .pagination span{font-size:12px}
#app .approval-bar{margin:0 0 16px;padding:12px 16px;border:1px solid var(--ut-line);border-radius:12px;background:#fff}#app .approval-bar>div:first-child{display:grid;gap:3px}#app .status-notice{margin-bottom:14px;border-radius:12px}#app .detail-panel{border:0;padding:0;background:transparent;box-shadow:none}#app .detail-tabs{padding:0;border-bottom:1px solid var(--ut-line);margin:0 0 20px;gap:23px;overflow-x:auto;flex-wrap:nowrap}#app .detail-tabs button{border:0;border-radius:0;background:transparent;padding:10px 0 12px;min-height:43px;border-bottom:3px solid transparent;color:var(--ut-muted);font-size:14px;white-space:nowrap;font-weight:500}#app .detail-tabs button.selected{border-bottom-color:var(--ut-blue);color:var(--ut-blue);font-weight:600}#app .detail-tabs span{margin-left:4px;font-size:11px}#app .detail-body{padding:0}#app .detail-body>.section-line{padding-top:8px}#app .detail-body>template+div{min-width:0}#app .info-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:21px 25px;margin:22px 0 0}#app .info-grid dt{font-size:12px;color:var(--ut-muted);margin-bottom:5px}#app .info-grid dd{font-size:14px;font-weight:500;line-height:1.55;color:var(--ut-ink)}#app .info-grid>div{border:0;padding:0;min-width:0}#app .group-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}#app .ut-detail-side .panel{margin:0}#app .ut-detail-side .ut-value-label{margin-top:0}
#app .sample-controls{padding:15px;background:var(--ut-soft);border-radius:12px;margin-bottom:19px;overflow:visible}#app .sample-search-controls{display:grid;grid-template-columns:1fr 1.5fr auto;gap:12px;align-items:end}#app .sample-style-filter{min-width:0}#app .sample-style-filter>label{font-size:12px;color:#526a81;margin-bottom:6px}#app .sample-style-combobox{min-width:0;height:40px}#app .sample-style-combobox input{padding-right:38px}#app .sample-style-options{background:#fff;color:#24364a;border-color:#becde1;z-index:12;max-height:300px}#app .sample-style-options button{color:#24364a;background:#fff;min-height:40px;white-space:normal}#app .sample-style-options button.active{background:#eaf0fc;color:#3f5fb0}#app .sample-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}#app .sample-card{min-width:0;border:1px solid var(--ut-line);border-radius:12px;background:#fff;overflow:hidden;box-shadow:none}#app .sample-card.selected{border-color:#3f5fb0;box-shadow:0 0 0 1px #3f5fb0}#app .sample-card-image{padding:0;border:0;width:100%;height:auto;aspect-ratio:auto;border-radius:12px 12px 0 0;background:#fff;display:block}#app .sample-card-image img{width:100%;height:auto;aspect-ratio:1.35;object-fit:contain;display:block;padding:5px;border-radius:12px 12px 0 0}#app .sample-card-copy{padding:12px 13px 13px}#app .sample-card-heading{margin:0 0 4px}#app .sample-code{font-size:14px;font-weight:700;color:var(--ut-ink);padding:0;min-height:22px}#app .sample-card-copy>h2{font-size:12px;color:#61768b;font-weight:400;min-height:19px;white-space:normal;display:block;line-height:1.55}#app .sample-card-copy>p{font-size:12px;color:#61768b;line-height:1.55;margin-top:4px}#app .sample-card-features{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0 12px}#app .sample-card-features button{min-height:23px;padding:3px 6px;border:0;border-radius:5px;font-size:11px;color:#5b7189;background:#f0f4f9;font-weight:400;white-space:normal;text-align:left}#app .sample-card-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0;padding:0;border:0}#app .sample-card-bottom>div{display:grid;min-width:0}#app .sample-card-bottom span{font-size:11px}#app .sample-card-bottom .link{font-size:12px;min-height:32px}#app .sample-select{font-size:11px;min-height:32px;padding:5px 9px;flex:none}#app .sample-sync-line{font-size:11px;color:var(--ut-muted);margin:0 0 8px}#app .sample-result-line{margin:17px 0}
#app .modal-backdrop{position:fixed;inset:0;padding:24px 22px;overflow:hidden;align-items:center;justify-content:center;background:#19274366;z-index:100;overscroll-behavior:contain}#app .modal{width:min(650px,100%);max-height:100%;border:1px solid var(--ut-line);border-radius:15px;box-shadow:0 20px 60px #14243e26;display:flex;flex-direction:column;min-height:0;overflow:hidden;margin:0}#app .modal.wide{width:min(940px,100%)}#app .modal-header{padding:20px 23px 16px;flex:none}#app .modal-header h2{font-size:16px}#app .modal-header .eyebrow{display:none}#app .modal>form{display:flex;flex-direction:column;overflow:hidden;min-height:0}#app .modal-body{padding:0 23px 20px;overflow-y:auto;overscroll-behavior:contain;min-height:0}#app .modal-footer{padding:15px 23px;border-top:1px solid var(--ut-line);flex:none;flex-wrap:wrap}#app .modal-tabs{overflow-x:auto;flex:none;padding:0 23px;margin-bottom:16px}#app .close{width:32px;height:32px;min-height:32px;padding:0;background:var(--ut-soft);border:0;border-radius:8px;color:var(--ut-muted);font-size:23px;flex:none}#app .sample-detail{width:min(900px,100%);max-height:100%;margin:0;min-height:0;overflow:hidden;border-radius:15px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--ut-line)}#app .sample-detail-bar{padding:16px 20px;flex:none}#app .sample-detail-body{padding:0 20px 20px;overflow-y:auto;min-height:0;overscroll-behavior:contain}#app .sample-main-photo{background:#fff}#app .sample-main-photo img{object-fit:contain;max-height:45dvh}#app .sample-photo-actions{flex-wrap:wrap}#app .toast{position:fixed;top:98px;right:23px;max-width:calc(100% - 46px);border-radius:9px;background:#24364a;padding:11px 16px;font-size:13px;z-index:200}
#app .team-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}#app .team-card{border:1px solid var(--ut-line);background:var(--ut-row);border-radius:12px;padding:18px;min-width:0}#app .team-card>p{margin:8px 0;color:var(--ut-muted);font-size:12px}#app .team-scope-list{margin:14px 0;max-height:230px;overflow:auto;font-size:13px;overflow-wrap:anywhere}#app .team-scope-list>div{padding:7px 0;border-bottom:1px solid var(--ut-line)}#app .team-editor{display:grid;grid-template-columns:1fr 1.2fr;gap:20px;margin-top:20px}#app .team-editor h3{margin-bottom:10px}#app .team-options{max-height:300px;overflow:auto;border:1px solid var(--ut-line);border-radius:8px;margin:10px 0;padding:6px}#app .team-member-option{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 4px;border-bottom:1px solid #edf1f6}#app .team-member-option label{font-weight:400}#app .team-member-option select{width:110px;font-size:12px}#app .team-group-option{align-items:flex-start;display:flex;padding:8px 4px;gap:9px;font-weight:400}#app .team-group-option small{display:block}#app .team-mode-settings{border-top:1px solid var(--ut-line);padding-top:16px;display:grid;gap:12px}#app .team-mode-settings>button{justify-self:start}#app .scope-preview{padding:15px;border:1px solid var(--ut-line);border-radius:10px;background:var(--ut-soft);font-size:13px}#app .scope-preview>p{margin:8px 0}#app .scope-preview ul{padding-left:20px;max-height:220px;overflow:auto}#app .scope-preview li{margin:5px 0;overflow-wrap:anywhere}#app .scope-preview small{display:block}#app .auth-card{border-radius:16px}#app .team-options .check input{flex:none}#app .table-wrap{max-width:100%}
@media(max-width:1000px){#app .sample-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#app .team-cards{grid-template-columns:1fr}}
@media(max-width:760px){#app .ut-layout{min-height:0}#app h1{font-size:22px}#app .page-heading{margin:0 max(12px,env(safe-area-inset-right)) 18px max(12px,env(safe-area-inset-left));align-items:flex-start}#app .panel{padding:16px max(12px,env(safe-area-inset-right)) 16px max(12px,env(safe-area-inset-left));border-left:0;border-right:0;border-radius:0;box-shadow:none}#app .ut-filter{background:transparent;border:0;border-bottom:1px solid var(--ut-line);border-radius:0;padding:0 0 18px;margin-bottom:18px}#app .ut-filter-grid>label:first-child{grid-column:1/-1}#app .sample-controls{background:#fff;border-radius:0;padding-top:12px}#app .sample-search-controls{grid-template-columns:1fr 1fr;gap:12px}#app .sample-global-search{grid-column:1/-1;grid-row:1}#app .sample-clear-filters{align-self:end}#app .sample-grid{grid-template-columns:minmax(0,1fr);gap:16px;padding:0 max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left))}#app .sample-card-image img{aspect-ratio:1.45;max-height:290px}#app .sample-card-copy{padding:14px 16px 16px}#app .sample-code{font-size:16px}#app .sample-card-copy>h2{font-size:14px;min-height:0}#app .sample-card-features button{font-size:12px}#app .sample-card-bottom{display:flex;gap:16px}#app .sample-card-bottom .link{font-size:14px;min-height:42px}#app .sample-select{font-size:13px;min-height:42px;padding:8px 16px}#app .sample-result-line,#app .sample-sync-line,#app .sample-notice{margin-left:12px;margin-right:12px}#app .sample-main-photo img{max-height:min(160px,24dvh);aspect-ratio:1.8}#app .sample-detail-body{grid-template-columns:1fr;padding:0 16px 16px}#app .sample-detail-copy{padding:0}#app .sample-thumbnails{gap:6px}#app .sample-photo-actions .button,#app .sample-photo-actions button{font-size:12px;padding:5px 8px;min-height:32px}#app .modal-backdrop{padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}#app .sample-detail{width:100%}#app .detail-tabs{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));gap:18px}#app .detail-tabs button{font-size:13px}#app .approval-bar,#app .status-notice{margin-left:12px;margin-right:12px}#app .detail-body> :not(.ut-detail-columns){margin-left:12px;margin-right:12px}#app .detail-body>.contact-grid,#app .detail-body>.location-grid,#app .detail-body>.brand-grid,#app .detail-body>.group-grid{padding-bottom:12px}#app .ut-list-footer{align-items:flex-start}#app .ut-list-footer>span{width:100%}#app .workspace-footer{margin:0 12px}#app .team-editor{grid-template-columns:1fr}#app .team-options{max-height:250px}}
@media(max-width:550px){#app .page-heading{display:block}#app .page-heading>.heading-actions{margin-top:13px}#app .ut-filter-grid{grid-template-columns:1fr}#app .ut-filter-grid>label{grid-column:1/-1}#app .customer-table{min-width:0}#app .customer-table td{max-width:none}#app .ut-table-scroll{overflow-x:visible}#app input:not([type=checkbox]):not([type=radio]),#app select,#app textarea{font-size:16px;min-height:43px}#app .team-member-option select{font-size:13px}#app .sample-style-options button{font-size:16px}#app .modal-header{padding:16px 17px}#app .modal-body{padding:0 17px 17px}#app .modal-footer{padding:12px 17px}#app .modal-tabs{padding:0 17px}#app .approval-bar{align-items:flex-start;gap:10px;flex-wrap:wrap}#app .ut-account{gap:6px}#app .ut-account-toggle{font-size:11px}#app .info-grid{gap:20px 14px}#app .team-cards{grid-template-columns:minmax(0,1fr)}}
#app button.primary,#app .button.primary{background:var(--ut-blue);border-color:var(--ut-blue);color:#fff}#app button.primary:hover,#app .button.primary:hover{background:#355296;color:#fff}
#app .toast{left:auto;bottom:auto;transform:none;width:max-content;height:auto;min-height:0;max-height:none;display:block;text-align:left;line-height:1.55}
#app .ut-account-toggle svg{width:12px;height:12px}body:has(#app .modal-backdrop){overflow:hidden}
#app .sample-library-panel .sample-controls{border:1px solid var(--ut-line)}
@media(max-width:760px){#app .sample-library-panel .sample-controls{border:0;border-bottom:1px solid var(--ut-line);border-radius:0;padding:0 0 18px;background:transparent}#app .sample-library-panel .sample-grid{padding:0}#app .sample-library-panel .sample-result-line{margin-left:0;margin-right:0}#app .sample-main-photo{height:auto;min-height:0;aspect-ratio:1.8;max-height:min(160px,24dvh)}#app .sample-main-photo img{width:100%;height:100%;max-height:100%;object-fit:contain}#app .sample-detail-copy{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}#app .sample-detail-copy>h2,#app .sample-detail-copy>.sample-style-number,#app .sample-detail-copy>.sample-feature-grid,#app .sample-detail-copy>.sample-select-button{grid-column:1/-1}#app .sample-detail-copy>section{margin:0;padding:0;border:0;min-width:0}#app .sample-detail-copy>section h3{font-size:12px;color:var(--ut-muted);margin-bottom:5px}#app .sample-detail-copy>section p,#app .sample-detail-copy>section li{font-size:14px}#app .sample-style-number{margin:0;padding:0 0 10px}#app .sample-style-combobox button svg{width:16px;height:16px}}
#app .sample-detail-footer{display:flex;justify-content:flex-end;gap:9px;padding:12px 20px;border-top:1px solid var(--ut-line);background:#fff;flex:none}#app .sample-detail-footer .sample-select-button{margin:0;min-height:39px;width:auto;padding:8px 16px}
@media(max-width:760px){#app .sample-detail-footer{padding:12px 16px}#app .sample-detail-footer .sample-select-button{min-height:42px}}