/* Shared reference-inspired layouts; colors are scoped to the selected palette. */
.reference-overview{margin:0 0 22px}.reference-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.reference-stat{display:flex;align-items:center;gap:14px;padding:20px;background:var(--white);border:1px solid var(--line);border-radius:14px}.reference-stat-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--soft);color:var(--green)}.reference-stat-icon svg{width:23px;height:23px}.reference-stat>div{display:grid;gap:4px}.reference-stat small{font-weight:600;font-size:11px}.reference-stat strong{font-size:25px;line-height:1.2}.reference-stat div>span{font-size:10px;color:var(--muted)}.reference-tabs{display:flex;gap:6px;overflow:auto;border-bottom:1px solid var(--line)}.reference-tabs button{display:flex;align-items:center;gap:7px;white-space:nowrap;padding:13px 16px;border:0;background:transparent;border-bottom:2px solid transparent;color:var(--muted);font-weight:600}.reference-tabs button.active{color:var(--green);border-bottom-color:var(--green)}.reference-tabs span{padding:3px 6px;background:var(--soft);border-radius:5px;font-size:10px}.reference-client-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px}.reference-client{border:1px solid var(--line);border-radius:16px;padding:22px;background:var(--white)}.reference-client-head{display:flex;gap:12px;align-items:center}.reference-client-head>div{min-width:0;flex:1}.reference-client-head h3{font-size:17px;margin:0 0 5px}.reference-client-head small{font-size:11px;color:var(--muted);overflow-wrap:anywhere}.reference-client-avatar{display:grid;place-items:center;width:44px;height:44px;background:var(--green);color:white;border-radius:50%;font-size:22px;font-weight:700}.reference-client-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:24px 0}.reference-client-stats div{display:grid;gap:5px}.reference-client-stats strong{font-size:23px}.reference-client-stats span{font-size:10px;color:var(--muted)}.reference-client .btn{width:100%}.reference-bin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;padding:20px}.reference-bin{display:grid;gap:7px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--soft);text-align:left}.reference-bin.occupied{background:var(--lime);border-color:var(--green)}.reference-bin strong{font-size:15px}.reference-bin span,.reference-bin small{font-size:10px;color:var(--muted)}
[data-palette="vivid"]{--green:#6830ff;--green-deep:#5324ce;--emerald:#6830ff;--mint:#e9ddff;--lime:#f5f2ff;--navy:#211a33;--ink:#211a33;--muted:#776b8a;--bg:#fff;--canvas:#fff;--soft:#f5f2ff;--line:#e8e2f2;--amber:#6830ff;--red:#ff245b;--white:#fff;accent-color:#6830ff}
[data-palette="vivid"] .brand-mark img,[data-palette="vivid"] .login-brand img,[data-palette="vivid"] .login-mobile-brand img{content:url('/brand-vivid.svg')}
[data-palette="vivid"] .brand-mark{background:transparent;border:0;box-shadow:none}
[data-palette="vivid"] .sidebar{background:linear-gradient(155deg,#211a33,#18151f)}
[data-palette="vivid"] .nav button.active{background:linear-gradient(110deg,#6830ff,#8957ff);color:#fff;border-color:#8957ff}
[data-palette="vivid"] .nav button.active::before{background:#ff245b}
[data-palette="vivid"] .workspace-hero,[data-palette="vivid"] .login-art{background:linear-gradient(115deg,#211a33 0%,#442977 45%,#6830ff 85%,#a4389c);box-shadow:0 14px 35px #6830ff18}
[data-palette="vivid"] .workspace-hero .hero-button{background:#f5f2ff;color:#6830ff;border-color:#e9ddff}
[data-palette="vivid"] .hero-mini-card{background:#fff;color:#211a33}
[data-palette="vivid"] .hero-orbit{border-color:#c4a8ff66;background:#6830ff15}
[data-palette="vivid"] .heading h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(30px,2.8vw,45px);font-weight:700;letter-spacing:-1.5px}
[data-palette="vivid"] .panel-head h2{font-family:Georgia,'Times New Roman',serif;font-size:21px;letter-spacing:-.4px}
[data-palette="vivid"] .btn.primary{background:#ff245b;border-color:#ff245b;color:#fff;box-shadow:0 5px 15px #ff245b20}
[data-palette="vivid"] .btn:not(.primary):not(.danger){color:#6830ff;border-color:#dcd0f4;background:#fff}
[data-palette="vivid"] .btn.primary:hover{background:#e51b4d;border-color:#e51b4d}
[data-palette="vivid"] .link{color:#6830ff}
[data-palette="vivid"] .badge,[data-palette="vivid"] .pill{color:#6830ff;background:#f5f2ff;border-color:#e9ddff}
[data-palette="vivid"] .badge.Critical,[data-palette="vivid"] .badge.High,[data-palette="vivid"] .badge.Cancelled,[data-palette="vivid"] .badge.Review,[data-palette="vivid"] .badge.Low.stock{color:#ba1845;background:#ff245b12}
[data-palette="vivid"] .success-banner,[data-palette="vivid"] .form-note,[data-palette="vivid"] .mini-empty{color:#5d35aa;background:#f5f2ff;border-color:#e9ddff}
[data-palette="vivid"] input,[data-palette="vivid"] select,[data-palette="vivid"] textarea{accent-color:#6830ff}
[data-palette="vivid"] .reference-stat-icon{background:#f5f2ff;color:#6830ff}
[data-palette="vivid"] .reference-stat:nth-child(4) .reference-stat-icon{background:#ff245b0c;color:#ff245b}
[data-palette="vivid"] .reference-bin.occupied{background:#f5f2ff;border-color:#d1baff}
[data-palette="vivid"] .avatar{background:#6830ff;color:#fff}
[data-palette="vivid"] .dot{background:#6830ff}
[data-palette="vivid"] .metric strong,[data-palette="vivid"] .invoice-total,[data-palette="vivid"] .profit-product-price{color:#6830ff}
[data-palette="vivid"] .login-benefits span,[data-palette="vivid"] .hero-kicker{color:#eee6ff}
[data-palette="vivid"][data-theme="dark"]{--white:#211a33;--bg:#171220;--canvas:#171220;--ink:#f5f2ff;--soft:#30233f;--line:#49375d;--muted:#b6a6c8}
[data-palette="vivid"][data-theme="dark"] .reference-stat,[data-palette="vivid"][data-theme="dark"] .reference-client{background:#211a33}
[data-palette="vivid"][data-theme="dark"] .btn:not(.primary):not(.danger){background:#30233f;color:#cbb3ff}
@media(max-width:800px){.reference-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.reference-stat{padding:15px;gap:9px}.reference-stat strong{font-size:22px}.reference-stat-icon{width:34px;height:34px}.reference-client-grid{grid-template-columns:1fr}}
[data-palette="vivid"] .flow-step .icon,[data-palette="vivid"] .activity-icon,[data-palette="vivid"] .help-step:before{color:#6830ff;background:#f5f2ff}
[data-palette="vivid"] .metric{background:#fff;border-color:#e8e2f2}
[data-palette="vivid"] .metric.featured{background:#f5f2ff}
[data-palette="vivid"] .metric .metric-icon{color:#6830ff;background:#f5f2ff}
[data-palette="vivid"] .metric:nth-child(4) .metric-icon{color:#ff245b;background:#ff245b0c}
[data-palette="vivid"] .nav button.active{color:#fff!important;background:linear-gradient(110deg,#6830ff,#8957ff)!important}
[data-palette="vivid"] .sidebar .nav button.active,[data-palette="vivid"] .sidebar .nav button.active span,[data-palette="vivid"] .sidebar .nav button.active .icon{color:#fff!important}
[data-palette="vivid"] .sidebar .nav button.active{background:linear-gradient(110deg,#6830ff,#8957ff)!important}
[data-palette="vivid"] .profit-upload,[data-palette="vivid"] .profit-file,[data-palette="vivid"] .profit-product-image{background:#f5f2ff!important;color:#6830ff;border-color:#d9cbff}
[data-palette="vivid"] .sidebar .workspace,[data-palette="vivid"] .sidebar .local-note,[data-palette="vivid"] .sidebar .user-card{background:#30263f;border-color:#4b3b5c;color:#fff}
[data-palette="vivid"] .sidebar .workspace small,[data-palette="vivid"] .sidebar .workspace .icon,[data-palette="vivid"] .sidebar .local-note span,[data-palette="vivid"] .sidebar .user-card small{color:#bfb0d4}
[data-palette="vivid"] .sidebar .local-note strong,[data-palette="vivid"] .sidebar .user-card strong{color:#f5f2ff}

/* Navigation contrast and visible header controls. */
[data-palette="vivid"] .sidebar .nav button:not(.active):hover,
[data-palette="vivid"] .sidebar .nav button:not(.active):focus-visible{background:#44315f!important;color:#fff!important;border-color:#8860bc!important}
[data-palette="vivid"] .sidebar .nav button:hover span,
[data-palette="vivid"] .sidebar .nav button:focus-visible span{color:#fff!important}
[data-palette="vivid"] .topbar{background:#f5f2ff!important;border-bottom:1px solid #d8c8f6!important;box-shadow:0 2px 12px #211a3308;color:#211a33!important}
[data-palette="vivid"] .topbar .topbar-search{background:#fff!important;border:1px solid #b69bdc!important;color:#493264!important;box-shadow:0 2px 6px #6830ff0d}
[data-palette="vivid"] .topbar .topbar-icon-button{background:#e9ddff!important;color:#5324ce!important;border:1px solid #c8afea!important}
[data-palette="vivid"] .topbar .topbar-icon-button:hover,[data-palette="vivid"] .topbar .topbar-search:hover{background:#e0d0ff!important;color:#211a33!important}
[data-palette="vivid"] .topbar kbd{background:#e9ddff!important;border-color:#c8afea!important;color:#493264!important}
[data-palette="vivid"] .topbar .date,[data-palette="vivid"] .topbar .breadcrumb{color:#5b4973!important}
[data-palette="vivid"][data-theme="dark"] .topbar{background:#211a33!important;color:#f5f2ff!important}
[data-palette="vivid"][data-theme="dark"] .topbar .breadcrumb,[data-palette="vivid"][data-theme="dark"] .topbar .date{color:#dfd1f4!important}
.expense-strip{display:flex;align-items:center;gap:20px;padding:18px 22px;background:#f5f2ff;border-bottom:1px solid #e8e2f2}.expense-strip>div{flex:1}.expense-strip small{display:block;margin-top:5px;color:#776b8a}.expense-total{display:flex;justify-content:space-between;background:#f5f2ff;padding:16px;margin-bottom:18px}.expense-total strong{color:#6830ff;font-size:24px}#tracking-progress:not(:empty){padding:16px;background:#f5f2ff;color:#5324ce}#tracking-table td{vertical-align:middle}#tracking-table .mono{display:block;margin-top:8px;font-size:12px}.brand-badge{display:inline-flex;align-items:center;gap:8px;vertical-align:middle;min-height:30px}.brand-badge img{width:28px;height:28px;object-fit:contain;background:#fff;border-radius:5px;padding:2px}.brand-badge small{font-size:11px;font-weight:600}.manual-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px}.manual-contents{position:sticky;top:100px;max-height:75vh;overflow:auto;align-self:start;padding:16px}.manual-contents button{display:block;width:100%;text-align:left;padding:10px;border:0;background:transparent;color:var(--ink)}.manual-contents button:hover{background:var(--soft)}.manual-chapter{padding:24px;scroll-margin-top:100px}.manual-chapter img{width:100%;height:auto;border:1px solid var(--line);border-radius:10px;margin:16px 0}.manual-chapter li{margin:10px 0;line-height:1.6}.manual-chapter h3{margin-top:22px}.manual-chapter details{margin:10px 0;padding:12px;background:var(--soft);border-radius:8px}.manual-chapter summary{cursor:pointer;font-weight:600}@media(max-width:800px){.manual-layout{grid-template-columns:1fr}.manual-contents{position:static;max-height:220px}.expense-strip{flex-wrap:wrap}}
#tracking-table input[type="checkbox"] { width:18px;height:18px;min-height:18px;padding:0;accent-color:#6830ff; }
.manual-index { display:flex;flex-wrap:wrap;gap:8px;padding:20px 0;border-bottom:1px solid #ded1f4; }
.manual-index a { padding:8px 12px;background:#f5f2ff;border-radius:8px;color:#5421c7;text-decoration:none; }
.manual-chapter { scroll-margin-top:90px;border-bottom:1px solid #ded1f4;padding:28px 0; }
.manual-chapter img { max-width:100%;width:100%;border:1px solid #ded1f4;border-radius:12px; }
.manual-chapter li { margin:12px 0;line-height:1.7;max-width:100ch; }