/* Kimura Operational System — adapted from the approved Stitch prototypes. */
:root {
  --ko-surface: var(--canvas);
  --ko-surface-low: color-mix(in srgb, var(--canvas) 94%, var(--primary));
  --ko-surface-high: color-mix(in srgb, var(--canvas) 86%, var(--primary));
  --ko-focus: color-mix(in srgb, var(--primary) 36%, transparent);
  --ko-radius-sm: 8px;
  --ko-radius: 12px;
  --ko-radius-lg: 16px;
  --ko-control: 44px;
  --ko-gap-1: 8px;
  --ko-gap-2: 12px;
  --ko-gap-3: 16px;
  --ko-gap-4: 24px;
  --ko-gap-5: 32px;
  --ko-shadow: 0 1px 2px rgb(15 23 42 / .04), 0 14px 36px -28px rgb(15 23 42 / .32);
}
.ko-dim {
  --canvas: #08111F;
  --sidebar: #0C1728;
  --card: #111C2E;
  --border: #283A52;
  --text: #F1F5F9;
  --muted: #A8B5C7;
  --wash: #182A42;
  --primary: #38BDF8;
  --primary-text: #08111F;
  --deep: #7DD3FC;
  --secondary: #2DD4BF;
  --warn: #FB7185;
  --warn-bg: #3A1825;
}

html { color-scheme: light; scroll-behavior: smooth; }
html.ko-dim { color-scheme: dark; }
body { letter-spacing: -.005em; font-family: 'Inter', system-ui, -apple-system, sans-serif; line-height: 1.5; overflow-x: hidden; }
body.st-menu-open { overflow: hidden; }
h1, .h1, h2, .h2, h3, .h3 { font-family: 'Hanken Grotesk', 'Inter', system-ui, sans-serif; }
.ko-skip-link { position: fixed; top: 8px; left: 8px; z-index: 9999; transform: translateY(-160%); background: var(--deep); color: #fff; padding: 10px 14px; border-radius: var(--ko-radius); text-decoration: none; }
.ko-skip-link:focus { transform: translateY(0); }
.st-sidebar { width: 256px; background: var(--sidebar); box-shadow: none; }
.st-main { margin-left: 256px; min-width: 0; }
.st-sidebar-header { min-height: 52px; padding: 7px 12px 5px; }
.st-sidebar-title-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.st-sidebar-collapse { width: 28px; height: 28px; flex: 0 0 28px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 8px; color: var(--muted); background: var(--card); cursor: pointer; font-size: .68rem; transition: color .2s ease,border-color .2s ease,background-color .2s ease,transform .42s cubic-bezier(.22,1,.36,1); }
.st-sidebar-collapse:hover { color: var(--deep); border-color: var(--primary); }
.st-sidebar-header .brand { font-family: 'Hanken Grotesk', 'Inter', system-ui, sans-serif; font-size: 1.05rem; line-height: 1; letter-spacing: -.03em; color: var(--deep); }
.st-sidebar-header .brand i { border: 1.5px solid currentColor; border-radius: 3px; padding: 2px; font-size: .68rem; }
.st-sidebar-header .sub { max-width: 190px; margin: 3px 0 0 29px; overflow: hidden; color: var(--muted); font-size: 8.5px; line-height: 1; letter-spacing: .075em; text-overflow: ellipsis; white-space: nowrap; }
.st-cta { margin: 10px 16px 12px; }
.st-cta .btn { min-height: 38px; padding-block: 7px; font-size: .82rem; }
.st-nav { padding: 6px 10px 10px; gap: 6px; }
.st-nav-link { min-height: 40px; padding: 8px 13px; border-radius: 10px; font-size: 14px; line-height: 1.25; gap: 10px; }
.st-nav > .st-nav-link { cursor: grab; user-select: none; }
.st-nav > .st-nav-link:active { cursor: grabbing; }
.st-nav > .st-nav-link.is-dragging { opacity: .42; border: 1px dashed var(--primary); background: var(--wash); }
.st-nav-grip { width: 12px !important; margin-left: auto; font-size: .8rem !important; opacity: .28 !important; }
.st-nav-link:hover .st-nav-grip { opacity: .7 !important; }
.st-nav-link i { font-size: 1rem; width: 20px; }
.st-nav-link.active { color: var(--deep); background: color-mix(in srgb, var(--primary) 13%, var(--sidebar)); box-shadow: inset -4px 0 0 var(--primary); }
.st-sidebar-footer { position: relative; padding: 10px 12px 14px; gap: 2px; }
.st-sidebar-footer-controls { display:flex; align-items:center; gap:6px; min-width:0; }
.st-sidebar-footer .st-nav-link.st-footer-link { min-height: 34px; padding: 6px 10px; gap: 9px; border-radius: 9px; font-size: 12.5px; opacity: .72; }
.st-sidebar-footer .st-nav-link.st-footer-link i { width: 17px; font-size: .9rem; }
.st-sidebar-footer .st-nav-link.st-footer-link:hover { opacity: 1; transform: none; }
.st-footer-form { margin: 0; }
.st-footer-form .st-footer-logout { color: var(--warn); }
.st-profile-trigger { width: auto; min-width:0; flex:1 1 auto; min-height: 48px; display: grid; grid-template-columns: 34px minmax(0,1fr) 20px; align-items: center; gap: 9px; padding: 7px; border: 1px solid transparent; border-radius: 11px; background: transparent; color: var(--text); text-align: left; }
.st-profile-trigger:hover,.st-profile-trigger[aria-expanded="true"] { background: var(--wash); border-color: var(--border); }
.st-profile-trigger .st-avatar { width: 34px; height: 34px; }
.st-profile-trigger-copy { min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.st-profile-trigger-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; }
.st-profile-trigger-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10.5px; color: var(--muted); }
.st-profile-trigger-more { color: var(--muted); }
.st-profile-drawer { position: absolute; z-index: 70; left: 12px; bottom: calc(100% + 4px); width: 236px; max-height: calc(100dvh - 76px); overflow-y: auto; padding: 8px; border: 1px solid var(--border); border-radius: 14px; background: var(--card); color: var(--text); box-shadow: 0 20px 48px -20px rgb(15 23 42 / .52); }
body[data-theme="chameleon_glass"] .st-profile-drawer { background: rgb(248 251 252 / .96); border-color: rgb(106 123 143 / .24); -webkit-backdrop-filter: blur(28px) saturate(165%); backdrop-filter: blur(28px) saturate(165%); box-shadow: 0 24px 60px -20px rgb(31 45 61 / .38), inset 0 1px 0 rgb(255 255 255 / .92); }
html.ko-dim body[data-theme="chameleon_glass"] .st-profile-drawer { background: rgb(16 24 34 / .96); border-color: rgb(203 213 225 / .18); box-shadow: 0 24px 60px -18px rgb(0 0 0 / .68), inset 0 1px 0 rgb(255 255 255 / .08); }
.st-profile-drawer[hidden] { display: none; }
.st-profile-drawer-head { display: grid; grid-template-columns: 34px minmax(0,1fr); align-items: center; gap: 9px; padding: 7px 8px 11px; border-bottom: 1px solid var(--border); }
.st-profile-drawer-head > span:last-child { min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.st-profile-drawer-head strong { font-size: 12.5px; }
.st-profile-drawer-head small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10.5px; color: var(--muted); }
.st-profile-drawer-links { padding: 6px 0; }
.st-profile-drawer-links a,.st-profile-drawer-links button,.st-profile-drawer-logout button { width: 100%; min-height: 36px; display: grid; grid-template-columns: 20px minmax(0,1fr) auto; align-items: center; gap: 8px; padding: 7px 9px; border: 0; border-radius: 8px; background: transparent; color: var(--text); text-align: left; text-decoration: none; font-size: 12.5px; }
.st-profile-drawer-links a:hover,.st-profile-drawer-links button:hover,.st-profile-drawer-logout button:hover { background: var(--wash); color: var(--deep); }
.st-profile-drawer-links small { font-size: 10px; color: var(--muted); }
.st-profile-drawer-logout { margin: 0; padding-top: 6px; border-top: 1px solid var(--border); }
.st-profile-drawer-logout button { color: var(--warn); }
@media (min-width:1081px) {
  .st-sidebar,.st-main { transition: width .42s cubic-bezier(.22,1,.36,1),margin-left .42s cubic-bezier(.22,1,.36,1); will-change:width,margin-left; }
  .st-sidebar { overflow-x:hidden; }
  .st-nav-label { display:inline-block; max-width:190px; overflow:hidden; opacity:1; transform:translateX(0); white-space:nowrap; transition:max-width .42s cubic-bezier(.22,1,.36,1),opacity .2s ease,transform .42s cubic-bezier(.22,1,.36,1); }
  .st-sidebar-header .brand { position:relative; overflow:hidden; transition:width .42s cubic-bezier(.22,1,.36,1),max-width .42s cubic-bezier(.22,1,.36,1); }
  .st-sidebar-header .brand-full,.st-sidebar-header .brand-mark { transition:opacity .24s ease,transform .42s cubic-bezier(.22,1,.36,1); }
  .st-sidebar-header .brand-mark { display:block; position:absolute; left:0; top:50%; opacity:0; transform:translate(-8px,-50%); }
  html.ko-sidebar-collapsed .st-sidebar { width: 72px; }
  html.ko-sidebar-collapsed .st-main { margin-left: 72px; }
  html.ko-sidebar-collapsed .st-sidebar-header { padding-inline: 10px; }
  html.ko-sidebar-collapsed .st-sidebar-title-row { justify-content:center; }
  html.ko-sidebar-collapsed .st-sidebar-header .brand { width:34px;max-width:34px;height:43px;justify-content:center;overflow:visible; }
  html.ko-sidebar-collapsed .st-sidebar-header .brand-full { display:block; opacity:0; transform:translateX(-12px); }
  html.ko-sidebar-collapsed .st-sidebar-header .brand-mark { display:block;width:34px;left:50%;opacity:1;transform:translate(-50%,-50%); }
  html.ko-sidebar-collapsed .st-sidebar-header .brand i { font-size: 1rem; }
  html.ko-sidebar-collapsed .st-sidebar-header .sub { display: none; }
  html.ko-sidebar-collapsed .st-cta { margin-inline: 10px; }
  html.ko-sidebar-collapsed .st-cta .btn { padding-inline: 0; }
  html.ko-sidebar-collapsed .st-cta .btn i { font-size: 1rem; margin: 0; }
  html.ko-sidebar-collapsed .st-nav { padding-inline: 10px; }
  html.ko-sidebar-collapsed .st-nav-link { justify-content: center; gap: 0; padding-inline: 0; }
  html.ko-sidebar-collapsed .st-nav-label { max-width:0; opacity:0; transform:translateX(-10px); }
  html.ko-sidebar-collapsed .st-nav-link > i:not(.st-nav-grip) { width: auto; font-size: 1rem; }
  html.ko-sidebar-collapsed .st-nav-grip { display: none; }
  html.ko-sidebar-collapsed .st-sidebar-footer { padding-inline: 10px; }
  html.ko-sidebar-collapsed .st-sidebar-footer-controls { flex-direction:column; gap:5px; }
  html.ko-sidebar-collapsed .st-profile-trigger { display: flex; justify-content: center; padding-inline: 0; }
  html.ko-sidebar-collapsed .st-profile-trigger-copy,html.ko-sidebar-collapsed .st-profile-trigger-more { display: none; }
  html.ko-sidebar-collapsed .st-profile-drawer { left: 68px; bottom: 8px; }
}
@media (max-height:800px) and (min-width:1081px) {
  .st-sidebar-header { padding: 7px 12px 5px; }
  .st-sidebar-header .brand { font-size: 1.05rem; }
  .st-sidebar-header .sub { font-size: 8.5px; margin-left: 29px; }
  .st-cta { margin: 6px 14px 7px; }
  .st-cta .btn { min-height: 32px; padding-block: 4px; font-size: .75rem; }
  .st-nav { gap: 4px; }
  .st-nav-link { min-height: 34px; padding: 5px 12px; font-size: 13px; gap: 8px; }
  .st-nav-link i { width: 17px; font-size: .88rem; }
  .st-sidebar-footer { padding-block: 5px 7px; }
}
.st-topbar { height: 52px; background: color-mix(in srgb, var(--canvas) 94%, transparent); padding: 0 22px; }
.st-content { padding: clamp(24px, 3vw, 40px); max-width: 1600px; min-width: 0; width: 100%; margin: 0 auto; }
.st-topbar > .d-flex:first-child { flex: 1 1 auto; min-width: 0; margin-right: 24px; }
.st-search { width: 100%; max-width: 820px; position: relative; }
.st-search i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: .82rem; }
.st-search input { min-height: 34px; height: 34px; padding-left: 36px; border-radius: 18px; font-size: 12.5px; background: color-mix(in srgb, var(--canvas) 80%, var(--card)); }
.st-icon-btn { width: 32px; height: 32px; border: 0; border-radius: 50%; background: transparent; color: var(--text); display: inline-grid; place-items: center; font-size: .98rem; }
.st-icon-btn:hover { background: var(--wash); color: var(--deep); }

