@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Lora:ital,wght@0,400;0,500;0,600;1,400&family=Playfair+Display:wght@600;700&display=swap');

:root{
  --brand-teal:#20505f;
  --brand-terracotta:#a8594b;
  --brand-charcoal:#373534;
  --brand-taupe:#847362;
  --brand-sand:#d6d2c7;
  --bg:#faf7f2;
  --surface:#ffffff;
  --surface-soft:#f4efe8;
  --ink:#373534;
  --muted:#847362;
  --line:#e4ddd2;
  --line-strong:#cfc5b7;
  --accent:#a8594b;
  --accent-strong:#914b42;
  --teal-strong:#173f4a;
  --danger-bg:#fff1ef;
  --danger-line:#e4b8b0;
  --danger:#8f493f;
  --brand-shadow:0 18px 50px rgba(55,53,52,.08);
}

html{color-scheme:light}
body{font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:linear-gradient(180deg,#fff 0%,#faf7f2 52%,#f7f1e8 100%);color:var(--ink)}
body.centered{display:block;padding:0;background:#faf7f2}

.topbar{min-height:74px;background:rgba(255,255,255,.97);color:var(--brand-charcoal);border-bottom:1px solid #ebe4da;box-shadow:0 4px 18px rgba(55,53,52,.04);backdrop-filter:blur(10px)}
.brand-logo{display:block;width:162px;height:auto}
.brand-logo-link{display:inline-flex;align-items:center;border-radius:8px;overflow:hidden;flex:0 0 auto}
.topnav a{color:var(--brand-charcoal);font-weight:700;position:relative}
.topnav a:hover{background:#f8f3ec;color:var(--brand-charcoal)}
.topnav a.active{background:transparent;color:var(--brand-charcoal);border-radius:0}
.topnav a.active::after{content:"";position:absolute;left:12px;right:12px;bottom:-15px;height:3px;border-radius:999px;background:var(--brand-terracotta)}
.user,.link-button{color:var(--brand-charcoal)}

.container{width:min(1210px,calc(100% - 40px));margin:42px auto 64px}
.narrow{width:min(980px,calc(100% - 40px))}
.page-head{margin-bottom:28px}
.page-head h1,h1{font-family:"Playfair Display",Georgia,"Times New Roman",serif;color:var(--brand-charcoal);font-weight:700;letter-spacing:-.03em}
.page-head h1{font-size:clamp(38px,4.2vw,52px)}
.eyebrow{color:var(--brand-terracotta);font-family:"Inter",sans-serif;font-weight:800;letter-spacing:.12em}
.lead,.page-head p{font-family:"Lora",Georgia,serif;color:#75675c}

.primary{background:var(--brand-terracotta);color:#fff}
.primary:hover{background:var(--accent-strong)}
.secondary{background:#f1ece5;color:var(--brand-charcoal);border:1px solid #ebe3d8}
.secondary:hover{background:#e8e0d5}
.danger{color:#8f493f}

input,textarea,select{font-family:"Inter",sans-serif;background:#fff;border-color:#d9d0c4}
input:focus,textarea:focus,select:focus,.money-input:focus-within{border-color:var(--brand-teal);box-shadow:0 0 0 4px rgba(32,80,95,.10)}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline-color:rgba(168,89,75,.28)}

.page-actions{gap:10px}
.page-actions .button{padding-inline:18px}
.page-actions .primary{background:var(--brand-terracotta)}

.summary-card{display:inline-flex;align-items:center;gap:14px;margin-top:18px;padding:14px 18px;border:1px solid #e5ddd1;border-radius:14px;background:#fbf7f1;min-width:210px}
.summary-icon{width:38px;height:38px;border:1px solid #d9cfc2;border-radius:10px;display:grid;place-items:center;color:var(--brand-taupe);background:#fff}
.summary-icon svg{width:20px;height:20px}
.summary-copy{display:flex;flex-direction:column;line-height:1.2}
.summary-copy small{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--brand-taupe);font-weight:800}
.summary-copy strong{font-family:"Playfair Display",Georgia,serif;font-size:28px;color:var(--brand-charcoal)}
.summary-copy span{font-size:12px;color:var(--brand-taupe)}

.search{grid-template-columns:minmax(0,1fr) 56px;margin-top:24px}
.search input{min-height:52px;border-radius:12px;padding-inline:16px}
.search button{min-width:56px;width:56px;height:52px;padding:0;border-radius:12px;background:var(--brand-teal);color:#fff}
.search button:hover{background:var(--teal-strong)}
.search button svg{width:20px;height:20px}

.table-wrap{border-color:#e5ddd1;border-radius:15px;box-shadow:0 12px 34px rgba(55,53,52,.045);overflow:hidden}
th{background:#f6f1ea;color:#66584d;font-size:11px;letter-spacing:.08em}
tbody tr:hover{background:#fcfaf6}
.empty{padding:58px 20px}
.empty-state{display:flex;flex-direction:column;align-items:center;gap:7px;color:#756b62}
.empty-state svg{width:34px;height:34px;color:#b8ada1;margin-bottom:4px}
.empty-state strong{font-weight:500;color:#655c55}
.empty-state small{font-size:13px;color:#94877c}

.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(300px,38%) 1fr;background:linear-gradient(90deg,#f7f1e8 0%,#fff 52%,#faf7f2 100%)}
.auth-brand-panel{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:48px;border-right:1px solid #ebe2d7;position:relative;text-align:center}
.auth-brand-panel::after{content:"";width:52px;height:2px;background:var(--brand-terracotta);margin-top:28px}
.auth-brand-mark{width:min(300px,80%);height:auto;margin-bottom:34px}
.auth-brand-tagline{font-family:"Lora",Georgia,serif;font-size:18px;line-height:1.5;color:#4e4540;max-width:250px}
.auth-brand-footer{position:absolute;bottom:34px;width:min(330px,calc(100% - 64px));display:flex;flex-direction:column;align-items:center;gap:18px;font-size:12px;color:#8b7d72}
.auth-developed-by{width:100%;padding-top:16px;border-top:1px solid #dfd5c8;font-size:13px;color:#5c5149}
.auth-developed-by strong{color:var(--brand-terracotta);font-weight:800}
.auth-main{display:grid;place-items:center;padding:48px 28px}
.auth-card{width:min(430px,100%);padding:34px;border-radius:18px;border:1px solid #ebe3da;border-top:0;box-shadow:var(--brand-shadow)}
.auth-card::before{content:"";display:block;height:4px;background:var(--brand-terracotta);border-radius:18px 18px 0 0;margin:-34px -34px 30px}
.auth-card .auth-logo{display:none}
.auth-card h1{font-size:38px;margin-top:12px}
.auth-card .primary{background:var(--brand-teal)}
.auth-card .primary:hover{background:var(--teal-strong)}

.form-hero{display:flex;flex-direction:column;gap:7px;margin-bottom:26px}
.breadcrumb-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:4px}
.breadcrumb-row .back{margin:0}
.breadcrumb-row .eyebrow{display:inline-flex}
.form-workspace{display:grid;grid-template-columns:170px minmax(0,1fr);gap:26px;align-items:start}
.flow-steps{display:flex;flex-direction:column;gap:0;margin:0;position:sticky;top:98px}
.flow-step{position:relative;border:0;border-radius:0;background:transparent;padding:12px 10px 12px 34px;color:#8a7d72;font-size:12px}
.flow-step::before{content:"";position:absolute;left:8px;top:50%;transform:translateY(-50%);width:18px;height:18px;border:1px solid #cfc5b8;background:#fff}
.flow-step:not(:last-child)::after{content:"";position:absolute;left:17px;top:31px;width:1px;height:18px;background:#d9d0c4}
.flow-step.active{color:var(--brand-charcoal);font-weight:800}
.flow-step.active::before{background:var(--brand-terracotta);border-color:var(--brand-terracotta);box-shadow:inset 0 0 0 5px #fff}
.form-content{min-width:0}
.section-card{border-color:#e5ddd1;box-shadow:0 12px 34px rgba(55,53,52,.045);border-radius:16px}
.mic{background:var(--brand-terracotta);box-shadow:0 10px 24px rgba(168,89,75,.18)}
.mic:hover{background:#914b42}
.actions{border-top-color:#e8dfd4}

.badge.ok{background:#e7f0ec;color:#20505f}
.badge.off{background:#f6e9e6;color:#9b4f43}
.back{color:var(--brand-teal)}

.users-meta{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:8px 0 16px;color:var(--brand-taupe);font-size:13px}
.users-table td:last-child a{color:var(--brand-teal);text-decoration:none}
.users-table td:last-child a:hover{text-decoration:underline}

@media(max-width:900px){
  .auth-shell{grid-template-columns:1fr}
  .auth-brand-panel{display:none}
  .auth-main{min-height:100vh}
  .auth-card .auth-logo{display:block;width:min(240px,78%);height:auto;margin:0 auto 24px}
  .form-workspace{grid-template-columns:1fr}
  .flow-steps{position:static;flex-direction:row;overflow:auto;padding-bottom:4px}
  .flow-step{flex:0 0 auto;padding:8px 12px 8px 30px;border:1px solid #e2d8cb;border-radius:999px;background:#fff}
  .flow-step:not(:last-child)::after{display:none}
  .flow-step::before{left:9px;width:12px;height:12px}
}

@media(max-width:760px){
  .brand-logo{width:140px}
  .topbar{background:#fff}
  .container,.narrow{width:min(100% - 24px,1210px);margin:26px auto 46px}
  .page-head h1{font-size:40px}
  .summary-card{width:100%}
  .search{grid-template-columns:minmax(0,1fr) 52px}
}

@media(max-width:480px){
  .brand-logo{width:128px}
  .auth-main{padding:24px 14px}
  .auth-card{padding:24px}
  .auth-card::before{margin:-24px -24px 24px}
  .page-head h1,h1{font-size:34px}
  .form-hero{margin-bottom:18px}
}