/* platform.css -- single stylesheet for crm.solv4ex.dev.
   Change a colour here and it changes everywhere. Sections:
   1 font  2 tokens  3 base  4 topbar  5 shared components  6 page sections */

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: block;
    src: url('/css/InterVariable.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: block;
    src: url('/css/InterVariable-Italic.woff2') format('woff2');
}

/* ---- 2. TOKENS ---------------------------------------------------
   Readability first. Contrast against white, WCAG AA needs 4.5:1:
     --s4x-text    #3D3D3D  10.86:1   kept deliberately over brand charcoal
     --s4x-blue    #19428A   9.60:1   carries white text, and all link text
     --s4x-accent  #5FB4E6   2.29:1   NEVER text, NEVER under white text.
                                      Borders, focus rings, underlines only.
     --s4x-ce-red  #CF1E2E   5.89:1   CE accent, kept on purpose            */

:root {
    --s4x-canvas:  #FFFFFF;
    --s4x-surface: #FFFFFF;
    --s4x-fill:    #F0F2F5;
    --s4x-border:  #E0E0E0;
    --s4x-text:    #3D3D3D;
    --s4x-blue:    #19428A;
    --s4x-accent:  #5FB4E6;
    --s4x-ce-red:  #CF1E2E;
    --s4x-radius-card: 6px;
    --s4x-radius-ctl:  4px;
    --s4x-shadow-card: 0 1px 4px rgba(0,0,0,.08);
    --s4x-shadow-pop:  0 4px 16px rgba(0,0,0,.18);
    --s4x-font: Inter, sans-serif;
}

/* ---- 3. BASE ---------------------------------------------------- */
body { font-family: var(--s4x-font); background: var(--s4x-canvas); color: var(--s4x-text); margin: 0; }
.card { border: 1px solid var(--s4x-border); }

