
:root{
  color-scheme:light;
  --ink:#1B1A17; --ink-2:#3A3732; --muted:#8B8478; --faint:#B5AEA2;
  --panel:#FDFCFA; --panel-2:#F6F3EE; --line:#ECE7DE; --line-2:#E2DCD1;
  --side:rgba(241,235,226,.78); --side-solid:#EFE9DF; --side-hi:#FFFFFF;
  --black:#141311; --on-black:#FFFFFF;
  --lime:#A6EC2E; --lime-ink:#1B2A05; --lime-soft:#EDF9D8; --lime-text:#43700F;
  --amber:#B0721A; --amber-soft:#FBF0D8; --red:#B3452F; --red-soft:#F9E3DD;
  --gold-1:#FFF6DA; --gold-2:#F8DD8C; --gold-3:#F3C955;
  --shadow:0 30px 80px -30px rgba(60,40,20,.45),0 2px 6px rgba(60,40,20,.08);
  --card-shadow:0 1px 2px rgba(40,30,20,.04),0 8px 24px -16px rgba(40,30,20,.18);
  --serif:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:"Geist","Helvetica Neue",Arial,sans-serif;
  --mono:"Geist Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{
  font-family:var(--sans);font-size:14.5px;line-height:1.5;color:var(--ink);-webkit-font-smoothing:antialiased;
  padding-inline:16px;padding-block:28px 40px;
  background-color:#B98A5E;
  background-image:
    radial-gradient(110% 38% at 18% 104%, rgba(92,62,40,.85) 0%, transparent 62%),
    radial-gradient(80% 30% at 88% 100%, rgba(150,106,70,.8) 0%, transparent 70%),
    radial-gradient(60% 22% at 55% 72%, rgba(255,214,130,.55) 0%, transparent 70%),
    linear-gradient(180deg,#7B7784 0%,#9E9498 16%,#C4A58C 32%,#E6B46A 46%,#F2C46B 52%,#D9A468 57%,#BE8D5E 66%,#A1744D 80%,#6E4C34 100%);
  background-attachment:fixed;
}
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance}
p{margin:0}
button,input,textarea,select{font:inherit;color:inherit}
a{color:inherit}
:focus-visible{outline:2px solid var(--black);outline-offset:2px}
.serif{font-family:var(--serif)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.label{font-size:12px;color:var(--muted);font-weight:500}

/* ---------- app shell ---------- */
.app{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:268px minmax(0,1fr);background:var(--side);backdrop-filter:blur(24px) saturate(1.1);-webkit-backdrop-filter:blur(24px) saturate(1.1);border:1px solid rgba(255,255,255,.55);border-radius:34px;box-shadow:var(--shadow);min-height:calc(100vh - 68px)}
.side{padding:26px 14px 16px 18px;display:flex;flex-direction:column;gap:6px;position:sticky;top:0;align-self:start;max-height:calc(100vh - 56px);overflow:auto}
.brand{display:flex;align-items:center;gap:10px;padding:6px 10px 22px;border-bottom:1px solid rgba(0,0,0,.06);margin-bottom:10px}
.brand-mark{width:30px;height:30px;flex:none}
.brand-name{font-weight:600;font-size:19px;letter-spacing:-.02em;line-height:1.1}
.nav-group{display:grid;gap:2px;padding-block:8px 6px}
.nav-group + .nav-group{border-top:1px solid rgba(0,0,0,.06)}
.nav-title{font-size:12px;color:var(--muted);padding:4px 12px 6px}
.nav-item{display:flex;align-items:center;gap:12px;width:100%;padding:9px 12px;border-radius:14px;border:0;background:none;text-align:left;cursor:pointer;font-size:14.5px;color:var(--ink-2)}
.nav-item{text-decoration:none}
.nav-item:hover{background:rgba(255,255,255,.5)}
.nav-item.active{background:var(--side-hi);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.05),0 6px 16px -10px rgba(60,40,20,.3)}
.nav-item[disabled]{cursor:default;color:var(--faint)}
.nav-item[disabled]:hover{background:none}
.nav-item svg{width:18px;height:18px;flex:none}
.nav-item .grow{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-num{font-family:var(--mono);font-size:11.5px;width:26px;height:26px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.6);color:var(--muted);flex:none}
.nav-item.done .nav-num{background:var(--lime);color:var(--lime-ink)}
.nav-item.now .nav-num{background:var(--black);color:var(--on-black)}
.badge{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--black);color:var(--on-black);font-size:11px;font-weight:600;display:grid;place-items:center}
.me{margin-top:auto;display:flex;align-items:center;gap:10px;padding:10px;border-radius:18px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.7)}
.avatar{width:38px;height:38px;border-radius:12px;background:var(--black);color:var(--on-black);display:grid;place-items:center;font-weight:600;font-size:14px;flex:none}
.me .who{min-width:0;line-height:1.3}
.me .who b{font-weight:500;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me .who span{font-size:12.5px;color:var(--muted);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.panel-main{margin:10px;background:var(--panel);border-radius:26px;padding:22px 30px 40px;min-width:0;box-shadow:0 1px 0 rgba(255,255,255,.8) inset}
.topline{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:26px}
.search{position:relative;flex:1;max-width:560px;min-width:220px}
.search-box{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:6px 6px 6px 16px;box-shadow:0 2px 10px -6px rgba(60,40,20,.25)}
.search-box svg{width:18px;height:18px;flex:none}
.search-box input{border:0;background:none;outline:none;flex:1;min-width:0;padding:6px 0;font-size:14.5px}
.search-box input::placeholder{color:var(--muted)}
.kbd{font-size:12px;background:var(--panel-2);border:1px solid var(--line);padding:5px 10px;border-radius:999px;color:var(--ink-2);white-space:nowrap}
.results{position:absolute;left:0;right:0;top:calc(100% + 6px);background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--card-shadow);padding:6px;z-index:20;display:grid}
.results button{display:flex;gap:10px;align-items:center;border:0;background:none;text-align:left;padding:9px 12px;border-radius:12px;cursor:pointer}
.results button:hover,.results button.hl{background:var(--panel-2)}
.top-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.btn.menu-btn{display:none}

/* ---------- common ---------- */
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.page-title{font-family:var(--serif);font-size:clamp(30px,3.4vw,40px);line-height:1.08;letter-spacing:-.01em}
.page-sub{font-size:16px;color:var(--ink-2);margin-top:6px}
.crumbs{display:flex;gap:8px;align-items:center;font-size:13px;color:var(--muted);margin-bottom:14px;flex-wrap:wrap}
.crumbs button{border:0;background:none;padding:0;color:var(--muted);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:20px 22px;box-shadow:var(--card-shadow)}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.card-head h2{font-family:var(--serif);font-size:23px;display:flex;align-items:center;gap:10px}
.icon-chip{width:32px;height:32px;border-radius:10px;background:var(--panel-2);display:grid;place-items:center;flex:none}
.icon-chip svg{width:16px;height:16px}
.stack{display:grid;gap:18px}
.lead{max-width:66ch;color:var(--ink-2);font-size:15.5px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line-2);background:var(--panel);border-radius:999px;padding:9px 18px;font-size:14px;font-weight:500;cursor:pointer;transition:transform .12s,background .15s,border-color .15s;white-space:nowrap}
.btn:hover{border-color:var(--faint)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.4;cursor:not-allowed;transform:none}
.btn.primary{background:var(--black);border-color:var(--black);color:var(--on-black)}
.btn.good{background:var(--lime);border-color:var(--lime);color:var(--lime-ink)}
.btn.sm{padding:6px 13px;font-size:13px}
.btn.ghost{background:transparent;border-color:transparent}
.btn.ghost:hover{background:var(--panel-2)}
.btn.danger{color:var(--red)}
.btn svg{width:16px;height:16px}
.linkbtn{background:none;border:0;padding:0;cursor:pointer;font-size:13px;font-weight:500;text-decoration:underline;text-underline-offset:3px;color:var(--ink-2)}

.chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 11px;font-size:12.5px;font-weight:500;white-space:nowrap}
.chip.done{background:var(--lime-soft);color:var(--lime-text)}
.chip.now{background:var(--black);color:var(--on-black)}
.chip.warn{background:var(--amber-soft);color:var(--amber)}
.chip.off{background:var(--panel-2);color:var(--muted)}
.chip .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.chip svg{width:13px;height:13px}

