/* ══════════════════════════════════════════════════════════════
   UK Public Finances — shared mind map styles
   ══════════════════════════════════════════════════════════════ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --paper:#e9eef1;
  --card:#ffffff;
  --card-2:#f6f9fb;
  --ink:#12212c;
  --ink-2:#4a5c69;
  --ink-3:#71838f;
  --rule:#c2ced6;
  --rule-soft:#dde5ea;
  --focus:#0b63c5;
  --shadow:0 1px 2px rgba(18,33,44,.10), 0 4px 14px rgba(18,33,44,.06);
  --shadow-lift:0 2px 6px rgba(18,33,44,.14), 0 10px 28px rgba(18,33,44,.12);

  --mono:ui-monospace,"SFMono-Regular","SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;

  --fs:16px;
  --link-w:1.6;
}

html[data-theme="dark"]{
  --paper:#101820;
  --card:#18232d;
  --card-2:#1e2b37;
  --ink:#e7eef4;
  --ink-2:#a9bcc9;
  --ink-3:#7c8f9c;
  --rule:#33465a;
  --rule-soft:#25333f;
  --focus:#6bb6ff;
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 4px 14px rgba(0,0,0,.35);
  --shadow-lift:0 2px 6px rgba(0,0,0,.6), 0 10px 28px rgba(0,0,0,.45);
}

html,body{height:100%}
body{
  font-family:var(--sans);font-size:var(--fs);
  color:var(--ink);background:var(--paper);
  overflow:hidden;-webkit-text-size-adjust:100%;
}

/* ── Toolbar ──────────────────────────────────────────────── */
#bar{
  position:fixed;inset:0 0 auto 0;z-index:60;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:9px 14px;background:var(--card);
  border-bottom:1px solid var(--rule);box-shadow:var(--shadow);
}
#brand{display:flex;flex-direction:column;line-height:1.15;margin-right:2px}
#brand b{font-size:.95rem;font-weight:700;letter-spacing:-.01em}
#brand span{font-family:var(--mono);font-size:.66rem;color:var(--ink-3);
  letter-spacing:.06em;text-transform:uppercase}

.grp{display:flex;align-items:center;gap:6px}
.sep{width:1px;height:26px;background:var(--rule-soft)}

button,input[type=search]{
  font-family:var(--sans);font-size:.8rem;color:var(--ink);
  background:var(--card-2);border:1px solid var(--rule);
  border-radius:7px;padding:7px 11px;cursor:pointer;
  transition:background .12s,border-color .12s,color .12s;
}
button:hover{background:var(--paper);border-color:var(--ink-3)}
button[aria-pressed="true"]{background:var(--ink);color:var(--card);border-color:var(--ink)}
input[type=search]{cursor:text;min-width:150px}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.icon-btn{font-family:var(--mono);min-width:36px;text-align:center}
.primary{background:var(--ink);color:var(--card);border-color:var(--ink);font-weight:600}
.primary:hover{background:var(--focus);border-color:var(--focus);color:#fff}

/* section navigation */
#nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
#nav a{
  font-size:.78rem;text-decoration:none;color:var(--ink-2);
  padding:6px 10px;border-radius:6px;border:1px solid transparent;
}
#nav a:hover{background:var(--card-2);border-color:var(--rule)}
#nav a[aria-current="page"]{background:var(--ink);color:var(--card);font-weight:600}
#nav a:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

/* ── Totals strip ─────────────────────────────────────────── */
#balance{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  display:flex;background:var(--card);border-top:1px solid var(--rule);
  font-family:var(--mono);font-size:.7rem;
}
#balance div{padding:8px 14px;border-right:1px solid var(--rule-soft);
  display:flex;gap:8px;align-items:baseline}
#balance b{font-size:.86rem;font-weight:600}
#balance i{font-style:normal;color:var(--ink-3);letter-spacing:.05em;
  text-transform:uppercase;font-size:.63rem}
