/* Mission Control: self-hosted, responsive, and usable without hover. */
:root{color-scheme:dark;--bg:#0d1421;--panel:#151e2e;--panel2:#1b283c;--line:#2a374c;--text:#edf2ff;--dim:#a2b2cb;--accent:#bdd2ff;--warn:#ffca85;--danger:#ffb4b5;--ok:#a5dfc8;--radius:14px;--tap:44px}
*{box-sizing:border-box}[hidden]{display:none!important}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button:disabled{opacity:.45;cursor:not-allowed}.icon{width:19px;height:19px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}a{color:var(--accent)}button{display:inline-flex;align-items:center;justify-content:center;gap:8px}.skip-link{position:absolute;left:12px;top:-100px;z-index:100;background:var(--panel);padding:12px}.skip-link:focus{top:12px}.app-shell{display:grid;grid-template-columns:236px minmax(0,1fr);min-height:100dvh}.sidebar{position:sticky;top:0;height:100dvh;overflow-y:auto;background:#101928;border-right:1px solid var(--line);padding:30px 18px 22px;display:flex;flex-direction:column}.brand{display:flex;gap:8px;align-items:center;text-decoration:none;color:var(--text);font-size:27px;font-weight:600;letter-spacing:-1px}.brand>span:last-child{font-weight:400;color:var(--dim);margin-left:-6px}.brand-mark,.login-mark{width:36px;height:36px;border-radius:11px;background:#263b5c;color:var(--accent);display:grid;place-items:center;margin-right:3px}.workspace{display:flex;gap:11px;align-items:center;margin:29px 0 20px;font-size:13px;font-weight:500}.workspace small{display:block;color:var(--dim);font-size:11px;font-weight:400;margin-top:2px}.avatar{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:#263b5c;color:var(--accent);font-size:12px;font-weight:600}.nav-label{font-size:10px;letter-spacing:1.5px;color:var(--dim);margin:12px 10px}.tabs{display:flex;flex-direction:column;gap:5px}.sidebar .tab,.sidebar-list,.all-lists{justify-content:flex-start;text-align:left;padding:10px 12px;background:transparent;border:0;border-radius:8px;width:100%;font-size:13px;color:var(--dim)}.sidebar .tab[aria-current=page],.sidebar-list[aria-current=page]{background:#263b5c;color:var(--accent)}.tab b{display:none;margin-left:auto;font-weight:500;font-size:11px;padding:1px 6px;background:var(--panel2);border-radius:4px}.tab b.on{display:inline}.tab b.warn{color:var(--warn)}.lists-label{margin-top:27px;display:flex;align-items:center;justify-content:space-between}.lists-label button{border:0;background:transparent;padding:0 4px;min-height:32px}.sidebar-list{display:flex;gap:10px;align-items:center;overflow-wrap:anywhere}.sidebar-list::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0}.sidebar-list span{margin-left:auto;font-size:11px}.all-lists{margin-top:8px;font-size:11px;color:var(--accent);justify-content:space-between}.sidebar-footer{margin-top:auto;padding-top:30px;display:grid;gap:6px}.sidebar-footer button{justify-content:flex-start;background:transparent;border:0;font-size:12px;padding:8px}.sidebar-footer .who{padding:2px 8px;overflow-wrap:anywhere;font-size:11px;color:var(--dim)}.sidebar-footer #sign-out{color:var(--dim);min-height:32px}.main-shell{min-width:0}.topbar{min-height:66px;padding:12px 38px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px}.breadcrumb{color:var(--dim);font-size:12px;overflow-wrap:anywhere}.breadcrumb>span{padding:0 10px;opacity:.6}.breadcrumb strong{font-weight:500;color:var(--text)}.topbar-actions{display:flex;align-items:center;gap:17px}.topbar-actions button{display:none}.phone-state{font-size:11px;color:var(--dim)}.phone-state.connected::before{content:'';display:inline-block;width:6px;height:6px;background:var(--ok);border-radius:50%;margin-right:7px}main{max-width:1160px;margin:0 auto;padding:38px 38px 65px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:1.7px;color:var(--accent);margin:0 0 10px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}.page-heading h1{font-size:clamp(26px,2.6vw,36px);line-height:1.17;font-weight:550;letter-spacing:-1.1px;margin:0;overflow-wrap:anywhere}.page-heading p{font-size:13px;color:var(--dim);margin:11px 0 0;max-width:560px}.primary{background:var(--accent)!important;color:#142440!important;border-color:transparent!important;font-weight:600}.page-heading button{flex-shrink:0;font-size:12px}kbd{font:10px inherit;opacity:.65;border:1px solid currentColor;border-radius:4px;padding:1px 4px;margin-left:3px}.modebar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:26px}.mode-tabs{display:flex;gap:3px;background:var(--panel2);padding:4px;border-radius:10px}.mode-tabs button{font-size:12px;min-height:35px;border:0;background:transparent;color:var(--dim);padding:6px 12px}.mode-tabs .icon{width:15px;height:15px}.mode-tabs button[aria-current=page]{background:#304565;color:var(--text)}#view-summary{font-size:11px;color:var(--dim)}.bottom-nav{display:none}.list-header-actions{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}.list-header-actions button{font-size:12px}.lists-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;color:var(--dim);font-size:12px;margin:20px 0 16px}.lists-toolbar label{display:flex;align-items:center;gap:7px}.focus-intro{padding:20px 24px;border:1px solid #425c85;background:#1d2d46;border-radius:14px 14px 0 0;margin-bottom:-1px}.focus-intro>span{font-size:10px;letter-spacing:1.5px;color:var(--accent)}.focus-intro p{font-size:13px;margin:8px 0 0;color:var(--dim)}.focus-mode #rows>.row{border-radius:0 0 14px 14px;border-color:#425c85}.focus-mode .task-row>.body .idea{font-size:24px;line-height:1.35}.focus-mode .task-row>.body{padding:28px 18px}.focus-mode .toolbar{display:none}.focus-mode .edit{padding:20px}.list-header-actions .danger{margin-left:auto}.capture{border:1px solid #486489;padding:16px;border-radius:var(--radius);background:#17253b;flex-wrap:wrap}.capture-label{width:100%;font-size:10px;letter-spacing:1.4px;color:var(--accent);margin-bottom:4px}.capture input{min-width:180px}.capture #add-text{flex-basis:100%}.capture #capture-close{flex:0 0 44px}.capture select{max-width:260px}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.dialog-heading h2{margin:0;font-size:20px}.dialog-heading button{border:0;background:transparent;padding:6px}.more-links{display:grid;gap:6px;margin-top:16px}.more-links button{justify-content:flex-start}.confirm-icon{color:var(--danger);display:inline-flex;padding:12px;background:#432b38;border-radius:12px}.danger-solid{background:var(--danger);color:#351c29;border:0}#confirm-description{color:var(--dim);line-height:1.6}.login-mark{width:48px;height:48px;margin:0 auto 22px;border-radius:15px}.blocked-box{padding:32px!important}.blocked-box .eyebrow{font-size:10px!important;margin-bottom:17px!important;color:var(--accent)!important}.blocked-box h2{font-size:24px!important;letter-spacing:-.6px}.toast{z-index:100!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}#load-more{display:flex;margin:22px auto 0}

/* --- inputs ------------------------------------------------------------- */

input, select, textarea, button { font: inherit; color: var(--text); }

input[type=text], input[type=search], input[type=datetime-local],
select, textarea {
  min-height: var(--tap);
  width: 100%;
  padding: .5rem .6rem;
  background: var(--bg);
  border: 1px solid var(--line); border-radius: var(--radius);
}
textarea { min-height: 4.5rem; resize: vertical; line-height: 1.4; }
input:focus, select:focus, textarea:focus {
  outline: 2px solid var(--accent); outline-offset: -1px;
}

button {
  min-height: var(--tap); padding: .5rem .9rem;
  background: var(--panel2); border: 1px solid var(--line);
  border-radius: var(--radius); cursor: pointer;
}
button:hover { border-color: var(--dim); }
button.danger { color: var(--danger); }
button[type=submit] { background: var(--accent); color: var(--bg);
                      border-color: transparent; font-weight: 600; }

.add, .search {
  display: flex; gap: .4rem; margin: .3rem 0 .8rem;
}
.add #add-text, .add #term-name, .add #term-meaning { flex: 1 1 auto; }
.add select { flex: 0 1 8.5rem; }
.add button { flex: 0 0 auto; }
@media (max-width: 520px) {
  .add { flex-wrap: wrap; }
  .add select { flex: 1 1 45%; }
  .add button { flex: 1 1 45%; }
}

.crumb { display: flex; align-items: center; gap: .5rem;
         color: var(--dim); font-size: .85rem; margin: 0 0 .5rem; }
.crumb button { min-height: 32px; padding: .2rem .55rem; font-size: .8rem; }

.toolbar { display: flex; align-items: center; gap: .8rem;
           margin: 0 0 .6rem; color: var(--dim); font-size: .85rem; }
.toolbar label { display: flex; align-items: center; gap: .35rem; cursor: pointer; }
.toolbar input[type=checkbox] { width: auto; min-height: auto; }
.toolbar button { min-height: 34px; padding: .25rem .6rem; font-size: .82rem;
                  margin-left: auto; }

.bulk { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem;
        padding: .5rem .6rem; margin: 0 0 .6rem;
        background: var(--panel); border: 1px solid var(--line);
        border-radius: var(--radius); font-size: .85rem; }
.bulk span { margin-right: auto; color: var(--dim); }
.bulk button { min-height: 36px; padding: .3rem .6rem; font-size: .82rem; }

/* --- rows --------------------------------------------------------------- */

.rows { list-style: none; margin: 0; padding: 0;
        display: flex; flex-direction: column; gap: .4rem; }

.row {
  display: grid;
  grid-template-columns: auto 1fr;
  background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden;
}
.row.open { border-color: var(--accent); }
.row.done .idea { color: var(--dim); text-decoration: line-through; }

.pick { grid-column: 1; align-self: center; margin: 0 0 0 .7rem;
        width: 20px; height: 20px; min-height: 20px; flex: none; }
.pick[hidden] { display: none; }

.body {
  grid-column: 2;
  display: flex; flex-direction: column; gap: .2rem;
  min-height: var(--tap);
  padding: .65rem .8rem;
  background: transparent; border: 0; border-radius: 0;
  text-align: left; width: 100%;
}
.body:hover { background: var(--panel2); }
.idea { white-space: pre-wrap; overflow-wrap: anywhere; }
.meta { color: var(--dim); font-size: .78rem; }
.meta .tag { color: var(--accent); }
.meta .due { color: var(--ok); }
.meta .over { color: var(--warn); font-weight: 600; }
.meta .bad { color: var(--danger); }

.edit { grid-column: 1 / -1; padding: .2rem .8rem .8rem;
        border-top: 1px solid var(--line); background: var(--panel2); }
.edit[hidden] { display: none; }
.edit .grid { display: grid; gap: .5rem; margin: .55rem 0;
              grid-template-columns: 1fr; }
@media (min-width: 560px) {
  .edit .grid { grid-template-columns: 1fr 1fr; }
}
.edit label { display: flex; flex-direction: column; gap: .2rem;
              font-size: .78rem; color: var(--dim); }
.acts { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .3rem; }
.acts button { min-height: 38px; padding: .35rem .7rem; font-size: .85rem; }
.acts .save { background: var(--accent); color: var(--bg);
              border-color: transparent; font-weight: 600; }
.acts .del { margin-left: auto; }

.hint, .prov { color: var(--dim); font-size: .74rem; margin: .4rem 0 0; }
.prov { font-variant-numeric: tabular-nums; }

/* --- growing textareas -------------------------------------------------- */
/* Height is set in JS from scrollHeight. overflow hidden is what makes that
   work: with a scrollbar the element would stay one row tall and scroll its
   content instead of growing. Empty collapses to a single row; long content
   grows without limit and the page scrolls, which is the ask -- a cap would mean
   a long description you cannot see all of. */
textarea.grow {
  overflow-y: hidden;
  min-height: var(--tap);
  resize: none;
  line-height: 1.45;
}

.edit label.stack {
  display: flex; flex-direction: column; gap: .2rem;
  margin: .55rem 0 0; font-size: .78rem; color: var(--dim);
}
.edit label.stack .note { color: var(--dim); opacity: .75; font-size: .72rem; }

.parent {
  margin: .45rem 0 0; padding: .3rem .5rem;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius);
  font-size: .76rem; color: var(--dim);
}
.parent[hidden] { display: none; }
.parent button {
  min-height: 28px; margin-left: .5rem;
  padding: .1rem .45rem; font-size: .72rem;
}

/* --- subtasks ----------------------------------------------------------- */

.subs { margin-top: .7rem; padding-top: .6rem; border-top: 1px dashed var(--line); }
.subs[hidden] { display: none; }
.subs-head { margin: 0 0 .4rem; font-size: .76rem; color: var(--dim); }

.subs-list { list-style: none; margin: 0 0 .5rem; padding: 0;
             display: flex; flex-direction: column; gap: .25rem; }

.sub {
  display: grid; grid-template-columns: auto 1fr auto;
  align-items: center; gap: .1rem;
  background: var(--bg);
  border: 1px solid var(--line); border-radius: var(--radius);
}
.sub.done .s-text { color: var(--dim); text-decoration: line-through; }
.s-done { width: 18px; height: 18px; min-height: 18px; margin: 0 .1rem 0 .55rem; }
.s-open {
  display: flex; flex-direction: column; gap: .1rem;
  min-height: 38px; padding: .4rem .55rem;
  background: transparent; border: 0; border-radius: 0; text-align: left;
}
.s-open:hover { background: var(--panel2); }
.s-text { font-size: .92rem; overflow-wrap: anywhere; }
.s-meta { font-size: .72rem; color: var(--dim); }
.s-meta .over { color: var(--warn); font-weight: 600; }
.s-meta .due  { color: var(--ok); }
.s-del {
  min-height: 38px; padding: 0 .65rem; font-size: 1.05rem; line-height: 1;
  background: transparent; border: 0; border-left: 1px solid var(--line);
  border-radius: 0;
}
.s-del:hover { background: var(--panel2); }

.subs-add { display: flex; gap: .4rem; }
.subs-add input { flex: 1 1 auto; min-height: 38px; }
.subs-add button { flex: 0 0 auto; min-height: 38px; padding: .3rem .75rem;
                   font-size: .85rem; }

/* Count badge on a collapsed row. */
.meta .subs-n { color: var(--dim); }
.meta .subs-n.part { color: var(--accent); }
.meta .subs-n.alldone { color: var(--ok); }

/* Lists get an explicit Edit button. Tapping the name opens the list, which is
   the primary action; hiding "edit" behind a modifier key would make it
   unreachable on a phone. */
.row.cat { grid-template-columns: 1fr auto; }
.row.cat .body { grid-column: 1; }
.gear {
  grid-column: 2; align-self: stretch;
  margin: 0; padding: 0 .85rem;
  background: transparent; border: 0; border-left: 1px solid var(--line);
  border-radius: 0; color: var(--dim); font-size: .8rem;
}
.gear:hover { background: var(--panel2); color: var(--text); }
.cat .idea { font-weight: 600; }

.empty { color: var(--dim); text-align: center; padding: 2.5rem 1rem;
         font-size: .9rem; }

/* --- blocked overlay ---------------------------------------------------- */

.blocked {
  position: fixed; inset: 0; z-index: 50;
  display: flex; align-items: center; justify-content: center;
  padding: 1.5rem;
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(3px);
}
.blocked[hidden] { display: none; }
.blocked-box {
  max-width: 26rem; width: 100%;
  padding: 1.4rem;
  background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 10px 40px rgba(0,0,0,.4);
  text-align: center;
}
.blocked-box h2 { margin: 0 0 .5rem; font-size: 1.05rem; }
.blocked-box p { margin: 0 0 1rem; color: var(--dim); font-size: .88rem;
                 line-height: 1.5; }
.blocked-box button {
  width: 100%; background: var(--accent); color: var(--bg);
  border-color: transparent; font-weight: 600;
}

/* --- toast -------------------------------------------------------------- */

.toast {
  position: fixed; left: 50%; transform: translateX(-50%);
  bottom: calc(1rem + env(safe-area-inset-bottom));
  max-width: min(92vw, 30rem);
  padding: .6rem .9rem;
  background: var(--panel); color: var(--text);
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 6px 24px rgba(0,0,0,.35);
  font-size: .87rem; z-index: 20;
}
.toast[hidden] { display: none; }
.toast.bad { border-color: var(--danger); color: var(--danger); }

@media (prefers-reduced-motion: no-preference) {
  .toast { animation: rise .18s ease-out; }
  @keyframes rise { from { opacity: 0; transform: translate(-50%, .5rem); }
                      to { opacity: 1; transform: translate(-50%, 0); } }
}

dialog { max-width: min(520px, 94vw); max-height: 90vh; overflow: auto; border: 1px solid var(--line); border-radius: 12px; padding: 24px; background: var(--panel); color: var(--text); }
dialog::backdrop { background: #0009; }
dialog label { display: block; margin: 16px 0; }
dialog input, dialog select { width: 100%; min-height: var(--tap); padding: .5rem .6rem; background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius); }
dialog button { margin: 6px 0; }
#google-signin { margin: 20px 0; }
.bar { flex-wrap: wrap; gap: 8px; }

/* Task and list surfaces retain the existing editor and subtask controls. */
.rows{gap:10px}.row{grid-template-columns:minmax(0,1fr)}.row>.body{grid-column:1;min-width:0;padding:18px 20px}.task-row{grid-template-columns:54px minmax(0,1fr)}.task-row>.body{grid-column:2;padding:18px 18px 18px 0;min-width:0}.task-row>.body .idea{font-size:15px;font-weight:500}.meta{font-size:11px;line-height:1.65;margin-top:4px}.quick-done{grid-column:1;grid-row:1;align-self:center;justify-self:center;padding:10px;width:44px;height:44px;border:0;background:transparent}.quick-done .icon{border:1px solid #6d819e;border-radius:50%;padding:2px;color:transparent;width:21px;height:21px}.quick-done:hover .icon{color:var(--accent)}.row.done .quick-done .icon{color:#122a22;background:var(--ok);border-color:var(--ok)}.pick{grid-column:1;grid-row:1;margin:0;justify-self:center}.row.open{border-color:#617da5}.edit{padding:17px 20px 20px;background:#182336}.edit label,.edit label.stack{font-size:12px}.edit .grid{gap:13px;margin:17px 0}.edit .grid label{gap:6px}.edit label.stack{margin:14px 0}.edit .acts{gap:8px;margin-top:20px}.edit .acts button{font-size:12px;min-height:44px}.edit .prov{margin-top:17px;opacity:.8}.edit .note{display:none}.subs{margin-top:24px}.sub .s-del{min-width:44px;min-height:44px}.subs-head{font-size:12px}.row.cat{display:block;position:relative;background:#273953;overflow:hidden}.cat-face{position:relative;z-index:1;display:flex;align-items:center;gap:9px;width:100%;background:var(--panel);transition:transform .18s ease;border-radius:var(--radius);touch-action:pan-y}.cat-face>.body{flex:1;min-width:0;padding:19px 8px;background:transparent}.cat-face .idea{font-size:15px;font-weight:500}.list-symbol{display:flex;padding:11px;background:#263b5c;color:var(--accent);border-radius:12px;margin-left:18px}.cat-face .gear{flex-shrink:0;padding:9px 12px;border:1px solid var(--line);border-radius:8px;font-size:12px;margin-right:17px;color:var(--text);background:var(--panel2)}.cat .edit{position:relative;z-index:2}.swipe-actions{position:absolute;right:0;top:0;display:flex;align-items:center;justify-content:center;width:176px;height:100%;max-height:110px;padding:8px;gap:6px}.swipe-actions button{flex-direction:column;border:0;background:transparent;min-width:72px;padding:9px 4px;font-size:11px}.cat.revealed .cat-face{transform:translateX(-176px)}.cat.revealed .cat-face .gear{visibility:hidden}.cat.archived .list-symbol{background:#2c303a;color:var(--dim)}#list-dialog-body .row.cat{border:0;background:transparent;overflow:visible;margin-top:16px}#list-dialog-body .cat-face,#list-dialog-body .swipe-actions{display:none}#list-dialog-body .edit{border:0;border-radius:10px;padding:0;background:transparent}#list-dialog-body .edit label{margin:14px 0}dialog{width:min(560px,94vw)}dialog h2{font-size:21px;font-weight:500}dialog p{font-size:13px}input:not([type=checkbox]),select,textarea{font-size:16px}#term-form{padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}.toolbar{font-size:12px;margin-bottom:15px}.toolbar button{min-height:40px}.empty{background:var(--panel);border:1px dashed var(--line);border-radius:var(--radius);padding:45px 20px}.empty::before{content:'All clear.';display:block;color:var(--text);font-size:20px;margin-bottom:8px}.focus-mode .empty::before{content:'Room to breathe.'}
.focus-tools{grid-column:1/-1;padding:0 25px 27px;display:flex;gap:10px;flex-wrap:wrap}.focus-tools p{width:100%;white-space:pre-wrap;color:var(--dim);font-size:14px;margin:0 0 14px}.focus-tools button{font-size:13px}
@media(min-width:1250px){main{padding-top:46px}.sidebar{padding-top:34px}}
@media(max-width:1050px){.app-shell{grid-template-columns:208px minmax(0,1fr)}.sidebar{padding-left:12px;padding-right:12px}main{padding:30px 24px 65px}.topbar{padding:14px 24px}.page-heading kbd{display:none}.page-heading h1{font-size:29px}}
@media(max-width:760px){.app-shell{display:block}.sidebar{display:none}.topbar{min-height:59px;padding:10px 18px}.topbar-actions button{display:inline-flex;min-width:44px;min-height:44px;border:0;background:transparent}.phone-state{display:none}main{padding:25px 18px calc(106px + env(safe-area-inset-bottom))}.page-heading{display:block;margin-bottom:23px}.page-heading h1{font-size:30px;max-width:420px}.page-heading p{font-size:12px}.page-heading>#capture-open{display:none}.eyebrow{font-size:10px}.modebar{gap:10px;margin-bottom:23px}.mode-tabs{flex:1;max-width:360px}.mode-tabs button{flex:1;min-height:40px;font-size:12px;padding:6px 8px}#view-summary{display:none}.bottom-nav{position:fixed;z-index:10;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-around;background:#101928f5;backdrop-filter:blur(16px);border-top:1px solid var(--line);padding:8px 9px calc(8px + env(safe-area-inset-bottom));gap:3px}.bottom-nav button{flex:1;flex-direction:column;gap:4px;background:transparent;border:0;padding:6px;min-width:44px;min-height:50px;font-size:10px;color:var(--dim)}.bottom-nav button[aria-current=page]{color:var(--accent);background:#263b5c;border-radius:10px}.bottom-nav #mobile-capture{flex:0 0 48px;background:var(--accent);color:#142440;border-radius:15px;margin:0 8px;min-height:48px}.toast{bottom:calc(87px + env(safe-area-inset-bottom));font-size:12px}.list-header-actions .danger{margin-left:0}.list-header-actions button{font-size:11px;flex:1;min-height:44px;padding:8px}.list-header-actions .icon{display:none}.lists-toolbar{font-size:11px;flex-wrap:wrap;margin:16px 0}.lists-toolbar label{min-height:35px}.row>.body{padding:16px}.task-row{grid-template-columns:46px minmax(0,1fr)}.task-row>.body{padding:17px 12px 17px 0}.task-row>.body .idea{font-size:14px}.meta{font-size:11px}.edit{padding:14px}.edit .acts button{flex:1 1 42%;margin:0}.list-symbol{margin-left:12px;padding:9px}.cat-face{gap:5px}.cat-face>.body{padding:17px 6px}.cat-face .idea{font-size:13px}.cat-face .gear{padding:8px;font-size:11px;margin-right:10px;min-height:44px}.cat-face .gear .icon{display:none}.cat .meta{font-size:10px}.capture select{flex:1 1 40%;max-width:none;min-width:0}.capture input{min-width:0}.capture button[type=submit]{flex:1}.add:not(.capture){flex-wrap:wrap}.add:not(.capture) input{flex:1 1 100%;min-width:0}.add:not(.capture) button{width:100%}.focus-mode .task-row>.body .idea{font-size:22px}.focus-mode .edit{padding:14px}.focus-mode .task-row>.body{padding:23px 12px 23px 0}.focus-intro{padding:17px}.focus-intro p{font-size:12px}dialog{max-height:85dvh;padding:21px;width:calc(100% - 24px);max-width:540px}#more-dialog{margin:auto auto calc(82px + env(safe-area-inset-bottom));border-radius:20px}.confirm-icon{padding:9px}.blocked{padding:18px}.blocked-box{padding:27px!important}.breadcrumb{font-size:11px}.sub{grid-template-columns:32px minmax(0,1fr) 44px}.subs-add input{min-width:0}.subs-add button{padding:6px 10px}}
@media(prefers-reduced-motion:reduce){.cat-face{transition:none}}

.body { align-items: stretch; } .body .idea, .body .meta { text-align: left; }
/* Task completion requires a deliberate left drag; clicking opens the editor. */
.task-row{position:relative;overflow:hidden}.task-row>.body{position:relative;z-index:1;background:var(--panel);touch-action:pan-y;user-select:none;transition:transform .18s ease;grid-row:1}.task-status{grid-column:1;grid-row:1;align-self:center;justify-self:center;display:flex;padding:10px;pointer-events:none}.task-status .icon{width:21px;height:21px;border:1px solid #6d819e;border-radius:50%;padding:2px;color:transparent}.row.done .task-status .icon{background:var(--ok);color:#122a22;border-color:var(--ok)}.task-swipe-cue{grid-column:2;grid-row:1;align-self:stretch;justify-self:end;display:flex;align-items:center;justify-content:center;width:145px;max-width:100%;font-size:12px;padding:12px;color:var(--dim);background:#22394a;pointer-events:none;visibility:hidden}.task-dragging .task-swipe-cue{visibility:visible}.task-ready .task-swipe-cue{background:#214b42;color:#c5f2df}.task-dragging>.body{transition:none}.toast button{margin-left:16px;min-height:44px;font-weight:600}.task-row>.edit,.task-row>.focus-tools{position:relative;z-index:2} @media(prefers-reduced-motion:reduce){.task-row>.body{transition:none}}
/* Compact list metadata and explicit reminder choices. */
.meta,.task-row .meta,.cat .meta{line-height:1.25;margin-top:3px}.sidebar-list{line-height:1.25}.reminder-options{border:1px solid var(--line);border-radius:8px;padding:10px 12px;display:flex;flex-wrap:wrap;gap:8px 18px;margin:12px 0}.reminder-options legend{font-size:12px;color:var(--dim)}.reminder-options label{display:flex;align-items:center;gap:7px;min-height:36px;margin:0!important}.reminder-options input{width:18px;height:18px}.phone-number-row{display:flex;align-items:flex-end;gap:10px}.phone-number-row>label{flex:1;min-width:0;margin:0}.phone-number-row input{min-width:0;width:100%}.phone-number-row button{flex-shrink:0}input[readonly]{opacity:.8;background:var(--panel2)}
