/* Back end: same brand tokens as the front page, laid out as a working app with tabs. */
:root{
  --bg:#F0EAE1;          /* Putty */
  --surface:#FFFFFF;
  --surface-2:#F7F3EE;
  --ink:#352B34;         /* Charcoal */
  --ink-soft:#6B5F67;
  --ink-faint:#9A8E92;
  --line:rgba(53,43,52,0.12);
  --line-strong:rgba(53,43,52,0.24);
  --burgundy:#78141F;
  --burgundy-ink:#FFFFFF;
  --burgundy-tint:rgba(120,20,31,0.07);
  --flare:#E6454E;
  --rust:#DB845E;
  --indigo:#00495E;
  --ok:#3F6B3A;
  --focus:#00495E;
  --display:'Barlow Condensed','Arial Narrow',Arial,sans-serif;
  --body:'Barlow',Arial,Helvetica,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box;}
[hidden]{display:none!important;}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--body); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:var(--display); font-weight:700; margin:0; color:var(--ink); text-wrap:balance;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--focus); outline-offset:3px; border-radius:6px;}
@media (prefers-reduced-motion: reduce){ *{transition:none!important;} }

.wrap{max-width:1180px; margin:0 auto; padding-inline:24px;}
@media (max-width:600px){ .wrap{padding-inline:16px;} }

/* Header */
header.top{position:sticky; top:0; z-index:10; background:color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
.top-row{display:flex; align-items:center; gap:16px; padding-block:14px; flex-wrap:wrap;}
.brand{display:flex; align-items:center; gap:12px; margin-right:auto; text-decoration:none;}
.logo{width:104px; height:35px; background:url("../assets/nulogic-wordmark.png") left center/contain no-repeat; flex:none;}
.brand-label{font-family:var(--display); font-weight:600; font-size:13px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-soft); padding-left:12px; border-left:1px solid var(--line-strong);}
.who{display:flex; align-items:center; gap:12px; font-size:14px; color:var(--ink-soft);}
@media (max-width:600px){ .who .who-email{display:none;} }

/* Buttons */
.btn{appearance:none; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:var(--display); font-weight:600; font-size:15px; letter-spacing:0.04em; text-transform:uppercase; padding:11px 20px; border-radius:999px; border:1px solid transparent; cursor:pointer; text-decoration:none; transition:background .15s ease, border-color .15s ease, color .15s ease;}
.btn-primary{background:var(--burgundy); color:var(--burgundy-ink);}
.btn-primary:hover{background:color-mix(in srgb, var(--burgundy) 88%, #000);}
.btn-quiet{background:transparent; color:var(--ink); border-color:var(--line-strong);}
.btn-quiet:hover{border-color:var(--burgundy); color:var(--burgundy);}
.btn-sm{padding:7px 14px; font-size:13.5px;}
.btn[disabled]{opacity:.6; cursor:progress;}
.link-btn{appearance:none; background:none; border:0; padding:0; font:inherit; color:var(--ink-soft); text-decoration:underline; cursor:pointer;}
.link-btn:hover{color:var(--burgundy);}

/* Fields */
.field{display:flex; flex-direction:column; gap:6px; min-width:0;}
.field label{font-size:12.5px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft);}
.field input,.field select,.field textarea{font:inherit; font-size:15px; color:var(--ink); background:var(--surface-2); border:1px solid var(--line-strong); border-radius:10px; padding:10px 12px; width:100%;}
.hint{font-size:13px; color:var(--ink-faint); margin:0;}
.msg{margin:12px 0 0; font-size:14px; font-weight:600;}
.msg.error{color:var(--burgundy);}
.msg.ok{color:var(--ok);}

/* Sign in */
.signin{max-width:440px; margin:72px auto; background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:32px;}
.signin .eyebrow{font-family:var(--display); font-weight:600; font-size:13px; letter-spacing:0.16em; text-transform:uppercase; color:var(--flare); display:block; margin-bottom:6px;}
.signin h1{font-size:34px; text-transform:uppercase; line-height:1;}
.signin p.lead{margin:10px 0 22px; color:var(--ink-soft); font-size:15px;}
.signin form{display:flex; flex-direction:column; gap:14px;}
.code-input{font-family:var(--display)!important; font-size:30px!important; letter-spacing:0.4em; text-align:center;}
@media (max-width:600px){ .signin{margin:32px auto; padding:24px 20px;} }

/* App shell */
nav.tabs{display:flex; gap:4px; padding-block:16px 0; overflow-x:auto;}
nav.tabs button{appearance:none; background:none; border:0; cursor:pointer; white-space:nowrap; font-family:var(--display); font-weight:600; font-size:16px; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink-soft); padding:8px 14px; border-radius:999px;}
nav.tabs button:hover{background:var(--burgundy-tint); color:var(--burgundy);}
nav.tabs button[aria-selected="true"]{background:var(--burgundy); color:var(--burgundy-ink);}
main.panel{padding-block:24px 64px;}
.panel-head{display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap; margin-bottom:18px;}
.panel-head h2{font-size:34px; text-transform:uppercase; line-height:1;}
.panel-head p{margin:6px 0 0; color:var(--ink-soft); font-size:15px; max-width:60ch;}

