:root {
 --bg:#f4f6f8;
 --card:#ffffff;
 --text:#1f2937;
 --muted:#6b7280;
 --line:#e5e7eb;
 --brand:#1d4ed8;
 --brand-hover:#1e40af;
 --sidebar:#0f172a;
 --sidebar-hover:#1e293b;
 --sidebar-text:#cbd5e1;
 --sidebar-muted:#94a3b8;
}

* {
 box-sizing:border-box;
}

html, body {
 margin:0;
 padding:0;
}

body {
 font-family:Inter, Arial, sans-serif;
 color:var(--text);
 background:var(--bg);
}

a {
 color:var(--brand);
 text-decoration:none;
}

a:hover {
 text-decoration:none;
}

.layout {
 display:grid;
 grid-template-columns:240px 1fr;
 min-height:100vh;
}

.sidebar {
 background:var(--sidebar);
 color:#e2e8f0;
 padding:20px 16px;
}

.sidebar a {
 display:block;
 color:var(--sidebar-text);
 padding:10px 12px;
 margin-bottom:4px;
 border-radius:8px;
 transition:background-color .15s ease, color .15s ease;
}

.sidebar a:hover {
 background:var(--sidebar-hover);
 color:#ffffff;
}

.sidebar a.sidebar-link-active{
 background:rgba(59,130,246,.18);
 color:#fff;
 box-shadow:inset 0 0 0 1px rgba(147,197,253,.25);
}

.sidebar .section {
 margin:20px 12px 8px;
 font-size:12px;
 text-transform:uppercase;
 color:var(--sidebar-muted);
 letter-spacing:.04em;
}

.sidebar-subnav{
 display:grid;
 gap:4px;
 margin-bottom:8px;
}

.sidebar-subnav a{
 padding-left:18px;
 font-size:14px;
}

.content {
 padding:24px;
}

.topbar {
 background:var(--card);
 border-bottom:1px solid var(--line);
 padding:12px 24px;
 display:flex;
 justify-content:space-between;
 align-items:center;
 gap:16px;
}

.card {
 background:var(--card);
 border:1px solid var(--line);
 border-radius:14px;
 padding:20px;
 margin-bottom:18px;
}

.grid-2 {
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:18px;
}

table {
 width:100%;
 border-collapse:collapse;
 background:#ffffff;
 border:1px solid var(--line);
 border-radius:12px;
 overflow:hidden;
}

th, td {
 border-bottom:1px solid var(--line);
 padding:12px;
 text-align:left;
 vertical-align:top;
}

th {
 font-size:12px;
 text-transform:uppercase;
 color:var(--muted);
 letter-spacing:.04em;
}

input, select, textarea {
 width:100%;
 border:1px solid #cbd5e1;
 border-radius:8px;
 padding:10px 12px;
 font-size:14px;
 background:#ffffff;
}

button, .btn {
 display:inline-block;
 background:var(--brand);
 color:#ffffff;
 border:none;
 border-radius:8px;
 padding:9px 14px;
 cursor:pointer;
 font-size:14px;
 line-height:1.2;
 transition:background-color .15s ease, transform .05s ease;
}

button[disabled], .btn[aria-disabled="true"] {
 opacity:.7;
 cursor:not-allowed;
}

button:hover, .btn:hover {
 background:var(--brand-hover);
 color:#ffffff;
}

button:active, .btn:active {
 transform:translateY(1px);
}

.btn-secondary {
 background:#475569;
 color:#ffffff;
}

.btn-secondary:hover {
 background:#334155;
 color:#ffffff;
}

.messages {
 list-style:none;
 padding:0;
 margin:0 0 16px 0;
}

.messages li {
 background:#eff6ff;
 border:1px solid #bfdbfe;
 padding:10px 12px;
 border-radius:8px;
 margin-bottom:8px;
}

.form-row {
 margin-bottom:14px;
}

.kpi {
 font-size:28px;
 font-weight:700;
 line-height:1.1;
}

.brand {
 display:flex;
 align-items:center;
 gap:10px;
 color:var(--text);
 font-weight:700;
 text-decoration:none;
}

.brand:hover {
 color:var(--text);
 text-decoration:none;
}

.brand-logo {
 height:36px;
 width:auto;
 display:block;
 object-fit:contain;
}

.brand-text {
 font-size:20px;
 line-height:1;
 white-space:nowrap;
}

