:root{
  --navy:#1b2a4a; --navy-soft:#2f4368; --ink:#222a38; --muted:#6b7585;
  --line:#d9dee7; --line-soft:#e8ecf2; --bg:#eef1f6; --card:#ffffff;
  --accent:#3d6fb4; --accent-soft:#eaf1fb; --field:#f6f8fb; --danger:#c0392b;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;overflow-x:hidden;max-width:100%;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.5;-webkit-text-size-adjust:100%;
}
a{color:var(--accent);text-decoration:none;}

/* top nav */
.nav{
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:saturate(160%) blur(8px);backdrop-filter:saturate(160%) blur(8px);
  border-bottom:1px solid var(--line);
  padding:max(10px,env(safe-area-inset-top)) 14px 10px;
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;
}
.nav .brand{font-weight:800;color:var(--navy);letter-spacing:.04em;font-size:15px;margin-right:6px;text-transform:uppercase;}
.nav .spacer{flex:1 1 auto;}
.nav .saved{font-size:12.5px;color:var(--muted);font-weight:600;white-space:nowrap;}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#3fb27f;margin-right:5px;vertical-align:middle;}
.saved.status-saved{color:#2e7d57;}
.saved.status-saved .dot{background:#3fb27f;}
.saved.status-saving .dot{background:#e0a33e;animation:pulse 1s ease-in-out infinite;}
.saved.status-dirty{color:var(--muted);}
.saved.status-dirty .dot{background:#c9ccd3;}
.saved.status-error{color:var(--danger);}
.saved.status-error .dot{background:var(--danger);}
@keyframes pulse{50%{opacity:.35;}}

button,.btn{
  font:inherit;font-size:15px;cursor:pointer;border-radius:9px;border:1px solid var(--line);
  background:#fff;color:var(--navy);padding:11px 15px;font-weight:600;min-height:44px;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  transition:.15s background,.15s border-color,.1s transform;
}
button:hover,.btn:hover{background:var(--accent-soft);border-color:var(--accent);}
button:active,.btn:active{transform:translateY(1px);}
button:focus-visible,.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.btn-primary{background:var(--navy);color:#fff;border-color:var(--navy);}
.btn-primary:hover{background:var(--navy-soft);border-color:var(--navy-soft);}
.btn-sm{font-size:13px;padding:8px 11px;min-height:38px;}
.btn-danger{color:var(--danger);border-color:#ecc9c9;}
.btn-danger:hover{background:#fde7e7;border-color:var(--danger);}

.wrap{max-width:920px;margin:20px auto 70px;padding:0 14px;}
.sheet{background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:30px 34px 38px;box-shadow:0 1px 3px rgba(20,30,50,.05);}

.brandline{font-size:11px;letter-spacing:.32em;color:var(--accent);font-weight:700;text-transform:uppercase;}
.title{font-size:30px;font-weight:800;letter-spacing:.04em;color:var(--navy);margin:2px 0 0;text-transform:uppercase;}
.subtitle{font-size:14px;letter-spacing:.28em;color:var(--navy-soft);font-weight:600;text-transform:uppercase;}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;
  border-bottom:2px solid var(--navy);padding-bottom:16px;margin-bottom:22px;}
.logno{font-size:13px;font-weight:700;color:var(--navy);
  display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.logno-label{white-space:nowrap;}
.logno-of{white-space:nowrap;color:var(--navy-soft);}
.logno input{width:64px;max-width:64px;text-align:center;flex:0 0 64px;}

/* ---- collapsible intake section ---- */
.collapse{border:1px solid var(--line);border-radius:11px;margin-bottom:22px;background:#fff;}
.collapse[open]{box-shadow:0 1px 3px rgba(20,30,50,.04);}
.collapse-bar{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;
  padding:13px 16px;font-size:13px;font-weight:800;color:var(--navy);text-transform:uppercase;
  letter-spacing:.05em;border-radius:11px;min-height:48px;}
.collapse-bar::-webkit-details-marker{display:none;}
.collapse-bar:hover{background:var(--accent-soft);}
.collapse-title{flex:1 1 auto;}
.collapse-bar::after{content:"Hide";font-size:11px;font-weight:700;color:var(--muted);
  letter-spacing:.04em;text-transform:uppercase;flex:0 0 auto;}
.collapse:not([open]) .collapse-bar::after{content:"Show";}
.collapse-bar::before{content:"";width:9px;height:9px;border-right:2px solid var(--navy-soft);
  border-bottom:2px solid var(--navy-soft);transform:rotate(45deg);transition:transform .15s;flex:0 0 auto;margin-right:2px;}
.collapse:not([open]) .collapse-bar::before{transform:rotate(-45deg);}
.collapse-body{padding:4px 16px 18px;}

label{display:block;font-size:12.5px;font-weight:700;color:var(--navy-soft);
  letter-spacing:.02em;text-transform:uppercase;margin-bottom:5px;}
input[type=text],textarea{
  width:100%;font-family:inherit;font-size:16px;color:var(--ink);background:var(--field);
  border:1px solid var(--line);border-radius:8px;padding:11px 12px;}
input[type=text]:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent;background:#fff;}
textarea{resize:none;overflow:hidden;min-height:64px;line-height:1.45;}
.field{margin-bottom:16px;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}

.section-title{font-size:13px;font-weight:800;color:var(--navy);text-transform:uppercase;
  letter-spacing:.06em;margin:26px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--line-soft);}
.q{margin-bottom:16px;}
.q .qtext{font-size:15px;color:var(--ink);margin-bottom:8px;}
.q .qtext b{color:var(--navy);}
.yn{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;}
.yn button{border:0;border-radius:0;background:#fff;color:var(--muted);padding:9px 22px;font-weight:700;min-height:44px;}
.yn button + button{border-left:1px solid var(--line);}
.yn button[aria-pressed="true"]{background:var(--navy);color:#fff;}
.yn button:hover{background:var(--accent-soft);color:var(--navy);}
.yn button[aria-pressed="true"]:hover{background:var(--navy);color:#fff;}
.prompt{font-size:13.5px;color:var(--muted);background:var(--accent-soft);
  border-left:3px solid var(--accent);border-radius:0 8px 8px 0;padding:11px 14px;margin-bottom:12px;}

/* exercise grid — Excel-style: fixed layout fits every column in one view,
   tap any cell to edit its full text in the popup box. No horizontal scroll. */
.tablewrap{overflow:hidden;border:1px solid var(--line);border-radius:10px;}
table.grid{border-collapse:collapse;width:100%;table-layout:fixed;}
.grid col.c-num{width:30px;}
.grid col.c-x{width:34px;}
.grid th{background:var(--navy);color:#fff;font-size:11px;letter-spacing:.02em;text-transform:uppercase;
  font-weight:700;text-align:left;padding:8px 6px;line-height:1.2;border:1px solid #2b3c5e;
  overflow:hidden;text-overflow:ellipsis;}
.grid td{border:1px solid var(--line);padding:0;vertical-align:top;background:#fff;}
.grid tbody tr:nth-child(even) td{background:#fafbfd;}
.cell{width:100%;text-align:left;cursor:pointer;border:0;background:transparent;border-radius:0;
  padding:7px 7px;min-height:40px;font-size:13px;font-weight:400;line-height:1.4;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  white-space:pre-wrap;word-break:break-word;}
.cell:hover{background:var(--accent-soft);}
.cell:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}
.cell.empty{color:#aab2c0;font-style:italic;font-weight:400;}
.table-hint{font-size:12.5px;color:var(--muted);margin:-4px 0 10px;}
.col-x{text-align:center;}
.rownum{color:var(--muted);font-size:12px;font-weight:700;text-align:center;padding:11px 0 0;}
.rm{border:0;background:transparent;color:#b0b8c4;font-size:18px;line-height:1;padding:8px 2px;border-radius:6px;min-height:auto;width:100%;}
.rm:hover{background:#fde7e7;color:var(--danger);}
.addrow{margin-top:12px;width:100%;}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px;}

/* sessions list */
.list-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px;}
.list-head h1{font-size:22px;color:var(--navy);margin:0;}
.count{color:var(--muted);font-size:13px;}
.card-list{display:grid;gap:12px;}
.scard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;
  display:flex;gap:14px;align-items:center;flex-wrap:wrap;}
.scard .lognum{font-weight:800;color:#fff;background:var(--navy);border-radius:8px;
  min-width:46px;height:46px;display:flex;align-items:center;justify-content:center;font-size:14px;flex:0 0 auto;}
.scard .meta{flex:1 1 200px;min-width:0;}
.scard .meta .ttl{font-weight:700;color:var(--navy);font-size:15px;}
.scard .meta .sub{color:var(--muted);font-size:13px;margin-top:2px;}
.scard .meta .sub span{margin-right:12px;white-space:nowrap;}
.scard .row-actions{display:flex;gap:6px;flex-wrap:wrap;}
.empty{text-align:center;color:var(--muted);padding:50px 20px;background:#fff;border:1px dashed var(--line);border-radius:12px;}

@media (max-width:640px){
  .wrap{padding:0 8px;margin-top:14px;}
  .sheet{padding:18px 10px 24px;border-radius:12px;}
  .title{font-size:25px;}
  .head{flex-direction:column;align-items:stretch;gap:10px;}
  .logno{justify-content:flex-start;}
  .collapse-body{padding:4px 10px 14px;}
  .grid2{grid-template-columns:1fr;}

  /* Excel-style grid stays whole-in-view on phones — shrink chrome, never scroll sideways. */
  .grid th{font-size:9.5px;padding:6px 3px;letter-spacing:0;}
  .grid col.c-num{width:20px;}
  .grid col.c-x{width:26px;}
  .cell{font-size:12px;padding:6px 4px;-webkit-line-clamp:4;line-clamp:4;}
  .rownum{font-size:10px;padding-top:9px;}
  .scard .row-actions{width:100%;}
}

/* ---- popup cell editor ---- */
.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(18,26,44,.5);
  display:flex;align-items:center;justify-content:center;padding:18px;
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);}
.modal-backdrop[hidden]{display:none;}
.modal{background:#fff;border-radius:14px;width:100%;max-width:560px;
  box-shadow:0 18px 50px rgba(10,20,40,.35);padding:18px 18px 16px;display:flex;flex-direction:column;}
.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:12px;}
.modal-eyebrow{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);}
.modal-title{font-size:18px;font-weight:800;color:var(--navy);margin-top:1px;}
.modal-x{border:0;background:transparent;font-size:24px;line-height:1;color:var(--muted);
  min-height:auto;padding:2px 6px;border-radius:8px;}
.modal-x:hover{background:var(--field);color:var(--navy);}
#ed-text{width:100%;min-height:170px;font-family:inherit;font-size:16px;line-height:1.5;
  border:1px solid var(--line);border-radius:10px;padding:12px;background:var(--field);resize:vertical;}
#ed-text:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent;background:#fff;}
.modal-actions{display:flex;gap:8px;align-items:center;margin-top:12px;}
.modal-actions .spacer{flex:1 1 auto;}
.ed-pos{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;}

@media (max-width:640px){
  .modal-backdrop{align-items:flex-end;padding:0;}
  .modal{max-width:none;border-radius:16px 16px 0 0;padding-bottom:max(16px,env(safe-area-inset-bottom));}
  #ed-text{min-height:42vh;}
}