.modal-head , .modal-body( section.lb-sheet-sec … , .lb-sheet-sum ) , .modal-foot */
.modal.lb-sheet{max-width:880px}
.lb-sheet .modal-body{display:grid;gap:22px}
.lb-sheet .modal-body .field + .field{margin-top:0}
.lb-sheet-sec{display:grid;gap:14px;min-width:0;padding-top:18px;border-top:1px solid var(--v2-line)}
.lb-sheet-sec:first-child{padding-top:0;border-top:0}
.lb-sheet-sec > h3{margin:0;font-size:var(--fs-2xs);font-weight:800;line-height:1.4;letter-spacing:.16em;text-transform:uppercase;color:var(--v2-muted)}
.lb-leg{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:12px}
.lb-counters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.lb-counter-field{display:flex;flex-direction:column;gap:8px;min-width:0}
.lb-counter{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:stretch;min-height:48px;border:1px solid var(--line-strong);border-radius:var(--r-2);background:var(--v2-card);overflow:hidden}
.lb-counter:focus-within{border-color:var(--v2-accent-ink);box-shadow:0 0 0 1px var(--v2-accent-ink),0 0 0 4px var(--focus-ring)}
.lb-counter > button{display:flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:var(--v2-ink);font-size:22px;font-weight:700;line-height:1;cursor:pointer}
.lb-counter > button:hover{background:var(--hover-bg)}
.lb-counter > button:focus-visible{outline:3px solid var(--v2-accent-ink);outline-offset:-3px}
.lb-counter > input{min-height:46px;padding:0;border:0;border-radius:0;text-align:center;font-variant-numeric:tabular-nums;box-shadow:none}
.lb-counter > input:focus{border:0;box-shadow:none}
/* the short way in: the few things nearly every flight needs, with no rule
above them, and the one button that opens the rest */
.lb-quick{padding-top:0;border-top:0}
.lb-like{padding:10px 12px;border-left:3px solid var(--v2-brand);background:var(--brand-wash-2);color:var(--v2-ink)}
.lb-launchpick{gap:10px}
.lb-launchpick .chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.lb-launchpick .chip{justify-content:center;min-height:48px}
.lb-launchpick .chip .n{font-variant-numeric:tabular-nums;opacity:.85}
.lb-launchpick.invalid > .label{color:var(--err)}
.lb-launchpick.invalid .chip{border-color:var(--err)}
.lb-big > input{min-height:60px;font-size:26px;font-weight:700;font-variant-numeric:tabular-nums}
.lb-more-btn{justify-content:space-between}
.lb-more-btn::after{content:'';flex:none;width:16px;height:16px;background:currentColor;-webkit-mask:var(--i-chev) center/contain no-repeat;mask:var(--i-chev) center/contain no-repeat;transition:transform .2s}
.lb-more-btn[aria-expanded="true"]::after{transform:rotate(180deg)}
.lb-sheet-sum{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;padding:14px 16px;background:var(--v2-paper);border:1px solid var(--v2-line);border-left:3px solid var(--v2-brand);border-radius:var(--r-1)}
.lb-sheet-sum .k{font-size:var(--fs-2xs);font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--v2-muted)}
.lb-sheet-sum .n{font-family:var(--font-display);font-size:34px;font-style:italic;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.lb-sheet .notice{margin-top:0}
/* ---------------------------------------------------------------- the account page
Three small shapes the account page needs and no other page does: the
steps of setting up two-step sign-in, the square it is set up from, and
the plain list of what closing an account takes with it. */
.lb-steps{margin:0 0 var(--sp-4);padding-left:1.4em;display:grid;gap:6px;color:var(--v2-ink);font-size:14px}
.lb-steps li{padding-left:2px}
.lb-qr{margin:0 0 var(--sp-3)}
.lb-qr img{display:block;width:180px;height:180px;background:#fff;padding:8px;border:1px solid var(--v2-line);border-radius:10px}
.lb-when{margin:var(--sp-2) 0 0;padding:0;list-style:none}
.lb-bullets{margin:0;padding-left:1.2em;display:grid;gap:6px;color:var(--v2-ink);font-size:14px}
/* ---------------------------------------------------------------- how wide a sentence may run
A card is 1232px across on a laptop, and an explanatory line that runs its
full width is 190 characters long — measured on /account/, where the longest
was 182. The hero caps its own sub-line at 62ch (platform.css .tl-hero-sub);
these are the same idea for the prose inside a card (64ch lands just under the
80-character measure that is comfortable to read). Only long text notices it:
a short hint is nowhere near the cap. */
.app-logbook .card .hint,
.app-logbook .card .lb-bullets > li,
.app-logbook .card .lb-steps > li{max-width:64ch}
/* ---------------------------------------------------------------- responsive */
@media screen and (max-width:900px){
.lb-kinds{grid-template-columns:minmax(0,1fr)}
}
@media screen and (max-width:720px){
/* the entry table's cards: the first column is no longer pinned */
.tablewrap > table.lb-entries.tl-cards :is(thead,tbody) > tr > :first-child{position:static;box-shadow:none;background:transparent}
table.lb-entries.tl-cards tr.lb-groups{display:none}
table.lb-entries.tl-cards :is(td,th).lb-sep{border-left:0}
table.lb-entries.tl-cards .lb-remarks{max-width:none}
table.lb-entries.tl-cards .lb-tags{justify-content:flex-end}
table.lb-entries.tl-cards tr.lb-totals .lb-time{font-size:16px}
}
@media screen and (max-width:640px){
.lb-figs{grid-template-columns:repeat(2,minmax(0,1fr))}
.lb-fig .n{font-size:30px}
.lb-leg{grid-template-columns:minmax(0,1fr)}
.lb-counters{grid-template-columns:repeat(2,minmax(0,1fr))}
/* the form fills the screen, its buttons held at the foot */
.modal-backdrop:has(> .modal.lb-sheet){padding:0;scroll-padding-bottom:104px}
.modal.lb-sheet{min-height:100%;margin-top:0;border:0;border-radius:0}
.lb-sheet .modal-foot{position:sticky;bottom:0;z-index:1;background:var(--v2-card)}
}
/* ---------------------------------------------------------------- print: the entry table as a page of the book */
@media print{
html:not(#tl-print) .tablewrap > table.lb-entries :is(thead,tbody) > tr > :first-child{position:static;box-shadow:none;background:none}
html:not(#tl-print) table.lb-entries{font-size:7.5pt}
html:not(#tl-print) table.lb-entries :is(th,td){padding:1mm 1.4mm}
html:not(#tl-print) table.lb-entries tr.lb-groups th.lb-grp{border-bottom:1pt solid #000}
html:not(#tl-print) table.lb-entries :is(tr.lb-totals,tr.lb-carried) :is(td,th){background:none;color:#000}
html:not(#tl-print) :is(.lb-body,.lb-tag){background:none;border:.5pt solid #666;color:#000}
html:not(#tl-print) .lb-periods{display:none}
}