/* ---- 4. TOPBAR -------------------------------------------------- */
.topbar{background:var(--s4x-text);color:var(--s4x-surface);padding:0 28px;height:58px;display:flex;align-items:center;justify-content:space-between;border-bottom:3px solid var(--s4x-accent);flex-shrink:0}
.topbar-brand{display:flex;flex-direction:column;justify-content:center;line-height:1.2}
.topbar-brand .brand-name{font-size:18px;font-weight:700;letter-spacing:.5px;color:var(--s4x-surface)}
.topbar-brand .brand-sub{font-size:11px;color:#aaa;letter-spacing:.3px;margin-top:1px}
.topbar-right{display:flex;align-items:center;gap:20px;font-size:14px}
.topbar-right .user-name{color:var(--s4x-border);font-size:14px}
.topbar-right .user-name strong{color:var(--s4x-surface);font-weight:600}
.topbar a.nav-link{color:#ccc;text-decoration:none;font-size:14px}
.topbar a.nav-link:hover{color:var(--s4x-surface)}
.topbar a.btn-2fa{background:var(--s4x-blue);color:var(--s4x-surface);text-decoration:none;padding:5px 12px;border-radius:4px;font-size:12px;font-weight:600;letter-spacing:.2px;transition:background .15s}
.topbar a.btn-2fa:hover{background:var(--s4x-blue)}
.topbar a.signout{color:#aaa;text-decoration:none;font-size:14px}
.topbar a.signout:hover{color:var(--s4x-surface)}

/* ---- 5. SHARED COMPONENTS (identical across pages) -------------- */
*{box-sizing:border-box;margin:0;padding:0}
label{display:block;font-size:13px;font-weight:600;color:var(--s4x-text);margin-bottom:5px}
body.p-login button{width:100%;padding:10px;background:var(--s4x-blue);color:var(--s4x-surface);border:none;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;letter-spacing:.3px;transition:background .15s}
body.p-totp-verify button{width:100%;padding:10px;background:var(--s4x-blue);color:var(--s4x-surface);border:none;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;letter-spacing:.3px;transition:background .15s}
.error{background:#fff0f0;border:1px solid #ffcccc;color:#c00;padding:9px 12px;border-radius:4px;font-size:13px;margin-bottom:16px}
body.p-sync-admin tr:last-child td{border-bottom:none}
body.p-users tr:last-child td{border-bottom:none}
.btn-primary{background:var(--s4x-blue);color:var(--s4x-surface)}
.btn-primary:hover{background:var(--s4x-blue)}
body.p-totp-setup input[type=text]:focus{border-color:var(--s4x-blue)}
body.p-totp-verify input[type=text]:focus{border-color:var(--s4x-blue)}
.back-link:hover{color:var(--s4x-blue)}
.hbar{background:#181921;padding:9px 16px;display:flex;align-items:center;gap:12px}
.hbar .title{color:var(--s4x-surface);font-size:15px;font-weight:600}
.hbar .dr{color:#c0c0c0;font-size:12px}
.hbar .asof{color:#888;font-size:11px;margin-left:auto}
.fbar{display:flex;flex-wrap:wrap;align-items:center;gap:5px;padding:8px 16px;background:var(--s4x-surface);border-bottom:1px solid var(--s4x-border)}
.pbtn{padding:4px 9px;font-size:12px;border-radius:4px;text-decoration:none;white-space:nowrap;border:1px solid #ccc;background:var(--s4x-fill);color:#333}
.pbtn.active{background:var(--s4x-blue);color:var(--s4x-surface);border-color:var(--s4x-blue)}
.cbtn.active{background:#2a2d36;color:var(--s4x-surface);border-color:#2a2d36}
.pills{margin-left:auto;display:flex;flex-wrap:wrap;gap:3px}
.pill .pv{color:var(--s4x-surface);font-size:14px;font-weight:700;line-height:1.2}
.pill .pl{color:rgba(255,255,255,0.6);font-size:9px;text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
.rf{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:7px 16px;background:#f4f6f9;border-bottom:1px solid var(--s4x-border);font-size:12px}
body.p-bob select{height:28px;padding:0 6px;font-size:12px;border:1px solid #ccc;border-radius:4px;background:var(--s4x-surface)}
body.p-dvat select{height:28px;padding:0 6px;font-size:12px;border:1px solid #ccc;border-radius:4px;background:var(--s4x-surface)}
thead th{padding:7px 10px;background:#2a2d36;border-bottom:2px solid var(--s4x-accent);white-space:nowrap;position:sticky;top:0;z-index:2;color:var(--s4x-surface)}
thead th.r{text-align:right}
tbody tr:nth-child(even){background:#f8f9fb}
tbody tr:nth-child(odd){background:var(--s4x-surface)}
tbody tr:hover{background:#e8f4fb}
tbody td{padding:5px 10px;border-bottom:1px solid #eee}
tbody td.r{text-align:right;white-space:nowrap}
.neg{color:var(--s4x-ce-red)}
.err{padding:20px;color:var(--s4x-ce-red)}
.data-as-of{font-size:11px;color:#888;font-style:italic}
.preset-group{display:flex;border-radius:4px;overflow:hidden;border:1px solid #ddd}
.preset-btn:last-child{border-right:none}
.preset-btn.active{background:#2a2d36;color:var(--s4x-surface)}
.preset-btn:hover:not(.active){background:var(--s4x-border)}
.period-label{font-size:12px;color:#555}
.custom-form{display:flex;align-items:center;gap:6px}
.custom-form input[type=date]{height:28px;font-size:12px;padding:2px 6px;border:1px solid #ccc;border-radius:3px}
th.r{text-align:right}
td.r{text-align:right}

/* ---- 6.index ---- */
body.p-index{font-family:Inter,sans-serif;color:var(--s4x-text);font-size:14px}
body.p-index .main{max-width:1100px;margin:24px auto;padding:0 16px}
body.p-index .page-title{font-size:16px;font-weight:700;color:var(--s4x-text);margin-bottom:4px}
body.p-index .page-subtitle{color:#888;font-size:13px;margin-bottom:20px;line-height:1.5}
body.p-index .dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
body.p-index .dash-card{display:block;background:var(--s4x-surface);border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.08); overflow:hidden;text-decoration:none;color:inherit;border-top:4px solid var(--s4x-accent); transition:box-shadow .15s,transform .15s}
body.p-index .dash-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.12);transform:translateY(-2px)}
body.p-index .dash-card-body{padding:16px 18px}
body.p-index .dash-tag{display:inline-block;background:var(--s4x-blue);color:var(--s4x-surface);font-size:10px;font-weight:700; text-transform:uppercase;letter-spacing:.04em;padding:3px 9px;border-radius:10px;margin-bottom:10px}
body.p-index .dash-name{display:block;font-size:14px;font-weight:700;color:var(--s4x-text);margin-bottom:6px}
body.p-index .dash-desc{font-size:12px;color:#888;line-height:1.5;display:-webkit-box; -webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
body.p-index .empty{padding:30px 20px;text-align:center;color:#999;font-size:13px;background:var(--s4x-surface);border-radius:6px}

/* ---- 6.login ---- */
body.p-login{font-family:Inter,sans-serif;display:flex;align-items:center;justify-content:center;min-height:100vh}
body.p-login .card{background:var(--s4x-surface);border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.12);width:360px;overflow:hidden}
body.p-login .card-header{background:var(--s4x-blue);color:var(--s4x-surface);padding:18px 24px;font-size:16px;font-weight:600;letter-spacing:.3px}
body.p-login .card-body{padding:28px 24px}
body.p-login input[type=text], body.p-login input[type=password]{width:100%;padding:9px 11px;border:1px solid #ddd;border-radius:4px;font-size:14px;margin-bottom:16px;outline:none;transition:border-color .15s}
body.p-login input:focus{border-color:var(--s4x-blue)}
body.p-login button:hover{background:var(--s4x-blue)}

/* ---- 6.sync-admin ---- */
body.p-sync-admin{font-family:Inter,sans-serif;color:var(--s4x-text);font-size:14px}
body.p-sync-admin .main{max-width:1100px;margin:24px auto;padding:0 16px}
body.p-sync-admin .card{background:var(--s4x-surface);border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.08);margin-bottom:20px;overflow:hidden}
body.p-sync-admin .card-header{background:var(--s4x-blue);color:var(--s4x-surface);padding:12px 20px;font-size:13px;font-weight:600;letter-spacing:.3px}
body.p-sync-admin .card-body{padding:16px 20px}
body.p-sync-admin table{width:100%;border-collapse:collapse;font-size:13px}
body.p-sync-admin th{text-align:left;padding:8px 10px;border-bottom:2px solid #eee;font-weight:600;color:#555;white-space:nowrap}
body.p-sync-admin td{padding:8px 10px;border-bottom:1px solid #f0f0f0;vertical-align:top}
body.p-sync-admin .btn{display:inline-block;padding:6px 14px;border:none;border-radius:4px;font-size:12px;font-weight:600;cursor:pointer;letter-spacing:.2px}
body.p-sync-admin .btn-primary:disabled{background:#aaa;cursor:not-allowed}
body.p-sync-admin .btn-danger{background:#e05555;color:var(--s4x-surface)}
body.p-sync-admin .btn-danger:hover{background:#c44444}
body.p-sync-admin .status-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600}
body.p-sync-admin .s-complete{background:#d4edda;color:#155724}
body.p-sync-admin .s-error{background:#f8d7da;color:#721c24}
body.p-sync-admin .s-running{background:#fff3cd;color:#856404}
body.p-sync-admin .s-cancelled{background:#e2e3e5;color:#383d41}
body.p-sync-admin .desc{color:#888;font-size:12px;margin-top:2px}
body.p-sync-admin .count{font-weight:600;color:#2c7a8c}
body.p-sync-admin .log-panel{background:#1e1e1e;color:#d4d4d4;font-family:'Consolas','Courier New',monospace;font-size:12px; padding:12px;border-radius:4px;max-height:400px;overflow-y:auto;white-space:pre-wrap;word-break:break-all;margin-top:12px;display:none}
body.p-sync-admin .resume-bar{background:#fff3cd;border:1px solid #ffc107;border-radius:4px;padding:10px 16px;margin-bottom:16px; font-size:13px;display:flex;align-items:center;gap:12px}
body.p-sync-admin .section .section-header{background:var(--s4x-blue);color:var(--s4x-surface);padding:12px 20px;font-size:13px;font-weight:600;letter-spacing:.3px; display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none;transition:background .15s}
body.p-sync-admin .section .section-header:hover{background:var(--s4x-blue)}
body.p-sync-admin .section-header-left{display:flex;align-items:center;gap:10px}
body.p-sync-admin .section-chevron{display:inline-block;font-size:11px;line-height:1;transition:transform .25s ease}
body.p-sync-admin .section:not(.collapsed) .section-chevron{transform:rotate(90deg)}
body.p-sync-admin .section-header-right{display:flex;align-items:center;gap:10px}
body.p-sync-admin .section-count{font-size:11px;font-weight:700;color:var(--s4x-surface);background:rgba(0,0,0,.22);padding:3px 9px;border-radius:10px;letter-spacing:.02em}
body.p-sync-admin .status-pill{font-size:11px;font-weight:700;color:var(--s4x-surface);padding:3px 10px;border-radius:10px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
body.p-sync-admin .pill-green{background:#1a7a4a}
body.p-sync-admin .pill-amber{background:#b35900}
body.p-sync-admin .pill-red{background:#c0392b}
body.p-sync-admin .section-body{max-height:4000px;overflow:hidden;transition:max-height .3s ease}
body.p-sync-admin .section.collapsed .section-body{max-height:0}

/* ---- 6.totp-setup ---- */
body.p-totp-setup{font-family:Inter,sans-serif;display:flex;align-items:flex-start;justify-content:center;min-height:100vh;padding:48px 16px 60px}
body.p-totp-setup .card{background:var(--s4x-surface);border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.12);width:420px;overflow:hidden}
body.p-totp-setup .card-header{background:var(--s4x-blue);color:var(--s4x-surface);padding:18px 24px;font-size:16px;font-weight:600;letter-spacing:.3px}
body.p-totp-setup .card-body{padding:28px 24px}
body.p-totp-setup h2{margin:0 0 16px;font-size:15px;font-weight:700;color:var(--s4x-text)}
body.p-totp-setup .status-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;border-radius:20px;font-size:13px;font-weight:700;margin-bottom:20px}
body.p-totp-setup .status-badge.enabled{background:#e8f5e9;color:#2e7d32;border:1px solid #a5d6a7}
body.p-totp-setup .status-badge.disabled{background:#f5f5f5;color:#666;border:1px solid #ccc}
body.p-totp-setup .status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
body.p-totp-setup .status-badge.enabled .status-dot{background:#2e7d32}
body.p-totp-setup .status-badge.disabled .status-dot{background:#bbb}
body.p-totp-setup .msg-box{border-radius:4px;padding:10px 14px;font-size:13px;margin-bottom:20px}
body.p-totp-setup .msg-box.success{background:#e8f5e9;border-left:4px solid #2e7d32;color:#1b5e20}
body.p-totp-setup .msg-box.error{background:#fff0f0;border-left:4px solid #ffcccc;color:#c00}
body.p-totp-setup .step{margin-bottom:20px}
body.p-totp-setup .step-header{display:flex;align-items:center;margin-bottom:8px;font-size:13px;font-weight:700;color:var(--s4x-text)}
body.p-totp-setup .step-num{display:inline-block;width:22px;height:22px;border-radius:50%;background:var(--s4x-blue);color:var(--s4x-surface);font-size:12px;font-weight:700;text-align:center;line-height:22px;margin-right:7px;flex-shrink:0}
body.p-totp-setup .step-body{font-size:13px;color:#555;line-height:1.5;padding-left:29px}
body.p-totp-setup .qr-wrap{text-align:center;margin:12px 0 10px}
body.p-totp-setup .qr-wrap img{border:1px solid var(--s4x-border);border-radius:4px;padding:6px;background:var(--s4x-surface)}
body.p-totp-setup .manual-secret{background:#f5f7fa;border:1px solid #e0e4ea;border-radius:4px;padding:8px 12px;font-family:'Courier New',monospace;font-size:13px;letter-spacing:2px;word-break:break-all;color:var(--s4x-text);text-align:center;margin-top:8px}
body.p-totp-setup .manual-label{font-size:11px;color:#888;text-align:center;margin-top:5px}
body.p-totp-setup input[type=text]{width:100%;padding:11px;font-size:22px;font-weight:bold;letter-spacing:6px;text-align:center;border:1px solid #ddd;border-radius:4px;margin-bottom:14px;outline:none;transition:border-color .15s}
body.p-totp-setup .btn{width:100%;padding:10px;border:none;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;transition:background .15s;letter-spacing:.3px}
body.p-totp-setup .btn-danger{background:var(--s4x-surface);color:#c00;border:1px solid #ffcccc}
body.p-totp-setup .btn-danger:hover{background:#fff0f0}
body.p-totp-setup hr{border:none;border-top:1px solid #eee;margin:24px 0}
body.p-totp-setup .back-link{display:block;text-align:center;font-size:12px;color:#888;text-decoration:none}

/* ---- 6.totp-verify ---- */
body.p-totp-verify{font-family:Inter,sans-serif;display:flex;align-items:center;justify-content:center;min-height:100vh}
body.p-totp-verify .card{background:var(--s4x-surface);border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.12);width:360px;overflow:hidden}
body.p-totp-verify .card-header{background:var(--s4x-blue);color:var(--s4x-surface);padding:18px 24px;font-size:16px;font-weight:600;letter-spacing:.3px}
body.p-totp-verify .card-body{padding:28px 24px}
body.p-totp-verify .step-label{font-size:13px;color:#555;margin-bottom:24px;line-height:1.5;text-align:center}
body.p-totp-verify input[type=text]{width:100%;padding:11px;font-size:22px;font-weight:bold;letter-spacing:6px;text-align:center;border:1px solid #ddd;border-radius:4px;margin-bottom:16px;outline:none;transition:border-color .15s}
body.p-totp-verify .remember-row{display:flex;align-items:center;gap:8px;margin-bottom:16px}
body.p-totp-verify .remember-row input[type=checkbox]{width:15px;height:15px;cursor:pointer;accent-color:var(--s4x-blue)}
body.p-totp-verify .remember-row label{margin:0;font-size:12px;font-weight:400;color:#555;cursor:pointer}
body.p-totp-verify button:hover{background:var(--s4x-blue)}
body.p-totp-verify .back-link{display:block;text-align:center;font-size:12px;color:#888;margin-top:18px;text-decoration:none}

/* ---- 6.users ---- */
body.p-users{font-family:Inter,sans-serif;color:var(--s4x-text);font-size:14px}
body.p-users .main{max-width:1000px;margin:24px auto;padding:0 16px}
body.p-users .card{background:var(--s4x-surface);border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.08);margin-bottom:20px;overflow:hidden}
body.p-users .card-header{background:var(--s4x-blue);color:var(--s4x-surface);padding:12px 20px;font-size:13px;font-weight:600;letter-spacing:.3px;display:flex;align-items:center;justify-content:space-between}
body.p-users .card-body{padding:20px}
body.p-users table{width:100%;border-collapse:collapse;font-size:13px}
body.p-users th{text-align:left;padding:9px 12px;border-bottom:2px solid #eee;font-weight:600;color:#555;white-space:nowrap}
body.p-users td{padding:9px 12px;border-bottom:1px solid #f0f0f0;vertical-align:middle}
body.p-users .badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600}
body.p-users .badge-yes{background:#d4edda;color:#155724}
body.p-users .badge-no{background:#f0f0f0;color:#888}
body.p-users .badge-super{background:#fff3cd;color:#856404}
body.p-users .btn{display:inline-block;padding:7px 16px;border:none;border-radius:4px;font-size:13px;font-weight:600;cursor:pointer;letter-spacing:.2px;text-decoration:none;transition:background .15s}
body.p-users .btn-sm{padding:4px 10px;font-size:12px}
body.p-users .btn-back{background:#f0f0f0;color:var(--s4x-text)}
body.p-users .btn-back:hover{background:var(--s4x-border)}
body.p-users .form-row{margin-bottom:16px}
body.p-users .form-row label{display:block;font-size:13px;font-weight:600;color:#555;margin-bottom:5px}
body.p-users .form-row input[type=text], body.p-users .form-row input[type=password], body.p-users .form-row input[type=number]{width:100%;padding:9px 11px;border:1px solid #ddd;border-radius:4px;font-size:14px;outline:none;transition:border-color .15s}
body.p-users .form-row input:focus{border-color:var(--s4x-blue)}
body.p-users .form-row .hint{font-size:12px;color:#999;margin-top:4px}
body.p-users .form-check{display:flex;align-items:center;gap:8px;margin-bottom:16px}
body.p-users .form-check input[type=checkbox]{width:16px;height:16px;accent-color:var(--s4x-blue);cursor:pointer}
body.p-users .form-check label{font-size:13px;font-weight:600;color:#555;cursor:pointer}
body.p-users .form-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
body.p-users .alert{padding:10px 14px;border-radius:4px;font-size:13px;margin-bottom:18px}
body.p-users .alert-error{background:#fff0f0;border-left:4px solid #e05555;color:#c00}
body.p-users .alert-success{background:#e8f5e9;border-left:4px solid #2e7d32;color:#1b5e20}
body.p-users .alert ul{margin:6px 0 0 16px}

/* ---- 6.bob ---- */
body.p-bob{font-family:Inter,sans-serif;color:var(--s4x-text);font-size:13px}
body.p-bob .cbtn{padding:4px 9px;font-size:12px;border-radius:4px;border:1px solid #ccc;background:var(--s4x-fill);color:#333;cursor:pointer;white-space:nowrap}
body.p-bob .pill{display:inline-flex;flex-direction:column;align-items:center;background:#2a2d36;border-radius:7px;padding:5px 12px;min-width:76px}
body.p-bob .pill-label{display:inline-flex;align-items:center;font-size:10px;font-weight:700;color:var(--s4x-blue);padding:0 4px;white-space:nowrap;}
body.p-bob .tbl-wrap{overflow:auto;max-height:calc(100vh - 220px)}
body.p-bob table{width:100%;border-collapse:collapse;font-size:13px}
body.p-bob .pos{color:#1a7a4a}
body.p-bob .cbadge{display:inline-block;font-size:9px;font-weight:700;padding:1px 4px;border-radius:3px;margin-left:4px;background:#e8f4fb;color:#2a6496;vertical-align:middle}
body.p-bob .cbadge.usd{background:#e8f0e8;color:#2a6a2a}
body.p-bob .pagination{display:flex;align-items:center;gap:14px;padding:8px 16px;background:#f8f9fb;border-top:1px solid var(--s4x-border);font-size:12px;color:#555}
body.p-bob .pagination a{color:var(--s4x-blue);text-decoration:none}

/* ---- 6.dvat ---- */
body.p-dvat{font-family:Inter,sans-serif;color:var(--s4x-text);font-size:13px}
body.p-dvat .tabs{display:flex;gap:2px;padding:0 16px;background:var(--s4x-surface);border-bottom:1px solid var(--s4x-border)}
body.p-dvat .tab{padding:9px 18px;font-size:13px;font-weight:600;color:#888;text-decoration:none;border-bottom:3px solid transparent}
body.p-dvat .tab.active{color:var(--s4x-text);border-bottom-color:var(--s4x-blue)}
body.p-dvat .gl-section{margin-top:12px}
body.p-dvat .gl-section:first-child{margin-top:0}
body.p-dvat .gl-section-header{background:#e9ecef;color:var(--s4x-text);font-size:12px;font-weight:700;padding:7px 10px;border-left:4px solid var(--s4x-accent);cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;user-select:none}
body.p-dvat .gl-section-header::-webkit-details-marker{display:none}
body.p-dvat .gl-section-header::before{content:"\25B6";margin-right:8px;font-size:9px;color:#888}
body.p-dvat .gl-section[open]>.gl-section-header::before{content:"\25BC"}
body.p-dvat .gl-section-meta{color:#777;font-weight:400;font-size:11px}
body.p-dvat .cbtn{padding:4px 9px;font-size:12px;border-radius:4px;border:1px solid #ccc;background:var(--s4x-fill);color:#333;cursor:pointer;white-space:nowrap;text-decoration:none;display:inline-block}
body.p-dvat .pill{display:inline-flex;flex-direction:column;align-items:center;background:#2a2d36;border-radius:7px;padding:5px 12px;min-width:76px}
body.p-dvat .tbl-wrap{overflow:auto;max-height:calc(100vh - 260px)}
body.p-dvat table{width:100%;border-collapse:collapse;font-size:13px}
body.p-dvat .flag{display:inline-block;font-size:9px;font-weight:700;padding:1px 4px;border-radius:3px;margin-left:4px;background:#fdecea;color:var(--s4x-ce-red);vertical-align:middle}
body.p-dvat .flag-review{background:#fff8e1;color:#8a6100;font-weight:700}

/* ---- 6.mktcl ---- */
body.p-mktcl{font-family:Inter,sans-serif;color:var(--s4x-text);font-size:14px}
html.p-mktcl, body.p-mktcl{height:100%;overflow:hidden}
body.p-mktcl .page{display:flex;flex-direction:column;height:100%}
body.p-mktcl .page-body{flex:1;overflow:hidden;display:flex;flex-direction:column}
body.p-mktcl .header-bar{background:#181921;color:var(--s4x-surface);padding:10px 20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;flex-shrink:0}
body.p-mktcl .header-title{font-size:15px;font-weight:600}
body.p-mktcl .header-sub{font-size:11px;color:#c0c0c0;margin-top:1px}
body.p-mktcl .filter-bar{background:var(--s4x-surface);border-bottom:1px solid var(--s4x-border);border-top:3px solid var(--s4x-ce-red);padding:8px 16px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;flex-shrink:0}
body.p-mktcl .preset-btn{display:inline-block;padding:4px 10px;font-size:12px;text-decoration:none;background:#f0f0f0;color:#333;border-right:1px solid #ddd;white-space:nowrap}
body.p-mktcl .pill-bar{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
body.p-mktcl .pill{display:inline-flex;flex-direction:column;align-items:center;background:#2a2d36;border-radius:5px;padding:5px 12px;min-width:76px}
body.p-mktcl .pill-val{color:var(--s4x-surface);font-size:16px;font-weight:700;line-height:1.2}
body.p-mktcl .pill-lbl{color:rgba(255,255,255,.55);font-size:9px;text-transform:uppercase;letter-spacing:.05em;margin-top:2px}
body.p-mktcl .pill-lbl.won{color:#4ddf8a}
body.p-mktcl .filter-row{background:var(--s4x-surface);border-bottom:1px solid var(--s4x-border);padding:7px 16px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;flex-shrink:0}
body.p-mktcl .filter-row label{font-size:13px;color:#555;font-weight:500}
body.p-mktcl .filter-row select{height:28px;font-size:13px;padding:2px 8px;border:1px solid #ccc;border-radius:3px;min-width:130px}
body.p-mktcl .custom-form button{height:28px;padding:0 12px;background:#2a2d36;color:var(--s4x-surface);border:none;border-radius:3px;font-size:12px;cursor:pointer}
body.p-mktcl .table-wrap{flex:1;overflow:auto;position:relative}
body.p-mktcl table{width:100%;border-collapse:collapse;font-size:13px}
body.p-mktcl th{background:#2a2d36;color:var(--s4x-surface);padding:8px 10px;font-size:12px;font-weight:600;text-align:left;white-space:nowrap;position:sticky;top:0;z-index:2;cursor:pointer;user-select:none}
body.p-mktcl th:hover{background:#363c4d}
body.p-mktcl th .sort-arrow{margin-left:4px;opacity:.4;font-size:10px}
body.p-mktcl th.sorted .sort-arrow{opacity:1;color:var(--s4x-blue)}
body.p-mktcl td{padding:7px 10px;border-bottom:1px solid #eee;vertical-align:middle}
body.p-mktcl .cell-main{font-size:13px;color:var(--s4x-text);line-height:1.3}
body.p-mktcl .cell-sub{font-size:11px;color:#888;margin-top:2px}
body.p-mktcl .sub-badge{display:inline-block;padding:2px 7px;border-radius:3px;font-size:11px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
body.p-mktcl .sub-ce{background:#dbeeff;color:#0055cc}
body.p-mktcl .sub-dbc{background:#fff0db;color:#b35900}
body.p-mktcl .existing-badge{display:inline-block;padding:1px 6px;border-radius:3px;font-size:10px;font-weight:700;background:#ececec;color:#777;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;margin-left:6px}
body.p-mktcl tr.lead-row.is-existing td{background:#fafafa;color:#8a8a8a}
body.p-mktcl .toggle-existing{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:#555;cursor:pointer;user-select:none;white-space:nowrap}
body.p-mktcl .toggle-existing input{cursor:pointer;margin:0}
body.p-mktcl .pill.clickable{cursor:pointer}
body.p-mktcl .pill.clickable:hover{background:#3a3f52}
body.p-mktcl .pill-lbl.hidden-lbl{color:#ffb28a}
body.p-mktcl .pill-lbl.unmerged-lbl{color:#ff8a8a}
body.p-mktcl .chip{display:inline-block;padding:1px 6px;margin:1px 3px 1px 0;border-radius:3px;font-size:11px;background:#eef2f7;color:#44506b;white-space:nowrap}
body.p-mktcl .unmerged-badge{display:inline-block;padding:1px 6px;border-radius:3px;font-size:10px;font-weight:700;background:#fde2e2;color:#b3261e;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;margin-left:6px}
body.p-mktcl .rollup-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:100;display:none;align-items:center;justify-content:center;padding:24px}
body.p-mktcl .rollup-overlay.open{display:flex}
body.p-mktcl .rollup-card{background:var(--s4x-surface);border-radius:4px;overflow:hidden;width:100%;max-width:820px;max-height:82vh;display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.35)}
body.p-mktcl .rollup-card h3{font-size:13px;padding:10px 14px;background:#2a2d36;color:var(--s4x-surface);font-weight:600;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
body.p-mktcl .rollup-close{background:none;border:none;color:#c0c0c0;font-size:20px;line-height:1;cursor:pointer;padding:0 2px}
body.p-mktcl .rollup-close:hover{color:var(--s4x-surface)}
body.p-mktcl .rollup-card .rollup-note{font-size:11px;color:#666;padding:8px 14px;border-bottom:1px solid #eee;background:#fafafa;flex-shrink:0}
body.p-mktcl .rollup-scroll{overflow:auto;flex:1}
body.p-mktcl .rollup-table thead th{position:sticky;top:0;z-index:1}
body.p-mktcl .rollup-table{width:100%;border-collapse:collapse;font-size:13px}
body.p-mktcl .rollup-table th{background:#3a3f52;color:#b0b8cc;padding:6px 14px;font-size:11px;text-align:left;position:static;cursor:default}
body.p-mktcl .rollup-table td{padding:6px 14px;border-bottom:1px solid #eee}
body.p-mktcl .rollup-table td.r{text-align:right}
body.p-mktcl .rollup-table tr:last-child td{border-bottom:none}
body.p-mktcl .rollup-count{font-weight:700;color:#b3261e}
body.p-mktcl .task-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;white-space:nowrap}
body.p-mktcl .task-complete{background:#d4edda;color:#155724}
body.p-mktcl .task-progress{background:#fff3cd;color:#856404}
body.p-mktcl .task-notstart{background:var(--s4x-canvas);color:#666}
body.p-mktcl .rev-pos{color:#1a7a4a;font-weight:700}
body.p-mktcl .status-won{color:#1a7a4a;font-weight:600}
body.p-mktcl .status-open{color:#b35900}
body.p-mktcl .status-lost{color:var(--s4x-ce-red)}
body.p-mktcl tr.lead-row{cursor:pointer}
body.p-mktcl tr.lead-row:hover td{background:#f5f5f5}
body.p-mktcl .chev{display:inline-block;width:16px;height:16px;line-height:16px;text-align:center;font-size:11px;color:var(--s4x-blue);font-weight:700;transition:transform .15s}
body.p-mktcl tr.lead-row.open .chev{transform:rotate(90deg)}
body.p-mktcl tr.detail-row{display:none}
body.p-mktcl tr.detail-row.open{display:table-row}
body.p-mktcl tr.detail-row > td{background:#edf2ff;padding:0;border-bottom:2px solid #c8d6f0}
body.p-mktcl .detail-inner{padding:10px 12px 12px 32px}
body.p-mktcl .detail-strip{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid #c8d6f0;font-size:12px}
body.p-mktcl .detail-item{color:#555}
body.p-mktcl .detail-item strong{color:var(--s4x-text);font-weight:600}
body.p-mktcl .opp-section-title{font-size:11px;font-weight:700;color:#555;text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px}
body.p-mktcl .opp-table{width:100%;border-collapse:collapse;font-size:12px}
body.p-mktcl .opp-table th{background:#3a3f52;color:#b0b8cc;padding:5px 10px;font-size:11px;font-weight:600;white-space:nowrap;position:static;cursor:default}
body.p-mktcl .opp-table td{padding:5px 10px;border-bottom:1px solid #dde4f5}
body.p-mktcl .opp-table td.r{text-align:right}
body.p-mktcl .opp-table tr:last-child td{border-bottom:none}
body.p-mktcl .pagination-bar{background:var(--s4x-surface);border-top:1px solid var(--s4x-border);padding:7px 16px;display:flex;align-items:center;gap:8px;flex-shrink:0;font-size:13px}
body.p-mktcl .pagination-bar .pg-info{color:#666;margin-right:4px}
body.p-mktcl .pg-btn{background:#f0f0f0;border:1px solid #ddd;border-radius:3px;padding:3px 9px;font-size:12px;cursor:pointer;color:#333}
body.p-mktcl .pg-btn:hover:not(:disabled){background:var(--s4x-border)}
body.p-mktcl .pg-btn:disabled{opacity:.4;cursor:default}
body.p-mktcl .pg-btn.active{background:#2a2d36;color:var(--s4x-surface);border-color:#2a2d36}
body.p-mktcl .pg-spacer{color:#aaa;padding:0 2px}
body.p-mktcl .err-box{background:#fde8e8;border:1px solid var(--s4x-ce-red);border-radius:4px;padding:12px 16px;margin:8px 16px;color:#c00;font-size:13px}
body.p-mktcl .no-data{padding:32px;text-align:center;color:#999;font-size:13px}

/* ---- 6.srps-scorecard ---- */
body.p-srps-scorecard{font-family:Inter,sans-serif;color:var(--s4x-text);font-size:14px}
body.p-srps-scorecard .content{max-width:98%;margin:0 auto;padding:16px}
body.p-srps-scorecard .header-bar{background:#181921;color:var(--s4x-surface);padding:12px 20px;border-radius:6px 6px 0 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
body.p-srps-scorecard .header-title{font-size:16px;font-weight:600;color:var(--s4x-surface)}
body.p-srps-scorecard .header-sub{font-size:12px;color:#c0c0c0;margin-top:2px}
body.p-srps-scorecard .filter-bar{background:var(--s4x-surface);border:1px solid var(--s4x-border);border-top:3px solid var(--s4x-ce-red);padding:10px 16px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:0}
body.p-srps-scorecard .preset-btn{display:inline-block;padding:5px 11px;font-size:12px;text-decoration:none;background:#f0f0f0;color:#333;border-right:1px solid #ddd;white-space:nowrap}
body.p-srps-scorecard .pill-bar{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
body.p-srps-scorecard .pill{display:inline-flex;flex-direction:column;align-items:center;background:#2a2d36;border-radius:6px;padding:6px 14px;min-width:80px}
body.p-srps-scorecard .pill-val{color:var(--s4x-surface);font-size:17px;font-weight:700;line-height:1.2}
body.p-srps-scorecard .pill-lbl{color:rgba(255,255,255,0.6);font-size:10px;text-transform:uppercase;letter-spacing:.05em;margin-top:2px}
body.p-srps-scorecard .filter-row{background:var(--s4x-surface);border:1px solid var(--s4x-border);border-top:none;padding:8px 16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
body.p-srps-scorecard .filter-row select{height:28px;font-size:12px;padding:2px 6px;border:1px solid #ccc;border-radius:3px}
body.p-srps-scorecard .filter-row label{font-size:12px;color:#555}
body.p-srps-scorecard .table-wrap{overflow:auto;max-height:75vh;border:1px solid var(--s4x-border);border-top:none}
body.p-srps-scorecard table{width:100%;border-collapse:collapse;font-size:13px}
body.p-srps-scorecard th{background:#2a2d36;color:var(--s4x-surface);padding:8px 10px;font-size:12px;font-weight:600;text-align:left;white-space:nowrap;position:sticky;top:0;z-index:2}
body.p-srps-scorecard td{padding:7px 10px;border-bottom:1px solid #f0f0f0;white-space:nowrap;vertical-align:middle}
body.p-srps-scorecard td.muted{color:#888;font-size:12px}
body.p-srps-scorecard .sub-hdr td{background:#2a2d36;color:var(--s4x-surface);font-size:12px;font-weight:700;letter-spacing:.04em;padding:6px 12px}
body.p-srps-scorecard tr:hover td:not(.sub-hdr td){background:#fafafa}
body.p-srps-scorecard .arrow-up{color:#1a7a4a}
body.p-srps-scorecard .arrow-dn{color:var(--s4x-ce-red)}
body.p-srps-scorecard .err-box{background:#fde8e8;border:1px solid var(--s4x-ce-red);border-radius:4px;padding:16px;margin:16px 0;color:#c00;font-size:13px}
body.p-srps-scorecard .no-data{padding:28px;text-align:center;color:#999;font-size:13px}
body.p-srps-scorecard .custom-form button{height:28px;padding:0 10px;background:#2a2d36;color:var(--s4x-surface);border:none;border-radius:3px;font-size:12px;cursor:pointer}

/* ---- 6.natacct ---- */
body.p-natacct *, body.p-natacct *::before, body.p-natacct *::after{box-sizing: border-box;}
body.p-natacct{margin:0; padding:0; background:var(--s4x-canvas); font-family:Inter,sans-serif; font-size:13px; color:var(--s4x-text);}
body.p-natacct table{border-collapse:collapse; width:100%;}
body.p-natacct td, body.p-natacct th{word-break:break-word;}
body.p-natacct a:hover{opacity:0.85;}
body.p-natacct button:hover{opacity:0.9;}
body.p-natacct input[type="date"], body.p-natacct select, body.p-natacct button{font-family:Inter,sans-serif;}
body.p-natacct .ce-opp-tip{position:relative; display:inline-block; cursor:default;}
body.p-natacct .ce-opp-tip .ce-opp-tip-box{display:none; position:fixed; background:#2a2d36; color:var(--s4x-surface); font-size:11px; padding:8px 12px; border-radius:5px; min-width:200px; max-width:260px; z-index:9999; white-space:normal; line-height:1.6; box-shadow:0 3px 10px rgba(0,0,0,0.3);}
body.p-natacct .nd-preview-bar{background:var(--s4x-text); color:var(--s4x-surface); padding:7px 20px; font-size:12px; display:flex; align-items:center; justify-content:space-between;}
body.p-natacct .nd-preview-bar a{color:var(--s4x-accent); text-decoration:none; font-weight:600;}
body.p-natacct .nd-preview-bar a:hover{color:var(--s4x-surface);}
body.p-natacct .nd-preview-tag{background:var(--s4x-ce-red); color:var(--s4x-surface); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:2px 8px; border-radius:10px;}