:root {
    --ink: #17212b;
    --muted: #66737f;
    --navy: #14273d;
    --navy-2: #1d3957;
    --gold: #c59a52;
    --paper: #f4f1eb;
    --white: #fff;
    --line: #dfe3e6;
    --success: #287454;
    --danger: #a43f45;
    --shadow: 0 10px 30px rgba(20,39,61,.08);
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { color: var(--ink); background: #f6f7f8; font: 15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color: #245c89; text-decoration: none; }
h1,h2,h3 { margin: 0 0 .7rem; font-family: Georgia,"Times New Roman",serif; line-height: 1.2; }
h1 { font-size: clamp(1.8rem,3vw,2.6rem); }
h2 { font-size: 1.35rem; }
.app-shell { display: grid; grid-template-columns: 245px 1fr; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 245px; color: #eef3f7; background: var(--navy); display: flex; flex-direction: column; padding: 24px 18px; }
.brand { display: flex; align-items: center; gap: 12px; color: white; margin-bottom: 30px; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--gold); color: var(--gold); font-family: Georgia,serif; font-weight: 700; }
.brand strong,.brand small { display:block; }
.brand small { color:#9fb0c1; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; }
.sidebar nav { display:grid; gap:4px; }
.sidebar nav a { color:#cbd5df; padding:10px 12px; border-radius:7px; }
.sidebar nav a:hover { background:var(--navy-2); color:white; }
.sidebar-user { margin-top:auto; padding:14px 10px 0; border-top:1px solid rgba(255,255,255,.12); font-size:.9rem; }
.link-button { border:0; background:none; padding:3px 0; color:#aebdca; cursor:pointer; }
.main { grid-column:2; min-height:100vh; min-width:0; }
.topbar { height:82px; background:white; border-bottom:1px solid var(--line); display:flex; align-items:center; padding:0 32px; position:sticky; top:0; z-index:5; }
.topbar-logo-wrap { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; }
.topbar-logo { display:block; width:min(400px,36vw); max-height:62px; object-fit:contain; }
.topbar-spacer { flex:1; }
.timer-shortcut { color:var(--danger); font-weight:600; }
.menu-toggle { display:none; border:0; background:none; font-size:1.3rem; }
.content { padding:32px; max-width:1500px; margin:0 auto; }
.page-head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:24px; }
.compact-head { align-items:center; margin-bottom:16px; }
.eyebrow { color:var(--gold); font-weight:700; text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; }
.muted { color:var(--muted); }
.panel { background:white; border:1px solid var(--line); border-radius:12px; padding:24px; box-shadow:var(--shadow); margin-bottom:24px; }
.subpanel { margin:8px 0 24px; padding:20px; border:1px solid var(--line); border-radius:10px; background:#fafbfb; }
.grid { display:grid; gap:20px; }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:24px; }
.metric { background:white; border:1px solid var(--line); border-radius:12px; padding:20px; box-shadow:var(--shadow); }
.metric span { color:var(--muted); font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; }
.metric strong { display:block; font:700 2rem/1.2 Georgia,serif; margin-top:8px; }
.button,button.button { display:inline-flex; align-items:center; justify-content:center; gap:6px; border:1px solid var(--navy); background:var(--navy); color:white; border-radius:7px; padding:9px 14px; cursor:pointer; font:inherit; font-weight:600; }
.button.secondary { background:white; color:var(--navy); }
.button.gold { background:var(--gold); border-color:var(--gold); color:#151515; }
.button.danger { background:var(--danger); border-color:var(--danger); }
.button.small { padding:5px 9px; font-size:.82rem; }
.actions { display:flex; gap:8px; flex-wrap:wrap; }
label { display:block; font-weight:600; margin-bottom:5px; }
input,select,textarea { width:100%; border:1px solid #cbd2d8; border-radius:7px; background:white; padding:9px 10px; font:inherit; color:var(--ink); }
textarea { min-height:100px; resize:vertical; }
.field { margin-bottom:16px; }
.checkbox { display:flex; align-items:center; gap:8px; }
.checkbox input { width:auto; }
.checkbox-list { display:grid; gap:7px; padding:9px 0; }
.checkbox-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:8px 14px; max-height:280px; overflow:auto; padding:12px; border:1px solid var(--line); border-radius:8px; background:#fafbfb; }
table { width:100%; border-collapse:collapse; }
th,td { text-align:left; padding:11px 10px; border-bottom:1px solid #e8ebed; vertical-align:top; }
th { color:var(--muted); font-size:.75rem; text-transform:uppercase; letter-spacing:.07em; }
.table-wrap { overflow-x:auto; }
.badge { display:inline-block; padding:3px 8px; border-radius:999px; background:#e9eef2; color:#3e5367; font-size:.75rem; font-weight:700; text-transform:capitalize; }
.badge.good { background:#dff1e9; color:var(--success); }
.badge.warn { background:#f8eed9; color:#8b6728; }
.flash { padding:12px 15px; border-radius:8px; margin-bottom:18px; }
.flash-success { background:#e3f3eb; color:#175b40; }
.flash-error { background:#f8e4e5; color:#852e34; }
.detail-list { display:grid; grid-template-columns:160px 1fr; gap:8px 16px; }
.detail-list dt { color:var(--muted); }
.detail-list dd { margin:0; }
.timer-card { text-align:center; padding:40px; background:var(--navy); color:white; border-radius:14px; }
.timer-display { font:700 clamp(2.8rem,9vw,5.5rem)/1 monospace; letter-spacing:.04em; margin:24px 0; color:#fff; }
.auth-shell { background:linear-gradient(135deg,var(--navy),#273f57); }
.auth-main { min-height:100vh; display:grid; place-items:center; padding:24px; }
.auth-card { width:min(460px,100%); background:white; border-radius:14px; padding:38px; box-shadow:0 24px 70px rgba(0,0,0,.25); }
.auth-brand { color:var(--gold); letter-spacing:.15em; text-transform:uppercase; font-weight:700; font-size:.75rem; }
.auth-logo { display:block; width:100%; max-width:400px; height:auto; margin:0 auto 24px; }
.integration-status { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.empty { padding:30px; text-align:center; color:var(--muted); }
.inline-attorney-form { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.lookup-action { align-self:end; }
.lookup-action .button { width:100%; }
.attorney-search-message { margin:-4px 0 12px; }
.attorney-results { max-height:330px; margin-bottom:20px; overflow:auto; border:1px solid var(--line); border-radius:8px; background:white; }
.opposing-selection-note { min-height:24px; margin:3px 0 8px; color:var(--success); font-weight:600; }
.pro-se-toggle { padding:8px 12px; border:1px solid var(--line); border-radius:8px; background:white; white-space:nowrap; }
.billing-five { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); border:1px solid var(--line); border-radius:9px; overflow:hidden; }
.billing-five > div { min-width:0; padding:16px; border-right:1px solid var(--line); }
.billing-five > div:last-child { border-right:0; }
.billing-five span,.billing-five strong { display:block; }
.billing-five span { margin-bottom:6px; color:var(--muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.07em; }
.billing-five strong { font-family:Georgia,"Times New Roman",serif; font-size:1.15rem; overflow-wrap:anywhere; }
.relationship-inline-form { display:grid; grid-template-columns:minmax(180px,.7fr) minmax(220px,1fr) auto; gap:8px; align-items:start; }
.relationship-inline-form select,.relationship-inline-form input { margin:0; }
.modal-backdrop {
    position:fixed;
    inset:0;
    z-index:100;
    padding:20px;
    background:rgba(5,13,22,.72);
    display:grid;
    place-items:center;
}
.modal-card {
    width:min(520px,100%);
    padding:28px;
    border-radius:13px;
    background:white;
    box-shadow:0 30px 100px rgba(0,0,0,.4);
}
.paybotx-backdrop {
    position:fixed;
    inset:0;
    z-index:120;
    padding:20px;
    background:rgba(3,7,11,.86);
    backdrop-filter:blur(11px);
    display:grid;
    place-items:center;
}
.paybotx-terminal {
    width:min(580px,100%);
    max-height:calc(100vh - 40px);
    overflow:auto;
    border:1px solid #42505c;
    border-radius:16px;
    background:#121a21;
    color:#edf2f6;
    box-shadow:0 36px 130px rgba(0,0,0,.78);
}
.paybotx-terminal > header {
    min-height:92px;
    padding:18px 22px;
    background:linear-gradient(120deg,#f8fafc,#e9eef3);
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.paybotx-terminal > header img { width:min(300px,78%); height:auto; }
.paybotx-terminal > header button {
    width:32px;
    height:32px;
    border:1px solid #c9d1d9;
    border-radius:50%;
    background:#fff;
    color:#56616c;
    font-size:21px;
    cursor:pointer;
}
.paybotx-entry,.paybotx-processing { padding:25px; }
.paybotx-entry h2,.paybotx-processing h2 { margin:5px 0 12px; color:#edf2f6; font-size:34px; }
.paybotx-entry input {
    border-color:#40505e;
    background:#0d141a;
    color:#edf2f6;
}
.paybotx-entry label { color:#cbd5dc; }
.paybotx-security-note { color:#8495a3; font-size:.84rem; }
.paybotx-error { padding:10px 12px; border-radius:7px; background:#522b30; color:#ffd9dd; }
.paybotx-card-prompt {
    min-height:78px;
    margin-top:13px;
    padding:13px;
    border:1px solid #234f86;
    border-radius:9px;
    background:linear-gradient(110deg,rgba(18,94,182,.16),rgba(15,28,40,.45));
    display:flex;
    align-items:center;
    gap:13px;
}
.paybotx-card-prompt > i {
    width:44px;
    height:44px;
    border-radius:10px;
    background:#0f5fae;
    color:#fff;
    font-size:24px;
    font-style:normal;
    display:grid;
    place-items:center;
}
.paybotx-card-prompt p,.paybotx-timer p { margin:0; display:grid; gap:5px; }
.paybotx-card-prompt b { color:#d6e1e9; font-size:12px; }
.paybotx-card-prompt small { color:#66829a; font-size:10px; }
.paybotx-timer {
    min-height:110px;
    margin-top:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:15px;
}
.paybotx-timer > span {
    width:70px;
    height:70px;
    padding:5px;
    border-radius:50%;
    background:conic-gradient(#1263b7 var(--paybotx-progress,0%),#2c3740 0);
    position:relative;
    display:grid;
    place-items:center;
}
.paybotx-timer > span::before {
    content:"";
    position:absolute;
    inset:6px;
    border-radius:50%;
    background:#121a21;
}
.paybotx-timer > span b,.paybotx-timer > span small { position:relative; z-index:1; }
.paybotx-timer > span b { margin-top:8px; font-size:22px; }
.paybotx-timer > span small { margin-top:-12px; color:#65737d; font-size:10px; }
.paybotx-timer p b { font-size:13px; }
.paybotx-timer p small { color:#63717c; font-size:10px; }
[hidden] { display:none !important; }
@media (max-width: 950px) {
    .app-shell { display:block; }
    .sidebar { transform:translateX(-100%); transition:.2s; z-index:20; }
    .menu-open .sidebar { transform:translateX(0); }
    .main { margin-left:0; }
    .menu-toggle { display:block; }
    .metrics { grid-template-columns:repeat(2,1fr); }
    .grid-2,.grid-3 { grid-template-columns:1fr; }
    .relationship-inline-form { grid-template-columns:1fr; }
    .billing-five { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .billing-five > div { border-bottom:1px solid var(--line); }
    .content { padding:22px; }
    .topbar-logo { width:min(310px,55vw); }
}
@media (max-width: 560px) {
    .metrics { grid-template-columns:1fr; }
    .page-head { align-items:flex-start; flex-direction:column; }
    .detail-list { grid-template-columns:1fr; }
    .topbar { height:72px; padding:0 18px; }
    .topbar-logo { width:min(220px,55vw); }
    .timer-shortcut { font-size:0; }
    .timer-shortcut::after { content:'●'; font-size:1rem; }
    .integration-status { align-items:flex-start; flex-direction:column; }
    .modal-backdrop,.paybotx-backdrop { padding:10px; }
    .paybotx-terminal > header { min-height:75px; }
    .paybotx-entry,.paybotx-processing { padding:19px; }
}
