/* App mode: only when opened from the installed home-screen icon (or ?app=1 for testing). Marketing chrome is swapped for an app-style top bar and bottom tabs. */
html.is-app{overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent}
html.is-app body{padding-bottom:calc(64px + env(safe-area-inset-bottom));-webkit-user-select:none;user-select:none}
html.is-app input,html.is-app textarea,html.is-app [contenteditable]{-webkit-user-select:text;user-select:text}
html.is-app .site-header{position:sticky;top:0;padding-top:env(safe-area-inset-top)}
html.is-app .nav-install,html.is-app .demo-banner,html.is-app .promo-strip,html.is-app .site-footer .f-cta,html.is-app .site-footer .f-cols{display:none!important}
html.is-app .chat-fab{bottom:calc(76px + env(safe-area-inset-bottom))!important}
.app-tabs{display:none}
html.is-app .app-tabs{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:80;background:var(--card,#fff);border-top:1px solid var(--line,#dbe3f0);padding:6px 6px calc(6px + env(safe-area-inset-bottom));justify-content:space-around;box-shadow:0 -6px 20px rgba(15,23,42,.08)}
.app-tabs a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 4px;border-radius:12px;text-decoration:none;color:var(--muted,#64748b);font-size:.72rem;font-weight:600;min-height:44px;justify-content:center}
.app-tabs a svg{width:22px;height:22px}
.app-tabs a[aria-current="page"]{color:var(--accent,#2563eb);background:var(--blue-50,#eff6ff)}
@media (min-width:900px){html.is-app .app-tabs{max-width:560px;margin:0 auto;border-radius:18px 18px 0 0}}

/* Plans and comparison tables: always-visible scrollbar + drag/touch scrolling, so sideways scrolling works with a finger, mouse or trackpad. */
.table-wrap{-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--accent,#2563eb) transparent;cursor:grab}
.table-wrap.is-dragging{cursor:grabbing;user-select:none}
.table-wrap::-webkit-scrollbar{height:10px}.table-wrap::-webkit-scrollbar-thumb{background:var(--accent,#2563eb);border-radius:8px}

/* Cookie box on phones: a slim bottom bar. Two equal choices up front; the detailed toggles open under "Customise". Wording unchanged. */
html .cookie .ck-more{display:none}
@media (max-width:640px){
 html .cookie{left:8px;right:8px;bottom:8px;max-width:none;padding:12px 14px;border-radius:14px}
 html .cookie h2{font-size:1rem;margin:0 0 4px}
 html .cookie>p:not(.ck-link){font-size:.82rem;line-height:1.35;margin:0 0 8px}
 html .cookie .ctas{display:flex;flex-wrap:nowrap;gap:8px;align-items:center}
 html .cookie .ctas .btn{flex:1;min-height:40px;padding:8px 6px;font-size:.88rem;white-space:nowrap}
 html .cookie .ck-more{display:inline-block;flex:none;padding:6px 2px;font-size:.82rem;white-space:nowrap}
 html .cookie:not(.open) .ck-rows,html .cookie:not(.open) [data-c="save"],html .cookie:not(.open) .ck-link{display:none}
 html .cookie.open{max-height:70vh;overflow:auto}
 html .cookie.open .ctas{flex-wrap:wrap}
 html.is-app .cookie{bottom:calc(72px + env(safe-area-inset-bottom))}
}

/* Practice + resume forms: tidy checkboxes (the global input{width:100%} rule was stretching them), and no pinned boxes in the right column. */
html .app-form input[type=checkbox],html .rs-form input[type=checkbox],html .keep-opts input[type=checkbox]{width:20px!important;height:20px;flex:none;margin:2px 0 0;padding:0;accent-color:var(--accent,#2563eb)}
html .keep-opts{border:1px solid var(--line,#dbe3f0);border-radius:12px;padding:14px 16px 10px;margin:20px 0;background:var(--card,transparent)}
html .keep-opts legend{font-weight:700;font-size:1rem;padding:0 6px}
html .keep-opts .note{font-size:.85rem;line-height:1.45;opacity:.85;margin:2px 0 8px}
html .keep-opts label{display:flex!important;gap:10px;align-items:flex-start;margin:8px 0!important;font-weight:500!important;font-size:.95rem;line-height:1.4;cursor:pointer}
html .keep-opts label span{flex:1;min-width:0}
html .keep-opts input:disabled+span{opacity:.55}
html .app-side .sum-card{position:static!important}
html .rs-pane{position:static!important;max-height:none!important;overflow:visible!important}

/* Keep-choice confirm bar and History delete dialog */
html .keep-opts .keep-confirm{margin:10px 0;padding:12px 14px;border:1px solid var(--accent,#2563eb);border-radius:12px;background:var(--blue-50,#eff6ff)}
html .keep-opts .keep-confirm p{margin:0 0 10px;font-size:.92rem}
html .keep-opts .keep-confirm .ctas{display:flex;gap:8px;flex-wrap:wrap}
html .keep-opts.is-pending{border-color:var(--accent,#2563eb)}
html .keep-opts.is-saved{border-color:#16a34a}
html .keep-opts .keep-status{margin:8px 0 0;display:inline}
html .keep-opts .keep-undo{margin-left:8px;font-size:.88rem}
dialog.pv-confirm{max-width:420px;width:calc(100% - 32px);border:1px solid var(--line,#dbe3f0);border-radius:16px;padding:22px;background:var(--card,#fff);color:var(--fg,#0f172a);box-shadow:0 30px 80px -20px rgba(0,0,0,.5)}
dialog.pv-confirm::backdrop{background:rgba(15,23,42,.5)}
dialog.pv-confirm h3{margin:0 0 8px;font-size:1.15rem}
dialog.pv-confirm p{margin:0 0 16px;font-size:.95rem;line-height:1.45}
dialog.pv-confirm .ctas{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
dialog.pv-confirm .btn.danger{background:#b91c1c;border-color:#b91c1c;color:#fff}
.sess-del{margin-left:8px;font-size:.82rem}

/* Social icons have no links yet (placeholders), so hide them until the real accounts exist. */
html .f-soc{display:none!important}
.rs-x input:disabled+.rs-x-b{opacity:.6}