:root{
  --bg:#fff7f1;
  --bg-soft:#fffdfb;
  --panel:#fff;
  --panel-tint:#fff1e8;
  --line:#ead7ca;
  --ink:#3b3440;
  --ink-soft:#746970;
  --primary:#b66f4d;
  --primary-dark:#985a3e;
  --gold:#cfb477;
  --gold-soft:#f6e7d5;
  --green:#72885e;
  --red:#b85c55;
  --shadow:0 18px 48px rgba(135,88,67,.10);
  --shadow-soft:0 10px 24px rgba(135,88,67,.08);
  --radius:26px;
  --container:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
[hidden]{display:none!important}
body{
  margin:0;
  min-height:100vh;
  background:linear-gradient(180deg,#fff8f3 0%,#fff3ec 100%);
  color:var(--ink);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.56;
  font-size:16px;
}
a{text-decoration:none;color:inherit}
button,input,select{font:inherit}
button{cursor:pointer}
img,svg{display:block;max-width:100%}
.topbar{
  position:sticky;
  top:0;
  z-index:30;
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:14px max(20px,calc((100vw - var(--container))/2));
  background:rgba(255,247,241,.9);
  border-bottom:1px solid rgba(234,215,202,.9);
  backdrop-filter:blur(16px);
}
.logo{display:flex;align-items:center;gap:14px;min-width:0}
.logo__mark{
  width:52px;
  height:52px;
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#fff0e7);
  display:grid;
  place-items:center;
  box-shadow:var(--shadow-soft);
  border:1px solid var(--line);
  flex:0 0 auto;
}
.logo__mark svg{width:28px;height:28px;fill:none;stroke:var(--primary);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.logo__text strong{display:block;font-size:16px;line-height:1.1;letter-spacing:0}
.logo__text small{display:block;font-size:14px;color:var(--ink-soft);margin-top:2px}
.topnav{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.topnav a{
  padding:10px 14px;
  border-radius:999px;
  color:var(--ink-soft);
  font-weight:700;
  transition:.2s;
}
.topnav a:hover{background:#fff0e8;color:var(--ink)}
.topnav__home{background:var(--primary);color:#fff!important;box-shadow:var(--shadow-soft)}
.workspace{
  width:min(calc(100% - 40px),var(--container));
  margin:0 auto;
  min-height:calc(100vh - 82px);
  display:grid;
  grid-template-columns:1fr minmax(320px,430px);
  gap:42px;
  align-items:center;
  padding:54px 0;
}
.login-copy h1,.hero-panel h1{
  margin:0 0 18px;
  font-size:42px;
  line-height:1.08;
  letter-spacing:0;
  color:#2d3448;
}
.login-copy p,.hero-panel p,.form-head p,.statement-preview p{color:var(--ink-soft);margin:0}
.eyebrow{
  margin:0 0 12px;
  color:#9a7664;
  font-size:14px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.login-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:28px;
}
.login-stats span,.status-pill{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow-soft);
  border-radius:22px;
  padding:16px;
  color:var(--ink-soft);
}
.login-stats strong{display:block;color:var(--primary);font-size:24px;line-height:1}
.login-card,.panel,.hero-panel,.sidebar{
  background:var(--panel);
  border:1px solid var(--line);
  box-shadow:var(--shadow-soft);
  border-radius:var(--radius);
}
.login-card{padding:30px}
.form-head{margin-bottom:22px}
.form-head h2,.panel h2{
  margin:0 0 8px;
  font-size:22px;
  line-height:1.15;
  letter-spacing:0;
}
label{display:grid;gap:8px;margin-bottom:14px}
label>span{
  font-size:14px;
  font-weight:800;
  color:#6a5d62;
}
input,select{
  width:100%;
  padding:14px 15px;
  border-radius:16px;
  border:1px solid var(--line);
  background:#fffdfb;
  color:var(--ink);
  outline:none;
  transition:.2s;
}
input:focus,select:focus{
  border-color:#ddb59d;
  box-shadow:0 0 0 4px rgba(182,111,77,.12);
  background:#fff;
}
.check-row{
  grid-template-columns:20px 1fr;
  gap:11px;
  align-items:start;
  margin:18px 0;
}
.check-row input{width:18px;height:18px;margin:3px 0 0;accent-color:var(--primary)}
.check-row span{font-size:14px!important;font-weight:600!important;color:var(--ink-soft)!important}
.telegram-login-box{
  display:grid;
  place-items:center;
  min-height:74px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fffdfb;
  margin-bottom:12px;
}
.telegram-login-box__placeholder{
  color:var(--ink-soft);
  font-size:14px;
  font-weight:800;
  text-align:center;
}
.telegram-login-box__placeholder--wide{
  display:grid;
  gap:12px;
  max-width:430px;
  font-weight:700;
}
.telegram-login-box__title{
  display:block;
  color:var(--ink);
  font-size:20px;
}
.telegram-login-box__actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin-top:4px;
}
.demo-login{
  margin-top:18px;
  padding-top:18px;
  border-top:1px solid var(--line);
}
.form__note{
  margin:0;
  color:var(--ink-soft);
  font-size:13px;
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:48px;
  padding:13px 20px;
  border-radius:18px;
  font-weight:800;
  letter-spacing:0;
  border:none;
  transition:.2s;
}
.button--primary{background:var(--primary);color:#fff;box-shadow:0 14px 30px rgba(182,111,77,.24)}
.button--primary:hover{background:var(--primary-dark);transform:translateY(-1px)}
.button--secondary{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft);color:var(--ink)}
.button--secondary:hover{background:#fff5ef;transform:translateY(-1px)}
.button--small{min-height:40px;padding:9px 14px;border-radius:14px;font-size:14px}
.dashboard{
  width:min(calc(100% - 40px),var(--container));
  margin:0 auto;
  display:grid;
  grid-template-columns:286px minmax(0,1fr);
  gap:22px;
  padding:26px 0 70px;
}
.sidebar{
  position:sticky;
  top:104px;
  align-self:start;
  padding:20px;
}
.person-card{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.person-card__avatar{
  width:48px;
  height:48px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:var(--gold-soft);
  color:var(--primary);
  font-weight:900;
}
.person-card span,.progress-box span,.step-list small{display:block;color:var(--ink-soft);font-size:13px}
.person-card strong{display:block;font-size:15px;line-height:1.2}
.progress-box{
  padding:16px;
  border-radius:22px;
  background:linear-gradient(180deg,#fff8f4 0%,#fff 100%);
  border:1px solid var(--line);
  margin-bottom:18px;
}
.status-box{
  display:grid;
  gap:4px;
  padding:16px;
  border-radius:22px;
  background:#fffdfb;
  border:1px solid var(--line);
  margin-bottom:18px;
}
.status-box span,.status-box small{color:var(--ink-soft);font-size:13px}
.status-box strong{font-size:18px;line-height:1.15;color:var(--primary-dark)}
.progress-box__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.progress-track{height:10px;border-radius:999px;background:#f1dfd4;overflow:hidden}
.progress-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--primary),var(--gold));transition:.35s}
.step-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.step-list li{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:12px;
  align-items:center;
  padding:12px;
  border-radius:18px;
  border:1px solid transparent;
}
.step-list li span{
  width:38px;
  height:38px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:#fff2ea;
  color:var(--primary);
  font-weight:900;
}
.step-list li.is-active,.step-list li.is-done{border-color:var(--line);background:#fff8f4}
.step-list li.is-done span{background:#eef4e8;color:var(--green)}
.dashboard-main{display:grid;gap:20px}
.hero-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(220px,280px) auto;
  gap:20px;
  align-items:end;
  padding:26px;
  background:linear-gradient(180deg,#fff 0%,#fff8f4 100%);
}
.hero-panel h1{font-size:34px;max-width:16ch}
.hero-status{
  display:grid;
  gap:6px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fffdfb;
}
.hero-status span,.hero-status small{color:var(--ink-soft);font-size:13px;font-weight:800}
.hero-status strong{font-size:18px;line-height:1.2;color:var(--ink)}
.hero-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap}
.readiness-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.stage-card{
  display:grid;
  gap:9px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadow-soft);
  min-height:148px;
}
.stage-card.is-active{border-color:#ddb59d;background:#fff7f1}
.stage-card.is-done{background:#f8fbf5;border-color:#dce9d1}
.stage-card__head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.stage-card__head strong{font-size:15px}
.stage-card__head span{color:var(--primary);font-weight:900;font-size:14px}
.stage-card small{color:var(--ink-soft);font-size:13px;line-height:1.3}
.stage-card em{font-style:normal;color:#9a7664;font-size:13px;font-weight:900}
.mini-track{height:8px;border-radius:999px;background:#f1dfd4;overflow:hidden}
.mini-track span{display:block;height:100%;background:linear-gradient(90deg,var(--primary),var(--gold))}
.grid{display:grid;gap:20px}
.grid--two{grid-template-columns:1fr 1fr}
.panel{padding:24px}
.panel__head{
  display:flex;
  align-items:start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}
.panel__head .eyebrow{margin-bottom:6px}
.status-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:max-content;
  padding:8px 12px;
  border-radius:999px;
  font-size:13px;
  font-weight:800;
  color:#7c5d4e;
}
.upload-list{display:grid;gap:12px}
.upload-group{
  display:grid;
  gap:12px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(180deg,#fffdfb 0%,#fff8f4 100%);
}
.upload-group__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.upload-group__head h3{margin:0;font-size:16px;line-height:1.2}
.upload-group__head span{
  min-width:max-content;
  padding:6px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--line);
  color:#9a7664;
  font-size:13px;
  font-weight:800;
}
.upload-group__items{display:grid;gap:10px}
.upload-item{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:12px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fffdfb;
}
.upload-item__icon{
  width:42px;
  height:42px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:var(--gold-soft);
  color:var(--primary);
  font-weight:900;
}
.upload-item h3{margin:0 0 3px;font-size:16px;line-height:1.2}
.upload-item p{margin:0 0 10px;color:var(--ink-soft);font-size:14px}
.upload-item input{padding:12px;background:#fff}
.upload-state{display:inline-flex;margin-top:10px;font-size:13px;font-weight:800;color:#9a7664}
.upload-state.is-ready{color:var(--green)}
.quality-pill{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  margin-top:8px;
  padding:5px 9px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  color:#7c5d4e;
  font-size:12px;
  font-weight:900;
}
.quality-pill.is-ok{color:var(--green);border-color:#dce9d1;background:#f8fbf5}
.quality-pill.is-warning{color:#9a6b18;border-color:#ead8a8;background:#fff8dc}
.quality-pill.is-error{color:var(--red);border-color:#f0c6c2;background:#fff1ef}
.quality-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.quality-list li{
  display:grid;
  gap:3px;
  padding:14px;
  border-radius:18px;
  background:#fff8f4;
  border:1px solid var(--line);
}
.quality-list strong{font-size:15px}
.quality-list span{color:var(--ink-soft);font-size:14px}
.profile-form{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.profile-form label{margin:0}
.field-source{
  display:flex;
  gap:8px;
  align-items:center;
  min-height:22px;
  color:#9a7664;
  font-size:12px;
  font-weight:800;
}
.ocr-review{display:grid;gap:16px}
.ocr-review__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.ocr-review__grid label{margin:0}
.ocr-review__actions{
  display:flex;
  justify-content:flex-end;
}
.validation-list{display:grid;gap:10px}
.validation-row{
  display:grid;
  gap:4px;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fffdfb;
}
.validation-row strong{font-size:15px}
.validation-row span{color:var(--ink-soft);font-size:14px}
.validation-row.is-danger{border-color:#f0c6c2;background:#fff1ef}
.validation-row.is-warning{border-color:#ead8a8;background:#fff8dc}
.validation-row.is-ok{border-color:#dce9d1;background:#f8fbf5}
.creditor-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.creditor-form label{margin:0}
.creditor-form label:nth-child(3),.creditor-form button{grid-column:1/-1}
.statement-preview{
  background:linear-gradient(180deg,#fff 0%,#fff8f4 100%);
}
#statement-output{
  min-height:208px;
  padding:18px;
  border-radius:20px;
  background:#fffdfb;
  border:1px solid var(--line);
}
.statement-lines{display:grid;gap:10px}
.statement-lines p{margin:0;color:var(--ink)}
.text-download{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:10px 14px;
  border-radius:14px;
  background:var(--primary);
  color:#fff;
  font-weight:800;
}
.event-log{
  max-height:360px;
  overflow:auto;
  display:grid;
  gap:10px;
  padding-right:4px;
}
.event-item{
  display:grid;
  grid-template-columns:112px 1fr;
  gap:12px;
  padding:12px 14px;
  border-radius:18px;
  background:#fffdfb;
  border:1px solid var(--line);
}
.event-item time{color:#9a7664;font-size:13px;font-weight:800}
.event-item strong{display:block;font-size:14px;line-height:1.25}
.event-item span{display:block;color:var(--ink-soft);font-size:13px;margin-top:2px}
.event-item small{display:block;color:#9a7664;font-size:12px;font-weight:800;margin-top:4px}
.event-item.is-warning{background:#fff8dc;border-color:#ead8a8}
.toast{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:50;
  max-width:360px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid var(--line);
  background:#fff;
  box-shadow:var(--shadow);
  color:var(--ink);
  font-weight:800;
  transform:translateY(20px);
  opacity:0;
  pointer-events:none;
  transition:.25s;
}
.toast.is-visible{transform:translateY(0);opacity:1}
@media(max-width:1080px){
  .workspace,.dashboard{grid-template-columns:1fr}
  .sidebar{position:static}
  .hero-panel{grid-template-columns:1fr}
  .hero-actions{justify-content:flex-start}
  .readiness-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  .topbar{align-items:flex-start;flex-direction:column;padding:12px 14px}
  .topnav{width:100%;overflow:auto;flex-wrap:nowrap;padding-bottom:2px}
  .workspace,.dashboard{width:min(calc(100% - 28px),var(--container))}
  .workspace{padding:34px 0}
  .login-copy h1{font-size:32px}
  .hero-panel h1{font-size:30px;max-width:none}
  .login-stats,.grid--two,.profile-form,.creditor-form,.readiness-grid{grid-template-columns:1fr}
  .ocr-review__grid{grid-template-columns:1fr}
  .creditor-form label:nth-child(3),.creditor-form button{grid-column:auto}
  .panel__head{align-items:flex-start;flex-direction:column}
  .event-item{grid-template-columns:1fr}
}
