  :root{
    --bg:#F4F1EA;
    --panel:#FFFFFF;
    --surface:#F1ECE0;
    --surface-2:#E8E0CD;
    --line: rgba(112,101,79,0.14);
    --line-strong: rgba(112,101,79,0.26);
    --text:#4A4438;
    --text-muted:#8B8272;
    --text-faint:#AFA791;
    --gold:#C6A046;
    --gold-bright:#A67C2E;
    --gold-soft:#F1E4B8;
    --sage:#8FA98F;
    --sage-bright:#5F7C61;
    --sage-soft:#E1EAE1;
    --terracotta:#C48B72;
    --terracotta-bright:#A15F45;
    --terracotta-soft:#F1E1D9;
    --slate:#8598A6;
    --slate-bright:#5C7382;
    --slate-soft:#E3EAEE;
    --radius:10px;
    --radius-sm:6px;

    /* Bootstrap theme overrides — map Bootstrap's variables to our gold palette */
    --bs-primary:#C6A046;
    --bs-primary-rgb:198,160,70;
    --bs-secondary:#8598A6;
    --bs-secondary-rgb:133,152,166;
    --bs-success:#5F7C61;
    --bs-success-rgb:95,124,97;
    --bs-danger:#A15F45;
    --bs-danger-rgb:161,95,69;
    --bs-warning:#F1E4B8;
    --bs-warning-rgb:232,223,199;
    --bs-body-bg:#F4F1EA;
    --bs-body-color:#4A4438;
    --bs-border-color:rgba(112,101,79,0.26);
    --bs-link-color:#A67C2E;
    --bs-link-hover-color:#7C6A3C;
    --bs-font-sans-serif:'IBM Plex Sans Arabic', sans-serif;
    --bs-btn-focus-box-shadow:0 0 0 0.2rem rgba(198,160,70,0.25);
  }

  .btn-primary{ --bs-btn-bg:#C6A046; --bs-btn-border-color:#C6A046; --bs-btn-hover-bg:#A67C2E; --bs-btn-hover-border-color:#A67C2E; --bs-btn-active-bg:#8C6425; }
  .btn-outline-secondary{ --bs-btn-color:#8B8272; --bs-btn-border-color:var(--line-strong); }
  .dropdown-item:active, .dropdown-item.active{ background-color:var(--gold-soft); color:#3E3627; }
  .user-avatar{
    width:26px; height:26px; border-radius:50%; background:var(--gold-soft);
    display:inline-flex; align-items:center; justify-content:center; font-size:13px;
  }
  .table > :not(caption) > * > *{ background-color:transparent; }
  .form-select:focus, .form-control:focus{ border-color:var(--gold); box-shadow:0 0 0 0.2rem rgba(198,160,70,0.2); }

  /* ================= Unified brand button system =================
     One shape (pill), one color family (gold) for every button in the app.
     Individual classes below only control emphasis (outline vs solid),
     never a different color family. */
  .btn-ghost, .btn-mini, .btn-add, .btn-clear, .btn-save, .pill,
  #loginBtn, .dropdown-toggle.btn{
    --bs-btn-color: var(--gold-bright);
    --bs-btn-bg: #fff;
    --bs-btn-border-color: var(--gold);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--gold);
    --bs-btn-hover-border-color: var(--gold);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--gold-bright);
    --bs-btn-active-border-color: var(--gold-bright);
    --bs-btn-disabled-color: var(--text-faint);
    --bs-btn-disabled-bg: #fff;
    --bs-btn-disabled-border-color: var(--line-strong);
    border-width:1.5px !important;
    border-radius:999px !important;
    font-family:'Cairo',sans-serif;
    font-weight:700;
    font-size:12.5px;
    padding:0.42rem 1rem;
    transition:.15s;
  }

  /* Solid emphasis — primary/confirm actions, still same gold family */
  .btn-mini, .btn-save, #loginBtn{
    --bs-btn-color:#fff;
    --bs-btn-bg: var(--gold);
    --bs-btn-border-color: var(--gold);
    --bs-btn-hover-bg: var(--gold-bright);
    --bs-btn-hover-border-color: var(--gold-bright);
    --bs-btn-active-bg:#8C6425;
    --bs-btn-active-border-color:#8C6425;
  }
  .btn-save{ padding:0.55rem 1.5rem; font-size:14px; }

  /* Active/selected state shares the exact same solid look everywhere */
  .pill.active{
    background:var(--gold) !important; border-color:var(--gold) !important; color:#fff !important;
  }

  /* Compact circular icon buttons — same gold family, smaller footprint */
  .icon-btn, .del-row, .mkt-arrow{
    width:26px; height:26px; padding:0 !important;
    border:1.5px solid var(--line-strong);
    border-radius:50% !important;
    background:#fff; color:var(--gold-bright);
    display:inline-flex; align-items:center; justify-content:center;
    font-size:11.5px; cursor:pointer; transition:.15s;
  }
  .icon-btn:hover, .mkt-arrow:hover{ background:var(--gold); border-color:var(--gold); color:#fff; }
  .icon-btn.del:hover, .del-row:hover{ background:var(--terracotta); border-color:var(--terracotta); color:#fff; }

  /* Type-toggle (client/trader) shares the same family, segmented style */
  .type-toggle button{
    border:1.5px solid var(--gold); background:#fff; color:var(--gold-bright);
    font-family:'Cairo',sans-serif; font-weight:700; font-size:12.5px;
  }
  .type-toggle button.active{ background:var(--gold) !important; color:#fff !important; border-color:var(--gold) !important; }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:
      radial-gradient(1100px 550px at 12% -10%, rgba(198,160,70,0.10), transparent 60%),
      radial-gradient(900px 500px at 100% 0%, rgba(143,169,143,0.08), transparent 55%),
      var(--bg);
    color:var(--text);
    font-family:'IBM Plex Sans Arabic', sans-serif;
    min-height:100vh;
    padding:22px;
  }
  .num{ font-family:'JetBrains Mono', monospace; direction:ltr; unicode-bidi:embed; font-weight:600; letter-spacing:0.2px; }
  h1,h2,h3{font-family:'Cairo', sans-serif; margin:0;}

  .app{max-width:1400px; margin:0 auto; display:flex; flex-direction:column; gap:16px;}
  .app.locked{filter:blur(4px); pointer-events:none; user-select:none;}

  .login-overlay{ position:fixed; inset:0; background:rgba(74,68,56,0.35); display:flex; align-items:center; justify-content:center; z-index:50; backdrop-filter:blur(2px); }
  .login-card{ background:var(--panel); border:1px solid var(--line-strong); border-radius:14px; padding:32px 30px; width:320px; box-shadow:0 18px 40px rgba(74,68,56,0.18); text-align:center; }
  .login-card .mark{width:46px; height:46px; margin:0 auto 12px; border-radius:50%; background:radial-gradient(circle at 32% 28%, var(--gold-soft), var(--gold) 60%, var(--gold-bright) 100%); box-shadow: inset 0 0 0 1px rgba(0,0,0,0.08);}
  .login-card h2{font-size:18px; color:var(--gold-bright); margin-bottom:2px;}
  .login-card p{font-size:11.5px; color:var(--text-faint); margin:0 0 18px;}
  .login-card input{ width:100%; background:var(--surface); border:1px solid var(--line-strong); border-radius:var(--radius-sm); padding:10px 12px; margin-bottom:10px; font-size:13.5px; color:var(--text); font-family:'IBM Plex Sans Arabic',sans-serif; }
  .login-card button{ width:100%; background:linear-gradient(160deg, var(--gold), var(--gold-bright)); color:#fff; border:none; border-radius:var(--radius-sm); padding:11px; font-weight:800; font-size:14px; cursor:pointer; font-family:'Cairo',sans-serif; margin-top:6px; }
  .login-card .hint{margin-top:12px; font-size:10.5px; color:var(--text-faint);}

  .topbar{ display:flex; align-items:center; gap:16px; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:14px 20px; flex-wrap:wrap; box-shadow:0 1px 3px rgba(74,68,56,0.04); }
  .brand{display:flex; align-items:center; gap:10px;}
  .brand .mark{ width:38px; height:38px; border-radius:50%; background: radial-gradient(circle at 32% 28%, var(--gold-soft), var(--gold) 55%, var(--gold-bright) 100%); box-shadow: inset 0 0 0 1px rgba(0,0,0,0.06), 0 2px 6px rgba(74,68,56,0.12); flex-shrink:0; }
  .brand-text h1{font-size:19px; font-weight:800; color:var(--gold-bright); letter-spacing:0.3px;}
  .brand-text span{font-size:11.5px; color:var(--text-faint);}
  .user-tag{margin-inline-start:6px; font-size:11.5px; color:var(--text-faint); border-inline-start:1px solid var(--line-strong); padding-inline-start:12px;}
  .user-tag b{color:var(--text-muted);}

  .type-toggle{display:flex; border:1px solid var(--line-strong); border-radius:999px; padding:3px; gap:2px; margin-inline-start:auto;}

  .client-block{display:flex; align-items:center; gap:10px;}
  .client-block label{font-size:12px; color:var(--text-muted); white-space:nowrap;}
  select#accountSelect{ background:var(--surface); color:var(--gold-bright); border:1px solid var(--line-strong); border-radius:var(--radius-sm); padding:9px 12px; font-family:'Cairo',sans-serif; font-weight:700; font-size:14.5px; min-width:170px; cursor:pointer; }

  .chips{display:flex; gap:10px; flex-wrap:wrap; width:100%; margin-top:12px;}
  .chip{ background:linear-gradient(155deg, var(--surface-2), var(--surface)); border:1px solid var(--line-strong); border-radius:var(--radius-sm); padding:8px 14px; min-width:118px; transition:.18s ease; }
  .chip:hover{ border-color:var(--gold); box-shadow:0 6px 16px rgba(74,68,56,0.09); transform:translateY(-2px); }
  .chip .lab{font-size:10.5px; color:var(--text-faint);}
  .chip .val{font-size:16px; margin-top:2px;}
  .chip.gold .val{color:var(--gold-bright);}
  .chip.cash .val{color:var(--text);}
  .chip.cash.neg .val{color:var(--terracotta-bright);}
  .chip.cash.pos .val{color:var(--sage-bright);}

  .toolbar{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:12px 18px; transition:.2s ease; }
  .toolbar:hover{ border-color:var(--gold); box-shadow:0 10px 24px rgba(74,68,56,0.09); transform:translateY(-2px); }
  .pillgroup{display:flex; gap:8px; flex-wrap:wrap;}
  .section-toggles{margin-inline-start:8px; padding-inline-start:12px; border-inline-start:1px solid var(--line-strong);}

  .dates{display:flex; align-items:center; gap:8px; margin-inline-start:auto; flex-wrap:wrap;}
  .dates label{font-size:11.5px; color:var(--text-faint);}
  .dates input[type=date]{ background:var(--surface); border:1px solid var(--line-strong); color:var(--text); border-radius:var(--radius-sm); padding:7px 9px; font-family:'JetBrains Mono',monospace; font-size:12.5px; }

  .market-toolbar{padding:10px 18px;}
  .market-price{display:flex; align-items:center; gap:18px; flex-wrap:wrap; width:100%;}
  .mp-item{display:flex; align-items:center; gap:8px;}
  .mp-item .lab{font-size:11.5px; color:var(--text-muted); white-space:nowrap;}
  .mp-item .val{font-size:15px; color:var(--gold-bright);}
  .mp-item input{ width:90px; background:var(--surface); border:1px solid var(--line-strong); color:var(--gold-bright); border-radius:var(--radius-sm); padding:6px 8px; font-size:14px; direction:ltr; text-align:center; font-family:'JetBrains Mono',monospace; }
  .market-price .mp-time{font-size:11px; color:var(--text-faint); margin-inline-start:auto;}
  .mp-status{width:100%; font-size:10.5px; color:var(--text-faint); margin-top:2px;}
  .mp-status.live{color:var(--sage-bright);}
  .mp-status.err{color:var(--terracotta-bright);}
  .price-cell{display:flex; align-items:center; gap:4px;}

  .workspace{ display:grid; grid-template-columns:1fr 1fr; grid-template-areas:"entry entry" "display traderSummary"; gap:16px; align-items:start; }
  .ticket{grid-area:entry;}
  .ledger-panel{grid-area:display;}
  .trader-summary-panel{grid-area:traderSummary;}
  @media (max-width:1040px){ .workspace{grid-template-columns:1fr; grid-template-areas:"entry" "display" "traderSummary";} }

  .trader-summary-scroll{max-height:260px;}
  #traderSummaryBody tr{cursor:pointer;}
  #traderSummaryBody tr:hover{background:rgba(198,160,70,0.09);}
  #traderSummaryBody tr.trader-row-active{background:rgba(198,160,70,0.16);}
  #traderSummaryBody td.tr-name{text-align:start; padding-inline-start:14px;}
  .trader-summary-footer{justify-content:flex-end;}

  section.panel{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:0; overflow:hidden; box-shadow:0 1px 3px rgba(74,68,56,0.04); transition:.2s ease; }
  section.panel:hover{ border-color:var(--gold); box-shadow:0 14px 30px rgba(74,68,56,0.11); transform:translateY(-3px); }
  .panel-head{ display:flex; align-items:center; justify-content:space-between; padding:14px 18px; border-bottom:1px solid var(--line); }
  .panel-head h2{font-size:15.5px; color:var(--gold-bright); font-weight:800;}
  .panel-head .hint{font-size:11px; color:var(--text-faint);}

  .ticket{position:relative;}
  .ticket::before{ content:""; position:absolute; top:0; left:0; right:0; height:10px; background-image: radial-gradient(circle, var(--bg) 3.4px, transparent 3.6px); background-size:18px 18px; background-position:8px -6px; }
  .ticket-hole{ position:absolute; top:16px; left:16px; width:16px; height:16px; border-radius:50%; background:var(--bg); border:1px solid var(--line-strong); }

  table{width:100%; border-collapse:collapse; font-size:12px;}
  thead th{ text-align:center; font-weight:700; color:var(--text-muted); font-size:10.4px; background:var(--surface); padding:9px 5px; border-bottom:1px solid var(--line-strong); white-space:nowrap; }
  tbody td{padding:6px 5px; border-bottom:1px solid var(--line); text-align:center; vertical-align:middle;}
  tbody tr:hover{background:rgba(198,160,70,0.05);}
  tbody input, tbody select{ width:100%; background:var(--surface); border:1px solid var(--line-strong); color:var(--text); border-radius:5px; padding:5px 3px; font-size:11.5px; text-align:center; font-family:'IBM Plex Sans Arabic',sans-serif; }
  .purity-cell{min-width:130px;}
  .purity-manual{display:flex; flex-direction:column; gap:4px; margin-top:4px;}
  tbody input.num-in{font-family:'JetBrains Mono',monospace; direction:ltr;}
  .ticket-scroll{max-height:210px; overflow:auto;}
  .add-row-bar{padding:8px 18px; border-top:1px solid var(--line); display:flex; gap:8px;}

  .cash-only{display:none; padding:22px 18px; gap:12px; flex-direction:column;}
  .cash-only.show{display:flex;}
  .cash-only .field{display:flex; flex-direction:column; gap:6px;}
  .cash-only label{font-size:12px; color:var(--text-muted);}
  .cash-only input{ background:var(--surface); border:1px solid var(--line-strong); color:var(--gold-bright); border-radius:var(--radius-sm); padding:11px 12px; font-size:17px; font-family:'JetBrains Mono',monospace; direction:ltr; }
  .ticket-table-wrap.hide{display:none;}

  .ticket-footer{ display:flex; align-items:flex-end; justify-content:space-between; gap:14px; padding:12px 18px; border-top:1px solid var(--line-strong); flex-wrap:wrap; background:var(--surface); }
  .foot-note textarea{ background:var(--panel); border:1px solid var(--line-strong); color:var(--text); border-radius:var(--radius-sm); padding:8px 10px; font-size:12px; width:180px; height:38px; resize:none; font-family:'IBM Plex Sans Arabic',sans-serif; }
  .foot-stats{display:flex; gap:12px; flex-wrap:wrap;}
  .foot-stats .fs{text-align:center;}
  .foot-stats .fs .lab{font-size:10px; color:var(--text-faint);}
  .foot-stats .fs .val{font-size:14px; margin-top:2px; color:var(--gold-bright);}

  .ledger-scroll{max-height:400px; overflow:auto;}
  .tag{display:inline-block; padding:2px 8px; border-radius:999px; font-size:10.5px; font-weight:700;}
  .tag.sell{background:var(--sage-soft); color:var(--sage-bright);}
  .tag.buy{background:var(--terracotta-soft); color:var(--terracotta-bright);}
  .tag.gold{background:var(--gold-soft); color:var(--gold-bright);}
  .tag.cash{background:var(--gold-soft); color:var(--gold-bright);}
  .pos{color:var(--sage-bright);}
  .neg{color:var(--terracotta-bright);}
  .muted-cell{color:var(--text-faint);}
  .row-actions{display:flex; gap:6px; justify-content:center;}
  .edit-in{width:60px !important;}

  .totals-bar{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:14px 18px; display:flex; align-items:center; gap:22px; flex-wrap:wrap; transition:.2s ease; }
  .totals-bar:hover{ border-color:var(--gold); box-shadow:0 10px 24px rgba(74,68,56,0.09); transform:translateY(-2px); }
  .totals-bar .grid{display:grid; grid-template-columns:repeat(3,auto); gap:16px 30px;}
  .totals-bar .t{text-align:center;}
  .totals-bar .t .lab{font-size:10.5px; color:var(--text-faint);}
  .totals-bar .t .val{font-size:14.5px; margin-top:2px;}
  .totals-bar .actions{margin-inline-start:auto; display:flex; gap:8px; flex-wrap:wrap;}

  .treasuries{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; display:grid; grid-template-columns:1fr 1fr; gap:18px; transition:.2s ease; }
  .treasuries:hover{ border-color:var(--gold); box-shadow:0 14px 30px rgba(74,68,56,0.11); transform:translateY(-3px); }
  @media (max-width:1040px){ .treasuries{grid-template-columns:1fr;} }
  .treasuries h2{font-size:15.5px; color:var(--gold-bright); font-weight:800; margin-bottom:12px;}
  .tr-balances{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px;}
  .tr-chip{background:var(--surface); border:1px solid var(--line-strong); border-radius:var(--radius-sm); padding:8px 14px; min-width:150px; transition:.18s ease;}
  .tr-chip:hover{ border-color:var(--gold); box-shadow:0 6px 16px rgba(74,68,56,0.09); transform:translateY(-2px); }
  .tr-chip .lab{font-size:10px; color:var(--text-faint);}
  .tr-chip .val{font-size:15px; margin-top:2px; color:var(--gold-bright);}
  .tr-chip-row{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:2px;}
  .tr-chip-actions{display:flex; gap:4px;}
  .tr-chip-actions .icon-btn{width:22px; height:22px; font-size:11px;}
  .tr-edit-in{width:100px; font-size:14px; padding:2px 6px;}
  .tr-form{display:flex; gap:8px; flex-wrap:wrap; align-items:flex-end;}
  .tr-form .field{display:flex; flex-direction:column; gap:5px;}
  .tr-form label{font-size:11px; color:var(--text-muted);}
  .tr-form select, .tr-form input{ background:var(--surface); border:1px solid var(--line-strong); color:var(--text); border-radius:var(--radius-sm); padding:8px 10px; font-size:12.5px; font-family:'IBM Plex Sans Arabic',sans-serif; }
  .day-open-box{margin-bottom:16px; padding-bottom:16px; border-bottom:1px dashed var(--line-strong);}
  .day-open-pair{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
  .day-open-pair .day-open-box{margin-bottom:16px; padding-bottom:0; border-bottom:none; padding-inline-start:16px; border-inline-start:1px dashed var(--line-strong);}
  .day-open-pair .day-open-box:first-child{padding-inline-start:0; border-inline-start:none;}
  @media (max-width:760px){ .day-open-pair{grid-template-columns:1fr;} .day-open-pair .day-open-box{padding-inline-start:0; border-inline-start:none; padding-bottom:16px; border-bottom:1px dashed var(--line-strong);} }
  .day-open-status{font-size:12px; color:var(--text-faint); margin-bottom:10px; font-weight:700;}
  .day-open-status.open{color:var(--sage-bright);}
  .day-open-status.reopen{color:var(--terracotta-bright);}
  .tr-form input{width:110px; font-family:'JetBrains Mono',monospace;}
  .writeoff-list{margin-top:12px; max-height:110px; overflow:auto; font-size:11.5px;}
  .writeoff-list div{display:flex; justify-content:space-between; padding:5px 2px; border-bottom:1px solid var(--line); color:var(--text-muted);}

  .section-toggles{display:flex; gap:10px; flex-wrap:wrap;}

  #printArea{display:none;}
  @media print{
    body *{visibility:hidden;}
    #printArea, #printArea *{visibility:visible;}
    #printArea{
      display:block; position:absolute; top:0; right:0; width:100%;
      padding:0; margin:0; color:#3E3627; background:#fff;
      font-family:'IBM Plex Sans Arabic', sans-serif;
    }
    #printArea .rp-sheet{ max-width:760px; margin:0 auto; padding:28px 34px; }
    #printArea .rp-head{
      display:flex; align-items:center; justify-content:space-between;
      border-bottom:3px double #C6A046; padding-bottom:14px; margin-bottom:18px;
    }
    #printArea .rp-brand{display:flex; align-items:center; gap:12px;}
    #printArea .rp-mark{
      width:40px; height:40px; border-radius:50%;
      background: radial-gradient(circle at 32% 28%, #F1E4B8, #C6A046 60%, #A67C2E 100%);
      flex-shrink:0;
    }
    #printArea .rp-brand h1{ font-family:'Cairo',sans-serif; font-size:19px; margin:0; color:#8C6425; }
    #printArea .rp-brand span{ font-size:10.5px; color:#8B8272; }
    #printArea .rp-meta{ text-align:left; font-size:11px; color:#8B8272; line-height:1.7; }
    #printArea .rp-meta b{color:#3E3627;}
    #printArea h2.rp-title{
      font-family:'Cairo',sans-serif; font-size:15.5px; color:#3E3627;
      margin:0 0 4px; text-align:center; letter-spacing:0.3px;
    }
    #printArea .rp-sub{ text-align:center; font-size:11px; color:#8B8272; margin-bottom:18px; }
    #printArea .rp-balances{
      display:flex; justify-content:center; gap:28px; margin-bottom:20px;
    }
    #printArea .rp-balances div{
      text-align:center; border:1px solid #E8E0CD; border-radius:8px; padding:8px 20px; background:#FAF7F0;
    }
    #printArea .rp-balances .lab{font-size:10px; color:#8B8272; display:block; margin-bottom:3px;}
    #printArea .rp-balances .val{font-family:'JetBrains Mono',monospace; font-size:15px; color:#8C6425; font-weight:700;}
    #printArea table{ width:100%; border-collapse:collapse; margin-top:6px; font-size:11.5px; }
    #printArea thead th{
      background:#F1ECE0; color:#6F6552; font-family:'Cairo',sans-serif; font-weight:700;
      padding:9px 6px; border-bottom:2px solid #D9CFB4; text-align:center; font-size:10.5px;
    }
    #printArea tbody td{ padding:8px 6px; text-align:center; border-bottom:1px solid #EEE7D6; }
    #printArea tbody tr:nth-child(even){ background:#FBF9F4; }
    #printArea .rp-note-row td{ text-align:right; color:#8B8272; }
    #printArea .rp-simple td:first-child{ text-align:right; color:#8B8272; width:40%; }
    #printArea .rp-simple td:last-child{ font-family:'JetBrains Mono',monospace; font-weight:700; color:#3E3627; text-align:center; }
    #printArea .rp-foot{
      margin-top:26px; padding-top:12px; border-top:1px solid #E8E0CD;
      display:flex; justify-content:space-between; font-size:10px; color:#AFA791;
    }
    #printArea .rp-sign{ display:flex; justify-content:space-between; margin-top:34px; }
    #printArea .rp-sign div{ text-align:center; width:150px; }
    #printArea .rp-sign .line{ border-top:1px solid #C9BFA1; margin-bottom:6px; height:34px; }
  }

  ::-webkit-scrollbar{width:8px; height:8px;}
  ::-webkit-scrollbar-thumb{background:var(--line-strong); border-radius:8px;}
  ::-webkit-scrollbar-track{background:transparent;}

  /* ---------- Login role / user role badge ---------- */
  .login-card select{
    width:100%; background:var(--surface); border:1px solid var(--line-strong);
    border-radius:var(--radius-sm); padding:10px 12px; margin-bottom:10px; font-size:13.5px;
    color:var(--text); font-family:'IBM Plex Sans Arabic',sans-serif;
  }
  .role-badge{
    background:var(--gold-soft); color:var(--gold-bright); border-radius:999px;
    padding:2px 10px; font-size:10px; font-weight:700; margin-inline-start:4px;
  }

  /* ---------- Settings page ---------- */
  .settings-block{padding:18px; border-bottom:1px solid var(--line); transition:background .18s ease;}
  .settings-block:last-child{border-bottom:none;}
  .settings-block:hover{background:rgba(198,160,70,0.045);}
  .settings-block h3{font-size:13.5px; color:var(--gold-bright); font-weight:800; margin-bottom:10px;}
  .perms-field{min-width:260px;}
  .perms-check{display:flex; flex-wrap:wrap; gap:6px 14px; max-width:420px;}
  .perms-check label{
    display:flex; align-items:center; gap:5px; font-size:11.5px; color:var(--text-muted);
    background:var(--surface); border:1px solid var(--line-strong); border-radius:6px; padding:5px 9px;
  }
  .perms-check input{width:auto;}
  .perm-chip{
    display:inline-block; background:var(--gold-soft); color:var(--gold-bright);
    border-radius:999px; padding:2px 8px; font-size:10px; margin:2px;
  }

  /* ---------- Menu page ---------- */
  .menu-wrap{max-width:900px; margin:60px auto; padding:0 20px;}
  .menu-head{text-align:center; margin-bottom:36px;}
  .menu-head .mark{width:64px; height:64px; margin:0 auto 14px;
    border-radius:50%; background:radial-gradient(circle at 32% 28%, var(--gold-soft), var(--gold) 55%, var(--gold-bright) 100%);
    box-shadow:0 4px 14px rgba(74,68,56,0.15);}
  .menu-head h1{font-size:26px; color:var(--gold-bright); font-weight:900;}
  .menu-head p{font-size:13px; color:var(--text-faint); margin-top:4px;}
  .menu-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:18px;}
  .menu-card{
    display:block; background:var(--panel); border:1px solid var(--line); border-radius:14px;
    padding:26px 22px; text-decoration:none; transition:.15s; box-shadow:0 1px 3px rgba(74,68,56,0.04);
  }
  .menu-card:hover{border-color:var(--gold); transform:translateY(-2px); box-shadow:0 8px 20px rgba(74,68,56,0.10);}
  .menu-card .icon{font-size:30px; margin-bottom:12px; display:block;}
  .menu-card h2{font-size:16px; color:var(--gold-bright); font-weight:800; margin-bottom:6px;}
  .menu-card p{font-size:12px; color:var(--text-faint); line-height:1.6; margin:0;}
