:root{color-scheme:dark;--bg:#080c14;--surface-panel:#0f1723;--surface-raised:#162031;--surface-glass:rgba(16, 24, 40, 0.7);--text:#e8effa;--muted:#a5b4ca;--border:rgba(255, 255, 255, 0.06);--border-subtle:var(--border);--blue:#568cff;--info:#E8B730;--success:#00E676;--warning:#FFB74D;--danger:#FF5252;--cyan:#E8B730;--purple:#b6a3ff;--brand:#E8B730;--brand-dark:#D4A017;--brand-glow:rgba(232, 183, 48, 0.25);--accent:#63D6E0;--radius-card:16px;--shadow:0 8px 28px rgba(0,0,0,0.4);--space-unit:8px;background:var(--bg);color:var(--text);font-size:15px}body{background:var(--bg)}button,input,select,textarea,dialog{background:var(--surface-panel);color:var(--text);border-color:var(--border);transition:all 0.2s ease}button:hover{color:var(--text);background:var(--surface-raised);border-color:var(--brand)}a{color:var(--brand);transition:color 0.2s ease}a:hover{color:var(--brand-dark)}.card,.table-wrap,.topbar,.bottom-nav{background:var(--surface-panel)}.card{box-shadow:var(--shadow);border-radius:var(--radius-card);background:var(--surface-panel)}.topbar input{background:var(--bg)}.layout>aside{background:#0a101b;border-right:1px solid var(--border)}.brand{padding:0 8px 24px;line-height:1}.brand img{width:176px;max-width:100%;height:49px;object-fit:contain;object-position:left}.nav button{display:flex;align-items:center;gap:12px}.nav button.active{background:rgba(232, 183, 48, 0.08);border-left-color:var(--brand);color:var(--brand)}.ruang-icon{width:21px;height:21px;flex:none;vertical-align:middle;object-fit:contain}.status{gap:6px;align-items:center;background:#1c2536;color:#d1e0fa}.status .ruang-icon{width:13px;height:13px}.status.good{background:rgba(0,230,118,0.1);color:var(--success)}.status.warn{background:rgba(255,183,77,0.1);color:var(--warning)}.status.bad{background:rgba(255,82,82,0.1);color:var(--danger)}th{background:#111926;color:var(--muted);position:sticky;top:0}td{border-color:var(--border)}tbody tr:hover{background:var(--surface-raised)}.tabs button.active{background:rgba(232, 183, 48, 0.08);color:var(--brand);border-color:var(--brand)}.avatar{background:rgba(232, 183, 48, 0.15);color:var(--brand)}.error{background:rgba(255,82,82,0.1);color:var(--danger)}.eyebrow{color:var(--brand)}.kpi strong{color:var(--text);font-variant-numeric:tabular-nums}.kpi small,.record dt{color:var(--muted)}pre{background:var(--bg);color:var(--text)}.login-intro{background:radial-gradient(ellipse at 20% 30%,rgba(232, 183, 48, 0.15),transparent 70%),url('/assets/ruang/backgrounds/grid.svg'),var(--bg)}.login-intro h1{font-size:clamp(2rem,4vw,3.8rem);letter-spacing:-.045em}.login form{padding:35px 15px}.login-intro .brand img{width:235px;height:65px}.owner-toolbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:22px}.owner-toolbar h2{font-size:1.5rem;margin:5px 0}.owner-toolbar form{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.owner-toolbar label{font-size:.75rem;color:var(--muted)}.owner-toolbar select,.owner-toolbar input{display:block;margin-top:4px}.business-hero{border:1px solid rgba(232, 183, 48, 0.2);background:radial-gradient(ellipse at 0 0,rgba(232, 183, 48, 0.15),transparent 70%),var(--surface-panel);padding:24px;border-radius:var(--radius-card);display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:18px}.business-hero h2{font-size:1.8rem;margin:8px 0;letter-spacing:-.035em;color:var(--brand)}.business-hero p{font-size:.8rem;color:var(--muted);max-width:500px;margin:0}.business-hero .ruang-icon{margin-right:10px}.health-signals{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-content:center}.health-signals small,.health-signals strong{display:block}.health-signals small{color:var(--muted)}.health-signals strong{font-size:.85rem;margin-top:4px}.executive-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0 24px}.executive-kpi{position:relative;display:grid;grid-template-columns:1fr auto;text-align:left;padding:16px;background:var(--surface-panel);border-top:2px solid var(--brand);min-width:0;box-shadow:var(--shadow)}.executive-kpi .ruang-icon{grid-column:2;grid-row:1;color:var(--brand)}.executive-kpi span{grid-column:1;grid-row:1;font-size:.8rem;color:var(--muted);padding-right:8px}.executive-kpi strong{grid-column:1/-1;font-size:clamp(1.15rem,1.65vw,1.85rem);font-weight:700;letter-spacing:-.035em;margin:10px 0;white-space:nowrap;font-variant-numeric:tabular-nums}.executive-kpi small{grid-column:1/-1;font-size:.7rem;color:var(--muted);font-weight:400}.executive-kpi.warning{border-top-color:var(--warning)}.executive-kpi.success{border-top-color:var(--success)}.executive-kpi.danger{border-top-color:var(--danger)}.executive-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.executive-panel{min-width:0}.panel-sales{order:0}.panel-attention{order:1}.panel-stock{order:2}.panel-operations{order:3}.panel-finance{order:4}.panel-employees{order:5}.panel-products{order:6}.panel-cases{order:7}.panel-activity{order:8;grid-column:1/-1}.panel-heading{display:flex;gap:10px;align-items:center;margin-bottom:16px}.fact-list{margin:0}.fact-list>div{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--border)}.fact-list dt{font-size:.85rem;color:var(--muted)}.fact-list dd{margin:0;font-weight:650;font-variant-numeric:tabular-nums}.text-link{background:transparent;border:0;color:var(--brand);padding:8px 0;text-align:left;font-size:.8rem}.text-link span{margin-left:5px}.ruang-chart{margin:16px 0}.ruang-chart svg{width:100%;height:auto;overflow:visible}.ruang-chart text{fill:var(--muted);font-size:11px}.chart-axis{stroke:var(--border);fill:none}.chart-line{fill:none;stroke:var(--brand);stroke-width:2.7;stroke-linejoin:round}.chart-point{fill:var(--brand)}figcaption{font-size:.75rem;color:var(--muted)}.inventory-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:14px 0}.inventory-flow>div{background:var(--bg);border:1px solid var(--border);border-radius:9px;padding:12px 8px;text-align:center}.inventory-flow strong,.inventory-flow small{display:block}.inventory-flow strong{font-size:1.25rem;margin-top:8px}.inventory-flow small{font-size:.7rem;color:var(--muted)}h3{font-size:.9rem;margin:18px 0 10px}.channel-row{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 0;border-bottom:1px solid var(--border);font-size:.85rem}.channel-row small{color:var(--muted)}.estimate-note{margin-top:16px;font-size:.8rem;color:var(--warning);border-left:2px solid var(--warning);padding-left:12px}.case-preview{padding:14px 0;border-bottom:1px solid var(--border)}.case-preview>.status{margin-left:10px}.case-preview p{font-size:.8rem;margin:10px 0 0;color:var(--muted)}.product-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--border)}.product-row img{width:42px;height:42px;border-radius:9px}.product-row>div:first-of-type{flex:1;min-width:0}.product-row strong{font-size:.85rem}.product-row small{display:block;font-size:.7rem;color:var(--muted)}.business-timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}.business-timeline li{display:flex;gap:14px;border-bottom:1px solid var(--border);padding:12px 0}.business-timeline strong{font-size:.85rem}.business-timeline small{display:block;color:var(--muted);font-size:.75rem}.quick-actions{display:flex;gap:24px;flex-wrap:wrap;padding:18px 0}.ruang-empty{text-align:center;padding:18px;color:var(--muted);font-size:.85rem}.ruang-empty img{width:120px;height:78px}.skeleton{min-height:130px;padding:12px 0}.skeleton i{display:block;background:linear-gradient(100deg,var(--surface-raised),rgba(232, 183, 48, 0.08),var(--surface-raised));height:20px;margin:14px 0;border-radius:6px;animation:breathe 1.5s ease-in-out infinite alternate}.skeleton i:nth-child(2){width:70%;height:35px}.skeleton i:nth-child(3){width:90%}@keyframes breathe{to{opacity:.4}}details{margin-top:14px}summary{cursor:pointer;color:var(--muted);font-size:.85rem}.attention-row{gap:10px}.attention-row>span:nth-child(2){font-size:.8rem}.attention-row small{color:var(--muted);font-size:.7rem}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--brand);outline-offset:4px}[hidden]{display:none!important}@media(min-width:1500px){.executive-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:1100px){.owner-toolbar{align-items:start;flex-direction:column}.business-hero{grid-template-columns:1fr}.executive-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.executive-kpi strong{font-size:1.4rem}.product-row{flex-wrap:wrap}}@media(max-width:800px){.executive-grid{grid-template-columns:1fr}.panel-activity{grid-column:auto}.executive-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.business-timeline{grid-template-columns:1fr}.panel-attention{order:-1}.panel-finance{order:3}.panel-operations{order:4}}@media(max-width:640px){.brand img{width:138px;height:38px}.content{padding:18px 12px 90px}.owner-toolbar{gap:12px}.owner-toolbar form{width:100%}.owner-toolbar select{min-width:150px}.business-hero{padding:18px}.business-hero h2{font-size:1.55rem}.health-signals{gap:12px}.health-signals strong{font-size:.75rem}.executive-kpis{gap:8px}.executive-kpi{padding:12px 10px}.executive-kpi strong{font-size:1.14rem}.executive-kpi .ruang-icon{width:17px;height:17px}.executive-kpi span{font-size:.73rem}.executive-kpi small{font-size:.65rem}.inventory-flow{grid-template-columns:repeat(3,minmax(0,1fr))}.bottom-nav button{display:grid;justify-items:center;gap:4px}.bottom-nav button.active{background:rgba(232, 183, 48, 0.1);color:var(--brand)}.attention-row{flex-wrap:wrap}.topbar{gap:8px}.topbar input{min-width:0}.identity{gap:6px}.avatar{padding:6px 8px}.login-intro .brand img{width:190px;height:50px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.search-result{display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin:8px 0}.search-result small{display:block;color:var(--muted)}

.kpi>.ruang-icon{float:right;margin-left:10px}.health .card>.ruang-icon{margin-bottom:10px}

/* Glassmorphism overrides & Premium adjustments */
.card {
    backdrop-filter: blur(16px);
    background: rgba(15, 23, 35, 0.85) !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.card:hover {
    transform: translateY(-1px);
}
.business-hero {
    border: 1px solid rgba(232, 183, 48, 0.3) !important;
    box-shadow: 0 0 20px rgba(232,183,48,0.15);
    background: radial-gradient(ellipse at 0 0, rgba(232, 183, 48, 0.25), transparent 70%), var(--surface-panel) !important;
}
.executive-kpi {
    transition: all 0.2s ease;
}
.executive-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(0,0,0,0.5) !important;
    z-index: 10;
}
.skeleton i {
    background: linear-gradient(100deg, var(--surface-raised), rgba(232, 183, 48, 0.2), var(--surface-raised)) !important;
    background-size: 200% 100% !important;
    animation: skeletonShimmer 1.5s infinite linear !important;
}
@keyframes skeletonShimmer {
    to { background-position: -200% 0; }
}
.nav button.active {
    box-shadow: inset 3px 0 12px rgba(232,183,48,0.15);
}
th {
    background: linear-gradient(180deg, #162031, #111926) !important;
    backdrop-filter: blur(8px);
}
tbody tr {
    transition: background 0.2s ease;
}
.tabs button.active {
    box-shadow: 0 2px 8px rgba(232,183,48,0.2);
}
.status {
    background: rgba(28, 37, 54, 0.7) !important;
    backdrop-filter: blur(4px);
}
input:focus, select:focus, textarea:focus, button:focus-visible {
    box-shadow: 0 0 0 2px rgba(232,183,48,0.3) !important;
    border-color: var(--brand) !important;
    outline: none !important;
}
.ruang-chart .chart-line {
    filter: drop-shadow(0 4px 6px rgba(232,183,48,0.4));
}