/* Shared profile layout: compact, content-led columns in every theme. */
.ko-profile-page { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 16px; max-width: 1180px; margin: 0 auto; }
.ko-profile-column { display: grid; min-width: 0; gap: 16px; align-content: start; }
.ko-profile-card { min-width: 0; overflow: hidden; }
.ko-profile-card .card-body { padding: clamp(18px, 2vw, 24px) !important; }
.ko-profile-card h1,.ko-profile-card h2 { margin: 0 0 16px; font-size: clamp(1.2rem, 1.7vw, 1.5rem) !important; }
.ko-profile-form { display: grid; gap: 13px; }
.ko-profile-form > div { min-width: 0; }
.ko-profile-form .form-label { margin-bottom: 5px; }
.ko-profile-form .form-control,.ko-profile-inline-form .form-control { min-height: 42px; height: 42px; }
.ko-profile-form > .btn { justify-self: start; margin-top: 1px; }
.ko-profile-copy { margin: -3px 0 14px; line-height: 1.5; }
.ko-profile-inline-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.ko-profile-email-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ko-profile-email-form > .btn { grid-column: 1 / -1; }
@media (min-width: 1080px) {
  .ko-profile-page { grid-template-columns: 1fr; max-width: 1480px; }
  .ko-profile-column { display: contents; }
  .ko-profile-column:first-child > .ko-profile-card:first-child { grid-row: 1; }
  .ko-profile-column:nth-child(2) > .ko-profile-card:first-child { grid-row: 2; }
  .ko-profile-column:first-child > .ko-profile-card:nth-child(2) { grid-row: 3; }
  .ko-profile-column:nth-child(2) > .ko-profile-card:nth-child(2) { grid-row: 4; }
  .ko-profile-card .card-body { padding-block: 18px !important; }
  .ko-profile-card h1,.ko-profile-card h2 { margin-bottom: 12px; }
  .ko-profile-column:first-child > .ko-profile-card:first-child .ko-profile-form { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; align-items: end; }
  .ko-profile-column:nth-child(2) > .ko-profile-card:first-child .ko-profile-form { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: end; }
  .ko-profile-email-form { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; align-items: end; }
  .ko-profile-form > .btn,.ko-profile-email-form > .btn { grid-column: auto; align-self: end; min-height: 42px; white-space: nowrap; }
  .ko-profile-column:first-child > .ko-profile-card:nth-child(2) .card-body { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 18px; }
  .ko-profile-column:first-child > .ko-profile-card:nth-child(2) h2 { grid-column: 1 / -1; }
  .ko-profile-column:first-child > .ko-profile-card:nth-child(2) .ko-profile-copy { margin: 0; }
}
@media (max-width: 900px) { .ko-profile-page { grid-template-columns: 1fr; max-width: 680px; } }
@media (max-width: 520px) { .ko-profile-email-form,.ko-profile-inline-form { grid-template-columns: 1fr; } .ko-profile-inline-form .btn { justify-self: start; } }
.st-topbar-actions { gap: 6px; }
.st-mobile-menu { display: none; }
.st-sidebar-backdrop { display: none; position: fixed; inset: 0; z-index: 35; border: 0; background: rgb(15 23 42 / .46); backdrop-filter: blur(2px); }