.card{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:22px;}
.card + .card{margin-top:14px;}
.card h3{font-size:19px; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:12px;}
.soon{border-style:dashed; background:transparent; color:var(--ink-soft);}

/* Settings: people with access */
ul.people{list-style:none; margin:0; padding:0;}
ul.people li{display:flex; align-items:center; gap:12px; padding:12px 0; border-top:1px solid var(--line); flex-wrap:wrap;}
ul.people li:first-child{border-top:0;}
.person-email{font-weight:600; margin-right:auto; word-break:break-all;}
.person-meta{font-size:13px; color:var(--ink-faint);}
.you{font-family:var(--display); font-weight:600; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--indigo); border:1px solid var(--indigo); border-radius:999px; padding:2px 8px;}
.add-row{display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap;}
.add-row .field{flex:1 1 260px;}

/* Staff tab ---------------------------------------------------------------- */
.staff-toolbar{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:12px;}
.staff-toolbar .field{flex:0 1 240px;}
.staff-toolbar .field.grow{flex:1 1 260px;}
.staff-toolbar input,.staff-toolbar select{background:var(--surface);}
.staff-summary{display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:16px;}
.summary-total{font-family:var(--display); font-weight:600; font-size:15px; letter-spacing:0.04em; text-transform:uppercase; margin-right:6px;}
.chip{appearance:none; cursor:pointer; font:inherit; font-size:13.5px; color:var(--ink); background:var(--surface); border:1px solid var(--line-strong); border-left:3px solid var(--rust); border-radius:8px; padding:5px 10px;}
.chip:hover{border-color:var(--burgundy); border-left-color:var(--burgundy);}
.chip.chip-on{background:var(--burgundy); color:var(--burgundy-ink); border-color:var(--burgundy);}
.chip.chip-done{border-left-color:var(--ok); color:var(--ink-soft);}

.staff-group h3{display:flex; align-items:baseline; gap:8px;}
.group-sub{font-family:var(--body); font-weight:500; font-size:14px; letter-spacing:0; text-transform:none; color:var(--ink-faint);}
.group-count{margin-left:auto; font-family:var(--body); font-weight:600; font-size:13px; color:var(--ink-faint);}
ul.people-list{list-style:none; margin:0; padding:0;}
li.person{display:grid; grid-template-columns:56px minmax(0,1fr) auto auto; gap:14px; align-items:center; padding:10px 0; border-top:1px solid var(--line);}
li.person:first-child{border-top:0;}
.person-main{display:flex; flex-direction:column; min-width:0;}
.person-name{font-weight:600;}
.person-role{font-size:13.5px; color:var(--ink-soft);}
.person-also{font-size:12.5px; color:var(--indigo);}
@media (max-width:820px){
  li.person{grid-template-columns:56px minmax(0,1fr) auto; }
  li.person .ticks{grid-column:1 / -1;}
}

.avatar{width:56px; height:56px; border-radius:12px; object-fit:cover; display:block; background:var(--surface-2);}
.avatar-lg{width:112px; height:112px; border-radius:18px;}
.no-photo{display:flex; flex-direction:column; align-items:center; justify-content:center; border:1.5px dashed var(--rust); background:color-mix(in srgb, var(--rust) 10%, var(--surface)); color:var(--ink-soft); text-align:center; line-height:1.05;}
.no-photo-initials{font-family:var(--display); font-weight:700; font-size:16px; color:var(--ink);}
.no-photo-text{font-size:9.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; margin-top:2px;}
.avatar-lg .no-photo-initials{font-size:30px;}
.avatar-lg .no-photo-text{font-size:12px;}

