/* Tuku Design System v2 — shared Kela primitives */
:root{
  font-family:Inter,"IBM Plex Sans",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color-scheme:light;
  --tuku-bg:#f7f8f6;
  --tuku-surface:#ffffff;
  --tuku-surface-2:#f1f4f1;
  --tuku-surface-3:#eaf0ec;
  --tuku-text:#1f2925;
  --tuku-muted:#66726c;
  --tuku-dim:#8b958f;
  --tuku-border:#e1e6e2;
  --tuku-border-strong:#cbd4ce;
  --tuku-primary:#315f4d;
  --tuku-primary-strong:#244a3b;
  --tuku-primary-soft:#e8f1ec;
  --tuku-secondary:#bf712a;
  --tuku-secondary-soft:#fbefe3;
  --tuku-success:#2f7b58;
  --tuku-success-soft:#e9f4ee;
  --tuku-warning:#a96518;
  --tuku-warning-soft:#fff3df;
  --tuku-danger:#b54343;
  --tuku-danger-soft:#fdeeee;
  --tuku-info:#486b91;
  --tuku-info-soft:#edf3f9;
  --tuku-purple:#775b8f;
  --tuku-purple-soft:#f2edf6;
  --tuku-teal:#35716b;
  --tuku-teal-soft:#e8f3f1;
  --tuku-radius-xs:8px;
  --tuku-radius-sm:10px;
  --tuku-radius-md:12px;
  --tuku-radius-lg:16px;
  --tuku-radius-xl:22px;
  --tuku-shadow-1:0 1px 2px rgba(31,41,37,.045);
  --tuku-shadow-2:0 12px 32px -20px rgba(31,41,37,.28);
  --tuku-shadow-3:0 24px 80px rgba(31,41,37,.12);
  --tuku-space-1:4px;
  --tuku-space-2:8px;
  --tuku-space-3:12px;
  --tuku-space-4:16px;
  --tuku-space-5:20px;
  --tuku-space-6:24px;
  --tuku-space-8:32px;
}
*{box-sizing:border-box}
html{min-height:100%;background:var(--tuku-bg)}
body{margin:0;min-height:100vh;background:var(--tuku-bg);color:var(--tuku-text);font-feature-settings:"cv02","cv03","cv04","cv11";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit}
button{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid rgba(49,95,77,.5);outline-offset:2px}
::selection{background:rgba(49,95,77,.16)}
[hidden]{display:none!important}

.tuku-appbar,.topbar,.top{
  position:sticky;top:0;z-index:30;
  background:rgba(247,248,246,.92);
  border-bottom:1px solid var(--tuku-border);
  backdrop-filter:blur(18px) saturate(1.18);
}
.tuku-toolbar,.toprow,.bar{display:flex;align-items:center;gap:12px}
.tuku-brand,.brand{display:flex;align-items:center;gap:10px;min-width:0}
.tuku-brand-mark,.brandmark,.mark{
  width:40px;height:40px;flex:0 0 40px;display:grid;place-items:center;
  border:1px solid #d8e6de;border-radius:14px;
  background:var(--tuku-primary-soft);color:var(--tuku-primary);
  font-size:18px;font-weight:900;letter-spacing:-.04em;
}
.tuku-brand-copy,.brandtext{min-width:0}
.tuku-brand-copy strong,.brandtext strong,.brand strong{display:block;color:var(--tuku-text);font-weight:790;letter-spacing:-.025em;line-height:1.05}
.tuku-brand-copy span,.brandtext span,.brand span{display:block;margin-top:3px;color:var(--tuku-muted);font-size:11px;line-height:1.2}