.card, .modal-content, .dropdown-menu, .list-group, .accordion-item { min-width: 0; border-color: var(--border); background: var(--card); color: var(--text); border-radius: var(--ko-radius-lg); box-shadow: var(--ko-shadow); }
.card-header, .card-footer, .modal-header, .modal-footer { background: transparent; border-color: var(--border); padding: 18px 20px; }
.card-body { padding: clamp(18px, 2vw, 24px); }
.btn { border-radius: var(--ko-radius); min-height: 40px; padding-inline: 16px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.btn-sm { min-height: 32px; }
.form-control, .form-select { min-height: var(--ko-control); border-radius: var(--ko-radius); background-color: var(--card); color: var(--text); }
.form-control::placeholder { color: color-mix(in srgb, var(--muted) 78%, transparent); }
.form-control:disabled, .form-select:disabled { background: color-mix(in srgb, var(--canvas) 84%, var(--border)); color: var(--muted); opacity: 1; }
.form-check-input { border-color: var(--border); background-color: var(--card); }
.form-check-input:checked { background-color: var(--primary); border-color: var(--primary); }
.form-label { text-transform: none; letter-spacing: 0; font-size: 12px; }
.table-responsive { border: 1px solid var(--border); border-radius: var(--ko-radius-lg); background: var(--card); box-shadow: var(--ko-shadow); }
.table { color: var(--text); margin-bottom: 0; }
.table thead th { height: 44px; white-space: nowrap; background: color-mix(in srgb, var(--canvas) 72%, var(--card)); }
.table tbody td { min-height: 52px; padding-block: 13px; }
.table.bg-white, .bg-white, .bg-light { background-color: var(--card) !important; color: var(--text) !important; }
.border, .border-top, .border-bottom, .border-start, .border-end { border-color: var(--border) !important; }
.rounded { border-radius: var(--ko-radius) !important; }
.modal-backdrop { background: #0f172a; }
.modal-content .btn-close { filter: var(--bs-btn-close-white-filter, none); }
.alert { padding: 14px 16px; box-shadow: none; }
.progress { background: color-mix(in srgb, var(--border) 72%, transparent); border-radius: 999px; }
.progress-bar { background: var(--primary); }
.pagination { gap: 6px; }
.page-link { border-radius: var(--ko-radius-sm) !important; border-color: var(--border); background: var(--card); color: var(--deep); }
.page-link:hover, .page-link:focus { background: var(--wash); color: var(--deep); }
.nav-tabs { border-color: var(--border); gap: 4px; }
.nav-tabs .nav-link { color: var(--muted); border-radius: var(--ko-radius-sm) var(--ko-radius-sm) 0 0; }
.nav-tabs .nav-link.active { background: var(--card); color: var(--deep); border-color: var(--border) var(--border) var(--card); }
.empty-state, .ko-empty { padding: 40px 24px; text-align: center; color: var(--muted); border: 1px dashed var(--border); border-radius: var(--ko-radius-lg); background: color-mix(in srgb, var(--card) 84%, var(--canvas)); }
.ko-state { min-height: 240px; padding: 40px 24px; display: grid; place-items: center; align-content: center; gap: 10px; text-align: center; color: var(--muted); border: 1px dashed var(--border); border-radius: var(--ko-radius-lg); background: color-mix(in srgb,var(--card) 84%,var(--canvas)); }
.ko-state > i { font-size: 2rem; color: var(--primary); }
.ko-state > p { max-width: 560px; margin: 0; }
.ko-state-compact { min-height: 0; padding: 16px; display: flex; justify-content: flex-start; text-align: left; }
.ko-offline { position: fixed; left: 50%; bottom: 20px; z-index: 100; transform: translateX(-50%); max-width: calc(100vw - 28px); padding: 10px 16px; border-radius: 999px; color: var(--primary-text); background: var(--warn); box-shadow: var(--ko-shadow); }
:where(a,button,input,select,textarea,[tabindex]):focus-visible { outline: 3px solid color-mix(in srgb,var(--primary) 70%,white); outline-offset: 3px; }
[aria-busy="true"] { cursor: wait; opacity: .72; }
.ko-settings-grid > [class*="col-"] > .card { height: 100%; }
.ko-settings-grid .card > h6:first-child { font-size: 1rem; }
.ko-theme-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.ko-theme-option { position: relative; min-width: 0; padding: 14px; border: 1px solid var(--border); border-radius: var(--ko-radius); cursor: pointer; display: grid; grid-template-columns: 72px minmax(0, 1fr) 20px; align-items: center; gap: 12px; background: var(--card); }
.ko-theme-option:hover { border-color: var(--primary); transform: translateY(-1px); }
.ko-theme-option.is-selected { border-color: var(--primary); box-shadow: 0 0 0 3px var(--ko-focus); }
.ko-theme-option input { position: absolute; opacity: 0; pointer-events: none; }
.ko-theme-option strong, .ko-theme-option small { display: block; }
.ko-theme-option small { color: var(--muted); margin-top: 2px; }
.ko-theme-check { color: var(--primary); opacity: 0; }
.ko-theme-option.is-selected .ko-theme-check { opacity: 1; }
.ko-theme-preview { width: 72px; height: 52px; overflow: hidden; border-radius: 9px; display: grid; grid-template-columns: 18px 1fr; grid-template-rows: 14px 1fr; border: 1px solid rgb(15 23 42 / .12); background: var(--preview-canvas); }
.ko-theme-preview i { grid-row: 1 / 3; background: var(--preview-sidebar); }
.ko-theme-preview b { background: var(--preview-primary); margin: 5px 7px 3px; border-radius: 4px; }
.ko-theme-preview em { background: var(--preview-card); margin: 2px 7px 7px; border-radius: 5px; box-shadow: 0 1px 3px rgb(15 23 42 / .12); }
.ko-theme-modern_professional { --preview-canvas: #F7F9FC; --preview-sidebar: #EEF2F7; --preview-card: #FFFFFF; --preview-primary: #0F2747; }
.ko-theme-serene_enterprise { --preview-canvas: #08111F; --preview-sidebar: #0C1728; --preview-card: #111C2E; --preview-primary: #38BDF8; }
.ko-theme-sage_studio { --preview-canvas:#F5F7F2; --preview-sidebar:#F8FAF6; --preview-card:#FFFEFC; --preview-primary:#496B55; }
.ko-theme-solar_amber { --preview-canvas:#FFFAEF; --preview-sidebar:#FFFCF5; --preview-card:#FFFFFF; --preview-primary:#9A5B08; }
.ko-theme-obsidian_velvet { --preview-canvas:#09090B; --preview-sidebar:#0D0D11; --preview-card:#121217; --preview-primary:#A78BFA; }
.ko-theme-polar_cobalt { --preview-canvas:#F6FAFF; --preview-sidebar:#FBFDFF; --preview-card:#FFFFFF; --preview-primary:#1A4DD0; }
.ko-theme-mineral_sky { --preview-canvas:#F5F9FA; --preview-sidebar:#F9FCFC; --preview-card:#FFFFFF; --preview-primary:#1686B8; }
.ko-theme-my_kimura_customized { --preview-canvas:#F5F8EF; --preview-sidebar:#FBFCF8; --preview-card:#FFFFFF; --preview-primary:#6F9E20; }
.ko-theme-pastel_signal { --preview-canvas:#F8FAFF; --preview-sidebar:#FCFCFF; --preview-card:#FFFFFF; --preview-primary:#6868E8; }
.ko-theme-dribbble_pastel { --preview-canvas:#F7F8FC; --preview-sidebar:#FCFCFF; --preview-card:#FFFFFF; --preview-primary:#6D63D9; }
.ko-theme-dribbble_sorbet { --preview-canvas:#F1F3F8; --preview-sidebar:#FBFBFD; --preview-card:#C9EACF; --preview-primary:#7772C8; }
.ko-theme-sorbet_workspace { --preview-canvas:#F1F3F8; --preview-sidebar:#FBFBFD; --preview-card:#F7C3C8; --preview-primary:#7772C8; }
.ko-theme-chameleon_glass { --preview-canvas:#DCEEF0; --preview-sidebar:rgba(255,255,255,.72); --preview-card:rgba(255,255,255,.62); --preview-primary:#4263EB; }
.ko-theme-polar_cursor { --preview-canvas:#F3F2ED; --preview-sidebar:#E4E3DD; --preview-card:#FAF9F5; --preview-primary:#171717; }
body[data-theme="sage_studio"], body[data-theme="solar_amber"], body[data-theme="obsidian_velvet"], body[data-theme="polar_cobalt"], body[data-theme="mineral_sky"], body[data-theme="my_kimura_customized"], body[data-theme="pastel_signal"], body[data-theme="dribbble_pastel"], body[data-theme="dribbble_sorbet"], body[data-theme="sorbet_workspace"] { background: var(--canvas); }
.ko-custom-theme-launch { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ko-custom-theme-trigger,.ko-dialog-action,.ko-dialog-close { border: 1px solid var(--border); color: var(--text); background: var(--card); font: 600 13px var(--font-sans); transition: transform .15s ease,border-color .15s ease,background .15s ease; }
.ko-custom-theme-trigger { display: inline-flex; align-items: center; gap: 5px; min-height: 34px; padding: 7px 12px; border-color: var(--primary); border-radius: 10px; color: var(--deep); }
.ko-custom-theme-trigger:hover,.ko-dialog-action:hover,.ko-dialog-close:hover { transform: translateY(-1px); border-color: var(--primary); }
.ko-custom-theme-dialog { width: min(920px, calc(100vw - 40px)); max-width: none; max-height: min(760px, calc(100dvh - 64px)); margin: auto; padding: 0; color: var(--text); background: transparent; border: 0; border-radius: var(--ko-radius); overflow: hidden; }
.ko-custom-theme-dialog::backdrop { background: rgb(15 23 42 / .54); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
.ko-custom-theme-dialog-content { display: flex; max-height: min(760px, calc(100dvh - 64px)); min-width: 0; flex-direction: column; background: var(--card); border: 1px solid var(--border); border-radius: var(--ko-radius); box-shadow: 0 26px 80px -28px rgb(15 23 42 / .72); overflow: hidden; }
.ko-custom-theme-dialog-header,.ko-custom-theme-dialog-footer { display: flex; flex: 0 0 auto; align-items: center; gap: 12px; padding: 14px 16px; background: var(--surface-2); border-color: var(--border); }
.ko-custom-theme-dialog-header { justify-content: space-between; border-bottom: 1px solid var(--border); }
.ko-custom-theme-dialog-footer { justify-content: flex-end; flex-wrap: wrap; border-top: 1px solid var(--border); }
.ko-custom-theme-dialog-body { min-width: 0; padding: 16px; overflow: auto; }
.ko-dialog-close { display: grid; flex: 0 0 34px; width: 34px; height: 34px; padding: 0; place-items: center; border-radius: 10px; }
.ko-dialog-action { min-height: 38px; padding: 8px 14px; border-radius: 10px; }
.ko-dialog-action.is-primary { color: var(--primary-text); background: var(--primary); border-color: var(--primary); }
.ko-dialog-action.is-secondary { background: var(--card); }
.ko-dialog-action.is-preview { color: var(--deep); background: var(--surface-2); border-color: var(--primary); }
.ko-theme-preview-bar { position: fixed; z-index: 1100; right: 20px; bottom: 20px; display: flex; max-width: calc(100vw - 40px); align-items: center; gap: 18px; padding: 11px 12px 11px 14px; color: var(--text); background: color-mix(in srgb,var(--card) 92%,transparent); border: 1px solid var(--primary); border-radius: 14px; box-shadow: 0 20px 50px -22px rgb(15 23 42 / .72); backdrop-filter: blur(16px); }
.ko-theme-preview-bar[hidden] { display: none; }
.ko-theme-preview-bar>span:first-child { display: grid; grid-template-columns: 24px auto; column-gap: 8px; align-items: center; }
.ko-theme-preview-bar>span:first-child>i { grid-row: 1/3; color: var(--primary); font-size: 18px; }
.ko-theme-preview-bar strong,.ko-theme-preview-bar small { display: block; }
.ko-theme-preview-bar strong { font-size: 12px; }
.ko-theme-preview-bar small { color: var(--muted); font-size: 10px; }
.ko-theme-preview-actions { display: flex; gap: 7px; }
.ko-custom-theme-dialog form,.ko-color-modes,.ko-color-mode-column,.ko-color-mode { min-width: 0; max-width: 100%; box-sizing: border-box; }
.ko-color-modes { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; align-items: stretch; overflow: hidden; }
.ko-color-mode-column { min-width: 0; }
.ko-color-mode { border: 1px solid var(--border); border-radius: 14px; padding: 14px; background: var(--card); }
.ko-color-mode-header { display: flex; align-items: center; gap: 8px; min-height: 34px; margin: -4px 0 8px; color: var(--text); font: 600 16px/1.25 var(--font-sans); }
.ko-color-mode-header i { flex: 0 0 auto; font-size: 18px; color: var(--primary); }
.ko-color-mode-dark { color: var(--palette-text,#F8FAFC); background: radial-gradient(circle at 88% 0,color-mix(in srgb,var(--palette-accent,#818CF8) 15%,transparent),transparent 44%),linear-gradient(145deg,color-mix(in srgb,var(--palette-panel,#171817) 92%,#334155),var(--palette-canvas,#0C0C0C)); border-color: color-mix(in srgb,var(--palette-muted,#94A3B8) 28%,transparent); box-shadow: inset 0 1px 0 rgb(255 255 255 / .06),0 16px 32px -28px rgb(0 0 0 / .9); }
.ko-color-mode-dark .ko-color-mode-header { color: var(--palette-text,#F8FAFC); }
.ko-color-mode-dark .ko-color-mode-header i { color: var(--palette-accent,#A3E635); }
.ko-color-mode-dark>p.text-muted { color: var(--palette-muted,#A6AAA3)!important; }
.ko-color-mode-dark .ko-color-control { color: var(--palette-text,#F8FAFC); background: color-mix(in srgb,var(--palette-panel,#171817) 88%,white 4%); border-color: color-mix(in srgb,var(--palette-muted,#94A3B8) 24%,transparent); }
.ko-color-mode-dark .ko-color-control strong { color: var(--palette-text,#F8FAFC); }
.ko-color-mode-dark .ko-color-control small { color: var(--palette-muted,#A6AAA3); }
.ko-color-mode-dark .ko-color-control.is-active { border-color: var(--palette-accent,#A3E635); box-shadow: 0 0 0 2px color-mix(in srgb,var(--palette-accent,#A3E635) 22%,transparent); }
.ko-color-mode-dark .ko-color-control input[type="color"] { background: var(--palette-panel,#171817); border-color: color-mix(in srgb,var(--palette-muted,#94A3B8) 34%,transparent); }
.ko-color-mode-dark .ko-spectrum-grid { background: color-mix(in srgb,var(--palette-canvas,#0C0C0C) 88%,white 3%); border-color: color-mix(in srgb,var(--palette-muted,#94A3B8) 24%,transparent); }
.ko-color-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.ko-color-control { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 9px; border: 1px solid var(--border); border-radius: 11px; background: var(--canvas); cursor: pointer; }
.ko-color-control.is-active { border-color: var(--primary); box-shadow: 0 0 0 2px color-mix(in srgb,var(--primary) 18%,transparent); }
.ko-color-control input[type="color"] { width: 38px; height: 38px; flex: 0 0 38px; padding: 2px; border: 1px solid var(--border); border-radius: 9px; background: var(--card); cursor: pointer; }
.ko-color-control strong,.ko-color-control small { display: block; line-height: 1.2; }
.ko-color-control strong { color: var(--text); font-size: 12px; }
.ko-color-control small { margin-top: 3px; font: 500 10px ui-monospace,SFMono-Regular,monospace; color: var(--muted); }
.ko-spectrum-grid { display: grid; grid-template-columns: repeat(9,minmax(20px,1fr)); gap: 5px; padding: 8px; border: 1px solid var(--border); border-radius: 12px; background: var(--canvas); }
.ko-spectrum-swatch { aspect-ratio: 1; min-width: 0; border: 1px solid color-mix(in srgb,var(--swatch) 70%,#64748B); border-radius: 6px; background: var(--swatch); cursor: pointer; transition: transform .12s ease,box-shadow .12s ease; }
.ko-spectrum-swatch:hover,.ko-spectrum-swatch:focus-visible { z-index: 1; transform: scale(1.18); box-shadow: 0 0 0 2px var(--card),0 0 0 4px var(--primary); }
@media (max-width:575px){.ko-color-grid{grid-template-columns:1fr}}
@media (max-width:575px){.ko-spectrum-grid{grid-template-columns:repeat(7,minmax(20px,1fr))}}
@media (max-width:900px){.ko-color-modes{grid-template-columns:1fr}.ko-color-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.ko-spectrum-grid{grid-template-columns:repeat(12,minmax(18px,1fr))}}
@media (max-width:760px){.ko-color-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ko-spectrum-grid{grid-template-columns:repeat(9,minmax(18px,1fr))}}
@media (max-width:600px){.ko-custom-theme-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 20px)}.ko-custom-theme-dialog-content{max-height:calc(100dvh - 20px)}.ko-custom-theme-dialog-footer{align-items:stretch;flex-direction:column}.ko-custom-theme-dialog-footer .me-auto{margin-right:0!important}.ko-dialog-action{width:100%}.ko-theme-preview-bar{right:10px;bottom:10px;left:10px;align-items:stretch;flex-direction:column}.ko-theme-preview-actions .ko-dialog-action{width:auto;flex:1}}
@media (max-width:480px){.ko-color-grid{grid-template-columns:1fr}.ko-spectrum-grid{grid-template-columns:repeat(6,minmax(18px,1fr))}}
body[data-theme="obsidian_velvet"] .ko-integration-canvas { box-shadow: inset 0 1px 0 rgb(255 255 255 / .035), 0 0 28px rgb(167 139 250 / .025); }
body[data-theme="pastel_signal"] .ko-metric:nth-child(1) { --pastel-tint:#EEF3FF; }
body[data-theme="pastel_signal"] .ko-metric:nth-child(2) { --pastel-tint:#EAF9F5; }
body[data-theme="pastel_signal"] .ko-metric:nth-child(3) { --pastel-tint:#F3EEFF; }
body[data-theme="pastel_signal"] .ko-metric:nth-child(4) { --pastel-tint:#FFF0F3; }
body[data-theme="pastel_signal"] .ko-metric { background: linear-gradient(145deg,var(--card),var(--pastel-tint)); }

/* Polar Cursor — quiet browser-agent chrome with Cursor-like density and hierarchy. */
body[data-theme="polar_cursor"] { background: var(--canvas); letter-spacing: -.012em; }
body[data-theme="polar_cursor"] h1,body[data-theme="polar_cursor"] h2,body[data-theme="polar_cursor"] h3,body[data-theme="polar_cursor"] h4,body[data-theme="polar_cursor"] h5,body[data-theme="polar_cursor"] h6 { font-family: var(--font-sans); font-weight: 600; letter-spacing: -.035em; }
body[data-theme="polar_cursor"] .st-sidebar { background: var(--sidebar); border-right-color: var(--border); }
body[data-theme="polar_cursor"] .st-sidebar-header::after { background: var(--border); }
body[data-theme="polar_cursor"] .st-sidebar-header .brand { color: var(--text); font-weight: 600; }
body[data-theme="polar_cursor"] .st-nav-link { border-radius: 7px; font-weight: 500; }
body[data-theme="polar_cursor"] .st-nav-link:hover { transform: none; background: color-mix(in srgb,var(--card) 60%,transparent); }
body[data-theme="polar_cursor"] .st-nav-link.active { color: var(--primary-text); background: var(--primary); box-shadow: none; }
body[data-theme="polar_cursor"] .st-nav-link.active::before { display: none; }
body[data-theme="polar_cursor"] .st-topbar { background: color-mix(in srgb,var(--canvas) 94%,transparent); border-bottom-color: var(--border); backdrop-filter: blur(14px); }
body[data-theme="polar_cursor"] .st-search { background: var(--card); border-color: var(--border); border-radius: 8px; box-shadow: inset 0 1px 0 color-mix(in srgb,white 52%,transparent); }
body[data-theme="polar_cursor"] .card,body[data-theme="polar_cursor"] .ko-bento-cell,body[data-theme="polar_cursor"] .ko-inbox-workspace { border-color: var(--border); border-radius: 10px; box-shadow: var(--token-depth); }
body[data-theme="polar_cursor"] .card::before { display: none; }
body[data-theme="polar_cursor"] .btn { border-radius: 7px; box-shadow: none; font-weight: 500; }
body[data-theme="polar_cursor"] .btn-primary { background: var(--primary); border-color: var(--primary); box-shadow: none; }
body[data-theme="polar_cursor"] .form-control,body[data-theme="polar_cursor"] .form-select,body[data-theme="polar_cursor"] .input-group-text { border-radius: 7px; background: var(--card); box-shadow: none; }
body[data-theme="polar_cursor"] .badge { border-radius: 5px; font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-weight: 500; letter-spacing: -.02em; }
body[data-theme="polar_cursor"] .ko-eyebrow,body[data-theme="polar_cursor"] .table thead th { font-family: ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing: .045em; }
body[data-theme="polar_cursor"] .ko-integration,body[data-theme="polar_cursor"] .ko-integration-canvas { border-radius: 8px; box-shadow: none; }
body[data-theme="polar_cursor"] .ko-metric { min-height: 104px; }
body[data-theme="polar_cursor"] .ko-metric-icon,body[data-theme="polar_cursor"] .ko-row-icon { border-radius: 7px; }
body[data-theme="polar_cursor"] .st-profile-drawer { border-radius: 10px; background: var(--card); box-shadow: 0 18px 50px -28px rgb(15 15 14 / .7); }
html.ko-dim body[data-theme="polar_cursor"] {
  --canvas:#141413; --sidebar:#1B1B19; --card:#20201E; --border:#393936;
  --text:#F0EFE9; --muted:#9A9890; --wash:#2A2A27; --primary:#F0EFE9;
  --primary-text:#171716; --deep:#FFFFFF; --secondary:#AAA79E; --accent:#A4A7FF;
  --warn:#F0786E; --warn-bg:#3B2421; --surface-2:#272725;
  --token-depth:0 1px 0 rgb(255 255 255 / .025);
}
html.ko-dim body[data-theme="polar_cursor"] .st-search { box-shadow: inset 0 1px 0 rgb(255 255 255 / .035); }
body[data-theme="dribbble_pastel"] .ko-metric:nth-child(1) { --pastel-tint:#EAF3FF; }
body[data-theme="dribbble_pastel"] .ko-metric:nth-child(2) { --pastel-tint:#E9F8F4; }
body[data-theme="dribbble_pastel"] .ko-metric:nth-child(3) { --pastel-tint:#F1ECFF; }
body[data-theme="dribbble_pastel"] .ko-metric:nth-child(4) { --pastel-tint:#FFF0F3; }
body[data-theme="dribbble_pastel"] .ko-metric { background: linear-gradient(145deg,var(--card),var(--pastel-tint)); }
.ko-filter-card .card-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.ko-filter-card .form-label { margin-bottom: 6px; }
.ko-leads-table td:first-child { min-width: 190px; }
.ko-leads-table td:nth-child(2) { min-width: 200px; }
.ko-leads-table td:last-child { white-space: nowrap; }
.ko-record-form { max-width: 1080px; margin-inline: auto; overflow: hidden; }
.ko-record-form > .card-body { padding: 0; }
.ko-form-section { padding: 24px; }
.ko-form-section + .ko-form-section { border-top: 1px solid var(--border); }
.ko-form-section h2 { margin: 0 0 18px; font-size: 1rem; }
.ko-lead-head { align-items: flex-start; }
.ko-lead-head .stage-badge { display: inline-flex; align-items: center; min-height: 28px; }
.ko-lead-workspace > [class*="col-"] > h5 { margin: 4px 0 10px; font-size: 1rem; }
.ko-lead-workspace pre { color: var(--text); }
.ko-lead-workspace .card[style*="max-height"] { scrollbar-color: var(--border) transparent; }
.ko-record-head { align-items: flex-start; }
.ko-record-head > .badge { padding: 9px 12px; font-size: .78rem; }
.ko-view-switcher { max-width: 100%; overflow-x: auto; scrollbar-width: thin; }
.ko-view-switcher .btn { flex: 0 0 auto; }
.ko-project-card { transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.ko-project-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--primary) 44%, var(--border)); }
#knowledge-body { min-height: 420px; line-height: 1.65; resize: vertical; }
.file-table td:last-child .d-flex { flex-wrap: nowrap; }

.ko-page-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 30px; }
.ko-page-head h1 { margin: 0; font-size: clamp(2rem, 3vw, 3rem); font-weight: 700; letter-spacing: -.04em; }
.ko-page-head p { margin: 8px 0 0; font-size: 1rem; color: var(--muted); }
.ko-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 20px; margin-bottom: 28px; }
.ko-kpi { min-height: 164px; padding: 22px; position: relative; overflow: hidden; }
.ko-kpi-label { font-size: 12px; letter-spacing: .09em; text-transform: uppercase; color: var(--muted); }
.ko-kpi-value { font: 600 2.5rem/1.1 'Hanken Grotesk', var(--font-serif); margin-top: 12px; color: var(--text); }
.ko-kpi-meta { margin-top: 12px; color: var(--deep); font-size: 13px; }
.ko-kpi-danger { background: var(--warn-bg); border-color: color-mix(in srgb, var(--warn) 45%, var(--border)); }
.ko-kpi-danger .ko-kpi-label, .ko-kpi-danger .ko-kpi-value, .ko-kpi-danger .ko-kpi-meta { color: var(--warn); }
.ko-dashboard-grid { display: grid; grid-template-columns: minmax(420px,1.5fr) minmax(280px,.7fr); gap: 20px; }
.ko-panel { min-height: 420px; overflow: hidden; }
.ko-panel-head { padding: 20px 22px; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }
.ko-panel-head h2 { margin: 0; font-size: 1.05rem; }
.ko-panel-body { padding: 12px; }
.ko-action { display: flex; align-items: flex-start; gap: 14px; padding: 16px; border: 1px solid var(--border); border-radius: var(--ko-radius); margin-bottom: 10px; background: var(--card); }
.ko-action-icon { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; display: grid; place-items: center; background: var(--wash); color: var(--deep); }
.ko-action > span:last-child { flex: 1; min-width: 0; padding-top: 1px; text-align: left; }
.ko-action strong { display: block; line-height: 1.3; margin-bottom: 4px; overflow-wrap: normal; word-break: normal; hyphens: none; }
.ko-action .small { display: block; line-height: 1.45; overflow-wrap: normal; word-break: normal; }
.ko-action.is-overdue .ko-action-icon { background: var(--warn-bg); color: var(--warn); }
.ko-stage-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 12px; margin-top: 28px; }
.ko-stage { min-width: 0; padding: 16px; border-top: 4px solid var(--stage-color); }
.ko-stage a { text-decoration: none; color: inherit; }
.ko-stage strong { display: block; font-size: 1.45rem; }
.ko-stage span { display: block; overflow-wrap: normal; word-break: normal; hyphens: none; line-height: 1.35; }
.ko-training { background: linear-gradient(145deg, var(--card), color-mix(in srgb, var(--wash) 60%, var(--card))); }
.ko-pipeline-row { margin-top: 20px; }
.ko-pipeline-row .ko-panel { min-height: 0; }
.ko-pipeline-row .ko-panel-body { padding: 20px 22px 24px; }
.ko-pipeline-row .ko-stage-grid { grid-template-columns: repeat(5,minmax(130px,1fr)); }
.ko-score { width: 104px; height: 104px; margin: 20px auto; border: 6px solid var(--secondary); border-radius: 50%; display: grid; place-items: center; font: 700 2rem 'Hanken Grotesk', sans-serif; }

.ko-call-layout { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(330px,.75fr); min-height: calc(100vh - 160px); border: 1px solid var(--border); border-radius: var(--ko-radius-lg); overflow: hidden; background: var(--card); }
.ko-call-stage { min-height: 640px; display: flex; flex-direction: column; padding: 28px; background: var(--card); }
.ko-call-status { min-height: 70px; display: flex; justify-content: space-between; align-items: center; padding: 18px 22px; border-radius: var(--ko-radius-lg); background: var(--wash); }
.ko-call-person { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.ko-call-person .avatar { width: 170px; height: 170px; font-size: 3.5rem; border: 6px solid var(--primary); background: var(--wash); color: var(--deep); box-shadow: 0 12px 32px -20px var(--primary); }
.ko-call-controls { display: flex; justify-content: center; gap: 22px; padding-top: 24px; }
.ko-call-controls .btn { width: 64px; height: 64px; padding: 0; border-radius: 50%; font-size: 1.25rem; }
.ko-call-controls .ko-start { width: auto; min-width: 174px; border-radius: 32px; padding-inline: 24px; }
.ko-call-transcript { border-left: 1px solid var(--border); display: flex; flex-direction: column; min-width: 0; }
.ko-call-transcript-head { height: 70px; flex: 0 0 70px; padding: 20px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; }
.ko-call-transcript .transcript { flex: 1; max-height: none; overflow-y: auto; padding: 20px; background: var(--canvas); }
.ko-call-transcript #turns p { padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--ko-radius); background: var(--card); }
.ko-transcript-toggle { display: none; }
.ko-report-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.ko-overall-score { min-width: 150px; padding: 18px 26px; text-align: center; }
.ko-score-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; }
.ko-score-card { padding: 16px; min-width: 0; }
.ko-score-card .progress { height: 6px; background: var(--wash); }
.ko-score-card .progress-bar { background: var(--primary); }
.ko-report-pairs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.ko-learning-layout { display: grid; grid-template-columns: minmax(260px,.65fr) minmax(0,1.5fr); gap: 18px; align-items: start; }
.ko-learning-list { position: sticky; top: 82px; max-height: calc(100vh - 110px); overflow: hidden; }
.ko-learning-tabs { overflow-y: auto; }
.ko-learning-tab { width: 100%; padding: 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; text-align: left; color: var(--text); background: transparent; border: 0; border-bottom: 1px solid var(--border); }
.ko-learning-tab span:first-child { min-width: 0; }
.ko-learning-tab strong, .ko-learning-tab small { display: block; overflow: hidden; text-overflow: ellipsis; }
.ko-learning-tab small { margin-top: 4px; color: var(--muted); }
.ko-learning-tab:hover, .ko-learning-tab.active { background: var(--wash); }
.ko-learning-tab.active { box-shadow: inset 4px 0 0 var(--primary); }
.ko-learning-panel[hidden] { display: none; }
.ko-evidence-block { padding: 18px; border: 1px solid var(--border); border-radius: var(--ko-radius); background: var(--canvas); }
.ko-evidence-block blockquote { color: var(--muted); border-left: 3px solid var(--primary); padding-left: 16px; }
.ko-recommendation { background: color-mix(in srgb,var(--secondary) 12%,var(--card)); }

@media (max-width: 1180px) {
  .ko-theme-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ko-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ko-dashboard-grid { grid-template-columns: 1fr 1fr; }
  .ko-training { grid-column: auto; }
  .ko-stage-grid { grid-template-columns: repeat(auto-fit,minmax(145px,1fr)); }
  .ko-score-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1080px) {
  .st-main { margin-left: 0; width: 100%; max-width: 100vw; }
  .st-topbar { height: 50px; padding: 0 12px; }
  .st-content { padding: 24px 16px 96px; }
  .st-mobile-menu { display: inline-grid; }
  .st-topbar > .d-flex:first-child { margin-right: 8px; }
  .st-search { width: 100%; max-width: none; }
  .st-topbar-actions .small { display: none; }
  .st-sidebar.open { box-shadow: 18px 0 45px rgb(15 23 42 / .24); }
  .st-sidebar-backdrop.open { display: block; }
  .st-profile-drawer { position: fixed; left: 12px; right: 12px; bottom: 12px; width: auto; }
  .ko-page-head { align-items: flex-start; }
  .ko-page-head h1 { font-size: 2rem; }
  .ko-dashboard-grid { grid-template-columns: 1fr; }
  .ko-training { grid-column: auto; }
  .ko-pipeline-row .ko-stage-grid { grid-template-columns: repeat(auto-fit,minmax(145px,1fr)); }
  .ko-call-layout { grid-template-columns: 1fr; min-height: auto; }
  .ko-call-stage { min-height: calc(100dvh - 110px); padding-bottom: 104px; }
  .ko-call-controls { position: sticky; bottom: 12px; z-index: 4; width: fit-content; margin-inline: auto; padding: 10px; border: 1px solid var(--border); border-radius: 999px; background: color-mix(in srgb,var(--card) 92%,transparent); backdrop-filter: blur(10px); box-shadow: var(--ko-shadow); }
  .ko-call-transcript { display: none; border-left: 0; border-top: 1px solid var(--border); min-height: 360px; max-height: 72dvh; }
  .ko-call-transcript.is-open { display: flex; }
  .ko-transcript-toggle { display: inline-flex; align-items: center; gap: 6px; }
  .ko-learning-layout { grid-template-columns: 1fr; }
  .ko-learning-list { position: static; max-height: none; }
  .ko-learning-tabs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
  .ko-learning-tab { min-width: min(300px,82vw); border-bottom: 0; border-right: 1px solid var(--border); scroll-snap-align: start; }
  .ko-learning-tab.active { box-shadow: inset 0 -4px 0 var(--primary); }
}
@media (max-width: 576px) {
  .st-search { display: none; }
  .ko-page-head { display: block; }
  .ko-page-head .btn { width: 100%; margin-top: 18px; }
  .ko-kpi-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .ko-kpi { min-height: 132px; padding: 16px; }
  .ko-kpi-value { font-size: 2rem; }
  .ko-stage-grid { grid-template-columns: 1fr 1fr; }
  .ko-stage { padding: 14px; }
  .st-topbar-actions { gap: 4px; }
  .st-topbar-actions .st-icon-btn:not(:last-of-type) { display: none; }
  .st-content { padding: 20px 14px 88px; }
  .st-content > .d-flex.justify-content-between { flex-wrap: wrap; }
  .st-content > .d-flex.justify-content-between > .d-flex { flex-wrap: wrap; width: 100%; }
  .st-content > .d-flex.justify-content-between > .d-flex .btn { flex: 1 1 auto; }
  .card-body { padding: 16px; }
  .row { --bs-gutter-x: 16px; }
  .d-flex.justify-content-between { row-gap: 12px; }
  .btn:not(.btn-sm):not(.st-icon-btn) { min-height: 44px; }
  .modal-dialog { margin: 10px; }
  .modal-content { max-height: calc(100dvh - 20px); overflow: auto; }
  .table-responsive { margin-inline: 0; }
  .ko-theme-grid { grid-template-columns: 1fr; }
  .ko-filter-card .card-header { align-items: flex-start; }
  .ko-form-section { padding: 18px 16px; }
  .ko-record-form > .card-footer { position: sticky; bottom: 0; z-index: 2; background: var(--card); }
  .ko-lead-head > .d-flex { width: 100%; }
  .ko-lead-head > .d-flex .btn { flex: 1 1 auto; }
  .ko-page-head > .ko-view-switcher { width: 100%; }
  .ko-record-head > .d-flex { width: 100%; }
  .ko-record-head > .d-flex .btn { flex: 1 1 auto; }
  #knowledge-body { min-height: 48vh; }
  form[action="/knowledge"] { flex-wrap: wrap; }
  form[action="/knowledge"] input[type="search"] { flex: 1 0 100%; }
  form[action="/knowledge"] .btn { flex: 1 1 auto; }
  .file-table td:last-child { min-width: 220px; }
  .ko-call-stage { min-height: calc(100dvh - 92px); padding: 14px 12px 100px; }
  .ko-call-status { min-height: 0; padding: 12px; align-items: flex-start; gap: 10px; }
  .ko-call-status > div:first-child { max-width: 52%; }
  .ko-transcript-toggle span { display: none; }
  .ko-call-person .avatar { width: 116px; height: 116px; font-size: 2.5rem; }
  .ko-call-person h1 { font-size: 2rem; }
  .ko-call-person p { font-size: .95rem !important; }
  .ko-call-controls { gap: 10px; }
  .ko-call-controls .btn { width: 52px; height: 52px; }
  .ko-call-controls .ko-start { min-width: 146px; padding-inline: 16px; }
  .ko-report-head { display: grid; grid-template-columns: 1fr auto; }
  .ko-overall-score { min-width: 112px; padding: 14px; }
  .ko-overall-score .display-5 { font-size: 2.2rem; }
  .ko-score-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .ko-score-card { padding: 14px; }
  .ko-report-pairs { grid-template-columns: 1fr; }
  .ko-review-actions .btn { flex: 1 1 100%; }
  .access-history { max-height: 320px; overflow-y: auto; }
  .access-bulk-form > .small { flex-basis: 100%; }
  .access-bulk-form .form-select, .access-bulk-form .btn { flex: 1 1 140px; width: 100% !important; }
  .access-permission-table { border: 0; box-shadow: none; overflow: visible; }
  .access-permission-table thead { display: none; }
  .access-permission-table tbody, .access-permission-table tr, .access-permission-table td { display: block; width: 100%; }
  .access-permission-table tr { padding: 14px; border-bottom: 1px solid var(--border); }
  .access-permission-table td { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; border: 0; }
  .access-permission-table td[data-label]::before { content: attr(data-label); color: var(--muted); font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
  .access-permission-table td .form-select { width: min(180px, 58vw); }
  .access-permission-table td:last-child .btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media print {
  .st-sidebar, .st-topbar, .st-sidebar-backdrop { display: none !important; }
  .st-main { margin-left: 0 !important; }
  .st-content { max-width: none; padding: 0; }
  .card { box-shadow: none; break-inside: avoid; }
}
.ko-inbox-page{height:calc(100vh - 86px);min-height:620px;display:flex;flex-direction:column;gap:10px}.ko-inbox-titlebar{display:flex;align-items:center;justify-content:space-between;gap:16px}.ko-inbox-titlebar h1{font-size:clamp(1.35rem,2vw,1.8rem);margin:0;letter-spacing:-.035em}.ko-inbox-title-actions{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.76rem}.ko-live-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgb(34 197 94/.12);animation:pulse 1.8s infinite}.ko-messages-shell{flex:1;min-height:0;display:grid;grid-template-columns:minmax(250px,310px) minmax(420px,1fr) minmax(220px,270px);overflow:hidden;border:1px solid var(--border);border-radius:18px;background:color-mix(in srgb,var(--card) 92%,transparent);box-shadow:var(--token-depth)}.ko-thread-pane,.ko-conversation-pane,.ko-contact-pane{min-width:0;min-height:0}.ko-thread-pane{display:flex;flex-direction:column;border-right:1px solid var(--border)}.ko-thread-toolbar{display:flex;gap:7px;padding:11px;border-bottom:1px solid var(--border)}.ko-thread-search{flex:1;display:flex;align-items:center;gap:8px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:0 10px}.ko-thread-search input{width:100%;height:34px;border:0;outline:0;background:transparent;color:var(--text);font-size:.78rem}.ko-icon-button{width:36px;height:36px;display:inline-grid;place-items:center;border:1px solid var(--border);border-radius:10px;background:var(--card);color:var(--text);text-decoration:none}.ko-channel-tabs{display:flex;gap:10px;padding:8px 12px;border-bottom:1px solid var(--border);overflow-x:auto}.ko-channel-tabs button,.ko-composer-channels button{border:0;background:none;color:var(--muted);font-size:.7rem;font-weight:650;padding:4px 0;white-space:nowrap}.ko-channel-tabs button.is-active{color:var(--text);box-shadow:inset 0 -2px var(--primary)}.ko-thread-list{overflow-y:auto}.ko-thread-row{position:relative;width:100%;display:grid;grid-template-columns:38px minmax(0,1fr);gap:9px;padding:11px 12px;text-align:left;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text)}.ko-thread-row:hover,.ko-thread-row.is-active{background:color-mix(in srgb,var(--primary) 8%,transparent)}.ko-thread-row.is-active{box-shadow:inset 3px 0 var(--primary)}.ko-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--primary) 12%,var(--card));color:var(--primary);font-size:.75rem;font-weight:800}.ko-avatar-lg{width:58px;height:58px;font-size:1rem}.ko-thread-copy{min-width:0}.ko-thread-line{display:flex;justify-content:space-between;gap:5px}.ko-thread-line strong{font-size:.78rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ko-thread-line time,.ko-thread-org,.ko-thread-preview{font-size:.66rem;color:var(--muted)}.ko-thread-org,.ko-thread-preview{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ko-thread-preview{margin-top:4px}.ko-unread-count{position:absolute;right:11px;bottom:9px;min-width:17px;height:17px;padding:0 4px;display:grid;place-items:center;border-radius:10px;background:var(--primary);color:var(--primary-text);font-size:.6rem;font-weight:800}.ko-conversation-pane{display:flex;flex-direction:column;background:color-mix(in srgb,var(--canvas) 72%,transparent)}.ko-conversation-head{min-height:61px;display:flex;align-items:center;gap:10px;padding:9px 14px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--card) 88%,transparent)}.ko-conversation-head>div:nth-child(3){min-width:0}.ko-lead-name{display:block;border:0;background:none;padding:0;color:var(--text);font-weight:760;font-size:.85rem}.ko-conversation-head span{display:block;color:var(--muted);font-size:.67rem}.ko-conversation-actions{margin-left:auto;display:flex;gap:7px;align-items:center}.ko-mobile-back{display:none;border:0;background:none;color:var(--text)}.ko-message-feed{flex:1;overflow-y:auto;padding:18px clamp(13px,3vw,32px);scroll-behavior:smooth}.ko-message-event{display:flex;flex-direction:column;align-items:flex-start;margin:0 auto 14px;max-width:780px}.ko-message-event.is-outbound{align-items:flex-end}.ko-message-label,.ko-message-meta{font-size:.62rem;color:var(--muted);margin:0 8px 4px}.ko-message-meta{margin-top:4px}.ko-message-bubble{max-width:min(76%,620px);padding:9px 12px;border:1px solid var(--border);border-radius:16px 16px 16px 5px;background:var(--card);color:var(--text);font-size:.78rem;line-height:1.45;box-shadow:0 1px 2px rgb(0 0 0/.04)}.ko-message-event.is-outbound .ko-message-bubble{border-radius:16px 16px 5px 16px;background:var(--primary);border-color:var(--primary);color:var(--primary-text)}.ko-message-event.is-note .ko-message-bubble{background:color-mix(in srgb,#f59e0b 13%,var(--card));border-style:dashed;color:var(--text)}.ko-message-event.is-call .ko-message-bubble{background:color-mix(in srgb,var(--secondary) 8%,var(--card));color:var(--text)}.ko-message-bubble strong,.ko-message-bubble p{display:block;margin:0}.ko-message-bubble strong{margin-bottom:4px}.ko-message-bubble audio{max-width:100%;height:32px;margin-top:7px}.ko-message-day,.ko-inbox-empty{text-align:center;color:var(--muted);font-size:.75rem}.ko-inbox-empty{margin:auto}.ko-inbox-empty i{font-size:2rem}.ko-inbox-empty h2{font-size:1rem;color:var(--text);margin:8px 0 3px}.ko-composer{padding:9px 12px 7px;border-top:1px solid var(--border);background:var(--card)}.ko-composer-channels{display:flex;gap:16px;margin-bottom:6px}.ko-composer-channels button.is-active{color:var(--primary)}.ko-composer-channels i{margin-right:4px}.ko-compose-row{display:flex;align-items:flex-end;gap:8px;padding:7px 7px 7px 12px;border:1px solid var(--border);border-radius:15px;background:var(--surface-2)}.ko-compose-row textarea{flex:1;resize:none;max-height:110px;min-height:32px;border:0;outline:0;background:transparent;color:var(--text);font:inherit;font-size:.78rem;padding:7px 0}.ko-send-button{width:33px;height:33px;border:0;border-radius:50%;background:var(--primary);color:var(--primary-text)}.ko-email-subject input{width:100%;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text);padding:5px 4px 7px;margin-bottom:6px;font-size:.76rem;outline:0}.ko-compose-status{display:flex;justify-content:space-between;min-height:16px;padding:3px 3px 0;color:var(--muted);font-size:.61rem}.ko-contact-pane{position:relative;padding:18px 15px;border-left:1px solid var(--border);background:color-mix(in srgb,var(--card) 94%,transparent);overflow-y:auto}.ko-contact-hero{text-align:center;padding:8px 0 17px;border-bottom:1px solid var(--border)}.ko-contact-hero .ko-avatar{margin:auto}.ko-contact-hero h2{font-size:.95rem;margin:10px 0 2px}.ko-contact-hero p{font-size:.7rem;color:var(--muted);margin:0}.ko-contact-details{margin:12px 0 18px}.ko-contact-details div{padding:8px 0;border-bottom:1px solid var(--border)}.ko-contact-details dt{font-size:.63rem;color:var(--muted);font-weight:600}.ko-contact-details dd{font-size:.75rem;margin:2px 0 0;overflow-wrap:anywhere}.ko-context-close{display:none;position:absolute;right:10px;top:10px;border:0;background:none;color:var(--text)}.ko-empty-compact{padding:28px 15px;text-align:center;color:var(--muted);font-size:.76rem}
@media(max-width:1180px){.ko-messages-shell{grid-template-columns:minmax(240px,300px) 1fr}.ko-contact-pane{position:absolute;z-index:20;right:0;top:0;bottom:0;width:280px;transform:translateX(105%);transition:transform .2s}.ko-contact-pane.is-open{transform:none}.ko-context-close{display:block}}
@media(max-width:760px){.ko-inbox-page{height:calc(100dvh - 72px);min-height:520px}.ko-inbox-titlebar{display:none}.ko-messages-shell{display:block;border-radius:13px;position:relative}.ko-thread-pane,.ko-conversation-pane{position:absolute;inset:0}.ko-conversation-pane{transform:translateX(105%);transition:transform .2s;z-index:5}.ko-inbox-page.has-active-thread .ko-conversation-pane{transform:none}.ko-mobile-back{display:block}.ko-conversation-actions .btn{display:none}.ko-message-bubble{max-width:88%}.ko-thread-pane{border:0}}

/* Inbox geometry must remain stable when a theme increases global button/card sizing. */
.ko-conversation-head{height:61px;min-height:61px;max-height:61px;box-sizing:border-box;overflow:hidden}.ko-conversation-head>.ko-avatar{flex:0 0 36px;width:36px!important;height:36px!important;min-width:36px;padding:0!important;margin:0!important;border-radius:50%!important}.ko-active-lead-copy{flex:1 1 auto;min-width:0;overflow:hidden}.ko-active-lead-copy .ko-lead-name{width:100%;max-width:100%;min-height:0!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.25;font-size:.85rem!important;box-shadow:none!important}.ko-active-lead-copy>span{display:flex!important;align-items:center;gap:5px;min-width:0;line-height:1.25;white-space:nowrap}.ko-active-lead-copy b,.ko-active-lead-copy em{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:inherit;color:inherit}.ko-active-lead-copy b{flex:0 1 auto}.ko-active-lead-copy em{flex:0 2 auto}.ko-active-lead-copy i{flex:0 0 auto;font-style:normal}.ko-conversation-actions{flex:0 0 auto;min-width:0}.ko-conversation-actions .ko-icon-button{flex:0 0 36px;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;padding:0!important;margin:0!important;border-radius:10px!important;font-size:.9rem!important;box-shadow:none!important}.ko-conversation-actions .btn{display:inline-flex!important;align-items:center;justify-content:center;width:auto!important;min-width:0!important;min-height:36px!important;height:36px!important;margin:0!important;padding:0 13px!important;border-radius:10px!important;font-size:.72rem!important;line-height:1!important;white-space:nowrap!important;box-shadow:none!important}.ko-composer{box-sizing:border-box}.ko-compose-row,.ko-compose-row textarea{box-sizing:border-box}.ko-compose-row textarea{width:auto!important;margin:0!important;line-height:1.35}.ko-send-button{flex:0 0 33px;width:33px!important;height:33px!important;min-width:33px!important;min-height:33px!important;padding:0!important;margin:0!important;border-radius:50%!important}.ko-message-day{width:100%;padding:20px 8px;box-sizing:border-box}
@media(max-width:900px){.ko-conversation-head{padding-inline:10px}.ko-active-lead-copy>span i,.ko-active-lead-copy>span em{display:none}.ko-conversation-actions .btn{padding-inline:10px!important}}
@media(max-width:760px){.ko-conversation-actions .btn{display:none!important}.ko-mobile-back{flex:0 0 28px;width:28px!important;height:36px!important;min-width:28px!important;padding:0!important;margin:0!important}.ko-composer-channels{gap:12px;overflow-x:auto}.ko-composer-channels button{flex:0 0 auto;min-width:0!important;padding:4px 0!important;margin:0!important}.ko-message-feed{padding-block:13px}}

.ko-conversation-head>.ko-avatar{display:grid!important;place-items:center!important;align-items:center!important;justify-content:center!important;flex:0 0 36px!important;width:36px!important;height:36px!important;min-width:36px!important;max-width:36px!important;padding:0!important;margin:0!important;line-height:1!important;text-align:center!important;text-indent:0!important;vertical-align:middle!important;overflow:hidden!important;box-sizing:border-box!important}.ko-conversation-head>.ko-avatar::before,.ko-conversation-head>.ko-avatar::after{display:none!important;content:none!important}
.st-notification-link { position: relative; }
.st-notification-badge {
  position: absolute;
  top: -5px;
  right: -7px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border: 2px solid var(--panel, #fff);
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 14px;
  text-align: center;
}
.st-nav-link.has-notification:not(.active) {
  color: var(--deep);
  background: color-mix(in srgb, var(--primary) 11%, var(--sidebar));
  box-shadow: inset 3px 0 0 var(--primary);
}
.st-nav-link.has-notification:not(.active) > i:first-child { color: var(--primary); opacity: 1; }
.st-nav-notification {
  margin-left: auto;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--primary);
  color: var(--primary-text);
  font-size: 10px;
  font-weight: 800;
  line-height: 18px;
  text-align: center;
}
.ko-phone-dock {
  position: fixed;
  z-index: 1080;
  right: 18px;
  bottom: 18px;
  display: flex;
  align-items: center;
  gap: 10px;
  width: min(460px, calc(100vw - 32px));
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--card) 94%, transparent);
  box-shadow: 0 18px 48px rgb(0 0 0 / .22);
  backdrop-filter: blur(18px);
}
.ko-phone-dock[hidden] { display: none; }
.ko-phone-icon { display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:50%;background:var(--primary);color:var(--primary-text); }
.ko-phone-copy { display:flex;flex:1;min-width:0;flex-direction:column; }
.ko-phone-copy strong,.ko-phone-copy span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.ko-phone-copy span { color:var(--muted);font-size:.78rem; }

/* --- Live Call Assist panel (added by fix_live_assist_css.py) --- */
.ko-assist-panel {
  position: fixed;
  z-index: 1085;
  right: 18px;
  bottom: 92px;
  width: min(360px, calc(100vw - 32px));
  max-height: 420px;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--card) 96%, transparent);
  box-shadow: 0 18px 48px rgb(0 0 0 / .22);
  backdrop-filter: blur(18px);
  overflow: hidden;
}
.ko-assist-panel[hidden] { display: none; }
.ko-assist-header {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 0 0 auto;
}
.ko-assist-header strong { font-size: .92rem; }
.ko-assist-hint { color: var(--muted); font-size: .72rem; }
.ko-assist-transcript {
  flex: 1;
  overflow-y: auto;
  padding: 10px 14px;
  font-size: .82rem;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 40px;
}
.ka-line strong { margin-right: 4px; }
.ka-user strong { color: var(--primary); }
.ka-prospect strong { color: #b45309; }
.ko-assist-suggestion {
  padding: 10px 14px;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  font-size: .85rem;
  font-weight: 500;
  min-height: 1.2em;
  flex: 0 0 auto;
}
.ko-assist-toggle.active {
  background: var(--primary);
  color: var(--primary-text);
  border-color: var(--primary);
}