/* Business OS — true black + white + clear glass. No emojis, SVG icons only.
   Root is 20px: the owner's phone runs large text. Inputs stay >=16px so
   iOS never zoom-jumps. */
:root{
  --bg:#000; --ink:#fff; --ink-dim:rgba(255,255,255,.72); --ink-faint:rgba(255,255,255,.5);
  --glass:rgba(255,255,255,.06); --glass-edge:rgba(255,255,255,.5);
  --glass-hi:rgba(255,255,255,.09);
  --bad:#ff7a7a; --good:#8fe3b0;
  --radius:18px;
}
*{box-sizing:border-box}
html{font-size:20px}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;padding-bottom:env(safe-area-inset-bottom)}
[hidden]{display:none!important}
h1{font-size:1.5rem;margin:0;letter-spacing:-.02em}
h2{font-size:1.15rem;margin:0 0 .6rem;letter-spacing:-.01em}
h3{font-size:.95rem;margin:0 0 .5rem}
p{line-height:1.45}
.sub{color:var(--ink-dim);margin:.2rem 0 0;font-size:.85rem}
.fineprint{color:var(--ink-faint);font-size:.75rem;text-align:center;margin-top:1rem}
.glass{background:var(--glass);border:1px solid var(--glass-edge);border-radius:var(--radius);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}

/* ---------- auth ---------- */
.auth-wrap{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:1rem}
.auth-card{width:100%;max-width:26rem;padding:1.4rem}
.brand-lockup{display:flex;gap:.8rem;align-items:center;margin-bottom:1.2rem}
.brand-mark{width:2.4rem;height:2.4rem;flex:none}
.brand-mark.sm{width:1.4rem;height:1.4rem}
.field{display:block;margin-bottom:.9rem}
.field span{display:block;font-size:.8rem;color:var(--ink-dim);margin-bottom:.35rem}
.field input,.field select,.field textarea{
  width:100%;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.35);
  border-radius:12px;color:var(--ink);padding:.65rem .8rem;font-size:17px;font-family:inherit}
.field textarea{min-height:4.2rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid rgba(255,255,255,.75);outline-offset:1px}
.form-error{color:var(--bad);font-size:.85rem;margin:.4rem 0 .8rem}

/* ---------- buttons / chips / toggles ---------- */
.btn{appearance:none;border:1px solid var(--glass-edge);background:var(--glass);color:var(--ink);
  border-radius:999px;padding:.6rem 1.1rem;font-size:.85rem;font-weight:600;cursor:pointer;
  min-height:2.6rem;display:inline-flex;align-items:center;justify-content:center;gap:.45rem}
