:root { color-scheme: dark; --bg:#000; --fg:#f4f4f4; --dim:#8b8b8b; --line:#4b4b4b; --ok:#6cff8f; --warn:#ffe36c; --bad:#ff6c6c; --focus:#fff; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html,body,#app { min-height:100%; }
body { margin:0; background:var(--bg); color:var(--fg); font-size:15px; line-height:1.45; }
button,input,select,textarea { font:inherit; color:inherit; background:#000; }
button,input,select,textarea { border:1px solid var(--line); border-radius:0; }
button { padding:.65rem .9rem; cursor:pointer; text-transform:uppercase; }
button:hover,button:focus-visible { background:var(--fg); color:var(--bg); outline:none; }
button.primary::before { content:"> "; }
button.danger { color:var(--bad); border-color:var(--bad); }
input,select,textarea { width:100%; padding:.65rem; }
textarea { min-height:6rem; resize:vertical; }
input:focus,select:focus,textarea:focus { outline:2px solid var(--focus); outline-offset:2px; }
label { display:grid; gap:.35rem; color:var(--dim); text-transform:uppercase; font-size:.8rem; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-weight:500; text-transform:uppercase; letter-spacing:.08em; }
h1::before,h2::before { color:var(--ok); content:"# "; }
a { color:var(--fg); }
.shell { width:min(1180px,calc(100% - 2rem)); margin:auto; }
.topbar { position:sticky; top:0; z-index:5; border-bottom:1px solid var(--line); background:#000; }
.topbar-inner { min-height:68px; display:flex; align-items:center; gap:1rem; }
.brand { display:flex; align-items:center; gap:.7rem; font-size:1.25rem; letter-spacing:.18em; text-transform:uppercase; }
.brand img { width:44px; height:44px; }
.nav { margin-left:auto; display:flex; flex-wrap:wrap; gap:.35rem; }
.nav button { border-color:transparent; }
.nav button.active { border-color:var(--fg); }
main { padding:2rem 0 5rem; }
.terminal { border:1px solid var(--line); padding:1rem; box-shadow:8px 8px 0 #1b1b1b; }
.terminal::before { display:block; margin:-1rem -1rem 1rem; padding:.35rem .65rem; border-bottom:1px solid var(--line); color:var(--dim); content:"debt-tracking@valuepedia:~$"; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1rem; }
.stack { display:grid; gap:1rem; }
.row { display:flex; align-items:end; gap:.7rem; flex-wrap:wrap; }
.row > * { flex:1 1 160px; }
.row > button { flex:0 0 auto; }
.card { border:1px solid var(--line); padding:1rem; min-width:0; }
.card header { display:flex; justify-content:space-between; gap:1rem; border-bottom:1px dashed var(--line); margin-bottom:.8rem; padding-bottom:.5rem; }
.muted { color:var(--dim); }
.positive { color:var(--ok); }.negative { color:var(--bad); }.warning { color:var(--warn); }
.flash { margin-bottom:1rem; padding:.7rem; border:1px solid var(--line); white-space:pre-wrap; }
.flash.error { color:var(--bad); border-color:var(--bad); }
.auth { min-height:100vh; display:grid; place-items:center; padding:1rem; }
.auth-box { width:min(760px,100%); }
.auth-logo { width:92px; height:92px; display:block; margin:0 auto 1rem; }
.tabs { display:flex; margin-bottom:1rem; }.tabs button { flex:1; }
.tabs button.active { background:var(--fg); color:var(--bg); border-color:var(--fg); }
.list { list-style:none; margin:0; padding:0; }
.list li { padding:.7rem 0; border-bottom:1px dashed var(--line); }
.list li:last-child { border:0; }
.amount { font-size:1.3rem; font-weight:700; }
.prompt::before { color:var(--ok); content:"$ "; }
dialog { width:min(720px,calc(100% - 2rem)); color:var(--fg); background:#000; border:1px solid var(--fg); padding:1.2rem; }
dialog::backdrop { background:#000c; }
.participant { display:grid; grid-template-columns:1fr 160px auto; gap:.5rem; align-items:end; }
table { width:100%; border-collapse:collapse; }
th,td { padding:.6rem; border-bottom:1px dashed var(--line); text-align:left; }
th { color:var(--dim); font-weight:400; text-transform:uppercase; font-size:.8rem; }
@media(max-width:700px){.topbar-inner{align-items:flex-start;padding:.7rem 0;flex-direction:column}.nav{margin-left:0;width:100%;overflow:auto;flex-wrap:nowrap}.participant{grid-template-columns:1fr}.shell{width:min(100% - 1rem,1180px)}main{padding-top:1rem}}