.bal-in b{color:#0a6b4f}
.bal-borrow b{color:#a52834}
.bal-out b{color:#7a3fa0}
html[data-theme="dark"] .bal-in b{color:#5fd6ac}
html[data-theme="dark"] .bal-borrow b{color:#ff8a94}
html[data-theme="dark"] .bal-out b{color:#c99cf0}

/* ── Stage ────────────────────────────────────────────────── */
#viewport{position:fixed;inset:0;overflow:hidden;cursor:grab;touch-action:none;
  background:radial-gradient(circle at 1px 1px, var(--rule-soft) 1px, transparent 0) 0 0/28px 28px}
#viewport.dragging{cursor:grabbing}
#stage{position:absolute;top:0;left:0;transform-origin:0 0;will-change:transform}
#wires{position:absolute;top:0;left:0;overflow:visible;pointer-events:none}

/* ── Nodes ────────────────────────────────────────────────── */
.node{
  position:absolute;background:var(--card);
  border:1px solid var(--rule);border-radius:8px;box-shadow:var(--shadow);
  padding:8px 11px 8px 13px;cursor:pointer;
  transition:box-shadow .12s,border-color .12s;
}
.node::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:var(--tone);border-radius:8px 0 0 8px}
.node:hover{box-shadow:var(--shadow-lift);border-color:var(--tone)}
.node.sel{border-color:var(--tone);box-shadow:0 0 0 2px var(--tone),var(--shadow-lift)}
.node.hit{background:var(--card-2)}
.node.hit .n-label{text-decoration:underline;text-decoration-color:var(--tone);
  text-decoration-thickness:2px;text-underline-offset:3px}

.n-label{font-size:.83rem;font-weight:600;line-height:1.3;letter-spacing:-.005em}
.n-sub{font-size:.68rem;color:var(--ink-3);margin-top:2px;line-height:1.3}
.n-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-top:5px}
.n-val{font-family:var(--mono);font-size:.85rem;font-weight:600;
  font-variant-numeric:tabular-nums;color:var(--tone)}
.n-meta{display:flex;align-items:baseline;gap:8px}
.n-pct,.n-count{font-family:var(--mono);font-size:.64rem;color:var(--ink-3);
  font-variant-numeric:tabular-nums;white-space:nowrap}

.node.root{padding:14px 16px;border-width:2px;border-color:var(--ink)}
.node.root .n-label{font-size:1rem;font-weight:700;line-height:1.2}
.node.root::before{width:0}
.node.d1 .n-label{font-size:.88rem;font-weight:700}
.node.d3{background:var(--card-2)}

.n-tog{
  position:absolute;top:50%;transform:translateY(-50%);
  width:22px;height:22px;padding:0;border-radius:50%;
  border:1px solid var(--rule);background:var(--card);
  font-family:var(--mono);font-size:.72rem;line-height:1;
  display:flex;align-items:center;justify-content:center;color:var(--ink-2);
}
.n-tog:hover{background:var(--tone);color:#fff;border-color:var(--tone)}
.side-out .n-tog{right:-11px}
.side-in .n-tog{left:-11px}

/* drill-down chip on section nodes */
.n-open{
  display:inline-flex;align-items:center;gap:4px;margin-top:7px;
  font-family:var(--mono);font-size:.64rem;letter-spacing:.05em;text-transform:uppercase;
  color:var(--tone);text-decoration:none;font-weight:600;
  border:1px solid var(--tone);border-radius:5px;padding:3px 7px;background:transparent;
}
.n-open:hover{background:var(--tone);color:#fff}

.axis{position:absolute;font-family:var(--mono);font-size:.7rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap;
  pointer-events:none;border-bottom:1px solid var(--rule);padding-bottom:5px}
.axis.in{text-align:right}

/* ── Detail drawer ────────────────────────────────────────── */
#detail{
  position:fixed;top:var(--bar-h,58px);right:0;bottom:var(--bal-h,34px);
  width:min(360px,92vw);z-index:70;
  background:var(--card);border-left:1px solid var(--rule);box-shadow:var(--shadow-lift);
  transform:translateX(100%);transition:transform .2s ease;
  display:flex;flex-direction:column;
}
#detail.open{transform:none}
#detail header{padding:14px 16px 12px;border-bottom:1px solid var(--rule);
  display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
#detail h2{font-size:1.02rem;line-height:1.25;font-weight:700}
#d-path{font-family:var(--mono);font-size:.63rem;color:var(--ink-3);
  letter-spacing:.05em;text-transform:uppercase;margin-bottom:5px}
#d-body{padding:14px 16px 24px;overflow-y:auto;flex:1}
#d-figure{font-family:var(--mono);font-size:1.9rem;font-weight:600;
  font-variant-numeric:tabular-nums;line-height:1;margin-bottom:4px}
#d-share{font-family:var(--mono);font-size:.7rem;color:var(--ink-3);margin-bottom:14px}
#d-note{font-size:.83rem;line-height:1.55;color:var(--ink-2)}
.d-block{margin-top:18px;padding-top:14px;border-top:1px solid var(--rule-soft)}
.d-block h3{font-family:var(--mono);font-size:.63rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:8px;font-weight:600}
.d-list{list-style:none;display:flex;flex-direction:column;gap:5px}
.d-list li{display:flex;justify-content:space-between;gap:12px;font-size:.79rem;line-height:1.35}
.d-list b{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.d-flag{font-size:.78rem;line-height:1.5;padding:9px 11px;border-radius:6px;
  background:rgba(190,120,0,.10);border:1px solid rgba(190,120,0,.35);color:var(--ink-2)}
.d-go{display:inline-block;margin-top:14px;font-size:.8rem;font-weight:600;
  color:var(--focus);text-decoration:none;border-bottom:2px solid currentColor}

/* ── Export dialog ────────────────────────────────────────── */
#export{
  position:fixed;inset:0;z-index:90;display:none;
  align-items:center;justify-content:center;padding:20px;
  background:rgba(10,18,25,.55);
}
#export.open{display:flex}
#export-card{
  background:var(--card);border:1px solid var(--rule);border-radius:12px;
  box-shadow:var(--shadow-lift);width:min(720px,100%);max-height:88vh;
  display:flex;flex-direction:column;
}
#export-card header{padding:16px 18px 12px;border-bottom:1px solid var(--rule);
  display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
#export-card h2{font-size:1.05rem}
#export-card p{font-size:.79rem;color:var(--ink-3);margin-top:4px;line-height:1.45}
#export-opts{padding:12px 18px;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;
  border-bottom:1px solid var(--rule-soft)}
