:root{
  --ink:#10261F; --inksoft:#1B3A30; --paper:#F4F6F3; --white:#fff;
  --slate:#44514B; --slatelt:#6C7A72;
  --amber:#E8A33D; --amberdeep:#8A5A14; --amberbg:#FBF1DC;
  --risk:#C2452D; --riskbg:#FAE8E3;
  --ok:#2E7D5B; --okbg:#E4F1EA;
  --line:#DDE4DF; --radius:10px;
  --fd:"Bricolage Grotesque",system-ui,sans-serif;
  --fb:"Instrument Sans",system-ui,sans-serif;
  --fm:"IBM Plex Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--fb);background:var(--paper);color:var(--slate);font-size:15.5px;line-height:1.55;-webkit-font-smoothing:antialiased}
.wrap{max-width:1120px;margin:0 auto;padding:0 22px}
.mono{font-family:var(--fm)}
h1{font-family:var(--fd);color:var(--ink);font-size:26px;font-weight:600;letter-spacing:-.01em}
h2{font-family:var(--fd);color:var(--ink);font-size:17px;font-weight:600;margin:26px 0 10px}
.h-sub{font-size:12px;color:var(--slatelt);font-weight:400;margin-left:6px}
a{color:inherit}

/* topbar */
.topbar{background:var(--ink);color:#fff}
.topbar-in{display:flex;align-items:center;justify-content:space-between;height:54px}
.logo{display:flex;align-items:center;gap:8px;font-family:var(--fd);font-weight:700;font-size:18px;color:#fff;text-decoration:none}
.topnav{display:flex;align-items:center;gap:18px;font-size:14px}
.topnav a{color:#C9D4CE;text-decoration:none}
.topnav a:hover{color:#fff}
.who{font-size:12px;color:#8FA39A}
.signout{font-size:13px}

/* page head */
.page-head{display:flex;align-items:flex-end;justify-content:space-between;margin:26px 0 18px;gap:12px;flex-wrap:wrap}
.sub{font-size:13.5px;color:var(--slatelt);margin-top:3px}
.crumb{margin:18px 0 6px;font-size:13.5px}
.crumb a{color:var(--slatelt);text-decoration:none}
.crumb a:hover{color:var(--ink)}

/* buttons */
.btn{display:inline-block;border:1.5px solid var(--line);background:var(--white);color:var(--ink);font-family:var(--fb);font-weight:500;font-size:14px;padding:8px 14px;border-radius:var(--radius);cursor:pointer;text-decoration:none;transition:background .12s,border-color .12s}
.btn:hover{border-color:var(--ink)}
.btn-primary{background:var(--ink);border-color:var(--ink);color:#fff}
.btn-primary:hover{background:var(--inksoft)}
.btn-mini{font-size:12px;padding:4px 10px;margin-top:6px}
.btn:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--amber);outline-offset:2px}

/* KPIs */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:22px}
.kpi{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.k-label{font-size:12px;color:var(--slatelt)}
.k-num{font-family:var(--fd);font-size:24px;font-weight:600;color:var(--ink)}
.k-risk{color:var(--risk)}

/* panels & rows */
.panel{background:var(--white);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.panel.pad{padding:16px 18px}
.row{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line);font-size:14px;text-decoration:none;color:var(--slate)}
.row:last-child{border-bottom:none}
a.row:hover{background:var(--paper)}
.row-main{flex:1;min-width:0}
.row-2l{flex-direction:column;align-items:flex-start;gap:2px}
.row-2l .row-main{width:100%}
.row-sub{font-size:12.5px;color:var(--slatelt)}
.empty{padding:16px;font-size:13.5px;color:var(--slatelt)}
.when{font-size:12px;color:var(--slatelt);min-width:74px}

/* pills & dots */
.pill{font-size:11px;letter-spacing:.03em;padding:3px 10px;border-radius:99px;white-space:nowrap}
.pill-overdue,.pill-today{background:var(--riskbg);color:var(--risk)}
.pill-soon{background:var(--amberbg);color:var(--amberdeep)}
.pill-later{background:#E8EEF9;color:#2C5AA0}
.pill-ok{background:var(--okbg);color:var(--ok)}
.dot{width:10px;height:10px;border-radius:50%;flex:none}
.dot-red{background:var(--risk)}
.dot-amber{background:var(--amber)}
.dot-green{background:var(--ok)}

/* dashboard columns */
.cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cols-radar{grid-template-columns:1.35fr 1fr}
.cols section{min-width:0}

/* pipeline */
.pipeline{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-bottom:6px}
.deal{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:13px 15px;text-decoration:none;color:var(--slate);transition:border-color .12s}
.deal:hover{border-color:var(--ink)}
.deal-head{display:flex;justify-content:space-between;align-items:center}
.deal-addr{font-family:var(--fd);font-weight:600;font-size:14.5px;color:var(--ink)}
.deal-meta{font-size:12.5px;color:var(--slatelt);margin:3px 0 9px}
.bar{height:5px;background:var(--paper);border-radius:3px;overflow:hidden}
.bar-fill{height:100%;border-radius:3px}
.bar-red{background:var(--risk)}
.bar-amber{background:var(--amber)}
.bar-green{background:var(--ok)}
.deal-foot{font-size:10.5px;color:var(--slatelt);margin-top:8px}

/* commission chart */
.gchart{display:flex;align-items:flex-end;gap:16px;height:100px}
.gcol{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px}
.gbar{width:100%;max-width:90px;background:var(--amberbg);border-top:3px solid var(--amber);border-radius:4px 4px 0 0}
.glab{font-size:11px;color:var(--slatelt)}
.gnote{font-size:12.5px;color:var(--slatelt);margin-top:10px}

/* market */
.mkt{width:100%;font-size:13.5px;border-collapse:collapse}
.mkt td{padding:5px 0}
.mkt td:last-child{text-align:right}
.delta-ok{color:var(--ok);font-size:12px}
.delta-risk{color:var(--risk);font-size:12px}

/* deal header */
.deal-header{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:18px 22px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:8px}
.dh-title{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.dh-tags{font-size:11.5px;color:var(--slatelt);margin-top:8px}
.dh-right{display:flex;flex-direction:column;align-items:flex-end;justify-content:center}
.dh-comm{font-family:var(--fd);font-size:24px;font-weight:600;color:var(--ink)}
.dh-split{font-size:11px;color:var(--slatelt)}

/* timeline */
.tl-item{display:flex;gap:14px}
.tl-rail{display:flex;flex-direction:column;align-items:center}
.tl-dot{width:14px;height:14px;border-radius:50%;flex:none;margin-top:3px}
.tl-done{background:var(--ok)}
.tl-overdue,.tl-today{background:var(--risk);box-shadow:0 0 0 4px var(--riskbg)}
.tl-soon{background:var(--amber);box-shadow:0 0 0 4px var(--amberbg)}
.tl-later{background:var(--line)}
.tl-line{flex:1;width:2px;background:var(--line);margin:4px 0}
.tl-body{padding-bottom:18px;min-width:0}
.tl-name{font-weight:600;color:var(--ink);font-size:14.5px}
.tl-when{font-weight:400;font-size:12px}
.tl-when-done{color:var(--ok)}
.tl-when-overdue,.tl-when-today{color:var(--risk)}
.tl-when-soon{color:var(--amberdeep)}
.tl-when-later{color:var(--slatelt)}
.tl-sub{font-size:12.5px;color:var(--slatelt);margin-top:2px}

/* docs */
.doc-ico{width:20px;text-align:center;font-size:13px}
.doc-complete .doc-ico{color:var(--ok)}
.doc-complete .row-main{color:var(--slatelt)}
.doc-action .doc-ico{color:var(--risk);font-weight:600}
.doc-pending .doc-ico{color:var(--amberdeep)}
.doc-note{font-size:11px;color:var(--slatelt);white-space:nowrap}
.doc-action .doc-note{color:var(--risk)}
.doc-pending .doc-note{color:var(--amberdeep)}
.doc-row .btn-mini{margin-top:0}

/* parties */
.avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;flex:none}
.av-green{background:var(--okbg);color:var(--ok)}
.av-amber{background:var(--amberbg);color:var(--amberdeep)}
.av-red{background:var(--riskbg);color:var(--risk)}
.party-main{flex:1;min-width:0;display:flex;flex-direction:column}
.contact-when{font-size:11px;white-space:nowrap}
.contact-green{color:var(--ok)}
.contact-amber{color:var(--amberdeep)}
.contact-red{color:var(--risk)}
.party-row .btn-mini{margin-top:0}
.inline-form{display:inline}

/* note form */
.note-form{display:flex;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.note-form input{flex:1}

/* forms */
label{display:block;font-size:13px;font-weight:500;color:var(--ink);margin:0 0 4px}
input,select{width:100%;height:42px;padding:0 12px;border:1.5px solid var(--line);border-radius:var(--radius);font-family:var(--fb);font-size:14.5px;background:var(--white);color:var(--ink)}
input:focus,select:focus{outline:none;border-color:var(--ink)}
.stack{display:flex;flex-direction:column;gap:14px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid2.tight{gap:8px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.form-box{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:24px 26px;max-width:760px;margin-top:8px}
.form-box .sub{margin:6px 0 16px}

/* auth */
.auth-box{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:30px 32px;max-width:400px;margin:56px auto}
.auth-box h1{font-size:24px}
.auth-sub{font-size:14px;color:var(--slatelt);margin:4px 0 18px}
.auth-box label{margin-top:12px}
.auth-box button{margin-top:18px;width:100%;height:44px;border:none;border-radius:var(--radius);background:var(--ink);color:#fff;font-family:var(--fd);font-weight:600;font-size:15px;cursor:pointer}
.auth-box button:hover{background:var(--inksoft)}
.auth-fine{font-size:11px;color:var(--slatelt);margin-top:14px;line-height:1.5}
.alert{background:var(--riskbg);color:var(--risk);font-size:13.5px;padding:9px 12px;border-radius:var(--radius);margin-bottom:12px}

/* footer */
.foot{margin-top:40px;padding:18px 0;border-top:1px solid var(--line)}
.foot .wrap{font-size:11px;color:var(--slatelt)}

@media (max-width:860px){
  .cols,.cols-radar{grid-template-columns:1fr}
  .grid3,.grid4{grid-template-columns:1fr 1fr}
  .deal-header{flex-direction:column}
  .dh-right{align-items:flex-start}
}
@media (max-width:520px){
  .grid2,.grid3,.grid4{grid-template-columns:1fr}
  .doc-note{display:none}
}

/* ===== workspace (sidebar layout) ===== */
.ws{display:flex;gap:0;background:var(--white);border:1px solid var(--line);border-radius:14px;margin-top:20px;overflow:hidden;min-height:70vh}
.ws-side{width:230px;flex:none;background:var(--paper);border-right:1px solid var(--line);padding:10px 0;display:flex;flex-direction:column}
.side-head{font-size:10.5px;color:var(--slatelt);text-transform:uppercase;letter-spacing:.06em;padding:12px 16px 6px}
.side-item{display:flex;flex-direction:column;gap:1px;padding:9px 16px;text-decoration:none;color:var(--slate);border-left:3px solid transparent;transition:background .1s}
.side-item:hover{background:var(--white)}
.side-active{background:var(--white);border-left-color:var(--ink)}
.side-h-red{border-left-color:var(--risk)}
.side-h-red.side-active{border-left-color:var(--risk)}
.side-h-amber.side-active{border-left-color:var(--amber)}
.side-name{font-family:var(--fd);font-weight:600;font-size:13.5px;color:var(--ink);display:flex;align-items:center;gap:7px}
.side-sub{font-size:10.5px;color:var(--slatelt)}
.side-badge{font-family:var(--fm);font-size:10px;padding:0 6px;border-radius:99px;line-height:16px}
.side-badge-red{background:var(--riskbg);color:var(--risk)}
.side-badge-amber{background:var(--amberbg);color:var(--amberdeep)}
.side-badge-green{background:var(--okbg);color:var(--ok)}
.side-overview{padding-top:11px;padding-bottom:11px;border-bottom:1px solid var(--line)}
.side-new{margin:auto 16px 8px;padding-top:12px;font-size:12.5px;color:var(--slatelt);text-decoration:none;border-top:1px solid var(--line)}
.side-new:hover{color:var(--ink)}
.ws-main{flex:1;min-width:0;padding:20px 24px;overflow-x:hidden}
.ws-main h1{font-size:21px}
.ws-main h2{margin-top:20px}
.urgent-banner{background:var(--riskbg);color:var(--risk);font-size:13px;font-weight:600;padding:9px 14px;border-radius:10px;margin:12px 0 2px}
.tabs{display:flex;gap:4px;margin:14px 0 12px;border-bottom:1px solid var(--line)}
.tab{font-size:13px;font-weight:500;color:var(--slatelt);text-decoration:none;padding:7px 13px;border-radius:8px 8px 0 0;border-bottom:2px solid transparent;margin-bottom:-1px}
.tab:hover{color:var(--ink)}
.tab-active{color:var(--ink);border-bottom-color:var(--ink);font-weight:600}
@media (max-width:820px){
  .ws{flex-direction:column;min-height:0}
  .ws-side{width:100%;border-right:none;border-bottom:1px solid var(--line);flex-direction:row;overflow-x:auto;padding:0}
  .side-head,.side-new{display:none}
  .side-item{flex:none;border-left:none;border-bottom:3px solid transparent;padding:10px 14px}
  .side-active{border-bottom-color:var(--ink)}
  .side-h-red{border-bottom-color:var(--risk);border-left:none}
  .side-overview{border-bottom:3px solid transparent}
  .side-overview.side-active{border-bottom-color:var(--ink)}
}

/* ===== full-width layout ===== */
.wrap{max-width:none;padding:0 26px}
.ws{min-height:calc(100vh - 158px)}
.ws-side{width:250px}
.ws-main{padding:22px 28px}

/* overview 3-up */
.ov-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:18px;align-items:start}
.ov-grid h2{margin-top:20px}

/* deal grid with persistent right rail */
.deal-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start}
.deal-rail .rail-h{margin-top:0}
.deal-rail .panel{margin-bottom:16px}
.rail-party .btn-mini{padding:4px 9px}
.deal-rail + * .rail-h{margin-top:0}
.deal-grid .rail-h:first-child{margin-top:14px}
/* hide duplicate Log tab on wide screens where the rail shows it */
@media (min-width:1101px){
  .tab-log{display:none}
}
.rail-manage{font-size:11px;font-weight:500;color:var(--amberdeep);text-decoration:none;text-transform:none;letter-spacing:0;margin-left:auto;padding-left:8px}
.rail-manage:hover{text-decoration:underline}
@media (max-width:1100px){
  .deal-grid{grid-template-columns:1fr}
  .deal-rail{display:none}
}
@media (max-width:1100px) and (min-width:821px){
  .ov-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .ov-grid{grid-template-columns:1fr}
}

/* theme toggle */
.theme-btn{background:transparent;border:1.5px solid rgba(255,255,255,.28);border-radius:99px;width:34px;height:26px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.theme-btn:hover{border-color:#fff}
.theme-ico{width:12px;height:12px;border-radius:50%;background:#F4F6F3;box-shadow:-3px 0 0 0 var(--ink) inset}
[data-theme=dark] .theme-ico{box-shadow:none;background:var(--amber)}

/* ===== dark theme ===== */
[data-theme=dark]{
  --paper:#0E1512;
  --white:#161F1A;
  --ink:#E9F1EC;
  --inksoft:#D5E3DB;
  --slate:#B9C6BF;
  --slatelt:#71827A;
  --line:#25332C;
  --amberbg:#33270F;
  --riskbg:#361711;
  --okbg:#12291F;
  --risk:#E06A50;
  --ok:#59B98C;
  --amberdeep:#E8A33D;
}
[data-theme=dark] body{background:var(--paper)}
[data-theme=dark] .topbar{background:#0A100D;border-bottom:1px solid var(--line)}
[data-theme=dark] .btn-primary{background:var(--amber);border-color:var(--amber);color:#10261F}
[data-theme=dark] .btn-primary:hover{background:#F0B45C}
[data-theme=dark] .auth-box button{background:var(--amber);color:#10261F}
[data-theme=dark] .auth-box button:hover{background:#F0B45C}
[data-theme=dark] .btn{background:var(--white);color:var(--ink)}
[data-theme=dark] .btn:hover{border-color:var(--slatelt)}
[data-theme=dark] input,[data-theme=dark] select{background:#101915;color:var(--ink);border-color:var(--line)}
[data-theme=dark] input:focus,[data-theme=dark] select:focus{border-color:var(--slatelt)}
[data-theme=dark] .side-active{background:var(--white)}
[data-theme=dark] .side-item:hover{background:#131C17}
[data-theme=dark] .pill-later{background:#16273B;color:#7FA8DC}
[data-theme=dark] .hero-card,[data-theme=dark] .panel,[data-theme=dark] .kpi,[data-theme=dark] .deal,[data-theme=dark] .form-box,[data-theme=dark] .auth-box,[data-theme=dark] .deal-header{box-shadow:none}

/* ===== design polish: stat boxes, sections, borders ===== */

/* KPI cards: accent top edge, hover lift, tabular numbers */
.kpis{margin-bottom:8px}
.kpi{position:relative;border-radius:12px;padding:13px 15px 12px;border:1px solid var(--line);overflow:hidden;transition:transform .12s,box-shadow .12s,border-color .12s}
.kpi::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--line)}
.kpi-a::before{background:linear-gradient(90deg,var(--risk),transparent)}
.kpi-b::before{background:linear-gradient(90deg,var(--amber),transparent)}
.kpi-c::before{background:linear-gradient(90deg,var(--risk),transparent)}
.kpi-d::before{background:linear-gradient(90deg,var(--ok),transparent)}
.kpi-e::before,.kpi-f::before{background:linear-gradient(90deg,var(--amberdeep),transparent)}
.kpi:hover{transform:translateY(-1px);box-shadow:0 6px 18px -10px rgba(16,38,31,.35);border-color:var(--slatelt)}
.k-num{font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.k-of{font-size:13px;color:var(--slatelt);font-weight:400}
.k-sm{font-size:17px;line-height:1.55}
.kpis-deal{margin:12px 0 2px}
.kpis-deal .kpi{padding:10px 13px 9px}
.kpis-deal .k-num{font-size:19px}
.kpis-deal .kpi::before{background:var(--line)}

/* section headers: small amber tick, letterspaced */
.ws-main h2,.rail-h{display:flex;align-items:center;gap:8px;font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--slatelt);font-weight:600}
.ws-main h2::before,.rail-h::before{content:"";width:14px;height:3px;border-radius:2px;background:var(--amber);flex:none}
.ws-main h2 .h-sub{text-transform:none;letter-spacing:0}

/* panels: layered borders + soft depth */
.panel{border-radius:14px;box-shadow:0 1px 2px rgba(16,38,31,.04),0 8px 24px -20px rgba(16,38,31,.25)}
.panel .row{border-bottom-color:color-mix(in srgb, var(--line) 62%, transparent)}
a.row{transition:background .1s}
a.row:hover{background:color-mix(in srgb, var(--paper) 65%, var(--white))}
.panel .row:first-child{border-top-left-radius:14px;border-top-right-radius:14px}
.panel .row:last-child{border-bottom-left-radius:14px;border-bottom-right-radius:14px}

/* workspace frame: quieter outer border, sidebar hairline */
.ws{border-radius:16px;box-shadow:0 2px 4px rgba(16,38,31,.04),0 16px 40px -30px rgba(16,38,31,.3)}
.ws-side{background:linear-gradient(180deg,var(--paper),color-mix(in srgb, var(--paper) 85%, var(--white)))}
.side-item{border-radius:0 8px 8px 0;margin-right:8px}

/* urgent banner: left accent bar instead of full fill */
.urgent-banner{background:color-mix(in srgb, var(--riskbg) 70%, transparent);border-left:3px solid var(--risk);border-radius:8px}

/* tabs: pill style */
.tabs{border-bottom:none;gap:6px;background:color-mix(in srgb, var(--paper) 70%, var(--white));padding:4px;border-radius:10px;width:fit-content}
.tab{border-radius:7px;border-bottom:none;margin-bottom:0;padding:6px 14px}
.tab-active{background:var(--white);box-shadow:0 1px 3px rgba(16,38,31,.12)}

/* dark-theme adjustments for the polish layer */
[data-theme=dark] .kpi:hover{box-shadow:0 6px 18px -10px rgba(0,0,0,.6)}
[data-theme=dark] .panel{box-shadow:none}
[data-theme=dark] a.row:hover{background:#1B2620}
[data-theme=dark] .ws{box-shadow:none}
[data-theme=dark] .ws-side{background:linear-gradient(180deg,#0E1512,#121B16)}
[data-theme=dark] .tabs{background:#101915}
[data-theme=dark] .tab-active{background:#1D2822;box-shadow:none}
[data-theme=dark] .urgent-banner{background:rgba(224,106,80,.12)}

/* ===== photos & attachments ===== */

/* flash */
.flash{background:var(--amberbg);color:var(--amberdeep);font-size:13px;padding:8px 13px;border-radius:9px;margin:8px 0;border-left:3px solid var(--amber)}

/* sidebar thumbnails */
.side-name{gap:9px}
.side-thumb{width:30px;height:30px;border-radius:7px;object-fit:cover;flex:none;background:var(--paper);border:1px solid var(--line)}
.side-thumb-empty{display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--slatelt)}
.side-item .side-sub{padding-left:39px}

/* property photo strip */
.photo-strip{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0 2px;align-items:stretch}
.photo-card{position:relative;width:132px;height:92px;border-radius:11px;overflow:hidden;border:1px solid var(--line);background:var(--paper)}
.photo-card img{width:100%;height:100%;object-fit:cover;display:block}
.photo-main{border:2px solid var(--amber)}
.photo-acts{position:absolute;top:5px;right:5px;display:flex;gap:4px;opacity:0;transition:opacity .12s}
.photo-card:hover .photo-acts{opacity:1}
.photo-btn{width:22px;height:22px;border:none;border-radius:6px;background:rgba(16,38,31,.72);color:#fff;font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;padding:0}
.photo-btn:hover{background:rgba(16,38,31,.92)}
.photo-star{background:var(--amber);color:#10261F;opacity:1}
.photo-main .photo-acts{opacity:1}
.photo-main .photo-acts .photo-btn:not(.photo-star){opacity:0}
.photo-main:hover .photo-acts .photo-btn{opacity:1}
.photo-add{display:flex}
.photo-add-label{width:132px;height:92px;border:1.5px dashed var(--line);border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--slatelt);cursor:pointer;transition:border-color .12s,color .12s}
.photo-add-label:hover{border-color:var(--amber);color:var(--amberdeep)}
.photo-add-label input{display:none}

/* step files + actions */
.tl-acts{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.step-attach{cursor:pointer;position:relative}
.step-attach input{display:none}
.step-files{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.step-file{position:relative;display:flex;align-items:center}
.step-file>a{display:flex;align-items:center;gap:7px;padding:4px 8px 4px 4px;border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--slate);background:var(--paper);max-width:200px}
.step-file>a:hover{border-color:var(--slatelt)}
.step-file img{width:34px;height:34px;border-radius:6px;object-fit:cover;flex:none}
.step-file-pdf{width:34px;height:34px;border-radius:6px;background:var(--riskbg);color:var(--risk);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;flex:none}
.step-file-name{font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.step-file-x{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border:none;border-radius:50%;background:var(--ink);color:#fff;font-size:12px;line-height:1;cursor:pointer;display:none;align-items:center;justify-content:center;padding:0}
.step-file:hover .step-file-x{display:flex}

/* dark tweaks */
[data-theme=dark] .photo-btn{background:rgba(0,0,0,.7)}
[data-theme=dark] .step-file-pdf{background:#361711;color:var(--risk)}

/* ===== edit / danger zone ===== */
.edit-note{font-size:11.5px;color:var(--slatelt);margin:2px 0}
.danger-zone{margin-top:16px;border:1px solid var(--risk);background:color-mix(in srgb, var(--riskbg) 40%, transparent)}
.dz-title{font-family:var(--fd);font-size:15px;color:var(--risk);margin:0 0 6px}
.dz-text{font-size:13px;color:var(--slate);margin:0 0 12px}
.dz-form label{font-size:12.5px}
.dz-row{display:flex;gap:10px;max-width:420px}
.dz-row input{flex:1}
.btn-danger{background:var(--risk);border-color:var(--risk);color:#fff;white-space:nowrap}
.btn-danger:hover{background:#a5381f;border-color:#a5381f}
/* on edit tab the grid has no rail — go full width */
.deal-grid:has(.danger-zone){grid-template-columns:1fr}
[data-theme=dark] .danger-zone{background:rgba(224,106,80,.08)}
[data-theme=dark] .btn-danger{color:#fff}

/* ===== party CRUD ===== */
.party-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.btn-x{padding:4px 9px;color:var(--risk)}
.btn-x:hover{border-color:var(--risk);background:var(--riskbg)}
.party-form{width:100%}
.pf-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.pf-grid input{height:38px}
.pf-acts{display:flex;gap:8px;margin-top:10px;align-items:center}
.pf-acts .btn{height:auto}
.party-edit{display:block;padding:12px 14px;background:color-mix(in srgb, var(--paper) 55%, var(--white))}
[data-theme=dark] .party-edit{background:#131C17}
@media (max-width:900px){.pf-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pf-grid{grid-template-columns:1fr}}