@media (max-width:900px) {
 .layout {
  grid-template-columns:1fr;
 }

 .sidebar {
  display:none;
 }

 .grid-2 {
  grid-template-columns:1fr;
 }

 .content {
  padding:16px;
 }

 .topbar {
  padding:10px 16px;
 }
}

@media (max-width:700px) {
 .brand-text {
  font-size:16px;
 }

 .brand-logo {
  height:30px;
 }
}

.navbar-left{
 display:flex;
 align-items:center;
}

.navbar-right{
 display:flex;
 align-items:center;
 gap:12px;
}

.user-name{
 color:var(--muted);
 font-size:14px;
}

.logout-form{
 margin:0;
}

.logout-form button{
 margin:0;
}

.logout-form{
 margin:0;
}

.logout-form button{
 margin:0;
}

.btn-small{
 padding:8px 12px;
 min-width:44px;
 text-align:center;
}

.btn-danger{
 background:#dc2626;
 color:#fff;
}

.btn-danger:hover{
 background:#b91c1c;
 color:#fff;
}

.catalog-page-header{
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:16px;
 margin-bottom:18px;
}

.catalog-page-note{
 color:var(--muted);
 margin:6px 0 0;
 line-height:1.5;
}

.catalog-layout{
 display:grid;
 grid-template-columns:minmax(320px, 420px) 1fr;
 gap:18px;
 align-items:start;
}

.catalog-tree-panel,
.catalog-detail-panel .card{
 margin-bottom:18px;
}

.catalog-search-form{
 display:flex;
 gap:10px;
 margin-bottom:16px;
}

.catalog-search-form input{
 flex:1;
}

.category-tree{
 list-style:none;
 margin:0;
 padding:0;
}

.category-tree .category-tree{
 padding-left:18px;
 margin-top:6px;
 border-left:1px solid var(--line);
}

.category-tree-node{
 margin-bottom:8px;
}

.category-tree-link{
 display:flex;
 justify-content:space-between;
 align-items:center;
 gap:12px;
 padding:10px 12px;
 border:1px solid var(--line);
 border-radius:10px;
 background:#fff;
 color:var(--text);
}

.category-tree-link:hover{
 background:#eff6ff;
 color:var(--text);
}

.category-tree-link small{
 color:var(--muted);
}

.category-tree-link-active{
 border-color:#93c5fd;
 background:#dbeafe;
}

.category-tree-link-muted{
 opacity:.65;
}

.catalog-detail-header{
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:12px;
 margin-bottom:16px;
}

.catalog-breadcrumbs{
 color:var(--muted);
 margin:6px 0 0;
}

.catalog-detail-grid{
 display:grid;
 grid-template-columns:repeat(2, minmax(0, 1fr));
 gap:14px 18px;
 margin:0 0 18px;
}

.catalog-detail-grid dt{
 font-size:12px;
 text-transform:uppercase;
 color:var(--muted);
 margin-bottom:4px;
}

.catalog-detail-grid dd{
 margin:0;
}

.catalog-actions{
 display:flex;
 flex-wrap:wrap;
 gap:10px;
}

.status-chip{
 display:inline-flex;
 align-items:center;
 padding:6px 10px;
 border-radius:999px;
 font-size:12px;
 font-weight:600;
}

.status-chip-active{
 background:#dcfce7;
 color:#166534;
}

.status-chip-muted{
 background:#e5e7eb;
 color:#4b5563;
}

.catalog-empty-state{
 color:var(--muted);
 margin:0;
}

.catalog-form-card{
 max-width:720px;
}

.workspace-page-header{
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:18px;
 margin-bottom:18px;
}

.workspace-page-header h1{
 margin:0;
}

.workspace-page-actions{
 display:flex;
 flex-wrap:wrap;
 gap:10px;
 justify-content:flex-end;
}

.workspace-layout{
 display:grid;
 grid-template-columns:minmax(320px, 420px) minmax(0, 1fr);
 gap:18px;
 align-items:start;
}

.workspace-sidebar .card,
.workspace-main .card{
 margin-bottom:18px;
}

.workspace-panel-head{
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:12px;
 margin-bottom:16px;
}

.workspace-panel-head h2,
.workspace-panel-head h3{
 margin:0;
}

.workspace-service-note{
 margin:12px 0 0;
 color:var(--muted);
 line-height:1.5;
}

.workspace-filters{
 display:grid;
 grid-template-columns:repeat(3, minmax(0, 1fr));
 gap:14px 18px;
 margin-bottom:16px;
}

