:root { --ink:#071013; --paper:#eef2ed; --muted:#6b7779; --line:rgba(7,16,19,.14); --aqua:#8dd3cc; --serif:"Prata",serif; --sans:"Manrope",sans-serif; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family:var(--sans); color:var(--ink); background:var(--paper); font-size:15px; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; }
.brand { display:inline-flex; align-items:center; gap:11px; font-weight:700; letter-spacing:-.03em; }
.brand-mark { width:22px; height:22px; border:1px solid currentColor; border-radius:50%; position:relative; overflow:hidden; }
.brand-mark::after { content:""; position:absolute; left:-2px; right:-2px; bottom:3px; height:7px; border-radius:50%; background:currentColor; transform:rotate(-7deg); }
.eyebrow { margin:0 0 18px; color:rgba(255,255,255,.58); font-size:.68rem; text-transform:uppercase; letter-spacing:.15em; font-weight:700; }
.eyebrow.dark { color:#647476; }
.alert { margin:0 0 24px; padding:14px 16px; border-radius:4px; font-size:.86rem; }
.alert.error { color:#8b3030; background:#f7dddd; }
.alert.success { color:#245e4b; background:#dbeee6; }
.alert.warning { color:#70561e; background:#f5e8c9; }

.login-shell { min-height:100vh; display:grid; grid-template-columns:1.15fr .85fr; }
.login-visual { min-height:100vh; padding:48px clamp(32px,6vw,90px); display:flex; flex-direction:column; justify-content:space-between; color:white; background:radial-gradient(circle at 72% 35%, rgba(47,153,163,.42), transparent 27%), linear-gradient(140deg,#061013,#0a252a 58%,#061013); }
.login-visual h1 { margin:0; max-width:780px; font:400 clamp(3.2rem,6vw,7rem)/.98 var(--serif); letter-spacing:-.045em; }
.login-visual > p { color:rgba(255,255,255,.5); font-size:.8rem; }
.login-panel { display:grid; place-items:center; padding:40px; background:var(--paper); }
.login-form { width:min(410px,100%); }
.login-form h2 { margin:0 0 35px; font:400 2.3rem/1.1 var(--serif); }
.login-form label, .password-form label { display:grid; gap:8px; margin:0 0 18px; font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.login-form input, .password-form input { width:100%; padding:14px 15px; border:1px solid var(--line); border-radius:3px; background:rgba(255,255,255,.55); outline:0; }
.login-form input:focus, .password-form input:focus { border-color:#397c7e; background:white; }
.login-form button, .password-form button { width:100%; min-height:50px; display:flex; align-items:center; justify-content:space-between; border:0; border-radius:3px; padding:0 18px; color:white; background:var(--ink); font-weight:700; cursor:pointer; }
.login-form > a { display:inline-block; margin-top:26px; color:var(--muted); font-size:.8rem; }

.dashboard-body { min-height:100vh; background:#e9eeea; }
.sidebar { position:fixed; z-index:10; inset:0 auto 0 0; width:240px; padding:32px 28px; display:flex; flex-direction:column; color:white; background:#071013; }
.sidebar nav { display:flex; flex-direction:column; gap:6px; margin:64px 0 auto; }
.sidebar nav a { padding:11px 12px; border-radius:3px; color:rgba(255,255,255,.55); font-size:.86rem; }
.sidebar nav a:hover, .sidebar nav a.active { color:white; background:rgba(255,255,255,.08); }
.logout { padding:0; color:rgba(255,255,255,.48); border:0; background:none; cursor:pointer; }
.dashboard { margin-left:240px; padding:40px clamp(24px,4.5vw,72px) 90px; }
.dashboard-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:38px; }
.dashboard-header p { margin:0 0 5px; color:var(--muted); font-size:.76rem; }
.dashboard-header h1 { margin:0; font:400 clamp(2.2rem,4vw,4rem)/1 var(--serif); letter-spacing:-.04em; }
.dashboard-header > a { padding:10px 14px; border:1px solid var(--line); border-radius:3px; font-size:.78rem; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:28px; }
.stats article { min-height:170px; display:flex; flex-direction:column; padding:22px; border:1px solid var(--line); background:rgba(255,255,255,.5); border-radius:4px; }
.stats span { color:var(--muted); font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; }
.stats strong { margin:auto 0 5px; font:400 3.5rem/1 var(--serif); }
.stats small { color:var(--muted); }
.panel { margin-top:28px; background:rgba(255,255,255,.55); border:1px solid var(--line); border-radius:4px; overflow:hidden; scroll-margin-top:24px; }
.panel-heading { min-height:110px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 28px; border-bottom:1px solid var(--line); }
.panel-heading p { margin:0 0 4px; color:var(--muted); font-size:.7rem; text-transform:uppercase; letter-spacing:.1em; }
.panel-heading h2 { margin:0; font:400 2rem/1.1 var(--serif); }
.panel-heading > span { color:var(--muted); font-size:.76rem; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; min-width:880px; }
th,td { padding:15px 18px; text-align:left; border-bottom:1px solid var(--line); vertical-align:middle; }
th { color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; }
td { font-size:.82rem; }
td strong,td small { display:block; }
td small { margin-top:4px; color:var(--muted); font-size:.7rem; }
tbody tr:hover { background:rgba(255,255,255,.7); }
.status-form { margin:0; }
.status { display:inline-flex; border:0; border-radius:999px; padding:7px 10px; font-size:.7rem; font-weight:700; }
select.status { appearance:auto; cursor:pointer; }
.status-new { color:#6d521b; background:#f1e4bc; }
.status-confirmed,.status-answered { color:#205a49; background:#cfe8df; }
.status-completed,.status-read { color:#40565a; background:#dce5e4; }
.status-cancelled { color:#7b3636; background:#f0d6d6; }
.message-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:0; }
.message-card { min-width:0; padding:24px 28px; border-bottom:1px solid var(--line); border-right:1px solid var(--line); }
.message-card.unread { background:rgba(185,229,222,.18); }
.message-card header,.message-card footer { display:flex; justify-content:space-between; gap:20px; }
.message-card header time { display:block; margin-top:4px; color:var(--muted); font-size:.7rem; }
.message-card > p { min-height:70px; margin:22px 0; color:#435155; line-height:1.65; }
.message-card footer { align-items:flex-end; }
.message-card footer > div { display:flex; flex-direction:column; gap:4px; font-size:.76rem; }
.message-card footer select { padding:7px; border:1px solid var(--line); border-radius:3px; background:white; font-size:.7rem; }
.empty { padding:35px 28px; color:var(--muted); }
.security-panel { padding-bottom:30px; }
.password-form { width:min(460px,calc(100% - 56px)); margin:28px; }
.service-editor-list { display:grid; }
.service-editor { display:grid; grid-template-columns:2fr .7fr .7fr; gap:16px; align-items:end; padding:24px 28px; border-bottom:1px solid var(--line); }
.service-editor label,.settings-form label { display:grid; gap:7px; color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.07em; font-weight:700; }
.service-editor .wide { min-width:0; }
.service-editor .description-field { grid-column:1 / 3; }
.service-editor input,.service-editor textarea,.settings-form input,.settings-form select { width:100%; padding:11px 12px; color:var(--ink); border:1px solid var(--line); border-radius:3px; background:rgba(255,255,255,.7); outline:0; text-transform:none; letter-spacing:0; font-weight:400; }
.service-editor textarea { resize:vertical; font:inherit; }
.service-editor input:focus,.service-editor textarea:focus,.settings-form input:focus,.settings-form select:focus { border-color:#397c7e; background:white; }
.service-editor .toggle { align-self:center; display:flex; flex-direction:row; align-items:center; gap:10px; color:var(--ink); text-transform:none; letter-spacing:0; }
.service-editor .toggle input { width:18px; height:18px; }
.service-editor button,.settings-form button { min-height:42px; padding:0 16px; border:0; border-radius:3px; color:white; background:var(--ink); font-weight:700; cursor:pointer; }
.settings-form { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; padding:28px; }
.settings-form button { align-self:end; }

@media (max-width:900px) {
  .login-shell { grid-template-columns:1fr; }
  .login-visual { min-height:360px; }
  .login-visual h1 { font-size:clamp(2.7rem,10vw,4.8rem); }
  .sidebar { position:static; width:100%; height:auto; padding:20px 24px; flex-direction:row; align-items:center; gap:24px; }
  .sidebar nav { margin:0 0 0 auto; flex-direction:row; }
  .sidebar form { display:none; }
  .dashboard { margin-left:0; }
  .message-grid { grid-template-columns:1fr; }
  .service-editor { grid-template-columns:1fr 1fr; }
  .service-editor .wide,.service-editor .description-field { grid-column:1 / -1; }
  .settings-form { grid-template-columns:1fr 1fr; }
}
@media (max-width:620px) {
  .login-visual { padding:28px 22px; }
  .login-panel { padding:48px 22px; }
  .sidebar nav { display:none; }
  .dashboard { padding:28px 16px 70px; }
  .dashboard-header { align-items:flex-start; flex-direction:column; gap:20px; }
  .stats { grid-template-columns:1fr; }
  .stats article { min-height:135px; }
  .panel-heading,.message-card { padding-left:18px; padding-right:18px; }
  .password-form { width:calc(100% - 36px); margin:18px; }
  .service-editor,.settings-form { grid-template-columns:1fr; padding:20px 18px; }
  .service-editor .wide,.service-editor .description-field { grid-column:1; }
}