:root{
      --rum-primary:#2A6DB0; --rum-accent:#C46A4A; --rum-text:#1A1A1A;
      --rum-btn:#F6A868; --space-dark:#000115;
      --card-bg: rgba(255,255,255,0.96); --card-border: rgba(0,0,0,0.10);
      --shadow: 0 20px 40px rgba(0,0,0,0.35); --shadow-soft: 0 10px 22px rgba(0,0,0,0.18); --shadow-btn: 0 10px 20px rgba(246,168,104,0.5);
      --stroke: rgba(255, 255, 255, 0.1);
      --glass-bg: rgba(255, 255, 255, 0.05);
      --nav-height: 0px;
    }
    *{box-sizing:border-box}
    html,body{height:100%;margin:0;background: radial-gradient(circle at top, #050522 0, #000115 50%, #000 100%);color:var(--rum-text);font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,"Noto Sans";overflow-x:hidden;overflow-y:auto}
    .stars-container{position:fixed;inset:0;z-index:1;pointer-events:none}.star{position:absolute;background:#fff;border-radius:50%;opacity:.8;animation:stars-move 300s linear infinite}@keyframes stars-move{0%{transform:translate(0,0)}100%{transform:translate(50px,50px)}}
    .actions{position:fixed;top:14px;right:14px;z-index:9;display:flex;gap:8px}.btn-top{border:0;border-radius:12px;padding:10px 14px;cursor:pointer;font-family:"Baloo 2",sans-serif;font-weight:800;background:var(--rum-btn);color:#000;box-shadow:var(--shadow-btn)}.btn-top--secondary{background:#2d3436;color:#fff;box-shadow:0 10px 20px rgba(45,52,54,.35)}
    .filters-pill{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:9;background:#eef3ff;color:#2A6DB0;border-radius:999px;padding:8px 12px;font-family:"Baloo 2",sans-serif;font-weight:800;box-shadow:0 10px 20px rgba(0,0,0,.2);min-width:120px;text-align:center}

    .project-summary {
      margin: 0 18px 10px 18px;
      padding: 12px 16px;
      border-radius: 16px;
      background: #ffffff;
      border: 1px solid rgba(0,0,0,0.08);
      box-shadow: var(--shadow-soft);
      display: grid;
      gap: 10px;
      position: relative;
      z-index: 6;
    }

    .project-summary__header {
      font-family: "Baloo 2", sans-serif;
      font-weight: 800;
      color: #0B1022;
      letter-spacing: 0.02em;
      text-transform: uppercase;
      font-size: 0.75rem;
    }

    .project-summary .info-card {
      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
      padding: 0;
    }

    .project-summary .section {
      background: #ffffff;
      border: 1px solid rgba(0,0,0,0.08);
      box-shadow: var(--shadow-soft);
    }

    .kpi-bar {
      position: sticky;
      top: 0;
      z-index: 6;
      margin-top: 56px;
      padding: 10px 18px 0 18px;
      display: grid;
      gap: 12px;
      grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    }
    .kpi-card {
      background: rgba(255,255,255,0.98);
      border: 1px solid rgba(0,0,0,0.08);
      border-radius: 14px;
      padding: 12px 14px;
      box-shadow: var(--shadow-soft);
      display: grid;
      gap: 6px;
    }
    .kpi-title {
      font-size: 0.7rem;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: rgba(0,0,0,0.55);
      font-weight: 700;
    }
    .kpi-value {
      font-family: "Baloo 2", sans-serif;
      font-size: 1.4rem;
      font-weight: 800;
      color: #0B1022;
    }
    .kpi-delta {
      font-size: 0.85rem;
      font-weight: 600;
      color: #2A6DB0;
    }
    .kpi-delta.is-negative {
      color: #C0392B;
    }

    .main-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(380px, 460px);
      min-height: calc(100vh - var(--nav-height));
      height: auto;
      position: relative;
      z-index: 5;
      gap: 16px;
      padding: 18px;
    }
    @media (min-width: 1600px){
      .main-layout {
        grid-template-columns: minmax(0, 1fr) 520px;
      }
    }

    .dashboard-canvas{
      min-width:0;
      position:relative;
      z-index:5;
    }


    .app{position:relative;z-index:5;display:grid;grid-template-columns:auto 1fr;height:100%;gap:14px;padding:14px}
    .sidebar{position:relative;width:260px;transition:width .18s ease;background:var(--card-bg);border:1px solid var(--card-border);border-radius:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden;height:100%}
    .sidebar.collapsed{width:68px}.sidebar__header{position:relative;display:flex;align-items:center;gap:10px;padding:12px;border-bottom:1px solid rgba(0,0,0,.06);min-height:52px}.brand{font-family:"Baloo 2",sans-serif;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--rum-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .sidebar.collapsed .brand{display:none}
    .sidebar .command-panel__toggle{top:8px;right:8px}
    .sidebar.collapsed .command-panel__toggle{right:-12px;box-shadow:0 8px 16px rgba(0,0,0,.25)}
    .tools{padding:12px;display:grid;gap:10px;grid-template-columns:1fr}
    .tool{display:flex;align-items:center;gap:10px;width:100%;border:none;border-radius:12px;padding:10px 12px;cursor:pointer;background:#fff;color:#111;box-shadow:var(--shadow-soft);transition:transform .08s ease, box-shadow .12s ease;text-align:left}
    .tool:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(0,0,0,.12)}.tool__icon{display:inline-flex;width:22px;height:22px}.tool__label{font-family:"Baloo 2",sans-serif;text-transform:uppercase;letter-spacing:.02em;font-weight:800}
    .style-panel{padding:0 12px 12px 12px;border-top:1px solid rgba(0,0,0,.06)}.style-title{font-family:"Baloo 2",sans-serif;font-weight:800;color:var(--rum-primary);margin:8px 0}.style-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}.style-row label{font-size:.9rem;min-width:64px}select.style-select{flex:1;padding:8px 10px;border-radius:10px;border:1px solid rgba(0,0,0,.12);background:#fff}.palette{display:flex;flex-wrap:wrap;gap:6px}.swatch{width:26px;height:26px;border-radius:50%;border:2px solid rgba(0,0,0,.12);cursor:pointer;display:inline-block}
    .sidebar-blank .sidebar__header{justify-content:space-between}.sidebar-blank__title{font-family:"Baloo 2",sans-serif;font-weight:800;color:var(--rum-primary);letter-spacing:.02em}
    .btn-mini{border:0;border-radius:8px;padding:6px 8px;font-family:"Baloo 2",sans-serif;font-weight:800;background:#eef3ff;color:#2A6DB0;cursor:pointer}
    .work{position:relative;overflow:auto}.grid-stack{min-height:100%;background:rgba(255,255,255,.03);border-radius:14px;border:1px dashed rgba(255,255,255,.1)}
    .grid-stack-item-content{background:var(--card-bg);border:1px solid var(--card-border);border-radius:14px;box-shadow:var(--shadow);padding:8px 8px 12px 8px;display:flex;flex-direction:column;gap:8px;height:100%}
    .widget__header{display:flex;align-items:center;justify-content:space-between;gap:10px}.widget__title{font-family:"Baloo 2",sans-serif;color:var(--rum-primary);font-weight:800;letter-spacing:.02em;display:flex;align-items:center;gap:8px}.widget__title .widget__icon{width:18px;height:18px}.widget__chart{flex:1;min-height:140px}.widget__actions{display:flex;gap:6px;align-items:center}.widget__param-select{min-width:140px;border-radius:10px;border:1px solid rgba(0,0,0,.12);padding:6px 8px;font-size:.8rem;font-family:"Inter",sans-serif;background:#fff}.widget__param-select:disabled{opacity:.6;cursor:not-allowed}.btn{border:0;border-radius:10px;padding:6px 10px;cursor:pointer;font-family:"Baloo 2",sans-serif;font-weight:800;box-shadow:var(--shadow-btn);background:var(--rum-btn);color:#000}.btn--danger{background:#e74c3c;color:#fff;box-shadow:0 10px 20px rgba(231,76,60,.35)}
.widget__gantt{width:100%;height:100%;border-radius:12px;overflow:hidden;background:#f7f8fa;border:1px solid rgba(0,0,0,0.08);position:relative}
.widget__gantt canvas{width:100%;height:100%;display:block}
.widget__gantt .status-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:600;color:#4a4a4a}
    .slicer{display:grid;gap:8px}
    .slicer__toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px}
    .slicer__meta{font-size:0.8rem;color:rgba(0,0,0,.55);font-weight:600}
    .slicer__clear{border:none;background:rgba(0,0,0,0.06);color:#0B1022;border-radius:8px;padding:4px 8px;font-size:0.75rem;font-weight:700;cursor:pointer}
    .slicer__search input{width:100%;padding:6px 10px;border-radius:10px;border:1px solid rgba(0,0,0,0.15);background:#fff;font-size:0.85rem}
    .slicer__list{display:grid;gap:8px;max-height:240px;overflow:auto;padding-right:4px}
    .slicer__option{display:flex;align-items:center;gap:8px;justify-content:space-between}
    .slicer__label{flex:1;min-width:0}
    .slicer__count{font-size:0.75rem;color:rgba(0,0,0,0.55);font-weight:700}
    .slicer__empty{font-size:0.85rem;color:rgba(0,0,0,0.6);background:rgba(0,0,0,0.04);padding:10px;border-radius:10px;text-align:center}
    .slicer__empty--inline{display:none}
    .slicer--empty{min-height:120px;display:flex;align-items:center;justify-content:center}
    .chip-group{display:grid;gap:8px}
    .chip-group__list{display:flex;flex-wrap:wrap;gap:8px;max-height:220px;overflow:auto;padding-right:4px}
    .chip{border:1px solid rgba(0,0,0,.12);border-radius:999px;padding:6px 10px;background:#fff;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
    .chip__count{font-size:0.75rem;color:rgba(0,0,0,0.55);font-weight:700}
    .chip--active{background:#eef3ff;color:#2A6DB0;border-color:#2A6DB0}
    .chip-group--empty{min-height:120px;display:flex;align-items:center;justify-content:center}
    .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
    .param-panel{display:grid;gap:10px;padding:10px 12px;border-top:1px solid rgba(0,0,0,.06)}
    .param-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
    .param-row.param-row--single{grid-template-columns:1fr}
    .param-panel select,.param-panel button{padding:8px 10px;border-radius:10px;border:1px solid rgba(0,0,0,.12);font-family:inherit}
    .param-panel button{background:var(--rum-btn);border:0;font-family:"Baloo 2",sans-serif;font-weight:800}
    .param-toggle{display:flex;align-items:center;gap:8px;font-size:.85rem}
    .param-toggle input{accent-color:var(--rum-primary)}
    .template-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
    .template-row .btn-mini{padding:8px 10px}
    .param-group{display:grid;gap:6px;padding:8px 10px;border-radius:12px;border:1px dashed rgba(0,0,0,.12);background:rgba(0,0,0,.02)}
    .param-group__title{font-family:"Baloo 2",sans-serif;font-weight:800;color:#0e1111}
    .param-check{display:flex;align-items:center;gap:8px;font-size:.9rem}
    .param-check input{accent-color:var(--rum-primary)}
    .info-card{display:grid;gap:10px;padding:0 12px 12px 12px}.section{border:1px dashed rgba(0,0,0,.12);border-radius:12px;padding:8px 10px;background:rgba(0,0,0,.02)}.section__title{font-family:"Baloo 2",sans-serif;font-weight:800;color:#0e1111;margin-bottom:6px}.kv{display:grid;grid-template-columns:1fr auto;gap:6px;align-items:center}.kv b{color:#333}.badge{background:#eef3ff;color:#2A6DB0;border-radius:999px;padding:2px 6px;font-weight:800;font-size:.75rem}.param-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
    .slider-wrap{display:grid;gap:8px}.slider-wrap input[type="range"]{width:100%}
    .info-list{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:0.85rem;color:#0e1111}
    .info-list li{display:flex;justify-content:space-between;gap:10px;padding-bottom:4px;border-bottom:1px dashed rgba(0,0,0,0.08)}
    .info-list li:last-child{border-bottom:none;padding-bottom:0}
    body.simple-view .section--advanced{display:none}
    body.simple-view .info-card{gap:12px}

    .command-panel {
      display: flex;
      flex-direction: column;
      gap: 18px;
      min-height: 0;
      background: #ffffff;
      color: #0B1022;
      border-radius: 18px;
      padding: 18px;
      border: 1px solid rgba(0,0,0,0.08);
      box-shadow: var(--shadow);
      overflow-y: auto;
      height: calc(100vh - 110px);
      max-height: none;
      scrollbar-gutter: stable;
      align-self: stretch;
      position: relative;
      z-index: 30;
      transition: width 0.2s ease, padding 0.2s ease;
    }

    body.command-panel-collapsed .main-layout {
      grid-template-columns: minmax(0, 1fr) 72px;
    }

    .command-panel.is-collapsed {
      width: 72px;
      padding: 14px 6px;
      gap: 12px;
    }

    .command-panel.is-collapsed .command-card {
      display: none;
    }

    .command-panel__toggle {
      position: absolute;
      top: 14px;
      right: 14px;
      border: none;
      border-radius: 12px;
      width: 38px;
      height: 38px;
      background: var(--rum-btn);
      color: #000;
      font-family: "Baloo 2", sans-serif;
      font-weight: 800;
      cursor: pointer;
      box-shadow: var(--shadow-btn);
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .command-panel__compact-label {
      display: none;
      margin-top: 56px;
      text-align: center;
      font-family: "Baloo 2", sans-serif;
      font-weight: 800;
      font-size: 0.7rem;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: rgba(11,16,34,0.7);
    }

    .command-panel.is-collapsed .command-panel__compact-label {
      display: block;
    }

    .command-card {
      background: #ffffff;
      border: 1px solid rgba(0,0,0,0.12);
      border-radius: 18px;
      padding: 18px;
      display: flex;
      flex-direction: column;
      gap: 14px;
      min-height: 0;
    }

    .command-card h3 {
      margin: 0;
      font-family: 'Baloo 2', sans-serif;
      font-size: 1rem;
      color: #0B1022;
    }

    .command-card .small {
      color: rgba(0,0,0,0.6);
    }

    .command-header {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      background: transparent;
      border: none;
      padding: 0;
      text-align: left;
      cursor: pointer;
      color: inherit;
      border-radius: 12px;
      box-shadow: none;
    }

    .command-toggle {
      margin-left: auto;
      font-size: 1rem;
      color: rgba(0,0,0,0.5);
      transition: transform 0.2s ease;
    }

    .command-body {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .command-card.is-collapsed .command-body {
      display: none;
    }

    .command-card.is-collapsed .command-toggle {
      transform: rotate(-90deg);
    }

    .command-index {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      background: rgba(42,109,176,0.12);
      border: 1px solid rgba(42,109,176,0.35);
      color: #2A6DB0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-weight: 700;
      font-size: 0.85rem;
    }

    .command-form {
      display: grid;
      gap: 12px;
    }

    .command-form label {
      font-size: 0.7rem;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: rgba(0,0,0,0.55);
      font-weight: 700;
    }

    .command-form select,
    .command-form input {
      padding: 8px 10px;
      border-radius: 10px;
      border: 1px solid rgba(0,0,0,0.2);
      background: rgba(0, 0, 0, 0.03);
      color: #0B1022;
      font-size: 0.85rem;
      width: 100%;
    }

    .btn-rum {
      background: var(--rum-btn);
      color: #000;
      border: none;
      padding: 8px 20px;
      border-radius: 20px;
      font-family: 'Baloo 2';
      font-weight: 700;
      cursor: pointer;
    }

    .btn-rum.btn-secondary {
      background: #F4F2ED;
      color: #0B1022;
      border: 1px solid rgba(255, 255, 255, 0.35);
    }

    .btn-ghost {
      background: rgba(0,0,0,0.05);
      border: 1px solid rgba(0,0,0,0.1);
      color: #0B1022;
      border-radius: 10px;
      padding: 6px 12px;
      font-weight: 600;
      cursor: pointer;
    }

    .status-text {
      color: rgba(0,0,0,0.60) !important;
    }

    .viewer-shell {
      position: relative;
      width: 100%;
      height: clamp(360px, 45vh, 680px);
      overflow: hidden;
      border-radius: 18px;
      border: 1px solid var(--stroke);
      background: rgba(0, 1, 21, 0.45);
    }
    @media (min-width: 1200px) {
      .viewer-shell {
        height: clamp(520px, 58vh, 720px);
      }
    }

    #viewer { width: 100%; height: 100%; cursor: grab; }

    .viewer-loader {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(0, 1, 21, 0.7);
      color: #fff;
      font-size: 14px;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      z-index: 20;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.2s ease;
    }

    .viewer-loader.is-visible {
      opacity: 1;
      pointer-events: auto;
    }

    .viewer-loader .teleport-text {
      font-weight: 700;
      margin-bottom: 10px;
    }

    .viewer-loader .teleport-bar {
      width: min(300px, 70%);
      height: 10px;
      border-radius: 999px;
      background: rgba(255,255,255,0.2);
      overflow: hidden;
      border: 1px solid rgba(255,255,255,0.35);
    }

    .viewer-loader .teleport-progress {
      height: 100%;
      width: 0%;
      background: linear-gradient(90deg, #F6A868, #2A6DB0);
      transition: width 0.2s ease;
    }

    .viewer-info-card {
      position: absolute;
      left: 16px;
      bottom: 16px;
      background: rgba(0, 0, 0, 0.72);
      color: #fff;
      padding: 10px 12px;
      border-radius: 12px;
      font-size: 0.8rem;
      line-height: 1.4;
      max-width: 260px;
      box-shadow: 0 12px 24px rgba(0,0,0,0.3);
      opacity: 0;
      transform: translateY(8px);
      transition: opacity 0.2s ease, transform 0.2s ease;
      pointer-events: none;
    }

    .viewer-info-card.is-visible {
      opacity: 1;
      transform: translateY(0);
    }

    .viewer-info-card .label {
      font-size: 0.65rem;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      opacity: 0.7;
    }

    .rum-viewer-widget--floating {
      z-index: 20;
    }

    @media (max-width: 1200px) {
      .main-layout {
        grid-template-columns: 1fr;
        height: auto;
        overflow: auto;
      }
      .command-panel {
        max-height: none;
        height: auto;
      }
      body.command-panel-collapsed .main-layout {
        grid-template-columns: 1fr;
      }
      .command-panel.is-collapsed {
        width: 100%;
      }
    }

    .status-banner {
      position: sticky;
      top: 56px;
      z-index: 7;
      margin: 6px 18px 0 18px;
      padding: 8px 12px;
      border-radius: 12px;
      background: rgba(255,255,255,0.9);
      border: 1px solid rgba(0,0,0,0.08);
      box-shadow: var(--shadow-soft);
      font-size: 0.85rem;
      color: #0B1022;
      display: none;
    }

    .status-banner.is-visible {
      display: block;
    }

    .status-banner.is-error {
      border-color: rgba(192, 57, 43, 0.4);
      background: rgba(231, 76, 60, 0.12);
      color: #8e1b10;
    }

    .btn-icon {
      border: none;
      background: transparent;
      font-size: 1.1rem;
      font-weight: 700;
      cursor: pointer;
      color: #0B1022;
      padding: 2px 6px;
      border-radius: 8px;
    }

    .btn-icon:hover {
      background: rgba(0,0,0,0.06);
    }

    .btn--icon {
      width: 28px;
      height: 28px;
      padding: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 8px;
      font-size: 0.95rem;
      font-weight: 700;
      line-height: 1;
    }

    .modal {
      position: fixed;
      inset: 0;
      display: none;
      align-items: center;
      justify-content: center;
      z-index: 40;
    }

    .modal.is-open {
      display: flex;
    }

    .modal__backdrop {
      position: absolute;
      inset: 0;
      background: rgba(0,0,0,0.4);
      backdrop-filter: blur(2px);
    }

    .modal__content {
      position: relative;
      background: #fff;
      border-radius: 18px;
      padding: 18px;
      width: min(520px, 90vw);
      max-height: 80vh;
      display: flex;
      flex-direction: column;
      gap: 14px;
      box-shadow: var(--shadow);
      z-index: 2;
    }

    .modal__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }

    .modal__body {
      display: flex;
      flex-direction: column;
      gap: 12px;
      overflow: auto;
    }

    .modal__subtitle {
      margin: 0;
      color: rgba(0,0,0,0.6);
      font-size: 0.85rem;
    }

    .modal__list {
      display: grid;
      gap: 8px;
    }

    .modal__option {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 0.9rem;
    }

    .modal__footer {
      display: flex;
      justify-content: flex-end;
      gap: 10px;
    }