.workspace-filter-actions{
 display:flex;
 gap:10px;
 align-items:flex-end;
}

.workspace-table-wrap{
 overflow:auto;
}

.workspace-pagination{
 display:flex;
 justify-content:space-between;
 align-items:center;
 gap:12px;
 margin-top:16px;
}

.entity-tree,
.entity-tree-children{
 list-style:none;
 margin:0;
 padding:0;
}

.entity-tree-node{
 margin-bottom:6px;
}

.entity-tree-children{
 padding-left:22px;
 margin-top:6px;
 border-left:1px solid var(--line);
}

.entity-tree-row{
 display:grid;
 grid-template-columns:24px 22px minmax(0, 1fr);
 align-items:center;
 gap:8px;
 padding:8px 10px;
 border:1px solid transparent;
 border-radius:12px;
 transition:background-color .15s ease, border-color .15s ease, color .15s ease;
}

.entity-tree-row:hover{
 background:#f8fafc;
 border-color:#dbeafe;
}

.entity-tree-row.is-active{
 background:#eff6ff;
 border-color:#bfdbfe;
}

.entity-tree-row.is-muted{
 opacity:.6;
}

.entity-tree-link{
 min-width:0;
 display:flex;
 flex-direction:column;
 gap:2px;
 color:var(--text);
}

.entity-tree-link:hover{
 color:var(--text);
}

.entity-tree-label{
 font-weight:600;
 line-height:1.3;
}

.entity-tree-meta{
 color:var(--muted);
 font-size:12px;
 line-height:1.3;
}

.entity-tree-toggle,
.entity-tree-toggle-placeholder{
 width:24px;
 height:24px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 border:none;
 border-radius:8px;
 background:transparent;
 padding:0;
 color:var(--muted);
}

.entity-tree-toggle:hover{
 background:#e2e8f0;
 color:var(--text);
}

.entity-tree-chevron{
 display:block;
 width:8px;
 height:8px;
 border-right:2px solid currentColor;
 border-bottom:2px solid currentColor;
 transform:rotate(-45deg);
 transition:transform .15s ease;
 margin-right:2px;
}

.entity-tree-toggle.is-open .entity-tree-chevron{
 transform:rotate(45deg);
 margin-top:-2px;
 margin-right:0;
}

.entity-tree-icon{
 position:relative;
 width:18px;
 height:16px;
 display:inline-block;
}

.entity-tree-icon-category::before{
 content:"";
 position:absolute;
 left:0;
 bottom:0;
 width:18px;
 height:12px;
 background:#f59e0b;
 border-radius:3px;
}

.entity-tree-icon-category::after{
 content:"";
 position:absolute;
 left:2px;
 top:0;
 width:8px;
 height:5px;
 background:#fbbf24;
 border-radius:2px 2px 0 0;
}

.entity-tree-icon-item::before,
.entity-tree-icon-item::after{
 content:"";
 position:absolute;
 inset:0;
 border-radius:3px;
}

.entity-tree-icon-item::before{
 background:#0ea5e9;
 top:3px;
 height:12px;
}

.entity-tree-icon-item::after{
 background:#38bdf8;
 height:4px;
 top:0;
 left:2px;
 right:2px;
 border-radius:2px 2px 0 0;
}

.search-select-native{
 display:none;
}

.search-select{
 position:relative;
 display:grid;
 grid-template-columns:minmax(0, 1fr) auto;
 gap:8px;
 align-items:start;
}

.search-select-input{
 width:100%;
}

.search-select-clear{
 background:#e2e8f0;
 color:var(--text);
 padding:10px 12px;
}

.search-select-clear:hover{
 background:#cbd5e1;
 color:var(--text);
}

.search-select-panel{
 grid-column:1 / -1;
 position:absolute;
 top:calc(100% + 6px);
 left:0;
 right:0;
 z-index:40;
 background:#fff;
 border:1px solid var(--line);
 border-radius:12px;
 box-shadow:0 18px 36px rgba(15, 23, 42, .12);
 overflow:hidden;
}

.search-select-list{
 max-height:280px;
 overflow:auto;
 padding:8px;
}

.search-select-option{
 width:100%;
 text-align:left;
 background:#fff;
 color:var(--text);
 border:1px solid transparent;
 border-radius:10px;
 padding:10px 12px;
 margin-bottom:4px;
}

.search-select-option:last-child{
 margin-bottom:0;
}

