:root{color-scheme:light;--bg: #f5f5f7;--surface: rgba(255, 255, 255, .82);--surface-strong: rgba(255, 255, 255, .96);--separator: rgba(60, 60, 67, .16);--separator-strong: rgba(60, 60, 67, .28);--text: #1d1d1f;--secondary-text: rgba(60, 60, 67, .72);--tertiary-text: rgba(60, 60, 67, .48);--accent: #007aff;--accent-soft: rgba(0, 122, 255, .13);--danger: #ff3b30;--success: #34c759;--warning: #ffcc00;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,Arial,sans-serif;font-size:17px;line-height:1.45;color:var(--text);background:var(--bg)}*{box-sizing:border-box}html{min-height:100%;margin:0;padding:0}body{min-height:100vh;margin:0;padding:0;background:radial-gradient(circle at 20% 0%,rgba(0,122,255,.16),transparent 24rem),radial-gradient(circle at 90% 12%,rgba(90,200,250,.18),transparent 20rem),linear-gradient(180deg,#fbfbfd,#f5f5f7 46%,#ececf1);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid rgba(0,122,255,.35);outline-offset:2px}.app-shell{width:min(680px,100%);min-height:100vh;margin:0 auto;padding:max(1rem,env(safe-area-inset-top)) 1rem 2rem}.app-header{display:grid;grid-template-columns:3.25rem 1fr 3.25rem;align-items:start;gap:.5rem;min-height:5.25rem;margin-bottom:.25rem}.title-block{grid-column:2;min-width:0;text-align:center}h1,.editable-title{display:block;width:100%;border:0;margin:.35rem 0 0;padding:0;background:transparent;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Helvetica Neue,Arial,sans-serif;font-size:clamp(2rem,9vw,3.25rem);font-weight:750;letter-spacing:-.045em;line-height:1.03;overflow-wrap:anywhere}.editable-title{cursor:text}.title-edit-input{display:block;width:100%;min-height:3rem;border:1px solid var(--separator);border-radius:1rem;margin-top:.35rem;padding:.55rem .75rem;background:var(--surface-strong);color:var(--text);box-shadow:0 1px 2px #0000000a inset;font-size:1.35rem;font-weight:700;text-align:center}.status-pill{display:inline-flex;gap:.35rem;flex-wrap:wrap;justify-content:center;margin:0;padding:.22rem .6rem;border:1px solid var(--separator);border-radius:999px;background:#ffffff94;color:var(--secondary-text);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);font-size:.66rem;font-weight:700;letter-spacing:.04em;line-height:1.2;text-transform:uppercase}.status-pill-connected{color:#0b6b2b;background:#34c75924;border-color:#34c75940}.status-pill-connecting,.sync-saving{color:#6c5400;background:#ffcc002e;border-color:#ffcc004d}.status-pill-offline,.sync-error{color:#8f1d16;background:#ff3b3024;border-color:#ff3b3040}.status-pill span+span:before{content:"·";margin-right:.35rem;color:currentColor;opacity:.55}.back-button,.round-button,.icon-button,.delete-list,.edit-list{display:inline-grid;place-items:center;border:0;border-radius:999px;background:transparent;color:var(--accent);line-height:1}.back-button{grid-column:1;width:3rem;height:3rem;padding:0;font-size:0}.back-button:before{content:"‹";font-size:2.6rem;font-weight:400;line-height:.8}.back-button:hover,.round-button:hover,.icon-button:hover,.delete-list:hover,.edit-list:hover{background:#007aff1a}.back-button[hidden]{display:block;visibility:hidden}.inline-back{display:inline-grid;visibility:visible}.page-panel{border:1px solid var(--separator);border-radius:1.5rem;padding:.6rem;background:var(--surface);box-shadow:0 18px 45px #00000014,0 1px #ffffffd9 inset;backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%)}.create-form{display:flex;gap:.65rem;align-items:center;margin:.25rem .25rem .85rem}.create-form input,.edit-input{display:block;width:100%;min-width:0;min-height:3.25rem;border:1px solid var(--separator);border-radius:1rem;padding:.7rem .95rem;background:#ffffffe6;color:var(--text);box-shadow:0 1px 1px #00000008 inset}.create-form input::placeholder,.edit-input::placeholder{color:var(--tertiary-text)}.create-form .round-button{flex:0 0 auto;width:3.25rem;min-width:3.25rem;height:3.25rem;background:var(--accent);color:#fff;box-shadow:0 8px 18px #007aff3d;font-size:2rem;font-weight:500}.create-form .round-button:hover{background:#0a84ff}ul{margin:0;padding:0}li{position:relative;display:block;min-height:3.35rem;margin:.5rem .25rem;border:1px solid var(--separator);border-radius:1.05rem;list-style-type:none;background:var(--surface-strong);box-shadow:0 1px 2px #0000000a;overflow:hidden}li.drop-target{border-color:#007affbf;outline:3px solid rgba(0,122,255,.16);outline-offset:2px;background:#eef6ff}li.drop-target:before{content:"";position:absolute;z-index:1;top:0;left:.85rem;right:.85rem;height:.22rem;border-radius:999px;background:var(--accent);box-shadow:0 0 .65rem #007affa6}.list-nav li{display:grid;grid-template-columns:2.55rem 2.55rem 2.55rem 1fr;align-items:stretch}.list-row{cursor:default}.list-link{display:block;width:100%;border:0;padding:.85rem 1rem;background:transparent;color:var(--text);font-weight:650;text-align:left;text-decoration:none}.list-link:hover{background:#007aff0f}.unchecked-count{float:right;min-width:1.65rem;border-radius:999px;margin-left:.75rem;padding:.08rem .5rem;background:var(--accent-soft);color:var(--accent);font-size:.85rem;font-weight:700;text-align:center}.delete-list,.edit-list,.icon-button{color:var(--secondary-text)}.delete-list{color:var(--danger);font-size:1.6rem}.edit-list{font-size:1.15rem;font-weight:700}.todos{margin-top:0}.todo{display:grid;grid-template-columns:2.55rem 2.55rem 1fr 2.55rem;gap:0;align-items:center;padding:0}.todo input[type=checkbox]{width:1.35rem;height:1.35rem;margin:0 auto;accent-color:var(--accent)}.todo-text{display:block;width:100%;border:0;padding:.95rem .8rem;background:transparent;color:var(--text);font-weight:560;text-align:left}.todo-text:hover{background:#007aff0d}.todo.completed .todo-text{color:var(--tertiary-text);text-decoration:line-through}.drag-handle{display:inline-grid;place-items:center;width:100%;height:100%;color:var(--tertiary-text);cursor:grab;font-size:1.1rem;font-weight:800;letter-spacing:-.18rem}.drag-handle:hover{color:var(--accent);background:#007aff0f}.list-drag-handle{align-self:stretch;margin-left:0}.icon-button{width:100%;min-height:100%;color:var(--danger);font-size:1.6rem}.icon-button:hover,.delete-list:hover{background:#ff3b301a}.edit-input{min-height:2.75rem;margin:.4rem .2rem}.message,.error{margin:1.25rem .75rem;text-align:center}.message{color:var(--secondary-text)}.error{border:1px solid rgba(255,59,48,.25);border-radius:1rem;padding:.85rem 1rem;background:#ff3b301c;color:#8f1d16;font-weight:600}.empty{min-height:15rem;display:grid;place-content:center}@media(prefers-color-scheme:dark){:root{color-scheme:dark;--bg: #000;--surface: rgba(28, 28, 30, .72);--surface-strong: rgba(44, 44, 46, .94);--separator: rgba(235, 235, 245, .18);--separator-strong: rgba(235, 235, 245, .28);--text: #f5f5f7;--secondary-text: rgba(235, 235, 245, .72);--tertiary-text: rgba(235, 235, 245, .48);--accent-soft: rgba(10, 132, 255, .2)}body{background:radial-gradient(circle at 20% 0%,rgba(10,132,255,.28),transparent 24rem),radial-gradient(circle at 90% 10%,rgba(94,92,230,.18),transparent 20rem),linear-gradient(180deg,#161617,#0b0b0d)}.create-form input,.edit-input,.title-edit-input{background:#3a3a3ceb}li.drop-target{background:#0a84ff2e}}@media(max-width:430px){.app-shell{padding-left:.7rem;padding-right:.7rem}.app-header{grid-template-columns:2.75rem 1fr 2.75rem}.page-panel{border-radius:1.25rem;padding:.45rem}.list-nav li{grid-template-columns:2.4rem 2.4rem 2.4rem 1fr}.todo{grid-template-columns:2.4rem 2.4rem 1fr 2.4rem}}