.tuku-btn,.btn{
  min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:7px;
  border:1px solid var(--tuku-border-strong);border-radius:var(--tuku-radius-md);
  background:#fff;color:var(--tuku-text);padding:0 13px;
  font-weight:740;font-size:12px;cursor:pointer;box-shadow:none;
  transition:background .16s,border-color .16s,color .16s,transform .16s;
}
.tuku-btn:hover,.btn:hover{background:var(--tuku-surface-2);border-color:#b8c4bd}
.tuku-btn:active,.btn:active{transform:translateY(1px)}
.tuku-btn--primary,.btn.primary{background:var(--tuku-primary);border-color:var(--tuku-primary);color:#fff}
.tuku-btn--primary:hover,.btn.primary:hover{background:var(--tuku-primary-strong);border-color:var(--tuku-primary-strong)}
.tuku-btn--tonal{background:var(--tuku-primary-soft);border-color:transparent;color:var(--tuku-primary-strong)}
.tuku-btn--danger,.btn.danger{background:var(--tuku-danger-soft);border-color:transparent;color:var(--tuku-danger)}
.tuku-btn--ghost{background:transparent;border-color:transparent;color:var(--tuku-muted)}
.tuku-btn--small,.btn.small{min-height:32px;padding:0 10px;border-radius:10px;font-size:11px}
.tuku-btn:disabled,.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}

.tuku-field,.field{display:grid;gap:5px;min-width:0}
.tuku-label,.field label{
  display:block;color:var(--tuku-muted);font-size:10px;font-weight:800;
  letter-spacing:.065em;text-transform:uppercase;
}
.tuku-control,.control{
  width:100%;height:40px;border:1px solid var(--tuku-border-strong);border-radius:var(--tuku-radius-md);
  background:#fff;color:var(--tuku-text);padding:0 11px;box-shadow:none;
}
textarea.tuku-control,textarea.control{height:auto;min-height:96px;padding-top:10px;padding-bottom:10px;resize:vertical}
.tuku-control:hover,.control:hover{border-color:#b8c4bd}
.tuku-control:focus,.control:focus{border-color:var(--tuku-primary)}
.tuku-help,.foot,.muted,.recommend{color:var(--tuku-muted);font-size:12px;line-height:1.45}

.tuku-tabs,.tabs{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none}
.tuku-tabs::-webkit-scrollbar,.tabs::-webkit-scrollbar{display:none}
.tuku-tab,.tab{
  min-height:38px;flex:0 0 auto;border:0;border-radius:11px;background:transparent;
  color:var(--tuku-muted);padding:8px 12px;font-size:12px;font-weight:760;white-space:nowrap;cursor:pointer;
}
.tuku-tab:hover,.tab:hover{background:var(--tuku-surface-2);color:var(--tuku-text)}
.tuku-tab.is-active,.tuku-tab.active,.tab.active{background:var(--tuku-primary-soft);color:var(--tuku-primary-strong)}

.tuku-page-title,.hero h1{margin:0;color:var(--tuku-text);font-weight:790;letter-spacing:-.04em;line-height:1.08}
.tuku-page-subtitle,.hero p{margin:5px 0 0;color:var(--tuku-muted);line-height:1.45}
.tuku-section-title{margin:0;color:var(--tuku-text);font-size:17px;font-weight:760;letter-spacing:-.02em}
.tuku-section-copy{margin:4px 0 0;color:var(--tuku-muted);font-size:12px;line-height:1.45}

.tuku-surface,.panel,.card{
  background:var(--tuku-surface);border:1px solid var(--tuku-border);
  border-radius:var(--tuku-radius-lg);box-shadow:var(--tuku-shadow-1);
}
.tuku-surface:hover,.panel:hover,.card:hover{border-color:var(--tuku-border-strong)}
.tuku-card-header,.head{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #edf1ee}
.tuku-card-header h2,.head h2{margin:0;color:var(--tuku-text);font-size:17px;font-weight:760;letter-spacing:-.018em}
.tuku-card-header p,.head p{margin:4px 0 0;color:var(--tuku-muted);font-size:12px;line-height:1.4}
.tuku-card-body,.body{padding:16px 18px}

.tuku-metric,.kpi{
  background:#fff;border:1px solid var(--tuku-border);border-radius:15px;
  padding:14px 15px;min-width:0;box-shadow:none;
}
.tuku-metric:hover,.kpi:hover{border-color:var(--tuku-border-strong)}
.tuku-metric-label,.kpi .label,.kpi span{
  display:block;color:var(--tuku-muted);font-size:9px;font-weight:820;letter-spacing:.085em;text-transform:uppercase;
}
.tuku-metric-value,.kpi .value,.kpi strong{
  display:block;margin-top:7px;color:var(--tuku-text);font-size:28px;font-weight:790;letter-spacing:-.045em;line-height:1.05;
}
.tuku-metric--danger,.kpi.red{background:var(--tuku-danger-soft);border-color:#f2d7d8}
.tuku-metric--warning,.kpi.amber{background:var(--tuku-warning-soft);border-color:#efdec7}
.tuku-metric--success,.kpi.green{background:var(--tuku-success-soft);border-color:#d5e8dd}
.tuku-metric--info,.kpi.blue{background:var(--tuku-info-soft);border-color:#dce7f1}

.tuku-chip,.pill,.status,.servicechip,.score{
  display:inline-flex;align-items:center;gap:5px;max-width:100%;
  min-height:24px;padding:3px 8px;border-radius:999px;
  border:1px solid transparent;background:var(--tuku-surface-2);color:var(--tuku-muted);
  font-size:10px;font-weight:800;letter-spacing:.02em;white-space:nowrap;
}
.tuku-chip--success,.pill.green,.status.ok,.servicechip.open{background:var(--tuku-success-soft);color:var(--tuku-success)}
.tuku-chip--warning,.pill.amber,.status.warn{background:var(--tuku-warning-soft);color:#80500e}
.tuku-chip--danger,.pill.red,.status.off,.servicechip.closed{background:var(--tuku-danger-soft);color:var(--tuku-danger)}
.tuku-chip--info,.pill.blue,.servicechip.evening,.score{background:var(--tuku-info-soft);color:var(--tuku-info)}
.tuku-chip--purple,.pill.purple{background:var(--tuku-purple-soft);color:var(--tuku-purple)}

.tuku-table-wrap,.tablewrap{overflow:auto;border-radius:inherit}
.tuku-table,.tablewrap table,table{width:100%;border-collapse:collapse}
.tuku-table th,.tuku-table td,th,td{padding:11px 14px;text-align:left;border-bottom:1px solid #edf1ee;color:var(--tuku-text);font-size:12px;vertical-align:middle}
.tuku-table th,th{background:#fafbfa;color:var(--tuku-muted);font-size:9px;font-weight:820;letter-spacing:.075em;text-transform:uppercase}
.tuku-table tbody tr:hover td,tbody tr:hover td{background:#fbfcfb}

.tuku-empty,.empty{padding:24px 14px;color:var(--tuku-muted);font-size:12px;text-align:center}
.tuku-divider{height:1px;background:var(--tuku-border);border:0}
.tuku-stack{display:grid;gap:12px}
.tuku-inline{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tuku-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.tuku-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}

.tuku-modal,.modal{
  position:fixed;inset:0;z-index:90;display:none;place-items:center;padding:18px;
  background:rgba(31,41,37,.34);backdrop-filter:blur(4px);
}
.tuku-modal.is-open,.modal.open{display:grid}
.tuku-dialog,.modalbox{
  width:min(620px,100%);max-height:min(760px,92vh);overflow:auto;
  background:#fff;border:1px solid var(--tuku-border);border-radius:var(--tuku-radius-xl);
  padding:20px;box-shadow:var(--tuku-shadow-3);
}
.tuku-dialog-header,.modalhead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.tuku-dialog-title,.modalhead h2{margin:3px 0 0;color:var(--tuku-text);font-size:22px;font-weight:780;letter-spacing:-.035em}
.tuku-eyebrow,.eyebrow{color:var(--tuku-primary);font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.tuku-icon-btn,.iconbtn{
  width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:11px;
  background:var(--tuku-surface-2);color:var(--tuku-text);font-size:20px;cursor:pointer;
}

.tuku-auth,.signin,.lock{
  position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:20px;
  background:linear-gradient(145deg,var(--tuku-bg),#eef2ef);
}
.tuku-auth.is-open,.signin.show,.lock.show{display:grid}
.tuku-auth-card,.signinbox,.lockbox{
  width:min(430px,100%);background:#fff;border:1px solid var(--tuku-border);
  border-radius:var(--tuku-radius-xl);padding:28px;box-shadow:0 24px 70px rgba(31,41,37,.10);
}
.tuku-auth-card h1,.signinbox h1,.lockbox h1{margin:0 0 8px;color:var(--tuku-text);font-size:24px;font-weight:790;letter-spacing:-.04em}
.tuku-auth-card p,.signinbox p,.lockbox p{margin:0 0 18px;color:var(--tuku-muted);font-size:13px;line-height:1.5}
.tuku-auth-card .tuku-brand-mark,.signinbox .brandmark,.lockbox .mark{width:48px;height:48px;margin-bottom:18px;border-radius:16px;font-size:22px}
.tuku-error,.error{color:var(--tuku-danger);font-size:11px;margin-top:10px;min-height:16px}

.tuku-toast,.toast{
  position:fixed;right:18px;bottom:18px;z-index:110;
  background:#23362e;color:#fff;padding:10px 12px;border-radius:12px;
  font-size:11px;opacity:0;transform:translateY(8px);pointer-events:none;transition:.2s;
}
.tuku-toast.is-visible,.toast.show{opacity:1;transform:none}

@media(max-width:900px){
  .tuku-grid-2,.tuku-grid-3{grid-template-columns:1fr}
}
@media(max-width:760px){
  .tuku-btn,.btn,.tuku-control,.control{min-height:38px;height:38px}
  .tuku-auth-card,.signinbox,.lockbox{padding:22px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}