.ticks{display:flex; gap:6px; flex-wrap:wrap;}
.tick{display:inline-flex; align-items:center; gap:7px; cursor:pointer; font-size:13px; padding:6px 10px; border-radius:8px; border:1px solid var(--line-strong); background:var(--surface-2); color:var(--ink-soft); user-select:none;}
.tick input{width:16px; height:16px; margin:0; accent-color:var(--ok); cursor:pointer;}
.tick.is-done{background:color-mix(in srgb, var(--ok) 10%, var(--surface)); border-color:color-mix(in srgb, var(--ok) 45%, transparent); color:var(--ink);}
.tick:hover{border-color:var(--burgundy);}

/* Edit sheet */
dialog.sheet{border:0; padding:0; border-radius:18px; width:min(560px, calc(100vw - 32px)); max-height:calc(100vh - 32px); background:var(--surface); color:var(--ink); box-shadow:0 24px 60px rgba(53,43,52,0.25);}
dialog.sheet::backdrop{background:rgba(53,43,52,0.45);}
dialog.sheet form{padding:24px; display:flex; flex-direction:column; gap:16px;}
.sheet-head{display:flex; justify-content:space-between; align-items:center; gap:12px;}
.sheet-head h2{font-size:26px; text-transform:uppercase;}
.sheet-photo{display:flex; gap:16px; align-items:center; flex-wrap:wrap;}
.sheet-photo .hint{margin-top:8px;}
.file-btn{position:relative; overflow:hidden;}
.file-btn input{position:absolute; inset:0; opacity:0; cursor:pointer;}
.sheet-fields{display:flex; flex-direction:column; gap:12px;}
fieldset.field{border:0; padding:0; margin:0;}
fieldset.field legend{font-size:12.5px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:6px; padding:0;}
.check-grid{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:6px;}
@media (max-width:520px){ .check-grid{grid-template-columns:1fr;} }
label.check{display:flex; gap:8px; align-items:center; font-size:14px; padding:7px 10px; border:1px solid var(--line); border-radius:8px; cursor:pointer;}
label.check input{accent-color:var(--burgundy); width:16px; height:16px; margin:0;}
.sheet-foot{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.btn-danger{background:transparent; color:var(--burgundy); border-color:color-mix(in srgb, var(--burgundy) 40%, transparent); margin-left:auto;}
.btn-danger:hover{background:var(--burgundy-tint);}

/* Toast */
.toast{position:fixed; left:50%; bottom:24px; transform:translateX(-50%); z-index:50; background:var(--ink); color:#fff; font-size:14px; padding:10px 16px; border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,0.2); max-width:calc(100vw - 32px);}
.toast.error{background:var(--burgundy);}
fieldset.field label.check{text-transform:none; letter-spacing:0; font-weight:500; font-size:14px; color:var(--ink);}

/* Workspace ---------------------------------------------------------------- */
.ws-switch{display:inline-flex; gap:4px; padding:4px; background:var(--surface); border:1px solid var(--line); border-radius:999px; margin-bottom:14px;}
.ws-switch button{appearance:none; border:0; background:none; cursor:pointer; font-family:var(--display); font-weight:600; font-size:15px; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink-soft); padding:7px 16px; border-radius:999px;}
.ws-switch button[aria-selected="true"]{background:var(--ink); color:#fff;}
.chip.chip-alert{border-left-color:var(--flare); background:color-mix(in srgb, var(--flare) 12%, var(--surface)); font-weight:600;}
.chip.chip-warn{border-left-color:var(--rust); font-weight:600;}
.chip.chip-plain{border-left-color:var(--indigo);}

ul.job-list{list-style:none; margin:0; padding:0;}
li.job{display:grid; grid-template-columns:150px minmax(0,1fr) 150px auto; gap:16px; align-items:center; padding:14px 0; border-top:1px solid var(--line);}
li.job:first-child{border-top:0;}
@media (max-width:820px){
  li.job{grid-template-columns:1fr auto; gap:10px;}
  li.job .due-badge{grid-column:1 / -1; flex-direction:row; gap:8px; align-items:baseline;}
  li.job .job-main{grid-column:1 / -1;}
}
.due-badge{display:flex; flex-direction:column; gap:2px; padding:8px 10px; border-radius:10px; border-left:4px solid var(--line-strong); background:var(--surface-2);}
.due-label{font-family:var(--display); font-weight:700; font-size:15px; letter-spacing:0.02em; text-transform:uppercase; line-height:1.1;}
.due-date{font-size:12.5px; color:var(--ink-soft);}
.due-overdue .due-badge{border-left-color:var(--flare); background:color-mix(in srgb, var(--flare) 14%, var(--surface));}
.due-overdue .due-label{color:var(--burgundy);}
.due-today .due-badge{border-left-color:var(--rust); background:color-mix(in srgb, var(--rust) 16%, var(--surface));}
.due-soon .due-badge{border-left-color:var(--rust);}
.due-later .due-badge{border-left-color:var(--indigo);}
.due-none .due-label{color:var(--ink-faint);}

.job-main{display:flex; flex-direction:column; gap:3px; min-width:0;}
.job-top{display:flex; gap:8px; align-items:center; flex-wrap:wrap;}
.job-ref{font-family:var(--display); font-weight:700; font-size:14px; letter-spacing:0.04em; color:var(--burgundy);}
.job-title{appearance:none; background:none; border:0; padding:0; text-align:left; font:inherit; font-weight:600; font-size:15.5px; color:var(--ink); cursor:pointer; overflow-wrap:anywhere;}
.job-title:hover{color:var(--burgundy); text-decoration:underline;}
.job-meta{font-size:13px; color:var(--ink-soft);}

.cat{display:inline-block; font-size:12px; font-weight:600; padding:2px 8px; border-radius:999px; border:1px solid currentColor; white-space:nowrap;}
.cat-design{color:var(--burgundy);}
.cat-content{color:var(--indigo);}
.cat-internal{color:var(--ink-soft);}
.cat-digital{color:#9A4A2B;}
.cat-social{color:#B42F38;}
.cat-pr{color:var(--ok);}

.status-select{font:inherit; font-size:14px; font-weight:600; border-radius:999px; padding:7px 12px; border:1px solid var(--line-strong); background:var(--surface); color:var(--ink); cursor:pointer;}
.status-select.status-new{border-color:var(--indigo); color:var(--indigo);}
.status-select.status-in_progress{border-color:var(--rust); color:#9A4A2B; background:color-mix(in srgb, var(--rust) 10%, var(--surface));}
.status-select.status-complete{border-color:var(--ok); color:var(--ok);}

details.month summary{display:flex; justify-content:space-between; align-items:baseline; gap:12px; cursor:pointer; list-style:none;}
details.month summary::-webkit-details-marker{display:none;}
details.month summary::before{content:"+"; font-family:var(--display); font-weight:700; color:var(--ink-faint); margin-right:4px;}
details.month[open] summary::before{content:"\2212";}
.month-name{font-family:var(--display); font-weight:700; font-size:22px; text-transform:uppercase; margin-right:auto;}
.month-total{font-weight:600; color:var(--ink-soft); font-size:14px;}
.cat-counts{display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); gap:8px; margin:16px 0;}
@media (max-width:820px){ .cat-counts{grid-template-columns:repeat(2, minmax(0,1fr));} }
.cat-count{display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2);}
.cat-count-n{font-family:var(--display); font-weight:700; font-size:28px; line-height:1;}
.cat-count.is-zero{opacity:.55;}
ul.done-list{list-style:none; margin:0; padding:0;}
ul.done-list li{display:grid; grid-template-columns:80px minmax(0,1fr) auto auto 150px; gap:12px; align-items:center; padding:9px 0; border-top:1px solid var(--line);}
@media (max-width:820px){ ul.done-list li{grid-template-columns:70px minmax(0,1fr); } ul.done-list li .cat, ul.done-list li .done-type, ul.done-list li .done-date{grid-column:2;} }
.done-type{font-size:12.5px; color:var(--ink-faint);}
.done-date{font-size:13px; color:var(--ink-soft); text-align:right;}

/* Job sheet */
dialog.sheet-wide{width:min(720px, calc(100vw - 32px));}
.jd-ref{margin:0 0 2px; font-family:var(--display); font-weight:600; font-size:14px; letter-spacing:0.06em; text-transform:uppercase; color:var(--burgundy);}
.jd-request{background:var(--surface-2); border:1px solid var(--line); border-radius:12px; padding:14px 16px;}
.jd-request h3{font-size:15px; text-transform:uppercase; letter-spacing:0.04em; margin-bottom:8px;}
.kv{display:grid; grid-template-columns:130px minmax(0,1fr); gap:10px; padding:5px 0; font-size:14.5px;}
.kv-k{color:var(--ink-soft); font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:0.04em;}
.kv-v{overflow-wrap:anywhere;}
.kv-v a{color:var(--indigo);}
ul.file-list{margin:0; padding-left:18px;}
.jd-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px;}
.jd-grid .full{grid-column:1 / -1;}
@media (max-width:600px){ .jd-grid{grid-template-columns:1fr 1fr;} }
.next-step{font-size:12.5px; font-weight:600; color:var(--ink); background:color-mix(in srgb, var(--rust) 18%, var(--surface)); border-radius:6px; padding:2px 8px;}

/* Today's list */
.job-actions{display:flex; gap:8px; align-items:center; justify-content:flex-end; flex-wrap:wrap;}
li.job{grid-template-columns:150px minmax(0,1fr) auto;}
@media (max-width:820px){ li.job{grid-template-columns:1fr;} li.job .job-actions{justify-content:flex-start;} }
.today-btn{background:transparent; color:var(--indigo); border-color:color-mix(in srgb, var(--indigo) 45%, transparent);}
.today-btn:hover{background:color-mix(in srgb, var(--indigo) 8%, transparent);}
.today-btn.is-on{background:var(--indigo); color:#fff; border-color:var(--indigo);}
.today-card{border:2px solid var(--indigo); box-shadow:0 6px 18px rgba(0,73,94,0.08);}
.today-card h3{color:var(--indigo);}
.today-card li.job:has(.status-complete) .job-title{text-decoration:line-through; color:var(--ink-soft);}

/* Tracking ----------------------------------------------------------------- */
.tr-bar{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:6px;}
.tr-bar .ws-switch{margin-bottom:0;}
.period{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.period input[type=month]{font:inherit; font-size:15px; padding:7px 10px; border:1px solid var(--line-strong); border-radius:10px; background:var(--surface); color:var(--ink);}
.period-label{font-family:var(--display); font-weight:700; font-size:22px; min-width:60px; text-align:center;}
.tr-month-title{font-size:26px; text-transform:uppercase; margin:18px 0 12px;}
.table-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch;}
table.data-table{width:100%; border-collapse:collapse; font-size:14.5px;}
.data-table th,.data-table td{padding:9px 10px; text-align:left; border-top:1px solid var(--line); vertical-align:top;}
.data-table thead th{border-top:0; font-size:12.5px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); white-space:nowrap;}
.data-table tbody th{font-weight:600;}
.data-table .total-row th,.data-table .total-row td{border-top:2px solid var(--line-strong); font-weight:700;}
.year-table td,.year-table tfoot td{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap;}
.year-table thead th:not(:first-child){text-align:right;}
.entry-table td{min-width:150px;}
.entry-table tfoot td{font-variant-numeric:tabular-nums;}
input.num{font:inherit; font-size:15px; width:100%; max-width:180px; padding:8px 10px; border:1px solid var(--line-strong); border-radius:8px; background:var(--surface-2); color:var(--ink); font-variant-numeric:tabular-nums; transition:background .3s ease, border-color .3s ease;}
input.num.saved{background:color-mix(in srgb, var(--ok) 14%, var(--surface)); border-color:var(--ok);}
.num-cell{display:flex; flex-direction:column; gap:3px;}
.delta{font-size:12px; color:var(--ink-faint);}
.delta.up{color:var(--ok);}
.delta.down{color:var(--burgundy);}
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px;}
.two-col .card + .card{margin-top:0;}
@media (max-width:760px){ .two-col{grid-template-columns:1fr;} }
.two-col + .card, .card + .two-col{margin-top:14px;}
.stat-fields{display:flex; gap:14px; flex-wrap:wrap;}
.stat-field{display:flex; flex-direction:column; gap:6px; flex:1 1 140px;}
.stat-label{font-size:12.5px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft);}
.table-note{margin-top:10px;}
.sub-head{font-family:var(--display); font-weight:600; font-size:14px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); margin:18px 0 8px;}

