/* Canonical component layer for every Skladik Beta domain. */
.ui-surface{background:var(--b-surface-glass);border:1px solid color-mix(in srgb,var(--b-line) 86%,transparent);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);box-shadow:var(--b-shadow-soft);border-radius:var(--b-radius)}
.ui-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:9px;background:var(--b-surface-glass);border:1px solid var(--b-line);border-radius:13px;backdrop-filter:blur(18px) saturate(140%)}
.ui-tabs{display:inline-flex;align-items:center;gap:4px;padding:4px;background:color-mix(in srgb,var(--b-surface) 76%,transparent);border:1px solid var(--b-line);border-radius:12px;box-shadow:var(--b-shadow-soft)}
.ui-tab{border:0;background:transparent;color:var(--b-text-2);min-height:34px;padding:0 12px;border-radius:9px;font-size:11px;font-weight:700;display:inline-flex;align-items:center;gap:7px}
.ui-tab:hover{background:var(--b-surface-2);color:var(--b-text)}.ui-tab.is-active{background:var(--b-surface);color:var(--b-green);box-shadow:0 1px 6px rgba(17,42,25,.08)}
.ui-input,.ui-select,.ui-textarea{width:100%;border:1px solid var(--b-line);background:color-mix(in srgb,var(--b-surface) 88%,transparent);border-radius:10px;outline:none;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
.ui-input,.ui-select{height:38px;padding:0 11px;font-size:11px}.ui-textarea{min-height:90px;padding:10px 11px;resize:vertical;font-size:11px}
.ui-input:focus,.ui-select:focus,.ui-textarea:focus{border-color:color-mix(in srgb,var(--b-green) 65%,var(--b-line));box-shadow:0 0 0 3px color-mix(in srgb,var(--b-green) 12%,transparent);background:var(--b-surface)}
.ui-field{display:grid;gap:6px}.ui-field>span{font-size:9px;font-weight:750;color:var(--b-text-2)}.ui-field small{font-size:8px;color:var(--b-text-3)}
.ui-button{min-height:36px;border:1px solid var(--b-line);background:color-mix(in srgb,var(--b-surface) 88%,transparent);color:var(--b-text);border-radius:10px;padding:0 12px;font-size:10px;font-weight:750;display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease,background .14s ease}
.ui-button:hover:not(:disabled){transform:translateY(-1px);border-color:var(--b-line-strong);box-shadow:var(--b-shadow-soft)}.ui-button:active:not(:disabled){transform:translateY(0)}.ui-button:disabled{opacity:.42;cursor:not-allowed}
.ui-button-primary{background:linear-gradient(180deg,color-mix(in srgb,var(--b-green) 92%,white),var(--b-green));border-color:var(--b-green);color:white;box-shadow:0 7px 18px color-mix(in srgb,var(--b-green) 18%,transparent)}
.ui-button-danger{color:var(--b-red);background:var(--b-red-soft);border-color:color-mix(in srgb,var(--b-red) 22%,var(--b-line))}.ui-button-ghost{background:transparent;box-shadow:none}.ui-button-sm{min-height:30px;padding:0 9px;font-size:9px;border-radius:9px}
.ui-badge{display:inline-flex;align-items:center;gap:5px;min-height:22px;padding:0 7px;border-radius:999px;background:var(--b-surface-2);color:var(--b-text-2);font-size:8px;font-weight:800;white-space:nowrap}.ui-badge::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.72}.ui-badge-good{background:var(--b-green-soft);color:var(--b-green)}.ui-badge-danger{background:var(--b-red-soft);color:var(--b-red)}.ui-badge-warn{background:var(--b-amber-soft);color:var(--b-amber)}.ui-badge-blue{background:var(--b-blue-soft);color:var(--b-blue)}
.ui-card{background:var(--b-surface-glass);border:1px solid var(--b-line);border-radius:var(--b-radius);box-shadow:var(--b-shadow-soft);backdrop-filter:blur(18px) saturate(140%)}.ui-card-pad{padding:15px}.ui-card-head{display:flex;align-items:flex-start;gap:10px;padding:14px 15px;border-bottom:1px solid var(--b-line)}.ui-card-head>div:first-child{min-width:0;flex:1}.ui-card-head h2,.ui-card-head h3{margin:0;font-size:13px}.ui-card-head p{margin:4px 0 0;font-size:9px;color:var(--b-text-2)}
.ui-table-wrap{overflow:auto;border-radius:var(--b-radius)}.ui-table{width:100%;border-collapse:collapse}.ui-table th{height:36px;padding:0 11px;text-align:left;font-size:8px;text-transform:uppercase;letter-spacing:.055em;color:var(--b-text-3);background:color-mix(in srgb,var(--b-surface-2) 90%,transparent);border-bottom:1px solid var(--b-line);white-space:nowrap}.ui-table td{padding:10px 11px;border-bottom:1px solid var(--b-line);font-size:10px;vertical-align:middle}.ui-table tr:last-child td{border-bottom:0}.ui-table tbody tr:hover{background:color-mix(in srgb,var(--b-green-soft) 32%,transparent)}
.ui-modal-backdrop{position:fixed;inset:0;z-index:180;background:rgba(10,20,14,.30);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:grid;place-items:center;padding:18px}.ui-modal-backdrop[hidden]{display:none}.ui-modal{width:min(560px,100%);max-height:min(780px,calc(100vh - 36px));overflow:auto;background:color-mix(in srgb,var(--b-surface) 92%,transparent);border:1px solid color-mix(in srgb,var(--b-line) 82%,white);border-radius:20px;box-shadow:0 28px 90px rgba(10,25,15,.22);backdrop-filter:blur(28px) saturate(155%)}.ui-modal-head{display:flex;align-items:flex-start;gap:12px;padding:17px 18px 13px;border-bottom:1px solid var(--b-line)}.ui-modal-head>div{flex:1}.ui-modal-head h2{margin:0;font-size:16px;letter-spacing:-.015em}.ui-modal-head p{margin:5px 0 0;font-size:9px;color:var(--b-text-2)}.ui-modal-body{padding:16px 18px}.ui-modal-foot{display:flex;justify-content:flex-end;gap:8px;padding:13px 18px 17px;border-top:1px solid var(--b-line)}
.ui-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.ui-form-grid .is-wide{grid-column:1/-1}.ui-inline-message{padding:9px 10px;border-radius:10px;font-size:9px;line-height:1.45;background:var(--b-blue-soft);color:var(--b-blue)}.ui-inline-message.is-error{background:var(--b-red-soft);color:var(--b-red)}
.ui-switch{position:relative;width:34px;height:20px;border:0;border-radius:999px;background:var(--b-line-strong);padding:0;transition:.16s}.ui-switch::after{content:"";position:absolute;width:16px;height:16px;left:2px;top:2px;border-radius:50%;background:white;box-shadow:0 1px 4px rgba(0,0,0,.18);transition:.16s}.ui-switch[aria-pressed="true"]{background:var(--b-green)}.ui-switch[aria-pressed="true"]::after{transform:translateX(14px)}.ui-switch:disabled{opacity:.34;cursor:not-allowed}
.ui-search{position:relative;min-width:220px;flex:1}.ui-search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--b-text-3);pointer-events:none}.ui-search .ui-input{padding-left:34px}
.ui-empty-mini{display:grid;place-items:center;text-align:center;min-height:180px;padding:30px;color:var(--b-text-2)}.ui-empty-mini strong{display:block;color:var(--b-text);font-size:12px;margin-bottom:5px}.ui-empty-mini span{font-size:9px;max-width:360px;line-height:1.5}
@media(max-width:760px){.ui-tabs{width:100%;overflow:auto;justify-content:flex-start}.ui-tab{flex:0 0 auto}.ui-form-grid{grid-template-columns:1fr}.ui-modal-backdrop{place-items:end center;padding:0}.ui-modal{width:100%;max-height:88vh;border-radius:22px 22px 0 0;border-bottom:0}.ui-modal-foot{padding-bottom:max(17px,env(safe-area-inset-bottom))}.ui-toolbar{align-items:stretch}.ui-search{min-width:100%}}

