*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:var(--bg-page); color:var(--text-primary); font-family:var(--font-body); min-height:100vh;}
h1,h2,h3{font-family:var(--font-display); font-weight:600; margin:0;}
.mono{font-family:var(--font-mono); font-variant-numeric:tabular-nums;}
::selection{background:var(--action-primary); color:var(--action-primary-text);}

/* ---- App shell: sidebar + main content ---- */
.app-shell{display:flex; min-height:100vh;}
.sidebar{
  width:250px; flex-shrink:0; background:var(--bg-sidebar); color:var(--text-on-dark);
  display:flex; flex-direction:column; position:sticky; top:0; height:100vh; overflow-y:auto;
  border-right:3px solid var(--action-primary);
}
.sidebar-brand{padding:20px 18px 14px;}
.sidebar-brand h1{font-size:19px; color:var(--text-on-dark); letter-spacing:0.3px;}
.sidebar-brand span{font-size:10px; color:var(--action-primary); text-transform:uppercase; letter-spacing:1.5px;}
.sidebar-search-trigger{
  margin:4px 14px 14px; background:var(--bg-sidebar-hover); border:1px solid rgba(247,242,231,0.12);
  color:var(--text-on-dark-soft); border-radius:var(--radius); padding:8px 12px; font-size:13px;
  display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-family:var(--font-body);
}
.sidebar-search-trigger .kbd{font-family:var(--font-mono); font-size:11px; opacity:0.7;}
.sidebar-nav{flex:1; padding:0 10px; overflow-y:auto;}
.sidebar-group{margin-bottom:2px;}
.sidebar-item{
  width:100%; text-align:left; background:none; border:none; color:var(--text-on-dark);
  padding:9px 10px; font-size:14px; font-family:var(--font-body); border-radius:var(--radius);
  cursor:pointer; display:flex; justify-content:space-between; align-items:center; opacity:0.82;
}
.sidebar-item:hover{background:var(--bg-sidebar-hover); opacity:1;}
.sidebar-item.active{background:var(--bg-sidebar-active); opacity:1; font-weight:600;}
.sidebar-item .chevron{transition:transform 0.15s; opacity:0.5; font-size:15px;}
.sidebar-item .chevron.open{transform:rotate(90deg);}
.sidebar-subitems{padding-left:14px; margin:2px 0 6px;}
.sidebar-subitem{
  width:100%; text-align:left; background:none; border:none; color:var(--text-on-dark-soft);
  padding:7px 10px; font-size:13px; font-family:var(--font-body); border-radius:var(--radius);
  cursor:pointer; display:block; border-left:2px solid transparent;
}
.sidebar-subitem:hover{background:var(--bg-sidebar-hover); color:var(--text-on-dark);}
.sidebar-subitem.active{color:var(--text-on-dark); border-left-color:var(--action-primary); font-weight:600;}
.sidebar-footer{padding:14px; border-top:1px solid rgba(247,242,231,0.1);}
.sidebar-account{font-size:11px; color:var(--text-on-dark-soft); margin-bottom:8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

.mobile-topbar{display:none;}
.app-main{flex:1; min-width:0;}
.wrap{max-width:960px; margin:0 auto; padding:28px 20px 80px;}

.subtabs{display:flex; gap:2px; margin-bottom:18px; border-bottom:1px solid var(--border-default); flex-wrap:wrap;}
.subtab{background:none; border:none; padding:9px 4px; margin-right:22px; font-size:13px; font-weight:500; color:var(--text-secondary); cursor:pointer; border-bottom:2px solid transparent;}
.subtab.active{color:var(--text-primary); border-bottom-color:var(--action-primary-hover);}

@media (max-width:860px){
  .sidebar{position:fixed; left:-270px; top:0; z-index:60; transition:left 0.2s; box-shadow:2px 0 12px rgba(0,0,0,0.25);}
  .sidebar.open{left:0;}
  .mobile-topbar{
    display:flex; align-items:center; gap:12px; background:var(--bg-sidebar); color:var(--text-on-dark);
    padding:12px 16px; border-bottom:3px solid var(--action-primary); position:sticky; top:0; z-index:40;
  }
  .mobile-topbar button{background:none; border:none; color:var(--text-on-dark); font-size:20px; cursor:pointer; padding:0;}
}

/* ---- Command palette ---- */
.cmdk-overlay{position:fixed; inset:0; background:rgba(23,28,26,0.55); z-index:100; display:flex; align-items:flex-start; justify-content:center; padding-top:12vh;}
.cmdk-overlay.hidden{display:none;}
.cmdk-box{background:var(--bg-surface); width:100%; max-width:480px; border-radius:6px; box-shadow:0 12px 40px rgba(0,0,0,0.3); overflow:hidden; margin:0 16px;}
.cmdk-box input{width:100%; border:none; border-bottom:1px solid var(--border-default); padding:16px 18px; font-size:16px; font-family:var(--font-body); outline:none; background:transparent; color:var(--text-primary);}
.cmdk-results{max-height:360px; overflow-y:auto; padding:6px;}
.cmdk-item{padding:10px 12px; border-radius:4px; cursor:pointer; display:flex; justify-content:space-between; align-items:center; font-size:14px;}
.cmdk-item.highlighted{background:var(--bg-sidebar-active);}
.cmdk-sublabel{font-size:11px; color:var(--text-secondary); text-transform:uppercase; letter-spacing:0.5px;}
.cmdk-empty{padding:20px; text-align:center; color:var(--text-secondary); font-size:13px;}

/* ---- Forms ---- */
label{display:block; font-size:12px; font-weight:500; color:var(--text-secondary); margin-bottom:5px; margin-top:14px;}
input[type=text], input[type=email], input[type=password], input[type=date], input[type=number], textarea, select{
  width:100%; padding:9px 10px; border:1px solid var(--border-default); border-radius:var(--radius);
  background:var(--bg-surface); font-family:var(--font-body); font-size:14px; color:var(--text-primary);
}
input:focus, textarea:focus, select:focus{outline:2px solid var(--border-focus); outline-offset:1px; border-color:var(--border-focus);}
.field label{margin-top:0;}

/* ---- Buttons ---- */
.btn{background:var(--action-primary); color:var(--action-primary-text); border:none; border-radius:var(--radius); padding:10px 18px; font-size:14px; font-weight:500; cursor:pointer; font-family:var(--font-body);}
.btn:hover{background:var(--action-primary-hover);}
.btn:disabled{opacity:0.5; cursor:default;}
.btn-full{width:100%; margin-top:20px;}
.btn-ghost{background:none; border:1px solid var(--border-default); color:var(--text-primary);}
.btn-ghost:hover{border-color:var(--action-primary); color:var(--action-primary-hover);}
.signout{background:none;border:1px solid rgba(247,242,231,0.3);color:var(--text-on-dark);padding:6px 12px;border-radius:var(--radius);font-size:12px;cursor:pointer; width:100%;}
.signout:hover{border-color:var(--action-primary); color:var(--action-primary);}

/* ---- Cards / stats / tables (used by any domain) ---- */
.card-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; margin-bottom:22px;}
.stat-card{background:var(--bg-surface); border:1px solid var(--border-default); border-radius:var(--radius); padding:16px 18px;}
.stat-card .label{font-size:11px; text-transform:uppercase; letter-spacing:1px; color:var(--text-secondary);}
.stat-card .value{font-size:24px; margin-top:6px;}
.stat-card .value.debit{color:var(--status-negative);}
.stat-card .value.credit{color:var(--status-positive);}
.chart-card{background:var(--bg-surface); border:1px solid var(--border-default); border-radius:var(--radius); padding:18px; margin-bottom:22px;}
.chart-card h3{font-size:15px; margin-bottom:14px;}
table{width:100%; border-collapse:collapse; font-size:13px;}
th{text-align:left; font-family:var(--font-mono); font-size:10px; text-transform:uppercase; letter-spacing:1px; color:var(--text-secondary); padding:8px 10px; border-bottom:1px solid var(--text-primary);}
td{padding:8px 10px; border-bottom:1px solid var(--border-default);}
tr.mismatch td{background:var(--status-negative-bg);}
td.num{font-family:var(--font-mono); text-align:right;}
.table-card{background:var(--bg-surface); border:1px solid var(--border-default); border-radius:var(--radius); padding:4px 18px 14px; overflow-x:auto;}
.empty-note{padding:30px 10px; text-align:center; color:var(--text-secondary); font-size:13px;}