ul.pr-list{list-style:none; margin:0; padding:0;}
li.pr-row{display:grid; grid-template-columns:70px minmax(0,1fr) auto auto; gap:12px; align-items:center; padding:10px 0; border-top:1px solid var(--line);}
li.pr-row:first-child{border-top:0;}
@media (max-width:640px){ li.pr-row{grid-template-columns:60px minmax(0,1fr);} li.pr-row select, li.pr-row .icon-btn{grid-column:2;} }
.pr-date{font-family:var(--display); font-weight:700; font-size:15px; text-transform:uppercase;}
.pr-main{display:flex; flex-direction:column; gap:2px; min-width:0;}
.pr-type{font-size:12px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--indigo);}
.pr-title{font-weight:600;}
.status-select.pr-planned{color:var(--ink-soft);}
.status-select.pr-contacted{border-color:var(--indigo); color:var(--indigo);}
.status-select.pr-confirmed{border-color:var(--rust); color:#9A4A2B;}
.status-select.pr-done{border-color:var(--ok); color:var(--ok);}
.pr-form,.fin-add{display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end;}
.pr-form .field,.fin-add .field{flex:0 1 170px;}
.pr-form .field.grow,.fin-add .field.grow{flex:1 1 220px;}
.icon-btn{appearance:none; background:none; border:0; padding:6px 4px; font:inherit; font-size:13px; color:var(--ink-faint); text-decoration:underline; cursor:pointer;}
.icon-btn:hover{color:var(--burgundy);}

.pr-targets{display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:12px;}
.target{display:flex; flex-direction:column; gap:6px; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2);}
.target-label{font-weight:600;}
.target-n{font-family:var(--display); font-weight:700; font-size:28px; line-height:1;}
.bar{height:8px; border-radius:999px; background:var(--line); overflow:hidden;}
.bar span{display:block; height:100%; background:var(--rust); border-radius:999px;}
.target.is-met .bar span{background:var(--ok);}
.target.is-met .target-n{color:var(--ok);}

