:root { --ink:#222522; --muted:#777a70; --paper:#f4f0e8; --card:#fffdf8; --line:#dedbd1; --leaf:#52715c; --coral:#da654d; --yellow:#e4b74f; --shadow:#554a3020; }
body[data-theme="citrus"] { --ink:#2c2921; --muted:#817761; --paper:#fbf4df; --card:#fffdf5; --line:#e4d9b9; --leaf:#b06d24; --coral:#c24d3e; --yellow:#e6bd43; --shadow:#7c5d2320; }
body[data-theme="coastal"] { --ink:#213036; --muted:#718187; --paper:#edf5f4; --card:#fbfffe; --line:#d2e1e2; --leaf:#397383; --coral:#d26958; --yellow:#e5b64b; --shadow:#24566820; }
body[data-theme="berry"] { --ink:#30272d; --muted:#88747d; --paper:#f4eceb; --card:#fffafa; --line:#e4d4d7; --leaf:#814f62; --coral:#c76268; --yellow:#dcae4c; --shadow:#59334420; }
body[data-theme="orchard"] { --ink:#293127; --muted:#788174; --paper:#f1f0e6; --card:#fffef8; --line:#d9ddce; --leaf:#66845b; --coral:#9b4d43; --yellow:#d7ad44; --shadow:#3e552d20; }
body[data-theme="night"] { --ink:#edf2e8; --muted:#a7b3a5; --paper:#202725; --card:#29312d; --line:#46544d; --leaf:#a9c98e; --coral:#ef9a75; --yellow:#d1a84c; --shadow:#0b111080; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:radial-gradient(circle at 12% 8%,color-mix(in srgb, var(--leaf) 14%, transparent) 0,transparent 24rem),var(--paper); font-family:Manrope, sans-serif; }
button,input { font:inherit; } button { cursor:pointer; }
.app-shell { max-width:720px; margin:auto; padding:24px 22px 48px; }
.topbar,.welcome-row,.section-heading,.list-card-header,.recovery-panel,.shared-note { display:flex; align-items:center; justify-content:space-between; }
.list-heading h1 { margin:0; font:500 30px/1 Fraunces,serif; }.list-heading h1 em { color:var(--leaf); font-style:italic; }.tagline { max-width:330px; margin:8px 0 0; color:var(--leaf); font-size:14px; font-weight:800; line-height:1.25; }
.drawer-status { padding:10px 12px; border-left:3px solid var(--leaf); background:color-mix(in srgb, var(--leaf) 10%, transparent); border-radius:3px; }.drawer-status.status-error { color:var(--coral); border-color:var(--coral); background:color-mix(in srgb, var(--coral) 14%, transparent); font-weight:800; }.drawer-status.status-success { color:var(--leaf); font-weight:700; }
.brand-lockup { font-family:Fraunces,serif; font-size:21px; font-weight:650; display:flex; gap:8px; align-items:center; }.brand-mark { color:var(--coral); font-family:serif; font-size:24px; }
.icon-button { border:1px solid var(--line); background:#ffffff7c; border-radius:50%; width:38px; height:38px; font-size:21px; color:var(--muted); }
.menu-button { display:flex; align-items:center; gap:7px; border:1px solid var(--line); background:color-mix(in srgb, var(--card) 76%, transparent); border-radius:6px; padding:9px 11px; color:var(--ink); font-size:11px; font-weight:800; }.menu-glyph { color:var(--leaf); font-size:17px; line-height:1; }
.install-app-button { position:fixed; right:18px; bottom:82px; z-index:9; border:0; border-radius:5px; padding:10px 13px; background:var(--leaf); color:#fff; box-shadow:0 8px 20px var(--shadow); font-size:11px; font-weight:800; }
.welcome-row { display:none; }.eyebrow,.card-kicker,.section-heading { font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.12em; color:var(--muted); }.eyebrow { margin:0 0 13px; }
.family-stack { display:flex; padding-bottom:5px; }.avatar { border:2px solid var(--paper); width:32px; height:32px; margin-left:-7px; border-radius:50%; display:grid; place-items:center; color:white; font-size:10px; font-weight:800; }.avatar:first-child { margin:0; }.avatar-a{background:#c37657}.avatar-b{background:#697c9a}.avatar-c{background:#79916c}.avatar-d{background:#b2a18b}
.section-heading { margin-bottom:14px; }.section-heading .text-button { color:var(--leaf); border:0; background:none; font-size:12px; font-weight:800; }.store-tabs { display:flex; gap:8px; overflow:auto; padding-bottom:4px; }.store-tab { white-space:nowrap; border:1px solid var(--line); color:var(--muted); background:transparent; border-radius:99px; padding:11px 15px; font-size:13px; font-weight:700; }.store-tab span { margin-left:7px; color:var(--ink); font-family:'DM Mono',monospace; font-size:11px; }.store-tab.active { background:var(--ink); border-color:var(--ink); color:#fff; }.store-tab.active span { color:#e6d78e; }
.list-card { background:var(--card); border:1px solid #e4e0d6; box-shadow:0 18px 55px #554a3020; border-radius:8px; padding:25px 22px 100px; margin-top:18px; }.card-kicker { margin:0 0 7px; }.list-card h2 { font:500 28px Fraunces,serif; margin:0; }.card-actions { display:flex; align-items:center; gap:12px; }.reorder-toggle { border:1px solid var(--line); background:transparent; color:var(--leaf); border-radius:4px; padding:7px 9px; font-size:10px; font-weight:800; }.reorder-toggle[aria-pressed="true"] { background:var(--leaf); color:#fff; }.sync-status { color:var(--leaf); font-size:11px; font-weight:800; }.sync-status i { display:inline-block; width:7px; height:7px; background:#77a178; border-radius:50%; margin-right:5px; }.progress-line { height:4px; background:#e9e5dc; border-radius:5px; margin-top:23px; overflow:hidden; }.progress-line span { display:block; height:100%; width:0%; background:var(--yellow); transition:width .25s; }.progress-copy { color:var(--muted); font-size:11px; margin:10px 0 11px; }.progress-copy strong { color:var(--ink); }.dot { padding:0 5px; color:#b4b1a8; }
.list-card h2 { font-size:20px; }.first-run-empty { padding:45px 14px 25px; text-align:center; border-top:1px solid var(--line); }.empty-mark { color:var(--coral); font:32px Georgia,serif; }.first-run-empty h2 { margin:10px 0 6px; font:500 25px Fraunces,serif; }.first-run-empty p { max-width:320px; margin:0 auto 18px; color:var(--muted); font-size:12px; line-height:1.5; }.empty-action { border:0; border-radius:4px; padding:10px 13px; background:var(--leaf); color:#fff; font-size:11px; font-weight:800; }
.route-heading { display:flex; align-items:flex-start; gap:12px; }.store-route { flex:1; margin:11px 0 0; color:var(--leaf); font-family:'DM Mono',monospace; font-size:10px; line-height:1.5; }.route-toggle { flex:none; margin-top:8px; border:1px solid var(--line); background:transparent; color:var(--leaf); border-radius:4px; padding:6px 8px; font-size:10px; font-weight:800; }.route-toggle[aria-pressed="true"] { background:var(--leaf); color:#fff; }.route-editor { margin-top:12px; border-top:1px solid var(--line); }.route-row { display:flex; justify-content:space-between; align-items:center; min-height:42px; border-bottom:1px solid var(--line); color:var(--ink); font-size:12px; font-weight:700; }.route-controls { display:flex; gap:3px; }.route-move { width:27px; height:27px; border:1px solid var(--line); background:#fffaf0; color:var(--leaf); border-radius:3px; font-weight:800; }.route-editor.hidden { display:none; }
.add-section-form { display:flex; gap:7px; padding-top:12px; }.add-section-form input { min-width:0; flex:1; border:1px solid var(--line); border-radius:4px; background:#fffdf8; padding:9px; font-size:11px; outline:0; }.add-section-form button { border:0; border-radius:4px; padding:9px 11px; background:var(--leaf); color:#fff; font-size:11px; font-weight:800; }
.family-panel { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:16px; padding:16px 18px; background:#e9eee5; border:1px solid #d5dfd1; border-radius:6px; }.family-panel h2 { margin:0; font:500 21px Fraunces,serif; }.family-panel p:not(.card-kicker) { margin:5px 0 0; color:var(--muted); font-size:11px; }.family-panel form { display:flex; gap:7px; flex:0 0 300px; }.family-panel input { min-width:0; flex:1; border:1px solid #cbd6c7; border-radius:4px; background:#fffdf8; padding:10px; font-size:11px; outline:0; }.family-panel button { border:0; border-radius:4px; padding:10px 12px; background:var(--leaf); color:#fff; font-size:11px; font-weight:800; }.family-panel .hidden { display:none; }.household-actions { display:flex; flex-direction:column; gap:8px; }.household-actions form { flex-basis:auto; }.household-actions input { max-width:120px; }
.invite-reminder { color:var(--leaf) !important; font-family:'DM Mono',monospace; font-weight:500; }.hidden { display:none !important; }
.invite-reminder { margin:14px 0 0; padding:10px 12px; border:1px solid var(--leaf); border-radius:4px; background:color-mix(in srgb, var(--leaf) 10%, transparent); font-weight:800; }.invite-actions { display:flex; gap:7px; margin-top:8px; }.invite-actions button { border:1px solid var(--leaf); border-radius:4px; padding:8px 10px; background:transparent; color:var(--leaf); font-size:10px; font-weight:800; }.household-next-step { color:var(--muted); font-size:11px; line-height:1.4; }.join-divider { margin:12px 0 0; color:var(--muted); font-family:'DM Mono',monospace; font-size:9px; text-transform:uppercase; letter-spacing:.08em; text-align:center; }
.invite-composer { display:grid; gap:7px; margin-top:10px; padding:10px; border:1px solid var(--line); border-radius:4px; background:color-mix(in srgb, var(--leaf) 5%, transparent); }.invite-composer form { display:flex; gap:6px; }.invite-composer input { min-width:0; flex:1; border:1px solid var(--line); border-radius:3px; padding:8px; background:var(--card); font-size:10px; }.invite-composer button { border:0; border-radius:3px; padding:8px 9px; background:var(--leaf); color:#fff; font-size:10px; font-weight:800; }
.items { border-top:1px solid var(--line); }.item { display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--line); min-height:58px; transition:background .25s, box-shadow .25s; }.item.recently-added { background:#fff3c9; box-shadow:inset 4px 0 0 var(--yellow); animation:new-item-pulse 1.1s ease-in-out 2; }.check { width:21px; height:21px; border:1.5px solid #b9b7ad; border-radius:50%; background:none; color:white; display:grid; place-items:center; flex:none; padding:0; font-size:13px; }.item.done .check { background:var(--leaf); border-color:var(--leaf); }.item.done .item-name { color:#aba99f; text-decoration:line-through; }.item-name { flex:1; min-width:70px; font-size:14px; font-weight:700; }.new-badge { color:#9c741e; background:#f6d878; border-radius:99px; padding:4px 7px; font-family:'DM Mono',monospace; font-size:9px; white-space:nowrap; }.category-select { max-width:92px; border:0; background:transparent; color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; padding:3px 0; }.item-user { width:22px; height:22px; border-radius:50%; background:#dbc18b; color:white; display:grid; place-items:center; font-size:9px; font-weight:800; }.move-controls { display:flex; gap:2px; }.move-item { width:25px; height:25px; border:1px solid var(--line); background:#fffaf0; color:var(--leaf); border-radius:3px; font-weight:800; line-height:1; }
@keyframes new-item-pulse { 0%,100% { background:#fff3c9; } 50% { background:#ffe69a; } }
.add-form { position:fixed; left:max(22px, calc(50% - 338px)); right:max(22px, calc(50% - 338px)); bottom:max(12px, env(safe-area-inset-bottom)); z-index:10; display:flex; align-items:center; gap:10px; margin:0; padding:11px 10px; background:#fffdf8f2; border:1px solid #e4e0d6; border-radius:6px; box-shadow:0 8px 22px #554a3026; backdrop-filter:blur(8px); }.plus { font-size:24px; color:var(--coral); }.add-form input { border:0; background:transparent; outline:0; flex:1; min-width:0; color:var(--ink); font-size:13px; }.add-form input::placeholder { color:#a3a096; }.add-form button,.restore-button { border:0; background:var(--leaf); color:white; border-radius:4px; padding:9px 13px; font-size:11px; font-weight:800; }
.recovery-panel { background:#ebe8dc; padding:13px 15px; margin-top:14px; border-radius:6px; gap:10px; }.recovery-icon { background:#fffaf0; color:var(--coral); width:31px; height:31px; border-radius:50%; display:grid; place-items:center; font-size:20px; }.recovery-panel div:nth-child(2) { flex:1; }.recovery-panel strong { font-size:12px; }.recovery-panel p { margin:2px 0 0; color:var(--muted); font-size:10px; }.recovery-actions { display:flex; align-items:center; gap:6px; }.restore-button,.clear-button { border:0; border-radius:4px; padding:9px 11px; font-size:11px; font-weight:800; }.restore-button { background:var(--coral); color:white; }.clear-button { background:transparent; color:var(--muted); }.hidden { display:none; }.shared-note { justify-content:center; gap:7px; color:var(--muted); font-size:10px; margin-top:28px; }.pulse { background:#80a17e; width:6px; height:6px; border-radius:50%; }.tiny-avatars { font-family:'DM Mono',monospace; color:#a3a096; margin-left:5px; }.toast { position:fixed; left:50%; bottom:22px; transform:translate(-50%,20px); background:var(--ink); color:white; padding:11px 16px; border-radius:4px; font-size:12px; opacity:0; pointer-events:none; transition:.2s; }.toast.show { opacity:1; transform:translate(-50%,0); }
@media (min-width:680px) { .app-shell { padding-top:38px; } .welcome-row { margin-top:85px; } }
@media (max-width:600px) { .family-panel { display:block; }.family-panel form { margin-top:12px; flex-basis:auto; }.family-panel button { white-space:nowrap; } input, select, textarea { font-size:16px !important; } }
.list-heading h1 { margin:0; font:500 25px/1 Fraunces,serif; }.list-heading h1 em { color:var(--leaf); font-style:italic; }.list-heading .eyebrow { margin:0 0 7px; }
.welcome-row { display:none; }
.menu-drawer { position:fixed; top:0; right:0; bottom:0; z-index:20; width:min(430px, 92vw); padding:28px 22px; overflow:auto; background:var(--card); border-left:1px solid var(--line); box-shadow:-15px 0 45px var(--shadow); }.drawer-heading { display:flex; justify-content:space-between; align-items:flex-start; }.drawer-heading h2 { margin:0; font:500 24px Fraunces,serif; }.drawer-close { border:0; background:none; color:var(--muted); font-size:28px; line-height:1; }.drawer-status { color:var(--muted); font-size:12px; line-height:1.5; }.menu-drawer .family-panel { display:block; margin:18px 0 0; padding:0; background:transparent; border:0; }.menu-drawer .family-panel > div:first-child { display:none; }.menu-drawer .family-panel form { margin-top:12px; flex-basis:auto; }.menu-drawer .family-panel .invite-reminder { display:block; }
.style-settings { margin-top:30px; padding-top:20px; border-top:1px solid var(--line); }.style-settings h3 { margin:0 0 12px; font:500 21px Fraunces,serif; }.style-options { display:grid; gap:7px; }.style-option { display:flex; align-items:center; gap:10px; width:100%; padding:9px; border:1px solid var(--line); border-radius:5px; text-align:left; color:var(--ink); background:transparent; }.style-option.selected { border-color:var(--leaf); box-shadow:inset 3px 0 var(--leaf); }.style-option strong,.style-option small { display:block; }.style-option strong { font-size:11px; }.style-option small { margin-top:2px; color:var(--muted); font-size:10px; }.style-swatch { display:flex; width:34px; height:25px; overflow:hidden; border-radius:3px; }.style-swatch i { flex:1; }
.drawer-section { margin-top:25px; padding-top:18px; border-top:1px solid var(--line); }.drawer-section h3 { margin:0 0 10px; font:500 21px Fraunces,serif; }.how-list { margin:0; padding-left:20px; color:var(--muted); font-size:11px; line-height:1.55; }.how-list li + li { margin-top:7px; }.members-list { display:grid; gap:6px; }.member-row { display:flex; align-items:center; gap:8px; min-height:34px; }.member-avatar { width:25px; height:25px; border-radius:50%; display:grid; place-items:center; color:#fff; font-size:10px; font-weight:800; }.member-name { flex:1; font-size:11px; font-weight:700; }.member-name small { color:var(--muted); font-size:9px; font-weight:400; }.remove-member { border:0; background:transparent; color:var(--coral); font-size:10px; font-weight:800; }
.install-copy { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }.install-copy + .install-copy { margin-top:8px; }.install-copy strong { color:var(--ink); }
#members-section { margin-top:42px; }
.route-heading-hidden { display:none; }.route-settings { max-width:720px; margin:28px auto 0; padding:18px 0 100px; border-top:1px solid var(--line); }.route-settings-heading { display:flex; justify-content:space-between; align-items:flex-start; }.route-settings h2 { margin:0; font:500 22px Fraunces,serif; }
.item-user.user-m { background:#c45b4b; }.item-user.user-j { background:#527ca8; }.item-user.user-s { background:#668b62; }.item-user.user-a { background:#9a70a8; }
body[data-theme="rock"] .item-user { color:#17131d; box-shadow:0 0 8px currentColor; } body[data-theme="rock"] .item-user.user-m { background:#ff3eb5; } body[data-theme="rock"] .item-user.user-j { background:#62e8ff; } body[data-theme="rock"] .item-user.user-s { background:#ffe45e; } body[data-theme="rock"] .item-user.user-a { background:#a879ff; }
body[data-theme="comic"] .item-user.user-m { background:#e53935; color:#fff; } body[data-theme="comic"] .item-user.user-j { background:#1d71d8; color:#fff; } body[data-theme="comic"] .item-user.user-s { background:#2a9d58; color:#fff; } body[data-theme="comic"] .item-user.user-a { background:#f0a51a; color:#17213d; }
body[data-theme="legal"] .item-user.user-m { background:#a94e38; color:#fff7a8; } body[data-theme="legal"] .item-user.user-j { background:#75631b; color:#fff7a8; } body[data-theme="legal"] .item-user.user-s { background:#5f7845; color:#fff7a8; } body[data-theme="legal"] .item-user.user-a { background:#8a5b74; color:#fff7a8; }
body[data-theme="cartoon"] .item-user.user-m { background:#ef6c3f; color:#fff; } body[data-theme="cartoon"] .item-user.user-j { background:#397bc5; color:#fff; } body[data-theme="cartoon"] .item-user.user-s { background:#197e75; color:#fff; } body[data-theme="cartoon"] .item-user.user-a { background:#9b65b5; color:#fff; }
body[data-theme="boardroom"] .item-user.user-m { background:#9c443b; color:#fff; } body[data-theme="boardroom"] .item-user.user-j { background:#173d5d; color:#fff; } body[data-theme="boardroom"] .item-user.user-s { background:#5c776c; color:#fff; } body[data-theme="boardroom"] .item-user.user-a { background:#b18b4a; color:#17283c; }
body[data-theme="legal"] .list-card { background:var(--card); background-image:none; }
body[data-theme="legal"] .items { border-top:1px solid #e5d879; }
body[data-theme="legal"] .item { min-height:54px; border-bottom:1px solid #e5d879; }
body[data-theme="rock"] { --ink:#f7eef8; --muted:#c6a9c9; --paper:#17131d; --card:#211b29; --line:#74406f; --leaf:#ff3eb5; --coral:#62e8ff; --yellow:#ffe45e; --shadow:#09070d99; font-family:'DM Mono',monospace; background:linear-gradient(135deg,#17131d 0%,#2b1735 48%,#17131d 100%); }
body[data-theme="comic"] { --ink:#17213d; --muted:#53617e; --paper:#fff2b8; --card:#fffdf0; --line:#17213d; --leaf:#1d71d8; --coral:#e53935; --yellow:#ffd92f; --shadow:#17213d55; font-family:Manrope,sans-serif; background-color:#fff2b8; background-image:radial-gradient(#e53935 1px,transparent 1px); background-size:12px 12px; }
body[data-theme="legal"] { --ink:#4c421e; --muted:#85773d; --paper:#fff7a8; --card:#fff9bd; --line:#ded17b; --leaf:#75631b; --coral:#a94e38; --yellow:#f0cf3a; --shadow:#89732230; font-family:'DM Mono',monospace; background-color:#fff7a8; background-image:repeating-linear-gradient(to bottom,transparent 0 33px,#e5d879 34px,#e5d879 35px); }
body[data-theme="cartoon"] { --ink:#263247; --muted:#63708a; --paper:#b9e8df; --card:#fffdf4; --line:#263247; --leaf:#197e75; --coral:#ef6c3f; --yellow:#f5c846; --shadow:#26324755; font-family:Manrope,sans-serif; background:linear-gradient(135deg,#b9e8df,#d8f2be 52%,#b9e8df); }
body[data-theme="boardroom"] { --ink:#17283c; --muted:#6a7784; --paper:#e8e4db; --card:#f9f7f1; --line:#c7c1b4; --leaf:#173d5d; --coral:#9c443b; --yellow:#b18b4a; --shadow:#17283c26; font-family:Manrope,sans-serif; background:linear-gradient(135deg,#e8e4db,#d9e0e2); }
body[data-theme="rock"] .store-tab.active { background:#ff3eb5; border-color:#ff3eb5; color:#17131d; box-shadow:0 0 12px #ff3eb599; }.rock .store-tab.active span, body[data-theme="rock"] .store-tab.active span { color:#17131d; }.rock .add-store-tab, body[data-theme="rock"] .add-store-tab { color:#62e8ff; border-color:#62e8ff; }.rock .item-user, body[data-theme="rock"] .item-user { color:#17131d; box-shadow:0 0 8px currentColor; }
body[data-theme="rock"] .add-form { background:#211b29; border-color:#62e8ff; box-shadow:0 0 16px #62e8ff66; }.rock .add-form input, body[data-theme="rock"] .add-form input { color:#f7eef8; }.rock .add-form input::placeholder, body[data-theme="rock"] .add-form input::placeholder { color:#c6a9c9; }.rock .add-form button, body[data-theme="rock"] .add-form button { background:#ff3eb5; color:#17131d; }.rock .item.recently-added, body[data-theme="rock"] .item.recently-added { background:#ffe45e; box-shadow:inset 4px 0 0 #ff3eb5, 0 0 12px #ffe45e88; }.rock .item.recently-added .item-name, body[data-theme="rock"] .item.recently-added .item-name { color:#17131d; }.rock .item.recently-added .item-meta, body[data-theme="rock"] .item.recently-added .item-meta { color:#39233c; }.rock .new-badge, body[data-theme="rock"] .new-badge { background:#62e8ff; color:#17131d; }
body[data-theme="rock"] .app-shell { max-width:760px; }.rock .brand-lockup, body[data-theme="rock"] h1, body[data-theme="rock"] h2, body[data-theme="rock"] h3 { text-transform:uppercase; letter-spacing:.08em; }.rock .list-card, body[data-theme="rock"] .list-card { border:2px solid var(--leaf); border-radius:0; transform:rotate(-.3deg); }.rock .store-tab, body[data-theme="rock"] .store-tab { border-radius:0; text-transform:uppercase; }.rock .add-form, body[data-theme="rock"] .add-form { border:2px solid var(--coral); border-radius:0; }.rock .item, body[data-theme="rock"] .item { border-bottom:1px solid var(--line); }
body[data-theme="comic"] .list-card { border:3px solid var(--ink); border-radius:12px; box-shadow:8px 8px 0 var(--ink); }.comic .store-tab, body[data-theme="comic"] .store-tab { border:2px solid var(--ink); border-radius:8px; box-shadow:3px 3px 0 var(--ink); }.comic .store-tab.active, body[data-theme="comic"] .store-tab.active { background:var(--coral); }.comic .add-form, body[data-theme="comic"] .add-form { border:3px solid var(--ink); border-radius:10px; box-shadow:5px 5px 0 var(--ink); }.comic .check, body[data-theme="comic"] .check { border:2px solid var(--ink); }
body[data-theme="legal"] .list-card { border:0; border-left:4px solid var(--coral); border-radius:0; box-shadow:10px 10px 0 #b7a43135; background:repeating-linear-gradient(to bottom,var(--card) 0 33px,#e5d879 34px,#e5d879 35px); }.legal .item, body[data-theme="legal"] .item { min-height:54px; border-bottom:0; }.legal .add-form, body[data-theme="legal"] .add-form { border:1px solid var(--line); border-radius:0; box-shadow:5px 5px 0 #b7a43135; }
body[data-theme="legal"] .list-card { background-size:100% 42px; }.legal .item, body[data-theme="legal"] .item { min-height:42px; }.legal .item-name, body[data-theme="legal"] .item-name { font:600 22px/1 'Caveat',cursive; }.legal .category-select, body[data-theme="legal"] .category-select { font-family:'Caveat',cursive; font-size:18px; }.legal .item-user, body[data-theme="legal"] .item-user { background:#b58b20; }
body[data-theme="cartoon"] .list-card { border:3px solid var(--ink); border-radius:22px; box-shadow:0 10px 0 var(--ink); }.cartoon .store-tab, body[data-theme="cartoon"] .store-tab { border:3px solid var(--ink); border-radius:99px; }.cartoon .item, body[data-theme="cartoon"] .item { border-bottom:2px dashed var(--line); }.cartoon .check, body[data-theme="cartoon"] .check { border:3px solid var(--ink); }.cartoon .add-form, body[data-theme="cartoon"] .add-form { border:3px solid var(--ink); border-radius:18px; }
body[data-theme="boardroom"] .list-card { border:1px solid var(--line); border-radius:2px; box-shadow:0 14px 30px var(--shadow); }.boardroom .card-kicker, body[data-theme="boardroom"] .card-kicker { letter-spacing:.18em; }.boardroom .store-tab, body[data-theme="boardroom"] .store-tab { border-radius:2px; }.boardroom .add-form, body[data-theme="boardroom"] .add-form { border-radius:2px; }.boardroom .list-card h2, body[data-theme="boardroom"] .list-card h2 { font-family:Georgia,serif; }
body[data-theme="legal"] .list-card { background:var(--card); background-image:none; }
body[data-theme="legal"] .items { border-top:1px solid #e5d879; }
body[data-theme="legal"] .item { min-height:54px; border-bottom:1px solid #e5d879; }

.item-name-button { border:0; padding:0; background:transparent; color:inherit; text-align:left; }
.item-name-editor { flex:1; min-width:70px; border:1px solid var(--leaf); border-radius:3px; padding:6px 7px; color:var(--ink); background:var(--card); font-size:16px; font-weight:700; outline:0; }