.btn.primary{background:#fff;color:#000;border-color:#fff}
.btn.big{width:100%;font-size:1rem;min-height:3rem}
.btn.sm{min-height:2.2rem;padding:.35rem .8rem;font-size:.78rem}
.btn.ghost{background:transparent;border-color:rgba(255,255,255,.25)}
.btn.danger{color:var(--bad);border-color:rgba(255,122,122,.5)}
.btn:active{transform:scale(.98)}
.chips{display:flex;flex-wrap:wrap;gap:.45rem}
.chip{appearance:none;border:1px solid rgba(255,255,255,.3);background:transparent;color:var(--ink-dim);
  border-radius:999px;padding:.5rem .85rem;font-size:.82rem;cursor:pointer;min-height:2.5rem}
.chip.active{background:#fff;color:#000;border-color:#fff;font-weight:700}
.switch-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.55rem 0}
.switch-row .lbl{font-size:.9rem}
.switch-row .hint{font-size:.75rem;color:var(--ink-faint)}
.switch{position:relative;width:3rem;height:1.7rem;flex:none}
.switch input{opacity:0;width:100%;height:100%;position:absolute;margin:0;cursor:pointer}
.switch .track{position:absolute;inset:0;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);transition:.15s}
.switch .track::after{content:"";position:absolute;top:.14rem;left:.16rem;width:1.3rem;height:1.3rem;border-radius:50%;background:#fff;transition:.15s}
.switch input:checked + .track{background:#fff}
.switch input:checked + .track::after{left:1.44rem;background:#000}

/* ---------- app chrome ---------- */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;
  padding:.7rem 1rem;background:rgba(0,0,0,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.12)}
.topbar-brand{display:flex;align-items:center;gap:.5rem;font-weight:800;letter-spacing:-.01em}
.pages{padding:1rem 1rem 6.5rem;max-width:44rem;margin:0 auto}
.page h2.page-title{font-size:1.3rem;margin-bottom:.2rem}
.page .page-sub{color:var(--ink-dim);font-size:.85rem;margin:0 0 1rem}
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;justify-content:space-around;
  background:rgba(10,10,10,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-top:1px solid rgba(255,255,255,.16);padding:.45rem .3rem calc(.45rem + env(safe-area-inset-bottom))}
.tab{appearance:none;background:transparent;border:0;color:var(--ink-faint);cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:.15rem;font-size:.64rem;padding:.3rem .35rem;min-width:3rem;min-height:3rem}
.tab svg{width:1.35rem;height:1.35rem}
.tab.active{color:#fff}

/* ---------- cards & rows ---------- */
.card{padding:1rem;margin-bottom:1rem}
.card .card-title{font-size:.78rem;letter-spacing:.1em;font-weight:700;color:var(--ink-dim);margin-bottom:.6rem}
.big-number{font-size:2.1rem;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1.05}
.money-line{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.42rem 0;font-size:.9rem}
.money-line span{color:var(--ink-dim)}
.money-line strong{font-variant-numeric:tabular-nums;white-space:nowrap}
.money-line.total{border-top:1px solid rgba(255,255,255,.25);margin-top:.4rem;padding-top:.7rem;font-size:1rem}
.money-line.total span{color:var(--ink)}
.split-bar{display:flex;height:.65rem;border-radius:999px;overflow:hidden;border:1px solid rgba(255,255,255,.3);margin:.5rem 0 .8rem}
.split-bar i{display:block;height:100%;background:#fff}
.split-bar i:nth-child(2){background:rgba(255,255,255,.62)}
.split-bar i:nth-child(3){background:rgba(255,255,255,.38)}
.split-bar i:nth-child(4){background:rgba(255,255,255,.18)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.grid2 .card{margin-bottom:0}
.grid-wrap{display:grid;gap:.7rem;margin-bottom:1rem}
.stat-label{font-size:.75rem;color:var(--ink-dim)}
.stat-value{font-size:1.25rem;font-weight:800;font-variant-numeric:tabular-nums}
.stat-note{font-size:.75rem;color:var(--ink-faint)}
.warn{color:var(--bad);font-size:.8rem}
.good{color:var(--good)}
.list-row{display:flex;justify-content:space-between;align-items:center;gap:.8rem;padding:.8rem 1rem;margin-bottom:.6rem;width:100%;text-align:left;color:var(--ink);cursor:pointer}
.list-row .main{min-width:0}
.list-row .t{font-weight:700;font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.list-row .s{color:var(--ink-dim);font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.list-row .amt{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.pill{display:inline-block;border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:.08rem .55rem;font-size:.7rem;color:var(--ink-dim);text-transform:capitalize}
.flag{display:inline-block;border:1px solid rgba(255,122,122,.6);color:var(--bad);border-radius:999px;padding:.08rem .55rem;font-size:.7rem;margin-left:.4rem}
.empty{color:var(--ink-faint);text-align:center;padding:1.6rem 1rem;font-size:.88rem}
.section-gap{margin-top:1.4rem}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.three-col{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.6rem}
@media (max-width:30rem){.three-col{grid-template-columns:1fr 1fr}}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:6.2rem;z-index:50;
  background:#fff;color:#000;font-weight:700;font-size:.85rem;border-radius:999px;padding:.6rem 1.2rem;
  box-shadow:0 10px 30px rgba(0,0,0,.6)}
details.card{padding:0}
details.card > summary{padding:1rem;cursor:pointer;font-weight:700;list-style:none}
details.card > .inside{padding:0 1rem 1rem}

/* ---------- promo ---------- */
.step-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:.7rem 0;border-top:1px solid rgba(255,255,255,.12)}
.step-row:first-of-type{border-top:0}
.step-row .step-main{min-width:0}
.step-row .step-title{font-weight:700;font-size:.92rem}
.step-row.done .step-title{color:var(--ink-dim);text-decoration:line-through}
.step-row .step-hint{font-size:.78rem;color:var(--ink-faint);line-height:1.45;margin-top:.15rem}
.reason-list{margin:.4rem 0 0;padding-left:1.15rem}
.reason-list li{font-size:.88rem;line-height:1.5;margin-bottom:.35rem}
.plan-copy{font-size:.88rem;line-height:1.55;color:var(--ink-dim)}
.plan-copy strong{color:var(--ink)}
.rank-line{display:flex;gap:.7rem;padding:.5rem 0;border-top:1px solid rgba(255,255,255,.12);font-size:.88rem;line-height:1.5}
.rank-line:first-of-type{border-top:0}
.rank-line .rank{flex:none;font-weight:800;font-size:1rem;line-height:1.3}
.status-pill{text-transform:none}
table.rows{width:100%;border-collapse:collapse;font-size:.88rem}
table.rows td,table.rows th{padding:.45rem .2rem;border-bottom:1px solid rgba(255,255,255,.12);text-align:left}
table.rows td:last-child,table.rows th:last-child{text-align:right;font-variant-numeric:tabular-nums}

/* ---- crew + paper documents (agreement / conduct / crew sheet) ---- */
.crew-row { border-top: 1px solid var(--edge); padding-top: .85rem; margin-top: .85rem; }
.paper {
  background: #fdfcf8; color: #17150f; border-radius: 14px; padding: 1.4rem 1.2rem;
  font-family: Georgia, "Times New Roman", serif; line-height: 1.55;
  box-shadow: 0 12px 32px rgba(0,0,0,.45);
}
.paper .letterhead { font-family: -apple-system, "Segoe UI", Roboto, sans-serif; font-weight: 800; letter-spacing: .35em; text-align: center; font-size: 1.05rem; }
.paper .letterhead-sub { font-family: -apple-system, "Segoe UI", Roboto, sans-serif; text-align: center; letter-spacing: .18em; font-size: .62rem; color: #6b675c; margin-top: .25rem; text-transform: uppercase; }
.paper .doc-title { font-size: 1.3rem; text-align: center; margin: 1.1rem 0 .7rem; color: #17150f; }
.paper .doc-h { font-size: .95rem; margin: 1rem 0 .3rem; color: #17150f; }
.paper p { margin: 0 0 .55rem; }
.paper ul { margin: 0 0 .6rem; padding-left: 1.2rem; }
.paper li { margin-bottom: .35rem; }
.paper .sig-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; margin-top: 2rem; }
.paper .sig-line { border-bottom: 1.5px solid #17150f; height: 2rem; }
.paper .sig-cap { font-size: .68rem; color: #6b675c; margin-top: .3rem; font-family: -apple-system, "Segoe UI", Roboto, sans-serif; }
.paper .doc-footer { margin-top: 1.6rem; font-size: .7rem; font-style: italic; color: #6b675c; border-top: 1px solid #d8d4c8; padding-top: .55rem; }
@media (max-width: 560px) { .paper .sig-grid { grid-template-columns: 1fr; } }
details.card summary { min-height: 44px; display: flex; align-items: center; }