/* Finance ------------------------------------------------------------------ */
.tiles{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; margin-bottom:14px;}
@media (max-width:820px){ .tiles{grid-template-columns:repeat(2, minmax(0,1fr));} }
.tile{display:flex; flex-direction:column; gap:4px; padding:16px 18px; background:var(--surface); border:1px solid var(--line); border-radius:14px;}
.tile-label{font-size:12.5px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft);}
.tile-value{font-family:var(--display); font-weight:700; font-size:30px; line-height:1.05; font-variant-numeric:tabular-nums;}
.tile-note{font-size:12.5px; color:var(--ink-faint);}
.tile-strong{background:var(--burgundy); border-color:var(--burgundy);}
.tile-strong .tile-label,.tile-strong .tile-note{color:rgba(255,255,255,0.8);}
.tile-strong .tile-value{color:#fff;}
.card-head{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;}
.card-head h3{margin-bottom:0;}
.fin-table input[type=text],.fin-table input[type=date]{font:inherit; font-size:14.5px; width:100%; min-width:120px; padding:7px 9px; border:1px solid transparent; border-radius:8px; background:transparent; color:var(--ink);}
.fin-table input[type=text]:hover,.fin-table input[type=date]:hover{border-color:var(--line-strong);}
.fin-table input:focus{border-color:var(--focus); background:var(--surface-2);}
.num-col{text-align:right!important; white-space:nowrap; font-variant-numeric:tabular-nums;}
.money-cell{display:inline-flex; align-items:center; gap:2px; justify-content:flex-end;}
.money-cell .pound{color:var(--ink-soft);}
input.money-input{width:84px; max-width:84px; padding-left:2px; text-align:left; background:transparent; border-color:transparent;}
input.money-input:hover{border-color:var(--line-strong);}
.fin-table td{vertical-align:middle;}
.fin-table .yearly{color:var(--ink-soft);}
.costs-table .month-row th,.costs-table .month-row td{background:var(--surface-2); font-family:var(--display); font-weight:700; text-transform:uppercase; letter-spacing:0.04em; font-size:14px;}
.total-row.grand th,.total-row.grand td{font-size:17px;}
.fin-add{margin-bottom:14px;}