/* ---- Toast / errors ---- */
.toast{position:fixed; bottom:20px; right:20px; background:var(--text-primary); color:var(--text-on-dark); padding:12px 18px; border-radius:var(--radius); font-size:13px; border-left:3px solid var(--action-primary); box-shadow:0 4px 12px rgba(0,0,0,0.2); z-index:50;}
.toast.error{border-left-color:var(--status-negative);}
.error-msg{background:var(--status-negative-bg); border:1px solid var(--status-negative); color:var(--status-negative); padding:10px 12px; border-radius:var(--radius); font-size:13px; margin-top:14px;}
.info-msg{background:var(--status-positive-bg); border:1px solid var(--status-positive); color:var(--status-positive); padding:10px 12px; border-radius:var(--radius); font-size:13px; margin-top:14px;}

/* ---- Generic form panel (stitched-ledger look) — used by any domain's add/edit forms ---- */
.form-panel{
  background:var(--bg-surface); border:1px solid var(--border-default); border-radius:var(--radius);
  position:relative; padding:26px 26px 26px 40px; margin-bottom:24px;
}
.form-panel::before{
  content:''; position:absolute; left:20px; top:14px; bottom:14px; width:0;
  border-left:2px dashed var(--border-default);
}
.form-panel::after{
  content:''; position:absolute; left:16px; top:0; bottom:0; width:8px;
  background-image: radial-gradient(circle, var(--bg-page) 2px, transparent 2.2px);
  background-size: 8px 16px; background-repeat: repeat-y;
}
.section-title{
  font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:1.4px;
  color:var(--action-primary-hover); margin:22px 0 10px; padding-bottom:6px; border-bottom:1px solid var(--border-default);
}
.section-title:first-child{margin-top:0;}
.field-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(160px,1fr)); gap:12px 16px;}
.field-grid.wide{grid-template-columns:repeat(auto-fill, minmax(220px,1fr));}
.date-row{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:4px;}
.date-row .field{flex:1; min-width:160px;}

@media (max-width:600px){
  .form-panel{padding:20px 16px 20px 30px;}
  .form-panel::before{left:14px;} .form-panel::after{left:10px;}
}