:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#0f172a;background-color:#f4f6f8;line-height:1.5;font-weight:400;--color-bg: #f7fbff;--color-panel: #ffffff;--color-accent: #1ca4a4;--color-accent-soft: #c8f5ef;--color-text-muted: #5f6c7b;--color-border: #d5e0ec;--color-danger: #f87171}*{box-sizing:border-box}body{margin:0;color:#0f172a;background:radial-gradient(circle at top,#e0f2ff,#f7fbff 40%,#f4f6f8);min-height:100vh}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at top,#d7f4ff,#f4f6f8 60%)}.login-card{width:100%;max-width:420px;background:#fff;border-radius:24px;padding:32px;box-shadow:0 25px 45px #0f172a2e;display:flex;flex-direction:column;gap:16px}.login-card h1{margin:0}.login-card label{display:flex;flex-direction:column;gap:6px;font-weight:500}.login-card input,.login-card select{border:1px solid var(--color-border);border-radius:10px;padding:10px;font-size:1rem}.input,input,select,textarea{width:100%;border:1px solid var(--color-border);border-radius:12px;padding:10px 12px;font-size:1rem;background:#fff;transition:border .2s ease,box-shadow .2s ease}input:focus,select:focus,textarea:focus{border-color:var(--color-accent);box-shadow:0 0 0 2px #14b8a626;outline:none}label{display:flex;flex-direction:column;gap:6px;font-weight:500;color:#0f172a}.error-text{color:var(--color-danger);margin:0}a{color:inherit;text-decoration:none}button{font-family:inherit}.app-shell{display:flex;min-height:100vh;background:var(--color-bg)}.content-area{flex:1;padding:32px;background:var(--color-bg)}.grid{display:grid;gap:24px}.grid.two{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.grid.three{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.panel{background:var(--color-panel);border-radius:18px;padding:24px;border:1px solid var(--color-border);box-shadow:0 18px 45px #0f172a14}.panel h2{margin:0 0 16px;font-size:1.1rem}.metric{display:flex;flex-direction:column;gap:4px}.metric__label{color:var(--color-text-muted);margin:0}.metric__value{margin:0;font-size:2.2rem;font-weight:600}.metric__helper{color:var(--color-text-muted)}.metric--danger{border-color:#f8717166}.metric--warning{border-color:#facc1566}.usage-card__values{display:flex;justify-content:space-between;align-items:baseline;margin:8px 0}.usage-card__values strong{font-size:1.8rem}.usage-card__bar{width:100%;background:#0f172a14;height:12px;border-radius:999px;overflow:hidden}.usage-card__bar span{display:block;height:100%;background:linear-gradient(90deg,#1ca4a4,#2f7bee)}.usage-card__onsite{margin-top:12px;color:var(--color-text-muted)}.usage-card__onsite--warning{color:var(--color-danger);font-weight:600}.table-scroll{overflow-x:auto}.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{text-align:left;padding:12px;border-bottom:1px solid var(--color-border)}.data-table tbody tr:hover{background:#0f172a0a}.panel input,.panel select,.panel textarea{border:1px solid var(--color-border);border-radius:10px;padding:10px;font-size:1rem;width:100%}.panel textarea{resize:vertical}.panel-subtitle{margin:4px 0 16px;color:var(--color-text-muted);font-size:.9rem}.alert-panel{border-color:#f8717180;background:#f8717114}.alert-panel ul{margin:0;padding-left:18px;color:var(--color-danger)}.contact-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.status-pill{display:inline-flex;align-items:center;justify-content:center;padding:4px 12px;border-radius:999px;background:#0f172a14;font-size:.75rem;margin-right:8px;text-transform:uppercase;letter-spacing:.05em}.status-pill--active{background:#0ea5e926;color:#0369a1}.status-pill--draft{background:#fbbf2433;color:#92400e}.status-pill--paused,.status-pill--on_hold{background:#f8717133;color:var(--color-danger)}.admin-actions{display:flex;align-items:center;gap:12px}.admin-actions select{border:1px solid var(--color-border);border-radius:10px;padding:6px 12px}.client-roster{display:flex;flex-direction:column;gap:12px}.client-roster__item{display:flex;justify-content:space-between;align-items:center;width:100%;border:1px solid var(--color-border);border-radius:16px;padding:14px 18px;background:#fff;cursor:pointer;text-align:left;transition:border-color .2s ease,box-shadow .2s ease}.client-roster__item:hover{border-color:var(--color-accent)}.client-roster__item--active{border-color:var(--color-accent);box-shadow:0 6px 18px #1ca4a433}.client-roster__item:focus-visible{outline:2px solid var(--color-accent)}.client-roster__meta{margin:4px 0 0;color:var(--color-text-muted);font-size:.9rem}.client-roster__badge{padding:4px 12px;border-radius:999px;background:var(--color-bg);font-size:.9rem}.segmented-control{display:inline-flex;border:1px solid var(--color-border);border-radius:999px;overflow:hidden;background:var(--color-bg)}.segmented-control button{border:none;padding:8px 18px;background:transparent;cursor:pointer;font-weight:600;color:var(--color-text-muted)}.segmented-control button.active{background:var(--color-panel);color:#0f172a;box-shadow:0 4px 12px #0f172a1f}.chip{padding:4px 10px;border-radius:999px;font-size:.85rem;text-transform:capitalize;display:inline-block}.chip--support{background:#e0f2ff;color:#0369a1}.chip--project{background:#e0fff5;color:#047857}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.topbar h1{margin:0;font-size:1.6rem}.topbar p{margin:4px 0 0;color:var(--color-text-muted)}.topbar__actions{display:flex;align-items:center;gap:16px}.topbar__user{text-align:right;display:flex;flex-direction:column;align-items:flex-end}.ghost-btn{border:1px solid var(--color-border);padding:8px 16px;border-radius:999px;background:#fff;cursor:pointer;display:inline-flex;align-items:center;gap:6px}.ghost-btn:hover{background:var(--color-accent-soft);border-color:var(--color-accent)}.primary-btn{border:none;background:linear-gradient(120deg,#0ea5e9,#14b8a6);color:#fff;padding:12px 24px;border-radius:12px;font-size:1rem;cursor:pointer;box-shadow:0 10px 20px #0ea5e94d;display:inline-flex;align-items:center;justify-content:center;gap:8px}.primary-btn:hover{opacity:.9}.sidebar{width:260px;background:#0f172a;color:#e0f2f1;padding:32px 24px;display:flex;flex-direction:column;gap:24px;position:sticky;top:0;align-self:flex-start;border-bottom-right-radius:24px}.sidebar__header{display:flex;align-items:center;justify-content:space-between;gap:12px}.sidebar__logo span{font-weight:600;font-size:1.1rem;display:block}.sidebar__logo small{color:#fff9}.sidebar__nav{display:flex;flex-direction:column;gap:8px}.sidebar__toggle{display:none;flex-direction:column;justify-content:center;gap:5px;padding:10px;background:#ffffff14;border:1px solid rgba(255,255,255,.25);border-radius:12px;cursor:pointer}.sidebar__toggle span{width:22px;height:2px;background:#fff;display:block}.sidebar__link{padding:10px 14px;border-radius:10px;color:#fffc;transition:background .2s ease}.sidebar__link:hover{background:#ffffff26}.sidebar__link--active{background:#ffffff40;color:#fff}.modal-backdrop{position:fixed;inset:0;background:#0f172a8c;display:flex;align-items:center;justify-content:center;padding:24px;z-index:999}.modal{background:#fff;border-radius:20px;width:min(720px,95%);max-height:90vh;overflow:auto;box-shadow:0 20px 45px #0f172a40;border:1px solid var(--color-border)}.modal__header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--color-border)}.modal__header h2{margin:0}.modal__body{padding:24px;display:flex;flex-direction:column;gap:16px}.template-picker{margin-bottom:24px;display:flex;flex-direction:column;gap:12px}.template-card{border:1px solid var(--color-border);border-radius:16px;padding:16px;text-align:left;background:#fff;cursor:pointer;display:flex;flex-direction:column;gap:6px;color:inherit}.template-card small{color:var(--color-text-muted)}.template-card--active{border-color:var(--color-accent);background:#14b8a614;box-shadow:0 6px 16px #14b8a633}@media(max-width:1024px){.app-shell{flex-direction:column}.sidebar{width:100%;border-radius:0 0 24px 24px;box-shadow:0 12px 25px #0f172a26;position:relative}.sidebar__toggle{display:inline-flex}.sidebar__nav{width:100%;flex-wrap:wrap;margin-top:16px;display:none}.sidebar.sidebar--open .sidebar__nav{display:flex}.content-area{padding:24px}}@media(max-width:640px){.content-area{padding:16px}.topbar{flex-direction:column;align-items:flex-start;gap:16px}.grid.two,.grid.three{grid-template-columns:1fr}.sidebar__nav{flex-direction:column}}