.search-select-option:hover,
.search-select-option.is-active{
 background:#eff6ff;
 color:var(--text);
 border-color:#bfdbfe;
}

.search-select-option.is-selected{
 background:#dbeafe;
 border-color:#93c5fd;
}

.search-select-empty{
 padding:12px;
 color:var(--muted);
}

.operation-page-header{
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:16px;
 margin-bottom:18px;
}

.operation-page-note{
 color:var(--muted);
 margin:6px 0 0;
 line-height:1.5;
}

.operation-overline{
 font-size:12px;
 text-transform:uppercase;
 letter-spacing:.06em;
 color:var(--muted);
 margin-bottom:8px;
}

.operation-create-layout,
.operation-detail-layout{
 display:grid;
 grid-template-columns:minmax(0, 2fr) minmax(280px, 360px);
 gap:18px;
 align-items:start;
}

.operation-section-head{
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:12px;
 margin-bottom:16px;
}

.operation-params-grid,
.operation-filters-grid{
 display:grid;
 grid-template-columns:repeat(2, minmax(0, 1fr));
 gap:14px 18px;
}

.operation-document-grid{
 display:grid;
 grid-template-columns:repeat(2, minmax(0, 1fr));
 gap:14px 18px;
}

.operation-document-type-row,
.operation-document-note-row,
.operation-notes-row,
.operation-filter-actions{
 grid-column:1 / -1;
}

.operation-item-picker{
 display:block;
}

.operation-search-toolbar{
 display:grid;
 grid-template-columns:minmax(0, 2fr) minmax(160px, 220px) auto;
 gap:14px;
 align-items:end;
 margin-bottom:12px;
}

.operation-item-search-row{
 margin-bottom:0;
}

.operation-item-quantity-row{
 margin-bottom:0;
}

.operation-picker-actions{
 display:flex;
 align-items:flex-end;
 height:100%;
}

.operation-search-status{
 color:var(--muted);
 font-size:13px;
 line-height:1.4;
 margin-bottom:10px;
}

.operation-combobox{
 position:relative;
}

.operation-combobox-results{
 position:absolute;
 top:calc(100% + 6px);
 left:0;
 right:0;
 background:#fff;
 border:1px solid var(--line);
 border-radius:12px;
 box-shadow:0 18px 36px rgba(15, 23, 42, .12);
 z-index:30;
 max-height:320px;
 overflow:auto;
 padding:8px;
}

.operation-combobox-item{
 width:100%;
 display:flex;
 flex-direction:column;
 align-items:flex-start;
 gap:2px;
 background:#fff;
 color:var(--text);
 border:1px solid transparent;
 padding:10px 12px;
 border-radius:10px;
}

.operation-combobox-item:hover{
 background:#eff6ff;
 color:var(--text);
 border-color:#bfdbfe;
}

.operation-combobox-item span{
 color:var(--muted);
 font-size:13px;
}

.operation-selected-item{
 margin-bottom:12px;
 display:flex;
 flex-wrap:wrap;
 gap:10px;
 color:var(--muted);
 font-size:13px;
}

.operation-search-results-wrap{
 margin-top:8px;
}

.operation-search-result-row{
 cursor:pointer;
}

.operation-search-result-row td{
 transition:background-color .15s ease;
}

.operation-search-result-row:hover td{
 background:#eff6ff;
}

.operation-search-result-row.is-selected td{
 background:#dbeafe;
}

.operation-callout{
 border:1px solid #dbeafe;
 background:#eff6ff;
 color:#1d4ed8;
 padding:12px 14px;
 border-radius:12px;
 line-height:1.5;
}

.operation-callout-warning{
 background:#fff7ed;
 border-color:#fed7aa;
 color:#9a3412;
 margin-bottom:16px;
}

.operation-fixed-site-value{
 min-height:42px;
 display:flex;
 align-items:center;
 padding:10px 12px;
 border:1px solid var(--line);
 border-radius:8px;
 background:#f8fafc;
 color:var(--text);
}

.operation-summary-card{
 position:sticky;
 top:24px;
}

.operation-summary-list{
 margin:0 0 18px;
 display:grid;
 gap:12px;
}

.operation-summary-list div{
 display:flex;
 justify-content:space-between;
 gap:12px;
 padding-bottom:12px;
 border-bottom:1px solid var(--line);
}

.operation-summary-list dt{
 color:var(--muted);
 font-size:13px;
}

