:root{--primary:#7a0715;--gold:#c9ad72;--line:#dfcfb5;--card:#fffdf8;--page:#f7efe4;--muted:#75675f;--ink:#201416;--soft:#fff8ef}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(135deg,#fff8ef,#efe3d5);font-family:"Segoe UI",Tahoma,Arial,sans-serif;color:var(--ink)}
.portal{max-width:1100px;margin:auto;padding:28px}
.hero{display:flex;gap:24px;align-items:center;background:linear-gradient(135deg,#6d0613,#9e1931);color:#fff;border-radius:30px;padding:30px;margin-bottom:22px;box-shadow:0 20px 55px rgba(84,34,26,.20)}
.hero img{width:190px;background:#fff;border-radius:24px;padding:12px;box-shadow:0 10px 20px rgba(0,0,0,.12)}
.hero-kicker{display:inline-block;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);padding:6px 12px;border-radius:999px;font-size:13px;font-weight:800;margin-bottom:12px}
.hero h1{font-size:34px;margin:0 0 8px}
.hero p{margin:0;line-height:1.95;color:#fff5e7}
.hero-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.hero-tags span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.24);padding:8px 12px;border-radius:999px;font-size:13px;font-weight:700}
.card{background:var(--card);border:1px solid var(--line);border-radius:26px;padding:26px;box-shadow:0 18px 45px rgba(83,41,27,.11);margin-bottom:18px}
h2{color:var(--primary);font-size:28px;margin:0 0 10px}
h3{color:var(--primary);margin:0 0 10px}
.muted{color:var(--muted);line-height:1.8}
.small{font-size:14px}
.section-head,.dash-head,.section-line{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.secure-note{background:#fff7e8;border:1px solid #ead3a3;color:#6a4508;border-radius:16px;padding:12px 14px;font-size:13px;font-weight:800;max-width:250px}
.info-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}
.info-strip div{display:flex;gap:10px;align-items:center;background:#fffaf2;border:1px solid var(--line);border-radius:18px;padding:12px}
.info-strip b{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--primary);color:#fff}
.info-strip span{font-size:14px;font-weight:800;color:#5b4540}
label{display:block;font-weight:800;margin:0 0 14px}
input,select,textarea{width:100%;margin-top:6px;border:1px solid var(--line);border-radius:15px;padding:13px;background:#fff;font:inherit}
button,.btn{background:var(--primary);color:#fff;border:1px solid var(--primary);border-radius:16px;padding:12px 20px;font-weight:900;cursor:pointer;text-decoration:none;display:inline-block}
button.secondary,.btn.secondary{background:#fff;color:var(--primary)}
button.gold,.btn.gold{background:var(--gold);border-color:var(--gold);color:#351d05}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
.result{margin-top:14px;border-radius:18px;padding:14px;display:none;line-height:1.8}
.result.ok{display:block;background:#eaf7ef;color:#0d6b3d}
.result.bad{display:block;background:#fff0f1;color:#a11224}
.hidden{display:none!important}
.otp-area{background:#fffaf2;border:1px solid var(--line);border-radius:18px;padding:14px;margin-top:12px}
.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin:14px 0 18px}
.tab{background:#fff;color:var(--primary);border-bottom-left-radius:0;border-bottom-right-radius:0}
.tab.active{background:var(--primary);color:#fff}
.contracts-toolbar{display:grid;grid-template-columns:minmax(0,2fr) minmax(220px,1fr);gap:12px;align-items:end;background:#fffaf2;border:1px solid var(--line);border-radius:20px;padding:14px 16px;margin:14px 0 10px}
.search-grow{margin-bottom:0}
.contracts-count{margin-bottom:12px;font-weight:700}
.contracts-list{display:grid;grid-template-columns:repeat(2,minmax(260px,1fr));gap:14px}
.contract-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;line-height:1.8;box-shadow:0 8px 20px rgba(83,41,27,.06)}
.contract-card h4{margin:0 0 8px;color:var(--primary);font-size:19px}
.contract-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:8px}
.contract-summary{color:#6d5b55;font-size:14px}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;background:#f8f8f8;border:1px solid #ddd;color:#5b4a4a;font-weight:800;font-size:12px}
.badge.pending{background:#fff4df;color:#7a0715;border-color:#d9bd83}
.badge.signed{background:#eefaf1;color:#176334;border-color:#a9d8b8}
.badge.active{background:#eef5ff;color:#184f95;border-color:#bad0f2}
.contract-note{margin-top:10px;background:#fffaf2;border:1px solid var(--line);border-radius:14px;padding:10px 12px;color:#7a5d42;font-size:13px}
.contract-modal{position:fixed;inset:0;background:rgba(20,10,12,.45);display:flex;align-items:flex-start;justify-content:center;padding:24px;z-index:30;overflow:auto}
.modal-card{position:relative;background:#fff;border-radius:24px;border:1px solid var(--line);max-width:940px;width:100%;padding:24px;box-shadow:0 25px 70px rgba(0,0,0,.25)}
.close{position:absolute;left:16px;top:14px;border-radius:50%;width:42px;height:42px;padding:0;font-size:26px}
.contract-body{white-space:pre-wrap;line-height:1.95;border:1px solid var(--line);border-radius:18px;padding:16px;max-height:420px;overflow:auto;background:#fffdf8}
.meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}
.meta-grid div{border:1px solid var(--line);border-radius:14px;padding:9px;background:#fffaf2}
.modal-note{margin:14px 0;background:#f7f1e6;border:1px solid var(--line);border-right:4px solid var(--gold);border-radius:16px;padding:12px 14px;line-height:1.8;color:#5e4a3d}
.signature-box{border:1px dashed var(--gold);border-radius:20px;background:#fffdf8;padding:14px;margin-top:14px}
.signature-note{margin-bottom:12px;background:#fff7e7;border:1px solid #e6d1a5;border-radius:14px;padding:10px 12px;color:#6f4908;font-size:14px;line-height:1.8}
canvas{width:100%;height:190px;border:1px solid var(--line);border-radius:14px;background:#fff;touch-action:none;display:block}
@media(max-width:760px){
  .portal{padding:14px}
  .hero{flex-direction:column;text-align:center}
  .hero img{width:160px}
  .contracts-list,.info-strip,.contracts-toolbar{grid-template-columns:1fr}
  .section-head,.dash-head,.section-line,.contract-head{display:block}
  .meta-grid{grid-template-columns:1fr}
  .modal-card{padding:18px}
  .contract-modal{padding:10px}
  .secure-note{max-width:none;margin-top:10px}
}


.upload-panel{background:#fffaf2;border:1px solid var(--line);border-radius:20px;padding:16px;margin:16px 0}
.upload-title{color:var(--primary);font-weight:900;margin-bottom:6px}
.file-picker{display:inline-flex;align-items:center;gap:8px;border:1px dashed var(--gold);background:#fff;border-radius:16px;padding:12px 16px;cursor:pointer;color:var(--primary);font-weight:900}
.file-picker input{display:none}


.portal-requests-list{display:grid;grid-template-columns:1fr;gap:14px;margin-top:14px}
.portal-request-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;line-height:1.9;box-shadow:0 8px 20px rgba(83,41,27,.06)}
.portal-request-card h4{margin:0;color:var(--primary);font-size:19px}
.portal-request-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}
.portal-reply-box{margin-top:12px;background:#eefaf1;border:1px solid #a9d8b8;border-right:4px solid #2f8f50;border-radius:16px;padding:12px 14px;color:#174f2c}
.portal-waiting-box{margin-top:12px;background:#fff8e8;border:1px solid #e3c786;border-right:4px solid var(--gold);border-radius:16px;padding:12px 14px;color:#6f4908}
.portal-request-upload{margin-top:12px;background:#fffaf2;border:1px solid var(--line);border-radius:16px;padding:12px}
.portal-request-upload .file-picker{margin-top:8px}