:root { --ink:#1d2433; --muted:#667085; --line:#e4e7ec; --bg:#f7f8fa; --accent:#1f5f8b; --warn:#b54708; --pos:#067647; --neg:#b42318; }
* { box-sizing: border-box; }
body { margin:0; font:15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; color:var(--ink); background:var(--bg); }
.top { background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20; }
.top .bar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 24px; max-width:1200px; margin:0 auto; }
.main-nav { display:flex; flex-wrap:wrap; gap:8px; padding:4px 24px 12px; max-width:1200px; margin:0 auto; }
.main-nav a { display:inline-flex; align-items:center; justify-content:center; white-space:nowrap; min-height:40px; padding:0 16px;
  border:1px solid #d0d5dd; border-radius:999px; background:#fff; color:var(--ink); text-decoration:none; font-size:.95rem; font-weight:500; }
.main-nav a:hover { background:#f2f4f7; border-color:#98a2b3; }
.main-nav a.on { background:#12355B; border-color:#12355B; color:#fff; }
.menu { position:relative; }
.menu summary { list-style:none; cursor:pointer; width:44px; height:44px; display:grid; place-items:center; border-radius:10px; color:#12355B; }
.menu summary::-webkit-details-marker { display:none; }
.menu summary::marker { content:""; }
.menu summary:hover, .menu[open] summary { background:#f2f4f7; }
.menu-panel { position:absolute; right:0; top:48px; min-width:230px; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 8px 24px rgba(16,24,40,.12); padding:6px; display:flex; flex-direction:column; }
.menu-panel a, .menu-item { display:block; text-align:left; width:100%; padding:11px 12px; border-radius:8px; color:var(--ink); text-decoration:none; background:none; font-size:.95rem; }
.menu-panel a:hover, .menu-item:hover { background:#f2f4f7; }
.menu-panel form { margin:0; border-top:1px solid var(--line); margin-top:4px; padding-top:4px; }
.menu-who { padding:8px 12px 10px; color:var(--muted); font-size:.85rem; border-bottom:1px solid var(--line); margin-bottom:4px; word-break:break-all; }
.brand { font-weight:700; color:var(--ink); text-decoration:none; }
main { max-width:1200px; margin:0 auto; padding:16px 24px 64px; }
h1 { font-size:1.5rem; } h2 { font-size:1.1rem; margin-top:1.6em; }
a { color:var(--accent); }
table { border-collapse:collapse; width:100%; background:#fff; border:1px solid var(--line); }
th, td { padding:6px 8px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
th { background:#f2f4f7; font-weight:600; font-size:.85rem; color:var(--muted); }
.num { text-align:right; font-variant-numeric:tabular-nums; }
.pos { color:var(--pos); } .neg { color:var(--neg); }
.nowrap { white-space:nowrap; }
.cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:12px; }
.card { background:#fff; border:1px solid var(--line); border-radius:8px; padding:14px; color:inherit; text-decoration:none; }
.card .k { color:var(--muted); font-size:.85rem; } .card .v { font-size:1.6rem; font-weight:700; } .card .sub { color:var(--muted); font-size:.8rem; }
.card.warn { border-color:var(--warn); }
.panel { background:#fff; border:1px solid var(--line); border-radius:8px; padding:12px 16px; margin:16px 0; }
form.inline, .inline { display:inline-flex; gap:10px; align-items:end; flex-wrap:wrap; }
.filters { margin-bottom:12px; }
label { display:inline-flex; flex-direction:column; font-size:.8rem; color:var(--muted); gap:2px; margin-right:8px; }
label:has(input[type=checkbox]) { flex-direction:row; align-items:center; gap:6px; color:var(--ink); font-size:.9rem; }
input, select, button { font:inherit; padding:5px 7px; border:1px solid #d0d5dd; border-radius:6px; background:#fff; }
button, .button { background:var(--accent); color:#fff; border:none; padding:7px 14px; border-radius:6px; cursor:pointer; text-decoration:none; display:inline-block; }
button.link { background:none; color:var(--neg); padding:0; }
button.sticky { position:sticky; bottom:12px; margin-top:12px; box-shadow:0 2px 8px rgba(0,0,0,.15); }
.flash { background:#ecfdf3; border:1px solid #abefc6; padding:8px 12px; border-radius:6px; margin-bottom:12px; }
.error, .warn-text { color:var(--warn); }
.hint { color:var(--muted); font-size:.9rem; }
.tag { font-size:.7rem; background:#eef4ff; color:#3538cd; padding:1px 6px; border-radius:10px; }
.tag.ok { background:#ecfdf3; color:var(--pos); font-size:.85rem; }
tr.suggested { background:#fffaeb; } tr.edited { background:#eff8ff; }
table.txns select { max-width:220px; }
.pnl .section td { background:#f9fafb; font-weight:700; }
.pnl .sum td { font-weight:600; border-top:2px solid var(--line); }
.pnl .strong td { background:#f0f9ff; }
.actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:12px 0; }
pre { background:#0f172a; color:#e2e8f0; padding:12px; border-radius:6px; overflow:auto; max-height:420px; }
code { background:#f2f4f7; padding:1px 4px; border-radius:4px; }
.picker { display:flex; flex-direction:column; gap:4px; }
.splitbox { display:flex; flex-wrap:wrap; gap:2px 10px; }
.splitbox label { font-size:.85rem; }
.splitbox[hidden] { display:none; }
.field { display:inline-flex; flex-direction:column; gap:2px; margin-right:8px; }
.field > span { font-size:.8rem; color:var(--muted); }
.steps li { margin:8px 0; } .steps .hint { margin-left:8px; }
.narrow { max-width:440px; margin:40px auto; }
.stack { display:flex; flex-direction:column; gap:12px; }
.stack label { margin:0; } .stack input { font-size:1rem; padding:8px; }
.qr { margin:10px 0; } .qr svg { width:220px; height:220px; background:#fff; }
.secret { font-size:1rem; letter-spacing:.05em; word-break:break-all; }
.codes { columns:2; font-size:1.05rem; list-style:none; padding:0; } .codes li { margin:4px 0; }
.logout { margin-left:auto; } .link-plain { background:none; color:var(--accent); padding:0; }
.linkbox { width: min(640px, 100%); font-family: monospace; }
.brand { display:inline-flex; align-items:center; gap:10px; color:#12355B; }
.brand img { display:block; border-radius:6px; }
button.secondary, .button.secondary { background:#fff; color:var(--accent); border:1px solid var(--accent); }
.print-only { display:none; }
@media print {
  @page { size: A4 landscape; margin: 12mm; }
  body { background:#fff; font-size:11pt; }
  .top, .no-print, .flash, .logout, button { display:none !important; }
  .print-only { display:block; }
  .print-head { display:flex; align-items:center; gap:12px; margin-bottom:6mm; }
  .print-brand { font-weight:700; font-size:14pt; color:#12355B; }
  main { max-width:none; padding:0; }
  h1 { font-size:18pt; margin:0 0 2mm; }
  a { color:inherit; text-decoration:none; }
  table { border:1px solid #bbb; }
  th, td { padding:4px 6px; }
  th { background:#eee !important; color:#222; }
  tr { break-inside:avoid; }
  .pnl .section td, .pnl .strong td { background:#f2f2f2 !important; }
  * { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}

/* Phones */
@media (max-width: 700px) {
  body { font-size:15px; }
  .top .bar { padding:8px 12px; }
  .main-nav { padding:2px 12px 10px; gap:6px; }
  .main-nav a { min-height:40px; padding:0 8px; font-size:.9rem; }
  main { padding:12px 12px 64px; }
  h1 { font-size:1.3rem; }
  .brand span { font-size:1rem; }
  .cards { grid-template-columns:1fr 1fr; gap:8px; }
  .card .v { font-size:1.3rem; }
  form.inline, .inline { gap:8px; }
  label { margin-right:0; }
  table:not(.pnl):not(.txns):not(.mtd) { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  th, td { white-space:nowrap; }
  table.txns td:nth-child(2) { white-space:normal; min-width:180px; }
  table.pnl th:first-child, table.pnl td:first-child { min-width:150px; max-width:170px; }
  .panel { padding:10px 12px; }
  .narrow { margin:16px auto; }
  input, select, button { font-size:16px; } /* stops iOS zooming into fields */
}
.panel.danger { border-color:#fda29b; background:#fffbfa; max-width:520px; }
button.danger { background:#b42318; }
.page-actions { display:flex; gap:10px; flex-wrap:wrap; margin:8px 0 12px; }
.link-danger { color:#b42318; font-size:.9rem; }
.passkey-btn { width:100%; display:flex; align-items:center; justify-content:center; gap:10px; padding:12px; font-size:1rem; background:#12355B; }
.or { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:.85rem; margin:16px 0 8px; }
.or::before, .or::after { content:""; flex:1; border-top:1px solid var(--line); }
[hidden] { display:none !important; }
.narrow-form { max-width:460px; }
.error-box { border-color:#fda29b; background:#fffbfa; }
.facts { display:grid; grid-template-columns:max-content 1fr; gap:6px 18px; max-width:520px; }
.facts dt { color:var(--muted); } .facts dd { margin:0; font-weight:600; }
.brand-text { display:flex; flex-direction:column; line-height:1.15; }
.brand-biz { font-size:.78rem; font-weight:500; color:var(--muted); max-width:52vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.h-biz { font-weight:500; color:var(--muted); font-size:.8em; }
tr.needs td:first-child { box-shadow: inset 4px 0 0 #f04438; }
tr.suggested td:first-child { box-shadow: inset 4px 0 0 #f79009; }
.notice { background:#fffaeb; border:1px solid #fedf89; padding:8px 12px; border-radius:8px; }
.tick { flex-direction:row !important; align-items:center; gap:6px; color:var(--ink) !important; font-size:.85rem !important; margin-top:4px; }
.tl-acct { display:flex; flex-wrap:wrap; align-items:end; gap:8px 16px; padding:8px 0; border-bottom:1px solid var(--line); }
.acct-row { display:flex; flex-wrap:wrap; align-items:end; gap:8px 14px; padding:12px 0; border-top:1px solid var(--line); }
.acct-name { display:flex; flex-direction:column; min-width:180px; flex:1 1 200px; }
.acct-row .tick { flex-basis:100%; }

/* Tables sized to their contents */
.table-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; border:1px solid var(--line); border-radius:8px; background:#fff; }
.table-scroll > table { border:0; }
table.fit { width:auto; }
table.fit th, table.fit td { padding:4px 8px; }
table.fit input:not([type=checkbox]), table.fit select { padding:4px 6px; }
table.txns select { max-width:200px; }
table.txns .picker select { max-width:170px; }

/* P&L: the row names stay put while the figures scroll sideways */
table.pnl { width:auto; min-width:100%; border-collapse:separate; border-spacing:0; }
table.pnl th, table.pnl td { padding:6px 12px; white-space:nowrap; }
table.pnl th:first-child, table.pnl td:first-child { position:sticky; left:0; z-index:1; background:#fff; white-space:normal; min-width:200px; max-width:260px; box-shadow: 1px 0 0 var(--line); }
table.pnl th:first-child { background:#f2f4f7; }
table.pnl tr.section td:first-child { background:#f9fafb; }
table.pnl tr.strong td:first-child { background:#f0f9ff; }
@media print { .table-scroll { overflow:visible; border:0; } table.pnl th:first-child, table.pnl td:first-child { position:static; box-shadow:none; } }
@media (max-width: 700px) { table.pnl th:first-child, table.pnl td:first-child { min-width:140px; max-width:160px; } }

/* MTD figures: always the full width of the screen; long HMRC field names wrap */
table.mtd { width:100%; table-layout:fixed; }
table.mtd th:last-child, table.mtd td:last-child { width:8.5em; }
table.mtd td:first-child, table.mtd th:first-child { white-space:normal !important; overflow-wrap:break-word; }
table.mtd td:first-child code { white-space:normal; overflow-wrap:break-word; font-size:.8rem; color:var(--muted); }
.field-label { font-weight:600; margin-bottom:2px; }
.button.danger { background:#b42318; color:#fff; }

/* Help */
.help-btn:hover { background:#f2f4f7; }
.help-dialog { width:min(620px, calc(100vw - 24px)); max-height:min(80vh, 760px); padding:0; border:0; border-radius:14px; box-shadow:0 20px 50px rgba(16,24,40,.25); color:var(--ink); }
.help-dialog::backdrop { background:rgba(16,24,40,.45); }
.help-head { position:sticky; top:0; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; background:#12355B; color:#fff; }
.help-head h2 { margin:0; font-size:1.05rem; }
.help-close { background:none; color:#fff; font-size:1.1rem; width:40px; height:40px; padding:0; border-radius:8px; }
.help-close:hover { background:rgba(255,255,255,.15); }
.help-body { padding:6px 20px 20px; line-height:1.55; }
.help-body h3 { font-size:.95rem; margin:16px 0 4px; color:#12355B; }
.help-body ol, .help-body ul { margin:4px 0; padding-left:20px; }
@media print { .help-btn, .help-dialog { display:none !important; } }

/* P&L: property names stay at the top while scrolling down (the table scrolls inside its own box) */
.pnl-scroll { max-height:calc(100dvh - 150px); overflow:auto; overscroll-behavior:contain; }
table.pnl thead th { position:sticky; top:0; z-index:2; background:#f2f4f7; box-shadow:0 1px 0 var(--line); }
table.pnl thead th:first-child { z-index:3; }
.lbl-short { display:none; }

/* P&L on phones: tighter rows and shorter labels so the report fits the screen */
@media (max-width: 700px) {
  .pnl-scroll { max-height:calc(100dvh - 176px); }
  table.pnl { font-size:.82rem; }
  table.pnl th, table.pnl td { padding:4px 7px; line-height:1.2; }
  table.pnl th:first-child, table.pnl td:first-child { min-width:150px; max-width:160px; }
  .lbl-long { display:none; } .lbl-short { display:inline; }
}
@media print { .pnl-scroll { max-height:none; overflow:visible; } table.pnl thead th { position:static; } .lbl-long { display:inline !important; } .lbl-short { display:none !important; } }