.operation-summary-list dd{
 margin:0;
 font-weight:700;
}

.operation-submit-button,
.operation-action-button{
 width:100%;
 margin-bottom:10px;
 text-align:center;
}

.operation-table-wrap{
 overflow:auto;
}

.operation-empty-table{
 text-align:center;
 color:var(--muted);
 padding:26px 12px;
}

.operation-status-chip{
 display:inline-flex;
 align-items:center;
 padding:6px 10px;
 border-radius:999px;
 font-size:12px;
 font-weight:600;
 white-space:nowrap;
}

.operation-status-chip-muted{
 background:#e5e7eb;
 color:#4b5563;
}

.operation-status-chip-success{
 background:#dcfce7;
 color:#166534;
}

.operation-status-chip-info{
 background:#dbeafe;
 color:#1d4ed8;
}

.operation-status-chip-warning{
 background:#fef3c7;
 color:#92400e;
}

.operation-status-chip-danger{
 background:#fee2e2;
 color:#991b1b;
}

.operation-inline-note{
 margin-top:16px;
 padding-top:16px;
 border-top:1px solid var(--line);
 line-height:1.5;
}

.operation-detail-grid{
 display:grid;
 grid-template-columns:repeat(2, minmax(0, 1fr));
 gap:14px 18px;
 margin:0;
}

.operation-detail-grid dt{
 font-size:12px;
 text-transform:uppercase;
 color:var(--muted);
 margin-bottom:4px;
}

.operation-detail-grid dd{
 margin:0;
}

.operation-status-list{
 padding-left:18px;
 margin:0;
 color:var(--muted);
 line-height:1.6;
}

.operation-row-meta{
 color:var(--muted);
 font-size:13px;
 line-height:1.4;
}

.operation-pagination{
 display:flex;
 justify-content:space-between;
 align-items:center;
 gap:12px;
 margin-top:16px;
}

.operation-pagination-actions{
 display:flex;
 align-items:center;
 gap:10px;
}

.operation-field-hint{
 display:block;
 margin-top:6px;
 color:var(--muted);
}

.operation-hidden{
 display:none !important;
}

.operation-empty-card{
 max-width:760px;
}

.loading-spinner{
 display:inline-block;
 width:14px;
 height:14px;
 border:2px solid rgba(255,255,255,.45);
 border-top-color:#fff;
 border-radius:999px;
 animation:spin .8s linear infinite;
 flex-shrink:0;
}

.loading-spinner-lg{
 width:24px;
 height:24px;
 border-width:3px;
}

button.is-loading{
 display:inline-flex;
 align-items:center;
 gap:8px;
}

.page-loading-overlay{
 position:fixed;
 inset:0;
 background:rgba(15, 23, 42, .24);
 display:flex;
 align-items:center;
 justify-content:center;
 z-index:1000;
}

.page-loading-overlay[hidden]{
 display:none;
}

.page-loading-overlay__content{
 background:#fff;
 border:1px solid var(--line);
 border-radius:14px;
 padding:16px 20px;
 display:flex;
 align-items:center;
 gap:12px;
 box-shadow:0 20px 45px rgba(15, 23, 42, .12);
}

.page-loading-overlay__content .loading-spinner{
 border-color:rgba(29, 78, 216, .25);
 border-top-color:var(--brand);
}

@keyframes spin{
 to{
  transform:rotate(360deg);
 }
}

@media (max-width:900px) {
 .catalog-layout{
  grid-template-columns:1fr;
 }

 .workspace-page-header,
 .workspace-pagination{
  flex-direction:column;
  align-items:flex-start;
 }

 .workspace-page-actions{
  justify-content:flex-start;
 }

 .workspace-layout{
  grid-template-columns:1fr;
 }

 .workspace-filters{
  grid-template-columns:1fr;
 }

 .catalog-search-form{
  flex-direction:column;
 }

 .catalog-detail-grid{
  grid-template-columns:1fr;
 }

 .operation-page-header,
 .operation-pagination{
  flex-direction:column;
  align-items:flex-start;
 }

 .operation-create-layout,
 .operation-detail-layout{
  grid-template-columns:1fr;
 }

 .operation-params-grid,
 .operation-document-grid,
 .operation-filters-grid,
 .operation-detail-grid{
  grid-template-columns:1fr;
 }

 .operation-search-toolbar{
  grid-template-columns:1fr;
 }

 .operation-summary-card{
  position:static;
 }
}