:root{--bg:#0e0e10;--fg:#d9d9dc;--dim:#6b6b75;--accent:#ffd633;--err:#ff6b6b;--row:#16161a;--line:#1a1a1e}
  *{box-sizing:border-box}
  body{background:var(--bg);color:var(--fg);margin:0;font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace}
  a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}
  body.gate{display:grid;place-items:center;min-height:100vh}
  body.gate main{width:min(360px,90vw);text-align:center}
  body.gate h1{font-weight:400;letter-spacing:.3em;color:var(--accent);margin-bottom:1.5em}
  body.gate input,body.gate button{width:100%;padding:.75em 1em;margin:.3em 0;background:#1a1a1d;color:var(--fg);border:1px solid #2a2a30;border-radius:4px;font:inherit}
  body.gate button{background:var(--accent);color:#000;cursor:pointer;border-color:var(--accent)}
  body.gate .err{color:var(--err);margin-bottom:.8em}
  body.browser header{display:flex;justify-content:space-between;align-items:center;padding:1em 1.5em;border-bottom:1px solid #1f1f25}
  .crumbs a{color:var(--dim)}.crumbs a:last-child{color:var(--fg)}
  .crumbs .sep{color:var(--dim);margin:0 .3em}
  .logout{color:var(--dim);font-size:.85em}.logout:hover{color:var(--err)}
  body.browser main{padding:1em 1.5em;max-width:900px;margin:0 auto}
  .empty{color:var(--dim)}.empty code{color:var(--accent)}
  .entries{list-style:none;padding:0;margin:0}
  .entries li{display:grid;grid-template-columns:1fr 6em 11em;gap:1em;align-items:center;padding:.55em .75em;border-bottom:1px solid var(--line)}
  .entries li:hover{background:var(--row)}
  .entries .name{color:var(--fg)}.entries .dir .name{color:var(--accent)}
  .entries .size,.entries time{color:var(--dim);font-size:.85em}
  .entries time{text-align:right}