/* Provisional design iteration: larger shared controls and readable density. */
@media(min-width:761px){
  .ui-toolbar{gap:10px;padding:11px;border-radius:14px}
  .ui-tabs{gap:5px;padding:5px;border-radius:13px}.ui-tab{min-height:39px;padding:0 14px;border-radius:10px;font-size:12px;gap:8px}
  .ui-input,.ui-select{height:42px;padding:0 13px;font-size:12px}.ui-textarea{min-height:104px;padding:12px 13px;font-size:12px}.ui-field{gap:7px}.ui-field>span{font-size:10px}.ui-field small{font-size:9px}
  .ui-button{min-height:40px;border-radius:11px;padding:0 14px;font-size:11px;gap:8px}.ui-button-sm{min-height:34px;padding:0 10px;font-size:10px}
  .ui-badge{min-height:25px;padding:0 8px;font-size:9px}.ui-badge::before{width:6px;height:6px}
  .ui-card-pad{padding:18px}.ui-card-head{gap:12px;padding:17px 18px}.ui-card-head h2,.ui-card-head h3{font-size:15px}.ui-card-head p{font-size:10.5px;margin-top:5px}
  .ui-table th{height:42px;padding:0 13px;font-size:9.5px}.ui-table td{padding:12px 13px;font-size:11.5px}
  .ui-modal{width:min(620px,100%)}.ui-modal-head{padding:19px 20px 15px}.ui-modal-head h2{font-size:18px}.ui-modal-head p{font-size:10.5px}.ui-modal-body{padding:18px 20px}.ui-modal-foot{gap:10px;padding:15px 20px 19px}.ui-form-grid{gap:13px}.ui-inline-message{padding:10px 12px;font-size:10px}
  .ui-switch{width:38px;height:22px}.ui-switch::after{width:18px;height:18px}.ui-switch[aria-pressed="true"]::after{transform:translateX(16px)}
  .ui-search{min-width:250px}.ui-empty-mini strong{font-size:13px}.ui-empty-mini span{font-size:10px}
}
@media(max-width:760px){
  .ui-toolbar{gap:9px;padding:10px}.ui-tabs{padding:5px;gap:4px}.ui-tab{min-height:38px;padding:0 13px;font-size:11px}
  .ui-input,.ui-select{height:42px;font-size:12px;padding:0 12px}.ui-textarea{font-size:12px}.ui-field>span{font-size:10px}.ui-field small{font-size:9px}
  .ui-button{min-height:40px;font-size:11px;padding:0 13px}.ui-button-sm{min-height:34px;font-size:10px}.ui-badge{min-height:24px;font-size:9px}
  .ui-card-pad{padding:16px}.ui-card-head{padding:15px 16px}.ui-card-head h2,.ui-card-head h3{font-size:14px}.ui-card-head p{font-size:10px}
  .ui-table td{font-size:11px}.ui-modal-head h2{font-size:17px}.ui-modal-head p{font-size:10px}.ui-inline-message{font-size:10px}
  .ui-switch{width:38px;height:22px}.ui-switch::after{width:18px;height:18px}.ui-switch[aria-pressed="true"]::after{transform:translateX(16px)}
}