#export-opts label{font-size:.79rem;display:flex;align-items:center;gap:6px;cursor:pointer}
#export-opts input[type=checkbox]{width:15px;height:15px;accent-color:var(--focus);cursor:pointer}
.x-sel{font-family:var(--sans);font-size:.79rem;padding:5px 8px;border:1px solid var(--rule);
  border-radius:6px;background:var(--card-2);color:var(--ink);cursor:pointer}
.x-sel:disabled{cursor:not-allowed}
#md-out{
  flex:1;min-height:240px;margin:0;padding:14px 18px;overflow:auto;
  font-family:var(--mono);font-size:.74rem;line-height:1.55;
  white-space:pre;background:var(--card-2);color:var(--ink);
  border:0;resize:none;width:100%;
}
#export-actions{padding:13px 18px;border-top:1px solid var(--rule);
  display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#export-status{font-family:var(--mono);font-size:.72rem;color:var(--ink-3);margin-left:auto}

/* ── Help ─────────────────────────────────────────────────── */
#help{position:fixed;inset:auto 0 0 0;z-index:80;background:var(--card);
  border-top:1px solid var(--rule);padding:16px 18px 22px;box-shadow:var(--shadow-lift);
  transform:translateY(101%);transition:transform .2s ease}
#help.open{transform:none}
#help h2{font-size:.88rem}
#help ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px 26px;margin-top:8px}
#help li{font-size:.78rem;color:var(--ink-2)}
#help kbd{font-family:var(--mono);font-size:.7rem;background:var(--card-2);
  border:1px solid var(--rule);border-bottom-width:2px;border-radius:4px;
  padding:1px 5px;color:var(--ink)}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@media (max-width:860px){
  #brand span{display:none}
  #brand b{font-size:.78rem;max-width:150px}
  #bar{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:8px;padding:8px 10px;
    scrollbar-width:none}
  #bar::-webkit-scrollbar{display:none}
  #bar>*{flex:0 0 auto}
  #nav{flex-wrap:nowrap}
  .sep{height:20px}
  button,input[type=search]{padding:6px 9px;font-size:.74rem}
  input[type=search]{min-width:112px}
  #q-count{display:none}
  #balance{overflow-x:auto;font-size:.62rem;scrollbar-width:none}
  #balance::-webkit-scrollbar{display:none}
  #balance div{white-space:nowrap;flex:0 0 auto;padding:7px 11px}
  #detail{width:100%;top:auto;bottom:var(--bal-h,34px);height:58vh;
    border-left:0;border-top:1px solid var(--rule);transform:translateY(120%)}
  #detail.open{transform:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