.tile{width:46px;height:46px;border-radius:14px;background:linear-gradient(160deg,#3B3935,#141311);color:#F4EFE6;display:grid;place-items:center;flex:none;box-shadow:0 6px 14px -8px rgba(0,0,0,.6)}
.tile svg{width:22px;height:22px}
.tile.lg{width:60px;height:60px;border-radius:18px}
.tile.lg svg{width:28px;height:28px}
.tile.off{background:var(--panel-2);color:var(--faint);box-shadow:none}
.mark{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;flex:none;background:var(--black);color:#fff}
.mark svg{width:13px;height:13px}
.mark.done{background:var(--lime);color:var(--lime-ink)}
.mark.off{background:var(--panel-2);color:var(--faint)}

/* ---------- overview ---------- */
.ov-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:18px;margin-bottom:18px}
.hero{position:relative;overflow:hidden;border-radius:28px;padding:22px 26px 26px;min-height:340px;display:flex;flex-direction:column;
  background:
    radial-gradient(60% 70% at 95% 10%, rgba(255,255,255,.85) 0%, transparent 60%),
    radial-gradient(90% 120% at 110% 60%, var(--gold-3) 0%, transparent 55%),
    radial-gradient(70% 90% at 70% 120%, var(--gold-2) 0%, transparent 60%),
    linear-gradient(135deg,#F6EFE2 0%,#F7E6B8 42%,var(--gold-2) 70%,var(--gold-1) 100%);
  border:1px solid rgba(255,255,255,.7);box-shadow:var(--card-shadow)}
.hero::before,.hero::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.hero::before{width:620px;height:620px;right:-300px;top:-240px;border:70px solid rgba(255,255,255,.28);filter:blur(6px)}
.hero::after{width:440px;height:440px;right:-40px;bottom:-330px;border:50px solid rgba(255,250,230,.45);filter:blur(8px)}
.hero > *{position:relative;z-index:1}
.hero-tag{display:flex;align-items:center;gap:8px;font-size:13.5px}
.hero-tag .dots{display:flex}
.hero-tag .dots span{width:30px;height:30px;border-radius:50%;background:var(--black);color:#fff;display:grid;place-items:center;border:2px solid #F7EAC6}
.hero-tag .dots span + span{margin-left:-8px}
.hero-tag svg{width:14px;height:14px}
.hero-title{font-family:var(--serif);font-size:clamp(40px,5.4vw,68px);line-height:.98;letter-spacing:-.02em;margin-top:auto;padding-top:48px;max-width:12ch}
.hero-meta{margin-top:12px;font-size:14px;color:var(--ink-2);display:flex;flex-wrap:wrap;gap:4px 16px}
.hero-progress{margin-top:22px;display:grid;gap:8px;max-width:520px}
.hero-progress .bar{display:flex;gap:4px}
.hero-progress .bar span{flex:1;height:6px;border-radius:3px;background:rgba(255,255,255,.7)}
.hero-progress .bar span.done{background:var(--black)}
.hero-progress .bar span.now{background:rgba(20,19,17,.35)}
.side-col{display:grid;gap:18px;align-content:start}
.pkg-name{font-family:var(--serif);font-size:30px;line-height:1.1}
.pkg-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:7px;font-size:13.5px}
.pkg-list li{display:flex;gap:10px;align-items:center}
.pkg-list li.x{color:var(--faint);text-decoration:line-through}
.next-pay{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.next-pay .big{font-family:var(--serif);font-size:38px;line-height:1}
.overview-text{white-space:pre-line;color:var(--ink-2);font-size:15.5px;max-width:70ch}

.alerts{display:grid;gap:8px}
.alert{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--panel-2);border-radius:16px;padding:12px 14px 12px 16px}
.alert .l{display:flex;gap:10px;align-items:center}
.alert .pip{width:8px;height:8px;border-radius:50%;background:var(--black);flex:none}
.alert.warn .pip{background:var(--amber)}

.table{display:grid}
.thead{display:grid;grid-template-columns:minmax(0,1fr) 190px 150px;gap:12px;align-items:center;background:var(--panel-2);border-radius:14px;padding:10px 14px;font-size:13px;color:var(--ink-2);margin-bottom:6px}
.thead .first{display:flex;gap:10px;align-items:center}
.trow{display:grid;grid-template-columns:minmax(0,1fr) 190px 150px;gap:12px;align-items:center;padding:10px 14px;border-radius:16px;border:0;background:none;text-align:left;cursor:pointer;width:100%;transition:background .15s}
.trow:hover{background:var(--panel-2)}
.trow.current{background:#FBF7EE;box-shadow:0 0 0 1px var(--line) inset}
.trow[disabled]{cursor:default;opacity:.6}
.trow[disabled]:hover{background:none}
.trow .first{display:flex;gap:14px;align-items:center;min-width:0}
.trow .t{font-weight:500;font-size:15px;display:block}
.trow .t.struck{text-decoration:line-through;color:var(--muted)}
.trow .s{font-size:12.5px;color:var(--faint);font-family:var(--mono);display:block}
.trow .detail{font-size:13px;color:var(--ink-2)}

/* ---------- stage page ---------- */
.stage-hero{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.stage-hero .txt{flex:1;min-width:220px}
.pager{display:flex;justify-content:space-between;gap:12px;margin-top:30px;padding-top:20px;border-top:1px solid var(--line);flex-wrap:wrap}
.pager button{display:grid;gap:2px;text-align:left;border:1px solid var(--line);background:var(--panel);border-radius:18px;padding:12px 18px;cursor:pointer;min-width:0;max-width:48%}
.pager button:hover{border-color:var(--faint)}
.pager button.next{text-align:right;margin-left:auto}
.pager small{color:var(--muted);font-size:12px}
.pager b{font-weight:500}
.stat-row{display:flex;gap:10px;flex-wrap:wrap}
.stat{background:var(--panel-2);border-radius:14px;padding:10px 14px;display:grid;gap:2px;min-width:130px}
.stat b{font-weight:500}
.notice{background:var(--amber-soft);border-radius:14px;padding:12px 16px;font-size:14px;margin-bottom:18px}

.bullets{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.bullets li{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;background:var(--panel-2);border-radius:14px}
.bullets li .n{font-family:var(--mono);font-size:12px;color:var(--muted);padding-top:2px;width:20px;flex:none}
.bullets li .tx{flex:1}

/* needs & goals timeline */
.day-sep{display:flex;align-items:center;gap:12px;margin:10px 0 2px;font-size:12.5px;font-weight:500;color:var(--ink-2)}
.day-sep::after{content:"";flex:1;height:1px;background:var(--line-2)}
.day-sep .d{background:var(--black);color:#fff;border-radius:999px;padding:3px 11px;font-family:var(--mono);font-size:11.5px;font-weight:400}
.timeline{display:grid;gap:10px}
.point{display:grid;gap:8px;padding:13px 16px;background:var(--panel-2);border-radius:16px}
.point.note{background:#FBF4E2}
.point-head{display:flex;gap:12px;align-items:flex-start}
.point-head .n{font-family:var(--mono);font-size:12px;color:var(--muted);padding-top:2px;width:22px;flex:none}
.point-head .tx{flex:1;min-width:0;white-space:pre-line}
.point-meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--muted);padding-left:34px}
.thread{display:grid;gap:6px;padding-left:34px}
.sep{display:flex;align-items:center;gap:10px;font-size:11.5px;color:var(--muted);font-family:var(--mono);margin:2px 0}
.sep::before,.sep::after{content:"";flex:1;height:1px;background:var(--line-2)}
.new-chip{background:var(--lime);color:var(--lime-ink);border-radius:999px;font-size:11px;font-weight:600;padding:1px 8px}

/* notifications */
.notif-wrap{position:relative}
.bell{position:relative;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--panel);display:grid;place-items:center;cursor:pointer}
.bell svg{width:18px;height:18px}
.bell .badge{position:absolute;top:-4px;right:-4px}
.notif{position:absolute;right:0;top:calc(100% + 8px);width:min(360px,calc(100vw - 48px));background:var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:8px;z-index:30;display:grid;gap:2px}
.notif-head{display:flex;justify-content:space-between;align-items:center;padding:8px 10px 6px}
.notif-head b{font-family:var(--serif);font-weight:400;font-size:19px}
.notif-item{display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;align-items:start;border:0;background:none;text-align:left;padding:9px 10px;border-radius:14px;cursor:pointer}
.notif-item:hover{background:var(--panel-2)}
.notif-item .ic{width:30px;height:30px;border-radius:9px;background:var(--black);color:#fff;display:grid;place-items:center}
.notif-item .ic svg{width:15px;height:15px}
.notif-item small{display:block;color:var(--muted);font-size:12px;margin-top:2px}

/* style finder categories */
.style-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.style-tab{position:relative;border:1px solid var(--line-2);background:var(--panel);border-radius:22px;padding:12px;text-align:left;cursor:pointer;display:grid;gap:10px;box-shadow:var(--card-shadow);transition:transform .15s,box-shadow .15s,border-color .15s}
.style-tab:hover{transform:translateY(-3px);border-color:var(--faint);box-shadow:0 14px 30px -18px rgba(60,40,20,.45)}
.style-tab[aria-pressed="true"]{background:linear-gradient(140deg,#FFF8E2,#F7DC8C);border-color:rgba(20,19,17,.55);box-shadow:0 0 0 1.5px var(--black),var(--card-shadow)}
.mosaic{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:4px;aspect-ratio:16/9;max-width:100%;border-radius:14px;overflow:hidden;background:var(--panel-2)}
.mosaic span{background:var(--line) center/cover no-repeat;display:block}
.mosaic span:first-child{grid-row:1/3}
.mosaic.empty{display:grid;place-items:center;grid-template-columns:1fr;grid-template-rows:1fr;color:var(--faint)}
.mosaic.empty svg{width:28px;height:28px}
.style-tab .txt{padding:0 6px 4px;display:grid;gap:2px}
.style-tab .nm{font-family:var(--serif);font-size:26px;line-height:1.1}
.style-tab .ct{font-size:12.5px;color:var(--muted)}
.style-tab .cta{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 6px 2px;border-top:1px solid rgba(0,0,0,.07);font-size:13px;font-weight:500}
.style-tab .cta svg{width:15px;height:15px;transition:transform .15s}
.style-tab:hover .cta svg{transform:translateX(3px)}
.style-tab[aria-pressed="true"] .cta{color:var(--ink)}
.viewing{display:inline-flex;align-items:center;gap:6px;background:var(--black);color:#fff;border-radius:999px;padding:3px 10px;font-size:12px}
.viewing svg{width:12px;height:12px}
.sub-nav{display:grid;gap:10px;background:var(--panel-2);border-radius:20px;padding:14px}
.sub-nav .label{font-size:12.5px}
.room-row{display:flex;gap:6px;flex-wrap:wrap}
.room{border:1px solid var(--line-2);background:var(--panel);border-radius:999px;padding:7px 14px;font-size:13.5px;cursor:pointer;color:var(--ink-2)}
.room:hover{border-color:var(--faint)}
.room[aria-pressed="true"]{background:var(--black);border-color:var(--black);color:#fff}
.room .mono{opacity:.6;margin-left:6px;font-size:11.5px}
.sub-nav-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.room-edit{display:inline-flex;align-items:center;gap:4px;border:1px dashed var(--faint);background:var(--panel);border-radius:999px;padding:4px 4px 4px 14px;font-size:13.5px}
.room-edit .mono{opacity:.6;font-size:11.5px;margin-right:2px}
.room-x{width:26px;height:26px;border-radius:50%;border:0;background:var(--panel-2);cursor:pointer;display:grid;place-items:center;font-size:15px;line-height:1;color:var(--ink-2)}
.room-x:hover{background:var(--red-soft);color:var(--red)}
.room-x[disabled]{opacity:.35;cursor:not-allowed}
.room-add{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.room-plus{border-style:dashed;color:var(--ink);font-weight:500}
.add-card{border:1.5px dashed var(--faint);background:transparent;border-radius:22px;padding:18px;display:grid;gap:8px;align-content:center;justify-items:start;text-align:left;cursor:pointer;min-height:180px;transition:border-color .15s,background .15s}
button.add-card:hover{border-color:var(--ink);background:rgba(255,255,255,.6)}
.add-card .plus{width:44px;height:44px;border-radius:50%;background:var(--black);color:#fff;display:grid;place-items:center;font-size:24px;line-height:1}
.add-card .nm{font-family:var(--serif);font-size:24px}
.add-card .ct{font-size:12.5px;color:var(--muted)}
.add-card .input{max-width:100%}
.room-add .input{width:190px;padding:6px 12px;border-radius:999px;font-size:13.5px}
.room-sec{display:grid;gap:12px;padding-top:6px}
.room-sec + .room-sec{border-top:1px solid var(--line);padding-top:18px}
.room-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.room-head h3{font-family:var(--serif);font-size:25px;display:flex;align-items:baseline;gap:10px}
.room-head h3 small{font-family:var(--sans);font-size:12.5px;color:var(--muted)}
.room-empty{border:1px dashed var(--line-2);border-radius:14px;padding:14px;color:var(--muted);font-size:13.5px}
.client-up{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;border-radius:22px;padding:18px 20px;background:linear-gradient(135deg,#F6EFE2 0%,#F8E3A6 100%);border:1px solid rgba(255,255,255,.7)}
.client-up h3{font-family:var(--serif);font-size:24px}
.client-up p{font-size:14px;color:var(--ink-2);max-width:52ch}
.client-up .btn{padding:12px 22px;font-size:15px}
.move{display:flex;gap:6px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--muted)}
.move select{width:auto;padding:4px 8px;border-radius:8px;font-size:12px}

.field{display:grid;gap:6px}
.field label{font-size:13px;font-weight:500;color:var(--ink-2)}
.input,textarea.input,select.input{width:100%;background:var(--panel);border:1px solid var(--line-2);border-radius:14px;padding:10px 14px;font-size:14.5px;outline:none}
.input:focus{border-color:var(--ink-2)}
textarea.input{min-height:84px;resize:vertical;line-height:1.5}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.row .input{flex:1;min-width:180px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-grid .full{grid-column:1/-1}
.check{display:flex;gap:10px;align-items:center;font-size:14.5px}
.check input{width:18px;height:18px;accent-color:#141311}
.dpanel{background:var(--panel-2);border:1px dashed var(--line-2);border-radius:20px;padding:18px;display:grid;gap:14px}
.dtag{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--ink-2)}
.dtag::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--black)}
.empty{border:1px dashed var(--line-2);border-radius:18px;padding:30px;text-align:center;color:var(--muted)}

/* references */
.ref-tools{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center}
.tabs{display:flex;gap:4px;flex-wrap:wrap;background:var(--panel-2);padding:4px;border-radius:999px}
.tab{border:0;background:none;border-radius:999px;padding:6px 13px;font-size:13px;cursor:pointer;color:var(--ink-2)}
.tab[aria-pressed="true"]{background:var(--panel);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.refs{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.ref{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--panel);display:flex;flex-direction:column;box-shadow:var(--card-shadow)}
.ref.liked{box-shadow:0 0 0 2px var(--lime),var(--card-shadow)}
.ref.disliked{opacity:.55}
.ref-img{aspect-ratio:4/5;max-width:100%;background:var(--panel-2);display:block;width:100%;border:0;padding:0;cursor:zoom-in;position:relative}
.ref-img img{width:100%;height:100%;object-fit:cover;display:block}
.ref.selected{box-shadow:0 0 0 3px var(--black),var(--card-shadow)}
.ref-check{position:absolute;right:10px;top:10px;width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.92);border:1.5px solid var(--ink-2);display:grid;place-items:center;color:transparent}
.ref-check svg{width:15px;height:15px}
.ref.selected .ref-check{background:var(--black);border-color:var(--black);color:#fff}
.select-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;background:var(--panel-2);border-radius:16px;padding:10px 12px}
.select-bar.on{background:#141311;color:#fff}
.select-bar.on .btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25);color:#fff}
.select-bar.on .btn.danger{background:#fff;color:var(--red);border-color:#fff}
.del-log{display:grid;gap:6px}
.del-log .ln{display:flex;gap:10px;align-items:center;font-size:13.5px;color:var(--ink-2);padding:8px 12px;border-radius:12px;background:var(--panel-2)}
.del-log .ln .ic{width:24px;height:24px;border-radius:7px;background:var(--red-soft);color:var(--red);display:grid;place-items:center;flex:none}
.del-log .ln .ic svg{width:13px;height:13px}
.del-log .ln .when{margin-left:auto;font-family:var(--mono);font-size:12px;color:var(--muted);white-space:nowrap}
.ref-src{position:absolute;left:10px;top:10px;background:rgba(255,255,255,.9);font-size:11.5px;font-weight:500;padding:3px 9px;border-radius:999px}
.ref-body{padding:10px 12px 12px;display:grid;gap:8px}
.ref-actions{display:flex;gap:6px;align-items:center}
.trash-btn{border:0;background:none;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;cursor:pointer;color:var(--faint);transition:color .15s,background .15s}
.trash-btn svg{width:16px;height:16px}
.trash-btn:hover,.trash-btn:focus-visible{color:var(--red);background:var(--red-soft)}
.react{border:1px solid var(--line-2);background:var(--panel);border-radius:10px;width:36px;height:32px;display:grid;place-items:center;cursor:pointer;color:var(--muted)}
.react svg{width:16px;height:16px}
.react[aria-pressed="true"].up{background:var(--lime);border-color:var(--lime);color:var(--lime-ink)}
.react[aria-pressed="true"].down{background:var(--black);border-color:var(--black);color:#fff}
.react[disabled]{cursor:default}
.comments{display:grid;gap:8px;font-size:13.5px}
.comment{background:var(--panel-2);border-radius:12px;padding:8px 10px}
.comment .who{font-size:12px;font-weight:600}
.comment .who span{font-weight:400;color:var(--muted)}

/* presentations */
.round{border:1px solid var(--line);border-radius:20px;padding:18px;display:grid;gap:14px;background:var(--panel)}
.round.old{background:var(--panel-2)}
.round-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center}
.round-label{font-family:var(--serif);font-size:22px}
.files{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.file{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--panel-2);display:block;position:relative}
.file .thumb{aspect-ratio:4/3;max-width:100%;display:block;overflow:hidden;width:100%;border:0;padding:0;background:none;cursor:zoom-in}
.file .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.file .doc{aspect-ratio:4/3;display:grid;place-items:center;font-family:var(--serif);font-size:24px}
.file .name{font-size:12px;padding:7px 10px;background:var(--panel);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.file .x{position:absolute;right:6px;top:6px;background:var(--panel);border:1px solid var(--line);border-radius:50%;width:26px;height:26px;cursor:pointer;line-height:1}
.decision{display:flex;gap:12px;align-items:flex-start;font-size:14px;border-top:1px solid var(--line);padding-top:14px;flex-wrap:wrap}
.decision p{white-space:pre-line}
.revcount{display:flex;gap:8px;align-items:center;font-size:13px;color:var(--ink-2)}
.pips{display:flex;gap:4px}
.pips i{width:22px;height:6px;border-radius:3px;background:var(--line-2)}
.pips i.used{background:var(--amber)}
.confirm{background:#FBF4E2;border-radius:16px;padding:12px 14px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:space-between}
details.history summary{cursor:pointer;font-size:13.5px;color:var(--ink-2);font-weight:500}
details.history[open] summary{margin-bottom:12px}
details.history > div{display:grid;gap:12px}

/* payments */
.pay-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pay-card{border-radius:22px;padding:20px;border:1px solid var(--line);background:var(--panel);display:grid;gap:8px;align-content:start;box-shadow:var(--card-shadow)}
.pay-card.due{background:linear-gradient(150deg,#FFF8E2,#F8E2A0)}
.pay-card.paid{background:var(--panel-2)}
.pay-pct{font-family:var(--serif);font-size:54px;line-height:1}
.pay-info{white-space:pre-line;font-size:14px;background:var(--panel-2);border-radius:16px;padding:14px 16px;user-select:all}
.pay-mini{display:grid;gap:10px}
.pay-mini .r{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:13.5px}

/* overlays */
.lightbox{position:fixed;inset:0;background:rgba(20,16,12,.86);display:grid;place-items:center;z-index:50;padding:24px;cursor:zoom-out}
.lightbox img{max-width:100%;max-height:90vh;border-radius:12px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--black);color:#fff;padding:11px 20px;border-radius:999px;font-size:14px;z-index:60;max-width:calc(100% - 32px)}
.loading{padding:120px 0;text-align:center;color:var(--ink-2)}
.scrim{display:none}

/* ---------- multi-project ---------- */
.unlock{min-height:calc(100vh - 80px);display:grid;place-items:center;padding-block:24px}
.unlock-card{width:min(460px,100%);background:rgba(253,252,250,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.7);border-radius:30px;padding:30px 28px;box-shadow:var(--shadow);display:grid;gap:14px}
.unlock-card .input{font-family:var(--mono);font-size:16px;padding:13px 16px;letter-spacing:.02em}
.unlock-card .btn{padding:12px 20px;font-size:15px}
.unlock-err{background:var(--red-soft);color:var(--red);border-radius:12px;padding:10px 12px;font-size:13.5px}
.switcher{position:relative;margin:0 0 6px}
.switch-btn{width:100%;display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:16px;border:1px solid rgba(255,255,255,.8);background:rgba(255,255,255,.6);cursor:pointer;text-align:left}
.switch-btn:hover{background:#fff}
.switch-btn svg{width:16px;height:16px;flex:none;margin-left:auto}
.switch-btn .who,.switch-menu .who{min-width:0;line-height:1.25;display:grid}
.switch-btn .who b,.switch-menu .who b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.switch-btn small,.switch-menu small{font-size:11.5px;color:var(--muted)}
.avatar.sm{width:30px;height:30px;border-radius:9px;font-size:12px}
.switch-menu{position:absolute;left:0;right:0;top:calc(100% + 6px);background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:6px;z-index:25;display:grid;gap:2px;max-height:60vh;overflow:auto}
.switch-menu button{display:flex;align-items:center;gap:10px;border:0;background:none;text-align:left;padding:8px 10px;border-radius:12px;cursor:pointer;font-size:14px}
.switch-menu button:hover,.switch-menu button.on{background:var(--panel-2)}
.switch-menu button svg{width:16px;height:16px;flex:none}
.switch-menu button.on svg{margin-left:auto;color:var(--lime-text)}
.sep-line{height:1px;background:var(--line);margin:4px 6px}
.proj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px}
.proj{border-radius:26px;overflow:hidden;border:1px solid var(--line);background:var(--panel);box-shadow:var(--card-shadow);display:flex;flex-direction:column}
.proj.current{box-shadow:0 0 0 1.5px var(--black),var(--card-shadow)}
.proj-top{padding:16px 18px 18px;display:grid;gap:4px;background:radial-gradient(70% 90% at 100% 0%,rgba(255,255,255,.8) 0%,transparent 60%),linear-gradient(135deg,#F6EFE2 0%,#F7E6B8 55%,var(--gold-2) 100%)}
.proj-name{font-family:var(--serif);font-size:30px;line-height:1.05;letter-spacing:-.01em;margin-top:18px}
.proj-meta{font-size:13.5px;color:var(--ink-2)}
.proj-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:12px;flex:1}
.proj .bar{display:flex;gap:3px}
.proj .bar span{flex:1;height:6px;border-radius:3px;background:var(--line)}
.proj .bar span.done{background:var(--black)}
.proj .bar span.now{background:var(--gold-3)}
.pays{display:flex;gap:4px}
.pay-pip{font-family:var(--mono);font-size:11px;padding:2px 7px;border-radius:999px;background:var(--panel-2);color:var(--muted)}
.pay-pip.paid{background:var(--lime);color:var(--lime-ink)}
.access.fresh{box-shadow:0 0 0 2px var(--lime),var(--card-shadow)}
.access-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.access .pw{font-size:18px;letter-spacing:.03em;user-select:all}
.invite{white-space:pre-wrap;font-family:var(--sans);font-size:13.5px;background:var(--panel-2);border-radius:14px;padding:12px 14px;margin:0;user-select:all}
.steps{margin:14px 0 0;padding-left:20px;display:grid;gap:4px;font-size:13.5px;color:var(--ink-2)}
.doc-open{border:0;background:none;padding:0;width:100%;text-align:left;cursor:pointer;display:block;color:inherit}
.lightbox.pdf{cursor:default}
.pdf-wrap{width:min(1000px,100%);height:min(88vh,1100px);background:var(--panel);border-radius:20px;padding:14px;display:grid;grid-template-rows:auto 1fr auto;gap:10px}
.pdf-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.pdf-head b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.pdf-wrap iframe{width:100%;height:100%;border:1px solid var(--line);border-radius:12px;background:#fff}
@media (max-width:640px){.access-grid{grid-template-columns:1fr}}
/* ---------- studio ---------- */
.count{font-family:var(--mono);font-size:11.5px;color:var(--muted)}
.nav-person{display:flex;align-items:center;gap:12px;width:100%;padding:7px 10px;border:0;background:none;border-radius:14px;text-align:left;cursor:pointer}
.nav-person:hover{background:rgba(255,255,255,.5)}
.person-ic{width:40px;height:40px;border-radius:13px;background:rgba(255,255,255,.55);display:grid;place-items:center;flex:none;color:var(--ink-2)}
.person-ic svg{width:18px;height:18px}
.nav-person .who{min-width:0;line-height:1.3;display:grid}
.nav-person .who b{font-weight:400;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-person .who span{font-size:13.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-wrap{margin-top:auto;position:relative}
.me-btn{width:100%;cursor:pointer;text-align:left}
.me-btn > svg{width:16px;height:16px;flex:none;margin-left:auto}
.me-menu{position:absolute;left:0;right:0;bottom:calc(100% + 8px);background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:8px;z-index:25;display:grid;gap:2px;max-height:60vh;overflow:auto}
.me-menu .nav-title{padding:4px 8px}
.me-menu button{display:flex;align-items:center;gap:10px;border:0;background:none;text-align:left;padding:8px 10px;border-radius:12px;cursor:pointer;font-size:14px}
.me-menu button:hover{background:var(--panel-2)}
.me-menu button svg{width:16px;height:16px}
.me-menu .who{display:grid;line-height:1.25;min-width:0}.me-menu .who b{font-weight:500}.me-menu small{font-size:11.5px;color:var(--muted)}
.pdot{width:10px;height:10px;border-radius:50%;flex:none;display:inline-block}
.pdot.lg{width:12px;height:12px}
.pchip{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:2px 9px;border-radius:999px;background:var(--panel-2);color:var(--ink-2);white-space:nowrap}
.pchip i{width:8px;height:8px;border-radius:50%}
.warn-t{color:var(--amber);font-style:normal}
.hero-next{margin-top:18px;display:grid;gap:2px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.7);border-radius:16px;padding:12px 14px;max-width:420px;font-size:14px}
.hero-next b{font-family:var(--serif);font-weight:400;font-size:22px}
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px}
.kpi{background:var(--panel-2);border-radius:14px;padding:12px 14px;display:grid;gap:2px}
.kpi b{font-family:var(--serif);font-weight:400;font-size:30px;line-height:1.1}
.kpi small{font-size:12px}
.agenda{display:grid;gap:8px}
.ag-day{display:flex;gap:12px;align-items:flex-start}
.ag-date{width:40px;flex:none;text-align:center;background:var(--panel-2);border-radius:12px;padding:4px 0;line-height:1.1}
.ag-date b{font-family:var(--serif);font-weight:400;font-size:20px;display:block}
.ag-date small{font-size:11px;color:var(--muted)}
.ag-items{display:grid;gap:3px;min-width:0;padding-top:2px}
.ag-item{display:flex;gap:7px;align-items:center;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ag-item i{width:7px;height:7px;border-radius:50%;flex:none}
.ag-item .mono{font-size:12px;color:var(--muted)}
.todo-add{display:grid;grid-template-columns:minmax(0,1fr) 160px 170px auto;gap:8px}
.todo-group{margin-top:14px;display:grid;gap:6px}
.todos{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.todo{display:flex;gap:10px;align-items:center;padding:9px 10px 9px 12px;border-radius:14px;background:var(--panel-2)}
.todo .tx{flex:1;min-width:0}
.todo.done .tx{text-decoration:line-through;color:var(--muted)}
.tick{width:24px;height:24px;border-radius:8px;border:1.5px solid var(--faint);background:var(--panel);display:grid;place-items:center;cursor:pointer;color:transparent;flex:none}
.tick svg{width:14px;height:14px}
.tick:hover{border-color:var(--ink-2)}
.tick.on{background:var(--lime);border-color:var(--lime);color:var(--lime-ink)}
.due-chip{font-family:var(--mono);font-size:11.5px;padding:2px 8px;border-radius:999px;background:var(--panel);color:var(--ink-2);white-space:nowrap}
.due-chip.late{background:var(--amber-soft);color:var(--amber)}
.gantt-wrap{overflow-x:auto;margin:0 -4px;padding:0 4px}
.gantt{min-width:760px;display:grid;gap:4px}
.grow-row{display:grid;grid-template-columns:200px minmax(0,1fr);gap:12px;align-items:center;min-height:48px}
.ghead{min-height:26px}
.glabel{display:flex;gap:10px;align-items:center;border:0;background:none;text-align:left;cursor:pointer;padding:6px 8px;border-radius:12px;min-width:0}
.glabel:hover{background:var(--panel-2)}
.glabel i{width:10px;height:10px;border-radius:50%;flex:none}
.glabel span{display:grid;min-width:0;line-height:1.3}
.glabel b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glabel small{font-size:12px;color:var(--muted)}
.gtrack{position:relative;height:40px;background:var(--panel-2);border-radius:12px}
.ghead .gtrack{background:none;height:22px}
.gmonth{position:absolute;top:2px;font-size:11.5px;color:var(--muted);transform:translateX(4px);white-space:nowrap}
.gline{position:absolute;top:0;bottom:0;width:1px;background:var(--line-2)}
.gtoday{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--red);opacity:.55;border-radius:2px}
.gtoday-l{position:absolute;top:2px;font-size:11px;color:var(--red);transform:translateX(-50%);font-weight:500}
.gbar{position:absolute;top:14px;height:12px;border-radius:999px;background:var(--c);opacity:.28}
.gbar.open{opacity:.12;background:repeating-linear-gradient(90deg,var(--c) 0 6px,transparent 6px 10px)}
.gmark{position:absolute;top:13px;width:14px;height:14px;border-radius:50%;background:var(--panel);border:2px solid var(--c);transform:translateX(-50%);display:inline-block}
.gmark.done{background:var(--c)}
.gmark.now{background:var(--gold-3);border-color:var(--black);box-shadow:0 0 0 3px rgba(243,201,85,.35)}
.gset{position:absolute;top:8px;border:1px dashed var(--faint);background:var(--panel);border-radius:999px;font-size:12px;padding:3px 10px;cursor:pointer}
.glegend{display:flex;gap:14px;font-size:12px;color:var(--muted);flex-wrap:wrap}
.glegend span{display:inline-flex;gap:6px;align-items:center}
.glegend .gmark{transform:none;width:11px;height:11px}
.tl-edit{margin-top:14px;background:var(--panel-2);border-radius:18px;padding:16px;display:grid;gap:12px}
.tl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.cal{display:grid;gap:6px}
.cal-head,.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.cal-head span{font-size:12px;color:var(--muted);padding-left:6px}
.cal-cell{min-height:104px;border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:6px;display:flex;flex-direction:column;gap:3px;text-align:left;cursor:pointer;min-width:0;overflow:hidden}
.cal-cell:hover{border-color:var(--faint)}
.cal-cell.out{background:transparent;opacity:.55}
.cal-cell.today .cal-n{background:var(--black);color:#fff}
.cal-cell.sel{box-shadow:0 0 0 2px var(--black)}
.cal-n{font-family:var(--mono);font-size:12px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center}
.cal-chip{font-size:11.5px;line-height:1.3;padding:2px 6px;border-radius:6px;background:color-mix(in srgb, var(--c) 16%, white);border-left:3px solid var(--c);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-chip.todo{background:var(--panel-2);border-left-style:dotted}
.cal-chip.target{background:var(--gold-1);border-left-color:var(--gold-3)}
.cal-chip.invoice{background:var(--amber-soft);border-left-color:var(--amber)}
.cal-more{font-size:11px;color:var(--muted);padding-left:4px}
.day-panel{margin-top:14px;background:var(--panel-2);border-radius:18px;padding:16px;display:grid;gap:12px}
.day-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.day-list li{display:flex;gap:10px;align-items:center;background:var(--panel);border-radius:12px;padding:8px 12px;font-size:14px}
.day-list li > i{width:9px;height:9px;border-radius:50%;flex:none}
.day-list .grow{flex:1;min-width:0}
.ev-form{display:grid;grid-template-columns:minmax(0,1fr) 110px 140px 160px auto auto;gap:8px;align-items:center}
.ev-form:has(#ev-date){grid-template-columns:minmax(0,1fr) 110px 140px 160px 150px auto auto}
.inv-group .card-head h2 small{margin-left:4px}
.inv-table{display:grid;gap:4px;overflow-x:auto}
.inv-row{display:grid;grid-template-columns:110px minmax(180px,1fr) 80px 80px 110px 90px auto;gap:10px;align-items:center;padding:8px 10px;border-radius:12px;font-size:13.5px;min-width:820px}
.inv-row:not(.head):hover{background:var(--panel-2)}
.inv-row.head{font-size:12px;color:var(--muted);background:var(--panel-2)}
.inv-row .r{text-align:right}
.inv-act{justify-content:flex-end;flex-wrap:nowrap}
.inv-form{background:var(--panel-2);border-radius:18px;padding:16px;display:grid;gap:12px;margin-bottom:14px}
.inv-wrap{grid-template-rows:auto minmax(0,1fr) auto}
.inv-scroll{overflow:auto;background:#f4f1ec;border-radius:12px}
.inv-doc{max-width:760px;margin:20px auto;background:#fff;padding:40px;border-radius:8px;color:#1b1a17}
.inv-top{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.inv-brand{font-family:var(--serif);font-size:28px}
.inv-small{font-size:12.5px;color:#6b665e;line-height:1.55}
.inv-title{font-family:var(--serif);font-size:34px;text-align:right}
.inv-meta table{font-size:13px;margin-left:auto}.inv-meta td{padding:2px 0 2px 16px}.inv-meta td:first-child{color:#6b665e}
.inv-to{margin:32px 0 22px}
.inv-lines{width:100%;border-collapse:collapse;font-size:14px}
.inv-lines th{text-align:left;font-size:12px;color:#6b665e;border-bottom:1px solid #e6e1d8;padding:8px 0;font-weight:500}
.inv-lines td{padding:12px 0;border-bottom:1px solid #f0ece5;vertical-align:top}
.inv-lines .r{text-align:right}
.inv-lines tfoot td{border:0;padding:6px 0}
.inv-lines .tot td{font-size:18px;font-weight:600;border-top:2px solid #1b1a17;padding-top:10px}
.inv-pay{margin-top:26px;font-size:13.5px;background:#f7f4ef;padding:14px 16px;border-radius:8px}
.inv-paid{margin-top:18px;display:inline-block;border:2px solid #43700f;color:#43700f;padding:4px 12px;border-radius:6px;font-weight:600;transform:rotate(-3deg)}
.contacts{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;align-items:start}
.contact{border:1px solid var(--line);background:var(--panel);border-radius:20px;padding:12px;display:grid;gap:10px;box-shadow:var(--card-shadow)}
.contact.focus{box-shadow:0 0 0 2px var(--black),var(--card-shadow)}
.ct-head{display:flex;align-items:center;gap:12px;border:0;background:none;text-align:left;cursor:pointer;padding:2px;width:100%}
.ct-head .who{flex:1;min-width:0;display:grid;line-height:1.3}
.ct-head .who b{font-weight:500}
.ct-head .who span{font-size:12.5px;color:var(--muted)}
.ct-head > svg{width:16px;height:16px;transition:transform .15s}
.contact.open .ct-head > svg{transform:rotate(180deg)}
.pin{color:var(--gold-3)}
.ct-lines{display:grid;gap:4px}
.ct-line{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:8px;align-items:center;background:var(--panel-2);border-radius:12px;padding:6px 6px 6px 12px;font-size:13.5px}
.ct-line b{font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:all}
.ct-more{display:grid;gap:10px;font-size:13.5px;border-top:1px solid var(--line);padding-top:10px}
.nf-list{display:grid;gap:4px}
.nf{display:flex;gap:12px;align-items:center;border:0;background:none;text-align:left;padding:10px;border-radius:14px;cursor:pointer;width:100%}
.nf:hover{background:var(--panel-2)}
.nf .ic{width:34px;height:34px;border-radius:10px;color:#fff;display:grid;place-items:center;flex:none}
.nf .ic svg{width:16px;height:16px}
.nf-body{flex:1;min-width:0;display:grid;gap:2px}
.nf-body small{font-size:12px;color:var(--muted)}
.nf.unread .nf-body > span{font-weight:500}
.nf-dot{width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px var(--lime-soft);flex:none}
.pkg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.pkg{border-radius:26px;overflow:hidden;border:1px solid var(--line);background:var(--panel);box-shadow:var(--card-shadow);display:flex;flex-direction:column}
.pkg-top{padding:18px;display:grid;gap:4px;background:radial-gradient(70% 90% at 100% 0%,rgba(255,255,255,.8) 0%,transparent 60%),linear-gradient(135deg,#F6EFE2 0%,#F7E6B8 55%,var(--gold-2) 100%)}
.pkg-name{font-family:var(--serif);font-size:30px;line-height:1.05}
.pkg-price{font-family:var(--mono);font-size:15px}
.pkg-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:12px;flex:1}
@media (max-width:880px){
  .todo-add{grid-template-columns:1fr 1fr}
  .todo-add .input:first-child{grid-column:1/-1}
  .ev-form,.ev-form:has(#ev-date){grid-template-columns:1fr 1fr}
  .ev-form #ev-title{grid-column:1/-1}
  .cal-cell{min-height:64px;padding:4px}
  .cal-chip{font-size:0;height:6px;padding:0;border-left-width:0;border-radius:3px;background:var(--c)}
  .cal-chip.todo,.cal-chip.target,.cal-chip.invoice{background:var(--c)}
  .cal-head,.cal-grid{gap:3px}
  .kpis{grid-template-columns:1fr 1fr}
  .contacts{grid-template-columns:1fr}
}
.icon-btn{width:32px;height:32px;border-radius:10px;border:1px solid var(--line);background:var(--panel);display:grid;place-items:center;cursor:pointer;color:var(--ink-2);flex:none}
.icon-btn:hover{border-color:var(--faint);color:var(--ink)}
.icon-btn svg{width:16px;height:16px}
.pkg-el{font-size:13px;color:var(--ink-2);font-style:italic;font-family:var(--serif)}
.pkg.addon .pkg-top{background:linear-gradient(135deg,#EEEAE3 0%,#E4DED3 100%)}
.inc-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.inc-chips span{font-size:12.5px;background:var(--panel-2);border-radius:999px;padding:4px 10px}
.pkg-note{font-size:13px;background:var(--amber-soft);color:var(--ink-2);border-radius:12px;padding:10px 12px}
.terms{margin-top:18px}
.terms-list{margin:0;padding-left:18px;display:grid;gap:4px;font-size:14px;color:var(--ink-2)}
.stage-picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px 14px}
.calc{margin-top:18px;background:linear-gradient(180deg,var(--panel) 0%,#FBF7EE 100%)}
.calc-inputs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.calc-in{position:relative}
.calc-in .input{padding-right:64px;font-size:17px;font-family:var(--mono)}
.calc-in span{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:13px;color:var(--muted)}
.calc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.calc-res{border:1px solid var(--line);background:var(--panel);border-radius:20px;padding:16px;display:grid;gap:12px;align-content:start}
.calc-res.idle{background:transparent;border-style:dashed}
.calc-total{font-family:var(--serif);font-size:32px;line-height:1}
.calc-lines{display:grid;gap:6px}
.calc-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;align-items:center;font-size:13.5px;background:var(--panel-2);border-radius:12px;padding:8px 12px}
.calc-line.best{box-shadow:0 0 0 1.5px var(--black) inset}
.calc-line small,.calc-line .linkbtn{grid-column:1/-1;justify-self:start}
.calc-split{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.calc-split span{background:var(--panel-2);border-radius:12px;padding:6px 10px;font-family:var(--mono);font-size:13px;display:grid}
.calc-split small{font-family:var(--sans);font-size:11px;color:var(--muted)}
.calc-sup{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:13px;background:var(--gold-1);border-radius:12px;padding:8px 12px}
@media (max-width:880px){.calc-inputs{grid-template-columns:1fr 1fr}}
.calc-step{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-top:1px solid var(--line)}
.calc-step:first-of-type{border-top:0;padding-top:4px}
.step-n{width:28px;height:28px;border-radius:50%;background:var(--black);color:#fff;display:grid;place-items:center;font-family:var(--mono);font-size:12.5px;flex:none;margin-top:4px}
.calc-picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;flex:1;min-width:0}
.calc-pick{position:relative;border:1px solid var(--line-2);background:var(--panel);border-radius:18px;padding:14px 16px;text-align:left;cursor:pointer;display:grid;gap:3px;transition:transform .15s,border-color .15s,box-shadow .15s}
.calc-pick:hover{transform:translateY(-2px);border-color:var(--faint)}
.calc-pick b{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.15}
.calc-pick small{font-size:12.5px;color:var(--muted)}
.calc-pick[aria-pressed="true"]{background:linear-gradient(140deg,#FFF8E2,#F7DC8C);border-color:transparent;box-shadow:0 0 0 1.5px var(--black)}
.calc-pick-mark{position:absolute;right:12px;top:12px;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--faint);display:grid;place-items:center}
.calc-pick[aria-pressed="true"] .calc-pick-mark{background:var(--black);border-color:var(--black);color:#fff}
.calc-pick-mark svg{width:12px;height:12px}
.calc-hint{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:14px;padding:6px 0 0 42px}
.calc-inputs{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.calc-out{flex:1;min-width:0;display:grid;gap:12px}
.calc-sum{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.calc-sum .calc-total{font-size:44px;margin:4px 0}

.brand-logo{display:block;width:100%;max-width:212px;height:auto}
.brand{padding:4px 10px 22px}
.brand-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.unlock-card .brand-logo{max-width:260px}
/* ---------- construction add-on ---------- */
.kpis-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.kpis-5 .kpi b{font-size:26px}
.b-group{margin-bottom:14px}
.b-rows{display:grid;gap:4px}
.b-row{display:grid;grid-template-columns:minmax(0,1fr) 110px 120px 150px auto;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--panel-2)}
.b-row.declined{opacity:.55}.b-row.declined .b-main b{text-decoration:line-through}
.b-main{display:grid;min-width:0;line-height:1.35}.b-main b{font-weight:500}.b-main small{font-size:12.5px;color:var(--muted)}
.b-num{display:grid;text-align:right;font-family:var(--mono);font-size:13.5px;line-height:1.3}.b-num small{font-family:var(--sans);font-size:11px;color:var(--muted)}.b-num b{font-weight:500}
.b-st{display:grid;gap:2px;justify-items:start}.b-st small{font-size:11.5px}
.b-act{justify-content:flex-end;flex-wrap:nowrap}
.b-total{display:grid;gap:6px;margin-top:4px}
.b-sum{display:flex;justify-content:space-between;gap:12px;font-size:14.5px;padding:4px 2px}.b-sum b{font-family:var(--mono);font-weight:500}
.b-sum.grand{border-top:2px solid var(--black);padding-top:10px;font-size:17px}.b-sum.grand b{font-family:var(--serif);font-size:28px;font-weight:400}
.b-form{background:var(--panel-2);border-radius:18px;padding:16px;display:grid;gap:12px;margin:10px 0}
.b-log{display:grid;gap:6px}
.b-log-row{display:flex;gap:10px;align-items:center;font-size:14px;padding:6px 4px}
.b-log-row .grow{flex:1;min-width:0}.b-log-row b{font-weight:500}
.who-dot{width:9px;height:9px;border-radius:50%;background:var(--black);flex:none}.who-dot.client{background:var(--gold-3)}
.ffe-room{display:grid;gap:10px;margin-top:14px}
.ffe-item{border:1px solid var(--line);border-radius:20px;padding:14px;display:grid;gap:12px;background:var(--panel)}
.ffe-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:flex-start}
.ffe-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.ffe-opt{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--panel);display:flex;flex-direction:column}
.ffe-opt.chosen{box-shadow:0 0 0 2.5px var(--lime);border-color:transparent}
.ffe-img{position:relative;aspect-ratio:4/3;max-width:100%;border:0;padding:0;background:var(--panel-2);cursor:zoom-in;display:grid;place-items:center;overflow:hidden}
.ffe-img[disabled]{cursor:default}
.ffe-img img{width:100%;height:100%;object-fit:cover}
.ffe-img > span:first-child:not(.ffe-letter){font-family:var(--serif);font-size:48px;color:var(--faint)}
.ffe-letter{position:absolute;left:10px;top:10px;width:30px;height:30px;border-radius:50%;background:var(--black);color:#fff;display:grid;place-items:center;font-weight:600;font-size:14px}
.ffe-opt.chosen .ffe-letter{background:var(--lime);color:var(--lime-ink)}
.ffe-body{padding:10px 12px 12px;display:grid;gap:6px;justify-items:start}
.ffe-body b{font-weight:500}.ffe-body small{font-size:12.5px;color:var(--muted)}
.ffe-price{font-family:var(--mono);font-size:15px}.ffe-price small{font-family:var(--sans)}
.ffe-add{border:1.5px dashed var(--faint);background:transparent;border-radius:16px;min-height:160px;display:grid;place-items:center;align-content:center;gap:6px;cursor:pointer;color:var(--ink-2);font-size:13.5px}
.ffe-add:hover{border-color:var(--ink);background:rgba(255,255,255,.6)}
.ffe-add svg{width:22px;height:22px}
.inv-row.c{grid-template-columns:110px minmax(200px,1fr) 80px 110px 110px auto;min-width:720px}
.due-list{display:grid;gap:6px}
.due-row{display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--panel-2);font-size:14px}
.due-row .grow{flex:1;min-width:0;display:grid}.due-row .grow b{font-weight:500}
.due-row.late{background:var(--amber-soft)}
.due-date{width:64px;flex:none;font-family:var(--mono);font-size:12.5px}
.ph-list{display:grid;gap:4px}
.ph-row{display:grid;grid-template-columns:minmax(0,1fr) 110px 110px 130px 90px;gap:10px;align-items:center;padding:9px 12px;border-radius:14px;background:var(--panel-2);font-size:14px}
.ph-row b{font-weight:500}
.ph-row.edit{grid-template-columns:minmax(0,1fr) 150px 150px 140px auto}
.gbar.solid{opacity:.85;top:12px;height:16px}
.addon-picks{display:grid;gap:8px}
.addon-pick{display:flex;gap:12px;align-items:flex-start;background:var(--gold-1);border:1px solid rgba(0,0,0,.05);border-radius:16px;padding:12px 14px;cursor:pointer}
.addon-pick input{width:18px;height:18px;margin-top:3px;accent-color:#141311;flex:none}
.addon-pick span{display:grid;gap:2px}.addon-pick b{font-weight:500}.addon-pick small{font-size:12.5px;color:var(--ink-2)}
@media (max-width:1100px){.kpis-5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:880px){
  .kpis-5{grid-template-columns:1fr 1fr}
  .b-row{grid-template-columns:1fr 1fr}.b-main{grid-column:1/-1}.b-act{justify-content:flex-start}
  .ph-row,.ph-row.edit{grid-template-columns:1fr 1fr}.ph-row b,.ph-row .input:first-child{grid-column:1/-1}
}
.ok-t{color:var(--lime-text)}
.cb-line{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;background:var(--gold-1);border-radius:14px;padding:10px 14px;margin-bottom:14px;font-size:14px}
.cb-card{background:linear-gradient(135deg,#FFF8E2,#F8E2A0);margin-bottom:14px}
.cb-form{display:grid;gap:10px}
.ver-tabs{margin:18px 0 14px;width:max-content;max-width:100%;overflow:auto}
.ver{margin-bottom:16px}
.ver.latest{box-shadow:0 0 0 1.5px var(--black),var(--card-shadow)}
.ver-sum{font-size:14px;margin-bottom:10px}
.ver-note{white-space:pre-line;background:var(--panel-2);border-radius:14px;padding:10px 14px;margin-bottom:12px;font-size:14px}
.ver-group{margin-top:12px}
.ver-cat{display:flex;justify-content:space-between;font-size:13px;color:var(--ink-2);padding:4px 2px 6px;border-bottom:1px solid var(--line);margin-bottom:6px;font-weight:500}
.b-row.v{grid-template-columns:minmax(0,1fr) 150px 110px}
.b-row.is-new{background:#FBF4E2}
.b-row.is-new .b-main b,.b-num b.hl{font-weight:700;color:var(--ink)}
.b-row.is-removed{opacity:.55}.b-row.is-removed .b-main b{text-decoration:line-through}
.b-num .was{text-decoration:line-through;color:var(--muted);font-size:12px}
.new-tag{display:inline-block;font-family:var(--sans);font-size:11px;font-weight:600;background:var(--black);color:#fff;border-radius:999px;padding:1px 8px;vertical-align:1px}
.new-tag.chg{background:var(--amber-soft);color:var(--amber)}
.rem-tag{display:inline-block;font-size:11px;font-weight:600;background:var(--red-soft);color:var(--red);border-radius:999px;padding:1px 8px;text-decoration:none}
.ver-fb{margin-top:12px;background:var(--amber-soft);border-radius:14px;padding:10px 14px;font-size:14px;white-space:pre-line}
@media (max-width:880px){.b-row.v{grid-template-columns:1fr auto}}
/* ---------- budget workspace ---------- */
.bad-t{color:var(--red)}
.ok-num{color:var(--lime-text)!important}.bad-num{color:var(--red)!important}.gold-num{color:var(--amber)!important}
.kpis-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.b-tabs{display:flex;gap:4px;align-items:center;flex-wrap:wrap;margin:6px 0 18px;border-bottom:1px solid var(--line)}
.b-tab{border:0;background:none;padding:10px 14px;font-size:14px;cursor:pointer;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;font-family:var(--sans)}
.b-tab:hover{color:var(--ink)}
.b-tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--ink);font-weight:500}
.b-tabs-r{margin-left:auto;display:flex;gap:8px;padding-bottom:8px}
.b-tabs-r svg{width:15px;height:15px}
.setup-ws{display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:10px}
.setup-ws p{max-width:620px;font-size:14px}
/* cash */
.cash .card-head h2{display:flex;gap:10px;align-items:center;font-size:22px}
.cash-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
.cash-grid>div{background:var(--panel-2);border-radius:14px;padding:12px 14px;display:grid;gap:2px}
.cash-grid b{font-family:var(--serif);font-weight:400;font-size:28px;line-height:1.1}
.cash-grid small{font-size:12px}
.cash-list{margin-top:12px;border-top:1px solid var(--line)}
.cash-row{display:grid;grid-template-columns:90px 1fr auto 30px;gap:10px;align-items:center;padding:8px 2px;border-bottom:1px solid var(--line);font-size:13.5px}
.cash-empty{font-size:13.5px;margin-top:12px}
.grow{min-width:0}
/* category cards */
.gcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px}
.gcard{text-align:left;font:inherit;color:inherit;cursor:pointer;background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:18px 18px 16px;box-shadow:var(--card-shadow);display:grid;gap:6px;position:relative;overflow:hidden;transition:transform .15s,box-shadow .15s}
.gcard::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--gc)}
.gcard:hover{transform:translateY(-2px);box-shadow:0 1px 2px rgba(40,30,20,.05),0 16px 32px -18px rgba(40,30,20,.3)}
.gc-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px}
.gc-ic{width:42px;height:42px;border-radius:13px;background:var(--gt);color:var(--gc);display:grid;place-items:center}
.gc-ic svg{width:20px;height:20px}
.gc-tot{text-align:right;display:grid}
.gc-tot small{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.gc-tot b{font-size:16px}
.gc-name{font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.1}
.gc-bar{height:6px;border-radius:99px;background:var(--panel-2);overflow:hidden;margin-top:8px}
.gc-bar i{display:block;height:100%;background:var(--gc);border-radius:99px}
.gc-foot{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted)}
/* items workspace */
.bws{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;align-items:start}
.bnav{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:10px;box-shadow:var(--card-shadow);position:sticky;top:12px;max-height:calc(100vh - 40px);overflow:auto}
.bnav-g{padding:6px 0 8px;border-bottom:1px solid var(--line)}
.bnav-g:last-child{border-bottom:0}
.bnav-h{display:flex;align-items:center;gap:8px;padding:6px 8px;font-weight:600;font-size:13px;color:var(--gc)}
.bnav-h svg{width:16px;height:16px}
.bnav-h span{flex:1;color:var(--ink)}
.bnav-h b{font-weight:500;font-size:11.5px;color:var(--muted)}
.bnav-s{display:flex;align-items:center;gap:8px;width:100%;border:0;background:none;font:inherit;font-size:13px;color:var(--ink-2);text-align:left;padding:6px 8px 6px 12px;border-radius:10px;cursor:pointer}
.bnav-s i{width:6px;height:6px;border-radius:50%;background:var(--gc);opacity:.45;flex:none}
.bnav-s span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bnav-s b{font-family:var(--mono);font-weight:400;font-size:11px;color:var(--muted)}
.bnav-s:hover{background:var(--panel-2)}
.bnav-s.on{background:var(--gold-1);color:var(--ink);font-weight:500}
.bnav-s.on i{opacity:1}
.bnav-add{display:flex;align-items:center;gap:6px;border:0;background:none;font:inherit;font-size:12.5px;color:var(--muted);padding:6px 12px;cursor:pointer}
.bnav-add svg{width:13px;height:13px}
.bnav-add:hover{color:var(--ink)}
.tpl-tag{font-size:11px;background:var(--panel-2);border-radius:999px;padding:1px 8px;color:var(--muted)}
.sub-title{font-family:var(--serif);font-size:38px;line-height:1.1;border:0;background:transparent;color:var(--ink);padding:2px 6px;margin-left:-6px;border-radius:10px;width:100%;outline:none}
.sub-title:hover{background:rgba(255,255,255,.5)}
.sub-title:focus{background:var(--panel);box-shadow:0 0 0 2px var(--gold-3)}
.sub-kpis{border-top:4px solid var(--gc)}
.sub-kpis .kpi b{font-size:24px}
.btable-wrap{overflow-x:auto;background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--card-shadow)}
.card .btable-wrap{border:0;box-shadow:none;border-radius:0}
.btable{width:100%;border-collapse:collapse;font-size:13px;min-width:860px}
.btable.sup{min-width:620px}
.btable th{font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);text-align:left;padding:11px 8px;border-bottom:1px solid var(--line);background:var(--panel-2);white-space:nowrap}
.btable th.n,.btable td.n{text-align:right}
.btable td{padding:5px 8px;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
.btable td.b,.btable .b{font-weight:600}
.btable tbody tr:hover{background:#FBF8F2}
.btable tfoot td{background:var(--panel-2);padding:11px 8px;border-bottom:0}
.btable .empty-cell{text-align:center;color:var(--muted);padding:28px;white-space:normal}
.ci{font:inherit;font-size:13px;color:var(--ink);border:1px solid transparent;background:transparent;border-radius:8px;padding:6px 7px;width:100%;min-width:0;outline:none}
.ci:hover{border-color:var(--line)}
.ci:focus{border-color:var(--gold-3);background:#fff;box-shadow:0 0 0 3px rgba(243,201,85,.25)}
.ci.num{text-align:right;font-family:var(--mono);font-size:12.5px;width:78px}
.btable:not(.fit) td:nth-child(3) .ci.num{width:50px}
.ci.b{font-weight:600}
.c-desc{min-width:210px;position:sticky;left:0;background:var(--panel);z-index:1}
.cd{display:flex;align-items:center;gap:4px}.cd .ci{flex:1;min-width:120px}
.btable tbody tr:hover .c-desc{background:#FBF8F2}tr.kid .c-desc{background:#FCFAF6}
.btable th:first-child{position:sticky;left:0;z-index:2}
.btable:not(.fit) td:nth-child(2) .ci{min-width:130px}
.c-tot small{display:block;font-size:10.5px;font-weight:400;color:var(--muted)}
.c-ind{display:none;color:var(--faint);padding-left:10px}
tr.kid .c-ind{display:inline}
tr.kid td{background:#FCFAF6}
.c-tog{border:0;background:none;width:22px;height:22px;display:grid;place-items:center;cursor:pointer;color:var(--muted);flex:none}
.c-tog svg{width:13px;height:13px;transition:transform .15s}
.c-tog.open svg{transform:rotate(90deg)}
.cv{display:flex;align-items:center;gap:4px}
.vchk{display:inline-grid;place-items:center}
.vchk input{appearance:none;-webkit-appearance:none;width:16px;height:16px;margin:0;border:1.5px solid var(--line-2);border-radius:5px;background:var(--panel);cursor:pointer;display:grid;place-items:center;transition:background .15s,border-color .15s}
.vchk input:hover{border-color:var(--ink-2)}
.vchk input:checked{background:var(--black);border-color:var(--black)}
.vchk input:checked::after{content:"";width:8px;height:4px;border:2px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.vchk input:focus-visible{outline:2px solid var(--gold-3);outline-offset:2px}
.ci.vp{width:46px}
.vat-off{font-size:11.5px;color:var(--faint)}
.c-paid{position:relative}
.paid-btn{font-family:var(--mono);font-size:12.5px;border:1px dashed var(--line-2);background:transparent;border-radius:8px;padding:5px 8px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;color:var(--muted)}
.paid-btn.has{border-style:solid;border-color:transparent;background:var(--lime-soft);color:var(--lime-text);font-weight:600}
.paid-btn:hover{border-color:var(--ink-2)}
.pb-plus svg{width:11px;height:11px}
.rc-dot{display:inline-grid;vertical-align:middle;margin-left:4px;color:var(--muted)}
.rc-dot svg{width:13px;height:13px}
.ca{display:flex;gap:4px;align-items:center;justify-content:flex-end}
.icon-btn.sm{width:28px;height:28px;border-radius:8px}
.icon-btn.sm svg{width:14px;height:14px}
.chip.bad{background:var(--red-soft);color:var(--red)}
.chip.dashed{background:transparent;border:1px dashed var(--line-2)}
.pay-tr>td{background:var(--gold-1)!important;padding:12px 14px!important;white-space:normal!important}
.pay-panel{display:grid;gap:10px;position:sticky;left:14px;max-width:min(780px,calc(100vw - 120px))}
.pay-list{display:grid;gap:2px;background:var(--panel);border-radius:12px;padding:4px 10px}
.pay-li{display:grid;grid-template-columns:90px 1fr auto auto 30px;gap:10px;align-items:center;padding:5px 0;border-bottom:1px solid var(--line);font-size:13px}
.pay-li:last-child{border-bottom:0}
.pay-add{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pay-add .input{width:auto;flex:1 1 130px;padding:8px 10px}
.pay-add #pay-note{flex:2 1 200px}
@media (max-width:1100px){.bws{grid-template-columns:1fr}.bnav{position:static;max-height:none}.kpis-4{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.cash-grid{grid-template-columns:1fr}.b-tabs-r{margin-left:0;width:100%}.sub-title{font-size:30px}.gcards{grid-template-columns:1fr}}

.gpills{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin-bottom:12px}
.gpill{display:flex;gap:10px;align-items:center;text-align:left;font:inherit;color:inherit;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:10px 12px;cursor:pointer;box-shadow:var(--card-shadow);transition:box-shadow .15s,border-color .15s}
.gpill:hover{border-color:var(--gc)}
.gpill.on{border-color:var(--gc);box-shadow:0 0 0 2px var(--gc) inset,var(--card-shadow)}
.gp-ic{width:34px;height:34px;border-radius:11px;background:var(--gt);color:var(--gc);display:grid;place-items:center;flex:none}
.gp-ic svg{width:17px;height:17px}
.gp-t{display:grid;line-height:1.25}
.gp-t b{font-size:14px;font-weight:600}
.gp-t small{font-size:11.5px;color:var(--muted)}
.subchips{display:flex;flex-wrap:wrap;gap:6px;padding:12px;background:var(--panel-2);border-radius:18px;margin-bottom:20px}
.subchip{display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:13px;border:1px solid transparent;background:transparent;color:var(--ink-2);border-radius:999px;padding:6px 12px;cursor:pointer}
.subchip:hover{background:var(--panel)}
.subchip.has{background:var(--panel);border-color:var(--line)}
.subchip b{font-family:var(--mono);font-weight:400;font-size:11px;color:var(--muted)}
.subchip.on{background:var(--gc);color:#fff;border-color:var(--gc)}
.subchip.on b{color:rgba(255,255,255,.8)}
.subchip.add{color:var(--muted);border:1px dashed var(--line-2)}
.subchip.add svg{width:13px;height:13px}
.sub-head{display:flex;align-items:center;gap:10px}
.sub-head .sub-title{flex:1}

.ffe-row td{background:#FBF9F4}
.ffe-row .c-desc{background:#FBF9F4}
.ffe-badge{flex:none;font-size:9.5px;font-weight:700;letter-spacing:.06em;background:var(--black);color:#fff;border-radius:6px;padding:2px 6px;margin-right:4px}
.ro-desc{display:grid;min-width:0;padding:3px 4px;line-height:1.3}
.ro-desc b{font-weight:600;font-size:13px;white-space:normal}
.ro-desc small{font-size:11.5px;color:var(--muted);white-space:normal}
.ffe-row.est .ro-desc small{color:var(--amber)}
.ffe-row .ro{padding:0 7px;color:var(--ink-2)}
.move-sel{position:relative;display:inline-grid;place-items:center;width:28px;height:28px;border:1px solid var(--line);border-radius:8px;color:var(--ink-2);cursor:pointer;background:var(--panel)}
.move-sel svg{width:14px;height:14px;pointer-events:none}
.move-sel select{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:14px}
.move-sel:hover{border-color:var(--faint)}
/* ---- items table that fits the page (no sideways scrolling) ---- */
.btable-wrap:has(.btable.fit){overflow:visible;container-type:inline-size}
.btable.fit{table-layout:fixed;min-width:0}
.btable.fit col.w-q{width:46px}.btable.fit col.w-p{width:84px}.btable.fit col.w-c{width:76px}.btable.fit col.w-v{width:74px}
.btable.fit col.w-t{width:102px}.btable.fit col.w-pd{width:92px}.btable.fit col.w-r{width:100px}.btable.fit col.w-pr{width:84px}.btable.fit col.w-a{width:62px}
.btable.fit.profit col.w-t{width:96px}.btable.fit.profit col.w-r{width:94px}
.btable.fit th{padding:10px 6px;font-size:10.5px}
.btable.fit th:first-child{position:static;padding-left:14px}
.btable.fit td{padding:6px 4px;white-space:normal;vertical-align:middle}
.btable.fit td:first-child{padding-left:10px}
.btable.fit .c-desc{position:static;min-width:0;background:transparent}
.btable.fit tbody tr:hover .c-desc{background:transparent}
.btable.fit tr.kid td{background:#FCFAF6}
.btable.fit .cd{align-items:center;min-width:0}
.btable.fit .cd .ci{min-width:0}
.c-two{display:grid;gap:0;flex:1;min-width:0}
.c-two .ci{padding:4px 7px}
.c-two .ci.sup{font-size:12px;color:var(--muted);padding-top:2px}
.c-two .ci.sup:focus{color:var(--ink)}
.btable.fit td:nth-child(2) .ci{min-width:0}
.btable.fit .ci.num{width:100%;padding-left:3px;padding-right:4px;font-size:12px}
.btable.fit .ci.num.q{text-align:center}
.btable.fit .ci.vp{width:34px;padding:5px 1px;text-align:center}
.btable.fit .cv{gap:3px}
.btable.fit .vat-off{font-size:11px}
.btable.fit .c-tot{white-space:nowrap}
.btable.fit .c-paid{white-space:nowrap}
.btable.fit .paid-btn{padding:4px 7px;font-size:12px}
.c-rem{white-space:nowrap}
.c-rem b{display:block;font-size:12.5px}
.c-rem .chip{margin-top:3px;font-size:10.5px;padding:1px 7px}
.c-rem .chip svg{width:11px;height:11px}
.btable.fit .ca{gap:2px}
.btable.fit .ro-desc b{font-size:12.5px}
.btable.fit .c-foot{padding-left:14px}
/* narrow: each item becomes a small card */
@container (max-width:760px){
  .btable.fit colgroup,.btable.fit thead{display:none}
  .btable.fit,.btable.fit tbody,.btable.fit tfoot{display:block}
  .btable.fit tr{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px 8px;padding:10px 12px;border-bottom:1px solid var(--line)}
  .btable.fit td{display:block;border:0;padding:0;text-align:left!important}
  .btable.fit td[data-l]::before{content:attr(data-l);display:block;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:1px}
  .btable.fit td.c-desc{grid-column:1/-1}
  .btable.fit td.c-act{grid-column:1/-1}
  .btable.fit td.c-act .ca{justify-content:flex-start}
  .btable.fit .ci.num{text-align:left}
  .btable.fit tr.pay-tr{display:block}
  .btable.fit tfoot tr{grid-template-columns:repeat(3,minmax(0,1fr))}
  .btable.fit tfoot td.c-foot{grid-column:1/-1;padding:0}
  .btable.fit tfoot td.c-act{display:none}
  .btable.fit .pay-panel{position:static;max-width:none}
  .btable.fit .empty-cell{grid-column:1/-1}
}
.btable.fit .pay-panel{position:static;max-width:none}

/* invoices + payments panel */
.pp-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.pp-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.pp-col{display:grid;gap:8px;align-content:start}
.pp-title{display:flex;justify-content:space-between;align-items:center}
.pp-title .linkbtn{display:inline-flex;align-items:center;gap:4px}
.pp-title .linkbtn svg{width:12px;height:12px}
.pp-empty{font-size:13px}
.pay-li.inv{grid-template-columns:minmax(0,1fr) auto auto 30px 30px}
.pay-li .grow{display:grid;min-width:0}
.pay-li .grow b{font-weight:600;font-size:13px}
.pay-li .grow small{font-size:11.5px}
.pay-li .chip{font-size:11px;padding:1px 8px}
.pay-li .chip svg{width:11px;height:11px}
.vinv-form{background:var(--panel);border-radius:12px;padding:10px}
.mini-f{display:flex;align-items:center;gap:6px;flex:1 1 150px}
.mini-f span{font-size:11.5px;color:var(--muted)}
.mini-f .input{flex:1}
.pay-add select.input{flex:1 1 100%;padding:8px 10px}
.inv-mini{display:inline-flex;align-items:center;gap:3px;margin-top:4px;border:0;background:none;padding:0;font:inherit;font-size:10.5px;color:var(--muted);cursor:pointer;white-space:nowrap}
.inv-mini svg{width:11px;height:11px}
.inv-mini.open{color:var(--amber)}.inv-mini.late{color:var(--red)}
.btable.fit .c-paid{white-space:normal}
/* vendor invoices on the Invoices & payments page */
.vi-card .card-head .chip svg{width:12px;height:12px}
.vi-table{display:grid}
.vi-row{display:grid;grid-template-columns:70px minmax(0,1.2fr) minmax(0,1.4fr) 96px 90px 92px 96px;gap:10px;align-items:center;padding:10px 4px;border-bottom:1px solid var(--line);font-size:13px}
.vi-row.head{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding-top:0}
.vi-row>span{min-width:0}
.vi-row>span:nth-child(2),.vi-row>span:nth-child(3){display:grid}
.vi-row small{font-size:11.5px}
.vi-row .r{text-align:right}
.vi-row .inv-act{justify-content:flex-end;gap:4px}
.vi-row.late{background:linear-gradient(90deg,var(--red-soft),transparent 60%)}
.vi-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:900px){.vi-row{grid-template-columns:1fr 1fr auto}.vi-row.head{display:none}.vi-row>span:nth-child(1),.vi-row>span:nth-child(5){display:none}}

.btable.fit col.w-c{width:92px}
.btable.fit .c-cost .ci.num{background:var(--panel-2)}
.btable.fit .c-cost .ci.num:focus{background:#fff}
.btable.fit th:nth-last-child(3){white-space:nowrap}

.cv-tog{display:block;margin:3px 0 0 auto;border:1px solid var(--line-2);background:transparent;border-radius:999px;padding:0 7px;font:inherit;font-size:10px;line-height:17px;color:var(--muted);cursor:pointer;white-space:nowrap}
.cv-tog:hover{border-color:var(--ink-2);color:var(--ink)}
.cv-tog.on{background:var(--amber-soft);border-color:transparent;color:var(--amber);font-weight:600}
.cv-net{display:block;font-family:var(--mono);font-size:10.5px;color:var(--muted);margin-top:2px}
.c-cost{vertical-align:top!important;padding-top:10px!important}
@container (max-width:760px){.cv-tog{margin-left:0}}

.ld{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:3px;font-family:var(--mono);font-size:11.5px;color:var(--ink-2)}
.ld span{white-space:nowrap}
.ld .ld-nv{color:var(--muted)}
.b-row.v .b-main{display:grid}

.ver-h{display:flex;align-items:baseline;gap:10px;margin:22px 0 10px}
.ver-h h3{font-size:22px;font-weight:400}
.ver.preview{border-style:dashed;background:linear-gradient(0deg,var(--panel),var(--panel)) padding-box}
.ver.preview .chip svg{width:12px;height:12px}
.kpi.fee{background:var(--lime-soft)}

/* ---- budget version as an invoice ---- */
.rcpt{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 28px;margin-top:8px}
.rc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:18px;border-bottom:2px solid var(--ink)}
.rc-logo{height:46px;width:auto;display:block}
.rc-doc{text-align:right;display:grid;gap:2px}
.rc-doc b{font-size:26px;font-weight:400;line-height:1.1}
.rc-doc span{font-size:12.5px;color:var(--muted)}
.rc-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
.rc-meta>div{display:grid;gap:1px;font-size:13.5px;min-width:0}
.rc-meta small{font-size:12px;color:var(--muted);line-height:1.4}
.rcpt .ver-note{margin:14px 0 0}
.rc-table{width:100%;border-collapse:collapse;margin-top:14px;font-size:13.5px;table-layout:fixed}
.rc-table th{font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:500;text-align:left;padding:8px 8px;border-bottom:1px solid var(--line-2)}
.rc-table th:nth-child(2){width:56px}.rc-table th:nth-child(3){width:110px}.rc-table th:nth-child(4){width:100px}.rc-table th:nth-child(5){width:130px}
.rc-table .n{text-align:right}
.rc-table td{padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.rc-cat td{padding-top:18px;font-weight:600;font-size:12.5px;letter-spacing:.02em;border-bottom:1px solid var(--ink-2);background:transparent}
.rc-cat td.n{font-weight:600}
.rc-desc b{font-weight:500}
.rc-desc small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.rc-table td small{display:block;font-size:11px;color:var(--muted)}
.rc-line.is-new td,.rc-line.is-chg td{background:#FBF6E6}
.rc-line.is-new .rc-desc b,.rc-line.is-chg .rc-desc b,.rc-line.is-new .rc-amt b,.rc-line.is-chg .rc-amt b{font-weight:700}
.rc-line.is-removed td{color:var(--muted)}
.rc-line.is-removed .rc-desc b{text-decoration:line-through}
.rc-amt .was{text-decoration:line-through}
.rc-table tfoot td{border-bottom:0;padding:6px 8px;color:var(--ink-2)}
.rc-table tfoot tr:first-child td{padding-top:16px}
.rc-grand td{border-top:2px solid var(--ink)!important;padding-top:12px!important;font-family:var(--serif);font-size:22px;color:var(--ink)!important}
.rc-grand td.n{font-size:28px}
.rc-grand small{font-family:var(--sans);font-size:12.5px;display:inline!important;margin-left:6px}
.rc-cmp{margin-top:6px}
@media (max-width:720px){
  .rcpt{padding:16px}
  .rc-meta{grid-template-columns:1fr 1fr}
  .rc-table thead{display:none}
  .rc-table,.rc-table tbody,.rc-table tfoot{display:block}
  .rc-table tr{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px 8px;padding:8px 0;border-bottom:1px solid var(--line)}
  .rc-table td{border:0;padding:0;text-align:left!important}
  .rc-table td.rc-desc,.rc-cat td:first-child{grid-column:1/-1}
  .rc-line td[data-l]::before{content:attr(data-l);display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
  .rc-table tfoot tr,.rc-cat{grid-template-columns:1fr auto}
  .rc-table tfoot td[colspan]{grid-column:1}
}

.c-inv{text-align:center;width:84px}
.inv-ic{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:3px 9px;font:inherit;font-size:12px;cursor:pointer;color:var(--ink-2)}
.inv-ic svg{width:14px;height:14px}
.inv-ic b{font-family:var(--mono);font-weight:600}
.inv-ic.none{border-style:dashed;color:var(--faint)}
.inv-ic.none svg:last-child{width:11px;height:11px}
.inv-ic.open{background:var(--amber-soft);border-color:transparent;color:var(--amber)}
.inv-ic.late{background:var(--red-soft);border-color:transparent;color:var(--red)}
.inv-ic.ok{background:var(--lime-soft);border-color:transparent;color:var(--lime-text)}
.inv-ic:hover,.inv-ic.on{border-color:var(--ink-2);color:var(--ink)}
.pay-li.sinv{grid-template-columns:minmax(0,1fr) auto auto 30px auto}
.btable.sup .pay-panel{position:static;max-width:none}
.kpis-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:720px){.kpis-3{grid-template-columns:1fr}}
.c-owe small{display:block;font-size:11px;font-weight:400}
.btable.sup td.c-owe{background:rgba(166,236,46,.08)}
/* ---------- FF&E schedule ---------- */
.fx{margin-top:6px}
.fx-top{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--line)}
.fx-intro h2{font-size:30px;font-weight:400;line-height:1.1}
.fx-intro p{font-size:13px;max-width:520px;margin-top:4px}
.fx-kpis{display:flex;gap:10px;flex-wrap:wrap}
.fx-kpis>div{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:10px 16px;min-width:112px;display:grid;gap:2px;box-shadow:var(--card-shadow)}
.fx-kpis span{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.fx-kpis b{font-size:21px;font-weight:500}
.fx-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:16px 0}
.fx-bar svg{width:15px;height:15px}
.fx-grow{flex:1}
.fx-room{margin-bottom:18px;padding:16px}
.fx-room-h{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.fx-room-name{flex:1;min-width:0;font-family:var(--serif);font-size:26px;font-weight:400;line-height:1.2}
input.fx-room-name{padding:4px 10px}
.fx-meta{font-size:12.5px;color:var(--muted);white-space:nowrap}
.fx-x{border:0;background:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;cursor:pointer;color:var(--muted);flex:none}
.fx-x svg{width:16px;height:16px}
.fx-x:hover,.fx-x:focus-visible{color:var(--red);background:var(--red-soft)}
.fx-confirm{display:inline-flex;gap:6px;align-items:center;font-size:13px;flex-wrap:wrap}
.fx-empty{border:1px dashed var(--line-2);border-radius:14px;padding:18px;text-align:center;color:var(--muted);font-size:13.5px}
/* inputs */
.fx-in{font:inherit;font-size:14px;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:7px 10px;min-width:0;outline:none;transition:border-color .15s,box-shadow .15s}
.fx-in:hover{border-color:var(--line-2)}
.fx-in:focus{border-color:var(--gold-3);box-shadow:0 0 0 3px rgba(243,201,85,.25)}
.fx-in::placeholder{color:var(--faint)}
.fx-ro{min-width:0}
/* product */
.fx-item{background:var(--panel-2);border-radius:18px;padding:12px;margin-bottom:12px}
.fx-item:last-child{margin-bottom:0}
.fx-item-h{display:grid;grid-template-columns:minmax(150px,1fr) minmax(150px,230px) auto auto minmax(80px,auto) 30px;gap:8px;align-items:center;margin-bottom:12px}
.fx-item-h .fx-confirm{grid-column:1/-1;justify-content:flex-end}
.fx-name{width:100%;font-weight:600}
span.fx-name{font-size:16px;padding:0 4px}
.fx-cat{width:100%}
span.fx-cat{color:var(--muted);font-size:13px}
.fx-qty{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.fx-num{width:52px;text-align:center}
.fx-st{position:relative;display:inline-flex;align-items:center;border-radius:999px;background:var(--panel);color:var(--ink-2);font-size:12.5px;font-weight:500}
.fx-st select{appearance:none;-webkit-appearance:none;border:0;background:transparent;font:inherit;color:inherit;padding:6px 28px 6px 13px;cursor:pointer;border-radius:999px}
.fx-st>span{padding:5px 13px}
.fx-st svg{position:absolute;right:9px;width:12px;height:12px;pointer-events:none}
.fx-st select:focus-visible{outline:2px solid var(--gold-3)}
.fx-st.st-specified{background:#E8E6F4;color:#4B4690}
.fx-st.st-approved{background:var(--lime-soft);color:var(--lime-text)}
.fx-st.st-ordered{background:var(--amber-soft);color:var(--amber)}
.fx-st.st-delivered,.fx-st.st-installed{background:var(--black);color:#fff}
.fx-total{min-width:80px;text-align:right;font-size:15px;color:var(--amber)}
/* options */
.fx-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px}
.fx-opt{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px;display:grid;gap:10px;align-content:start}
.fx-opt.sel{border:2px solid var(--black);padding:11px}
.fx-tag{position:absolute;top:-9px;left:12px;background:var(--black);color:#fff;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border-radius:6px;padding:2px 8px}
.fx-letter{position:absolute;top:8px;right:10px;font-family:var(--mono);font-size:11px;color:var(--faint)}
.fx-opt-main{display:grid;grid-template-columns:84px minmax(0,1fr);gap:12px;align-items:start}
.fx-img{width:84px;height:84px;border-radius:12px;overflow:hidden;border:0;padding:0;background:var(--panel-2);display:grid;place-items:center;cursor:pointer;color:var(--faint)}
.fx-img img{width:100%;height:100%;object-fit:cover;display:block}
.fx-img svg{width:24px;height:24px}
label.fx-img:hover{color:var(--ink-2);background:#EFEAE1}
span.fx-img{cursor:default}
.fx-spin{width:18px;height:18px;border-radius:50%;border:2px solid var(--line-2);border-top-color:var(--ink);animation:fxspin .8s linear infinite}
@keyframes fxspin{to{transform:rotate(360deg)}}
.fx-fields{display:grid;gap:3px;min-width:0}
.fx-opt .fx-in{background:transparent;border-color:transparent;padding:4px 6px;font-size:13px}
.fx-opt .fx-in:hover{border-color:var(--line)}
.fx-opt .fx-in:focus{background:#fff;border-color:var(--gold-3)}
.fx-title{font-weight:600;font-size:14px!important;padding-right:18px!important}
span.fx-title{padding:4px 18px 4px 6px;line-height:1.3}
.fx-row{display:flex;gap:6px;align-items:center;justify-content:space-between}
.fx-fields>.fx-in{width:100%}
.fx-row>.fx-in,.fx-row>.fx-ro{flex:1 1 0;width:0;min-width:0}
.fx-vendor{color:var(--muted)}
span.fx-vendor,span.fx-lead{padding:4px 6px;font-size:12.5px}
.fx-price{flex:0 0 92px!important;width:92px!important;text-align:right;font-weight:600}
b.fx-price{font-size:13.5px;padding:4px 6px}
.fx-lead{font-size:12px!important;color:var(--ink-2)}
.fx-links{display:inline-flex;align-items:center;gap:4px;flex:none}
.fx-go{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;color:var(--ink-2)}
a.fx-go:hover{background:var(--panel-2);color:var(--ink)}
.fx-go.off{color:var(--line-2)}
.fx-go svg{width:14px;height:14px}
.fx-det-btn{border:0;background:none;font:inherit;font-size:12px;font-weight:500;color:var(--ink-2);cursor:pointer;padding:4px 6px;border-radius:8px}
.fx-det-btn:hover{background:var(--panel-2)}
.fx-det-btn i{font-style:normal;font-size:9px;display:inline-block;transition:transform .15s}
.fx-det-btn[aria-expanded="true"] i{transform:rotate(180deg)}
.fx-det{background:var(--panel-2);border-radius:12px;padding:10px;display:grid;gap:6px;font-size:12.5px}
.fx-det label:not(.btn),.fx-det>div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px;align-items:center}
.fx-det label:not(.btn)>span,.fx-det>div>span{color:var(--muted);font-size:12px}
.fx-det .fx-in{background:var(--panel)!important;border-color:var(--line)!important}
.fx-det b{font-weight:500}
.fx-det .row{margin-top:4px}
.fx-opt-f{display:flex;gap:6px;align-items:center}
.fx-sel{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:13px;font-weight:500;border:1px solid var(--line-2);background:var(--panel-2);color:var(--ink);border-radius:999px;padding:7px 12px;cursor:pointer;transition:background .15s}
.fx-sel:hover:not(:disabled){background:#EAE4D9}
.fx-sel.on{background:var(--black);border-color:var(--black);color:#fff}
.fx-sel.on:hover:not(:disabled){background:#2C2A26}
.fx-sel svg{width:14px;height:14px}
.fx-sel:disabled{cursor:default;opacity:.75}
.fx-by{font-size:11.5px;color:var(--muted);margin-top:-4px}
.fx-add{display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;min-height:150px;border:1.5px dashed var(--line-2);border-radius:16px;background:transparent;font:inherit;font-size:13px;font-weight:500;color:var(--muted);cursor:pointer}
button.fx-add:hover{color:var(--ink);border-color:var(--faint);background:rgba(255,255,255,.5)}
.fx-add svg{width:16px;height:16px}
.fx-linkform{cursor:default;align-items:stretch;padding:14px;background:var(--panel);border-style:solid;border-color:var(--gold-3)}
.fx-note{width:100%;margin-top:10px;font-size:13px}
p.fx-note{background:var(--panel);border-radius:10px;padding:8px 12px;color:var(--ink-2)}
@media (max-width:720px){.fx-kpis>div{min-width:0;flex:1}.fx-item-h{grid-template-columns:1fr auto auto}.fx-item-h .fx-name,.fx-item-h .fx-catsel{grid-column:1/-1}.fx-opts{grid-template-columns:1fr}.fx-room-name{font-size:22px}}

textarea.fx-title{resize:none;field-sizing:content;min-height:30px;line-height:1.3;width:100%;display:block;overflow:hidden}
.fx-opt-main{grid-template-columns:76px minmax(0,1fr)}.fx-img{width:76px;height:76px}
.fx-adds{display:grid;grid-template-columns:1fr 1fr;gap:8px;min-height:150px}
.fx-adds .fx-linkform{grid-column:1/-1}
.fx-adds .fx-add{min-height:0}

.fx-catsel{position:relative;display:flex;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:10px;min-width:0}
.fx-catsel:hover{border-color:var(--line-2)}
.fx-catsel:focus-within{border-color:var(--gold-3);box-shadow:0 0 0 3px rgba(243,201,85,.25)}
.fx-catsel select{appearance:none;-webkit-appearance:none;border:0;background:transparent;font:inherit;font-size:14px;color:var(--ink);padding:7px 30px 7px 10px;width:100%;min-width:0;cursor:pointer;outline:none;text-overflow:ellipsis}
.fx-catsel.empty select{color:var(--faint)}
.fx-catsel svg{position:absolute;right:10px;width:13px;height:13px;pointer-events:none;color:var(--muted)}
@media (max-width:1100px) and (min-width:721px){.fx-item-h{grid-template-columns:minmax(0,1fr) auto auto auto 30px}.fx-item-h .fx-name{grid-column:1/-1}}
/* ---------- subcontractor quotes (compact rows) ---------- */
.q-req{margin-bottom:12px;padding:12px 14px}
.q-head{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,260px) 28px;gap:8px;align-items:center}
.q-head .fx-confirm{grid-column:1/-1;justify-content:flex-end}
.q-title{font-family:var(--serif);font-size:20px;padding:3px 10px;border-color:transparent;background:transparent}
.q-title:hover{border-color:var(--line)}
.q-status{display:flex;align-items:center;gap:8px;white-space:nowrap}
.q-status .chip{font-size:12px}
.q-status .chip svg{width:12px;height:12px}
.q-sub{display:flex;align-items:center;gap:6px;min-width:0}
.q-sub>span:first-child{font-size:11.5px;color:var(--muted);white-space:nowrap}
.q-sub .fx-catsel{flex:1}
.q-sub select{font-size:12.5px!important;padding:5px 26px 5px 8px!important}
.q-scope{width:100%;font-size:12.5px;margin:6px 0 8px;padding:5px 10px;background:var(--panel-2);border-color:transparent}
.q-rows{display:grid;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.q-row{display:grid;grid-template-columns:minmax(110px,1.1fr) 84px 58px 96px 108px minmax(120px,1.4fr) 28px 126px;gap:5px;align-items:center;padding:5px 8px;border-bottom:1px solid var(--line);background:var(--panel)}
.q-row.q-lab{background:var(--panel-2);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding-top:6px;padding-bottom:6px}
.q-row.sel{background:var(--lime-soft);box-shadow:inset 3px 0 0 var(--lime-text)}
.q-row>span{min-width:0}
.q-row .r{text-align:right}
.q-row .fx-in{width:100%;padding:3px 6px;font-size:13px;background:transparent;border-color:transparent}
.q-row .fx-in:hover{border-color:var(--line);background:var(--panel)}
.q-row .fx-in:focus{background:#fff;border-color:var(--gold-3)}
.q-two{display:grid;gap:0}
.q-name{font-weight:600}
.q-small{font-size:11.5px!important;color:var(--ink-2)}
.q-num{text-align:right;font-weight:600;font-size:14px!important}
.q-date{padding:3px 2px!important}
.q-vat{display:flex;align-items:center;gap:3px}
.q-vat small{font-size:11px;color:var(--muted)}
.q-vp{width:32px!important;padding:2px!important;text-align:center;font-size:12px!important}
.q-tot{display:grid;line-height:1.2}
.q-tot b{font-size:13.5px}
.q-tot small{font-size:10.5px}
.q-low{color:var(--lime-text);font-weight:600}
.q-diff{color:var(--amber)}
.q-pdf .icon-btn{cursor:pointer}
.q-act{display:flex;align-items:center;gap:4px}
.q-act .fx-sel{padding:4px 8px;font-size:12px}
.q-act .fx-x{width:26px;height:26px}
.q-addrow{display:flex;align-items:center;gap:6px;border:0;background:transparent;font:inherit;font-size:12.5px;color:var(--muted);padding:7px 12px;cursor:pointer;text-align:left}
.q-addrow:hover{color:var(--ink);background:var(--panel-2)}
.q-addrow svg{width:13px;height:13px}
.ffe-badge.qb{border:0;cursor:pointer;background:var(--gold-3);color:var(--ink)}
.q-rows{container-type:inline-size}
@container (max-width:780px){
  .q-row{grid-template-columns:minmax(0,1fr) 90px 60px 96px;row-gap:2px}
  .q-row.q-lab{display:none}
  .q-row>span:nth-child(5){grid-column:1}
  .q-row>span:nth-child(6){grid-column:2/-1}
  .q-row>span:nth-child(7){grid-column:1}
  .q-row>span:nth-child(8){grid-column:2/-1;justify-content:flex-end}
}
@media (max-width:900px){.q-head{grid-template-columns:1fr 28px}.q-status{grid-row:2;grid-column:1/-1}.q-sub{grid-column:1/-1;grid-row:3}}

.q-mk{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-2px 0 8px;padding:6px 10px;border-radius:10px;background:var(--panel-2);font-size:12.5px;color:var(--ink-2)}
.q-mk.on{background:var(--gold-1)}
.q-mk-t{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.q-mk-p{width:48px!important;text-align:center;padding:3px!important;font-size:13px!important;background:var(--panel)!important}
.q-mk-note{color:var(--muted);font-size:12px;flex:1;min-width:220px}
.q-cl{color:var(--amber);font-weight:600}
.q-mk-in{font-size:12px;color:var(--amber);font-weight:600}

@media (max-width:1100px){
  .ov-grid{grid-template-columns:1fr}
  .side-col{grid-template-columns:1fr 1fr}
  .pay-grid{grid-template-columns:1fr}
}
@media (max-width:880px){
  body{padding-block:12px 24px}
  .app{grid-template-columns:1fr;border-radius:26px}
  .side{position:fixed;left:0;top:0;bottom:0;width:min(300px,86vw);max-height:none;z-index:45;background:var(--side-solid);padding-top:calc(26px + env(safe-area-inset-top,0px));transform:translateX(-105%);transition:transform .2s}
  .side.open{transform:none;box-shadow:var(--shadow)}
  .scrim.open{display:block;position:fixed;inset:0;background:rgba(20,16,12,.35);z-index:44}
  .btn.menu-btn{display:inline-flex}
  .panel-main{padding:18px 16px 32px;margin:6px;border-radius:22px}
  .side-col{grid-template-columns:1fr}
  .thead{display:none}
  .trow{grid-template-columns:minmax(0,1fr) auto;padding:10px 8px}
  .trow .detail{display:none}
  .form-grid{grid-template-columns:1fr}
  .pager button{max-width:100%;flex:1}
}
@media (max-width:520px){
  .refs{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .hero{min-height:280px;padding:18px}
  .kbd{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.stage-ctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.sc-done,.sc-ask{font-size:12.5px;color:var(--muted)}
.n-bullets{min-height:96px;resize:vertical;line-height:1.5}
.lang-tog{display:inline-flex;background:var(--panel-2);border:1px solid var(--line);border-radius:999px;padding:2px;gap:2px}
.lang-tog button{border:0;background:transparent;font:inherit;font-size:11.5px;font-weight:600;letter-spacing:.04em;color:var(--muted);padding:4px 9px;border-radius:999px;cursor:pointer}
.lang-tog button[aria-pressed="true"]{background:var(--panel);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
