:root{color-scheme:dark;--bg:#0c1120;--panel:#171f30;--panel2:#202b3f;--line:#2a3750;--text:#eef2fc;--muted:#a9b7ca;--accent:#60a5fa;--bad:#fb7185;font-family:system-ui,-apple-system,'Segoe UI',Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,textarea,select{font:inherit}button{cursor:pointer;border:0;color:inherit}button:disabled{opacity:.45;cursor:default}input,textarea,select{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:12px;padding:12px;min-width:0}input:focus,textarea:focus{outline:2px solid var(--accent)}.hidden{display:none!important}.login{min-height:100dvh;display:grid;place-items:center;padding:24px}.login-card{width:min(380px,100%);border:1px solid var(--line);border-radius:24px;padding:28px;background:var(--panel);text-align:center}.login-card label{display:block;text-align:left;font-size:.86rem;margin:22px 0 8px}.login-card input{width:100%}.login-card button,.filters button,#install{background:var(--accent);color:#091321;font-weight:700;padding:12px 20px;border-radius:12px}.login-card button{width:100%;margin-top:14px}.login-card p{color:var(--muted)}.logo{width:52px;height:52px;background:linear-gradient(135deg,#60a5fa,#6366f1);border-radius:17px;display:grid;place-items:center;font-weight:900;font-size:27px;margin:auto}.logo.small{width:35px;height:35px;border-radius:10px;font-size:20px;margin:0}.error{color:var(--bad)!important}.shell{min-height:100dvh}header{height:64px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 16px;position:sticky;top:0;z-index:10;background:var(--bg)}.brand,.head-actions{display:flex;align-items:center;gap:12px}.icon-button{background:var(--panel);border-radius:10px;padding:6px 11px;font-size:21px}.connection{color:#4ade80}main{width:min(900px,100%);margin:auto;padding:22px 18px 105px}h1{font-size:1.6rem;margin:0 0 10px}h2{font-size:1.05rem;margin:0 0 12px}.muted{color:var(--muted)}.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:24px 0}.tiles button{display:flex;align-items:flex-start;flex-direction:column;gap:6px;background:var(--panel);padding:18px;text-align:left;border-radius:16px;border:1px solid var(--line)}.tiles span{font-size:27px;color:var(--accent)}.tiles small{color:var(--muted)}.panel{background:var(--panel);padding:18px;border-radius:16px;border:1px solid var(--line);margin:16px 0}.panel p{color:var(--muted);line-height:1.6}.bottom-nav{height:75px;position:fixed;bottom:0;left:0;right:0;background:#131c2c;border-top:1px solid var(--line);display:flex;justify-content:space-around;z-index:10;padding-bottom:env(safe-area-inset-bottom)}.bottom-nav button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:transparent;font-size:10px;color:var(--muted);padding:7px 1px}.bottom-nav button span{font-size:22px}.bottom-nav button.selected{color:var(--accent)}.filters{display:flex;gap:8px;margin:18px 0}.filters input,.filters select{flex:1;max-width:100%}.records{display:grid;gap:9px}.record{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:14px;overflow-wrap:anywhere}.record b{font-size:.94rem}.record small{color:var(--muted);display:block;margin-top:6px}.record details{margin-top:8px}.record pre{white-space:pre-wrap;word-break:break-word;font-size:.76rem;color:var(--muted)}.chat-log{display:flex;flex-direction:column;gap:13px;min-height:40vh;max-height:57dvh;overflow:auto;padding:16px 0}.bubble,.system-bubble{white-space:pre-wrap;overflow-wrap:anywhere;border-radius:16px;padding:12px 15px;line-height:1.55;max-width:92%;background:var(--panel)}.bubble.user{background:#1e426b;align-self:flex-end}.bubble.lex{align-self:flex-start}.system-bubble{color:var(--muted);font-size:.9rem}.composer{display:flex;align-items:end;gap:8px;margin:12px 0}.composer textarea{resize:vertical;flex:1;max-height:130px}.composer button{background:var(--accent);color:#07111f;border-radius:12px;padding:14px 18px;font-weight:700}@media(min-width:700px){.tiles{grid-template-columns:repeat(4,1fr)}.bottom-nav{position:static;width:min(900px,100%);margin:auto;border:1px solid var(--line);border-radius:16px;height:65px;padding:0}.shell{display:flex;flex-direction:column}main{flex:1;width:min(900px,100%)}} 
/* Lex Web v0.2 — readable, deliberately editable mobile styles */
:root { --radius:16px; --compact-row:58px; --green:#4ade80; --orange:#fbbf24; }
main {padding-top:18px}
.heading {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.heading h1 {margin:0 0 3px}
.caption {font-size:.78rem}
.version {font-size:.66rem;background:var(--panel2);color:var(--muted);padding:2px 6px;border-radius:6px}
.button-row {display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.button-row.right {justify-content:flex-end}
.primary-button,.secondary-button,.danger-button,.more-button {padding:10px 14px;border-radius:12px;font-weight:600;min-height:42px}
.primary-button {background:var(--accent);color:#07111f}
.secondary-button {background:var(--panel2);color:var(--text);border:1px solid var(--line)}
.danger-button {background:#883448;color:#fff}
.more-button {background:var(--panel);border:1px solid var(--line);display:block;width:100%;margin:14px 0}
.text-button {background:transparent;color:var(--accent);font-size:.83rem}
.square {min-width:43px;padding:8px 10px;font-size:1.25rem;line-height:1.1}
.search-line {display:flex;align-items:center;gap:7px;margin:6px 0 10px}
.search-line input {flex:1;width:100%;padding:11px 13px;min-height:43px}
.search-line .icon-button {font-size:1.25rem;padding:8px 12px;min-height:43px}
.chips {display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.chip {padding:8px 11px;border-radius:11px;background:var(--panel);border:1px solid var(--line);font-size:.82rem;color:var(--text)}
.chip.active {border-color:var(--accent);color:var(--accent)}
.chip.quiet {background:transparent;color:var(--muted)}
.popover,.advanced {background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin:0 0 12px;box-shadow:0 12px 32px #0004}
.popover-heading {display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.popover-footer {display:flex;justify-content:flex-end;margin-top:12px}
.check-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.check-row {display:flex;align-items:center;gap:8px;font-size:.85rem;min-height:26px}
.check-row input {margin:0;width:17px;height:17px;accent-color:var(--accent)}
.check-row small {color:var(--muted);margin-left:auto}
.filter-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
.filter-grid label,.field {display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:.79rem}
.filter-grid input,.filter-grid select {padding:10px;font-size:.88rem;width:100%}
.compact-list {background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin:8px 0}
.compact-list:empty {display:none}
.list-row {min-height:var(--compact-row);display:flex;align-items:center;gap:9px;padding:7px 10px;border-bottom:1px solid var(--line);position:relative;touch-action:pan-y}
.list-row:last-child {border-bottom:0}
.row-open {display:flex;align-items:center;gap:10px;flex:1;min-width:0;text-align:left;background:transparent;padding:0;min-height:43px}
.row-main {display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.row-title {display:block;color:var(--text);font-size:.88rem;font-weight:600;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.row-title.completed {text-decoration:line-through;color:var(--muted)}
.row-meta {display:flex;gap:7px;align-items:center;color:var(--muted);font-size:.72rem;white-space:nowrap;overflow:hidden}
.row-meta span {overflow:hidden;text-overflow:ellipsis}
.row-icon {color:var(--accent);font-size:1.1rem;flex-shrink:0;width:24px;text-align:center}
.row-icon.done {color:var(--green)}
.row-menu {padding:7px 10px;border-radius:10px;background:transparent;color:var(--muted);font-size:1.3rem;line-height:1}
.row-menu:hover,.row-menu:focus-visible {background:var(--panel2)}
.inline-menu {position:absolute;right:8px;top:43px;z-index:5;background:#26334b;box-shadow:0 10px 28px #0009;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;min-width:160px;padding:5px}
.inline-menu button {background:transparent;text-align:left;padding:10px 12px;border-radius:8px;font-size:.84rem}
.inline-menu button:hover {background:#3b4d69}
.inline-menu button.danger-text {color:#fda4af}
.hint {margin-top:10px;color:var(--muted);font-size:.73rem;line-height:1.5}
.breadcrumbs {display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin:10px 0 12px}
.breadcrumbs button {padding:5px 9px;background:var(--panel);border:1px solid var(--line);border-radius:8px;font-size:.78rem}
.folder-heading {color:var(--muted);font-size:.71rem;font-weight:700;letter-spacing:.05em;margin:15px 0 7px;text-transform:uppercase}
.empty-state {padding:22px 14px;color:var(--muted);font-size:.84rem;text-align:center}
.drawer-overlay,.confirm-overlay {position:fixed;inset:0;background:#030712b9;z-index:30}
.drawer {position:fixed;bottom:0;right:0;top:3vh;width:min(580px,100%);background:#141e2e;border:1px solid var(--line);border-radius:24px 24px 0 0;z-index:31;display:flex;flex-direction:column;box-shadow:0 -15px 50px #0008;animation:slide-in .2s ease-out}
@keyframes slide-in {from{transform:translateY(28px);opacity:.75}to{transform:translateY(0);opacity:1}}
.drawer-handle {width:42px;height:4px;border-radius:5px;background:#506078;margin:9px auto 3px;flex:none}
.drawer-top {padding:8px 18px 12px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:8px;flex:none}
.drawer-top h2 {margin:2px 0 0;font-size:1.1rem}
.drawer-content {padding:16px 18px 28px;overflow:auto;overscroll-behavior:contain;flex:1;display:flex;flex-direction:column;gap:14px}
.drawer-footer {padding:11px 16px max(14px,env(safe-area-inset-bottom));background:#141e2e;border-top:1px solid var(--line);display:flex;gap:8px;flex-wrap:wrap;flex:none}
.drawer-footer .primary-button {flex:1}
.field input,.field textarea,.field select {width:100%;font-size:.94rem;color:var(--text);border-radius:11px}
.field textarea {min-height:115px;resize:vertical;line-height:1.55}
.field input:disabled,.field textarea:disabled {opacity:.65}
.field-line {display:grid;grid-template-columns:1fr 1fr;gap:10px}
.field-caption {font-size:.75rem;color:var(--muted)}
.note-preview {white-space:pre-wrap;overflow-wrap:anywhere;background:var(--panel2);border:1px solid var(--line);padding:12px;border-radius:12px;font-size:.88rem;line-height:1.6}
.drawer-toolbar {display:flex;gap:8px;flex-wrap:wrap}
.drawer-toolbar button {background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:7px 10px;font-size:.8rem}
.confirm-overlay {z-index:40;display:grid;place-items:center;padding:18px}
.confirm-dialog {background:#1b273a;border:1px solid var(--line);border-radius:18px;padding:20px;width:min(400px,100%);box-shadow:0 15px 60px #0008}
.confirm-dialog p {color:var(--muted);line-height:1.5;white-space:pre-wrap}
.toast {position:fixed;left:50%;bottom:calc(90px + env(safe-area-inset-bottom));transform:translateX(-50%);background:#354760;color:#fff;padding:12px 16px;border:1px solid #587196;border-radius:12px;box-shadow:0 8px 30px #000a;z-index:50;max-width:90vw;font-size:.84rem;text-align:center}
button:focus-visible {outline:2px solid var(--accent);outline-offset:2px}
@media(min-width:700px){.drawer {top:0;border-radius:20px 0 0 20px}.drawer-handle{display:none}.bottom-nav{position:fixed;bottom:10px;left:50%;transform:translateX(-50%);background:#131c2c}.shell main{padding-bottom:115px}.compact-list{margin-bottom:12px}}
@media(max-width:380px){.filter-grid{grid-template-columns:1fr}.chip{font-size:.76rem}.row-title{font-size:.82rem}}
