:root{--color-bg:#f4f5f7;--color-surface:#fff;--color-text:#1f2328;--color-muted:#656d76;--color-border:#d8dce1;--color-accent:#06c755;--color-accent-text:#fff;--color-error:#c62828;--color-done-surface:#eceef1;--genre-0-bg:#ede4fb;--genre-0-fg:#5b3a9a;--genre-1-bg:#fde3e1;--genre-1-fg:#a33a31;--genre-2-bg:#dfeafc;--genre-2-fg:#2a5aa8;--genre-3-bg:#dff3e1;--genre-3-fg:#2d7a3a;--genre-4-bg:#fcf0cf;--genre-4-fg:#8a6510;--genre-5-bg:#def3f3;--genre-5-fg:#1f6f73;--radius:12px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--color-bg:#121417;--color-surface:#1d2025;--color-text:#e6e8eb;--color-muted:#9aa3ad;--color-border:#343941;--color-done-surface:#181a1e;--genre-0-bg:#3a2d55;--genre-0-fg:#d7c4fa;--genre-1-bg:#4f2a27;--genre-1-fg:#f6c1bb;--genre-2-bg:#233a5c;--genre-2-fg:#bcd3fa;--genre-3-bg:#24432a;--genre-3-fg:#bfe8c5;--genre-4-bg:#4a3c16;--genre-4-fg:#f3dc9c;--genre-5-bg:#1d4446;--genre-5-fg:#b6e6e7}}*{box-sizing:border-box}body{background:var(--color-bg);color:var(--color-text);margin:0;font-family:system-ui,-apple-system,Hiragino Sans,Noto Sans JP,sans-serif;line-height:1.5}.app{max-width:640px;margin:0 auto;padding:16px}.app__title{margin:0 0 12px;font-size:1.25rem}.filters{gap:10px;display:grid}.search,select{border:1px solid var(--color-border);background:var(--color-surface);width:100%;color:var(--color-text);font:inherit;border-radius:8px;padding:10px 12px}.segmented{border:1px solid var(--color-border);border-radius:8px;grid-template-columns:repeat(3,1fr);display:grid;overflow:hidden}.segmented button{background:var(--color-surface);color:var(--color-text);font:inherit;cursor:pointer;border:none;padding:8px 0}.segmented button+button{border-left:1px solid var(--color-border)}.segmented button[aria-pressed=true]{background:var(--color-accent);color:var(--color-accent-text);font-weight:600}.field-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.field{gap:2px;min-width:0;display:grid}.field__label{color:var(--color-muted);font-size:.75rem}.field select{padding:8px;font-size:.875rem}.count{color:var(--color-muted);margin:12px 0 8px;font-size:.875rem}.list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.card{border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface)}.card--done{background:var(--color-done-surface);opacity:.7}.card--done .card__title{text-decoration:line-through}.card__header{align-items:flex-start;gap:8px;display:flex}.card__title{overflow-wrap:anywhere;flex:1;font-weight:600}.badge{background:var(--color-muted);color:var(--color-surface);border-radius:999px;flex-shrink:0;padding:0 8px;font-size:.75rem;line-height:1.6}.card__meta{flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:6px;font-size:.8125rem;display:flex}.chip{border-radius:999px;padding:1px 10px}.chip--unset{border:1px dashed var(--color-border);color:var(--color-muted)}.chip--genre-0{background:var(--genre-0-bg);color:var(--genre-0-fg)}.chip--genre-1{background:var(--genre-1-bg);color:var(--genre-1-fg)}.chip--genre-2{background:var(--genre-2-bg);color:var(--genre-2-fg)}.chip--genre-3{background:var(--genre-3-bg);color:var(--genre-3-fg)}.chip--genre-4{background:var(--genre-4-bg);color:var(--genre-4-fg)}.chip--genre-5{background:var(--genre-5-bg);color:var(--genre-5-fg)}.difficulty{color:var(--color-muted);letter-spacing:1px}.card__no{color:var(--color-muted);margin-left:auto;font-size:.75rem}.card__note{color:var(--color-muted);overflow-wrap:anywhere;margin:6px 0 0;font-size:.8125rem;display:block}.status{text-align:center;color:var(--color-muted);margin:24px 0}.status--error{color:var(--color-error)}.button{background:var(--color-accent);color:var(--color-accent-text);font:inherit;cursor:pointer;border:none;border-radius:8px;padding:8px 20px}.card__body{border-radius:var(--radius);width:100%;color:inherit;font:inherit;text-align:left;background:0 0;border:none;padding:12px 14px;display:block}.card__button{cursor:pointer}.card__button:active{background:var(--color-done-surface)}.notice{border:1px solid var(--color-border);background:var(--color-surface);border-radius:8px;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px;padding:10px 12px;font-size:.875rem;display:flex}.notice__close{color:var(--color-muted);font:inherit;cursor:pointer;background:0 0;border:none;flex-shrink:0}.overlay{z-index:10;background:#00000073;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{width:100%;max-width:640px;max-height:90vh;padding:20px 16px calc(20px + env(safe-area-inset-bottom));background:var(--color-bg);border-radius:16px 16px 0 0;gap:14px;display:grid;overflow-y:auto}.sheet__title{overflow-wrap:anywhere;margin:0;font-size:1.125rem}.sheet__no{color:var(--color-muted);margin:-10px 0 0;font-size:.8125rem}.toggle{align-items:center;gap:8px;font-weight:600;display:flex}.toggle input{width:20px;height:20px;accent-color:var(--color-accent)}.choice-group{border:none;margin:0;padding:0}.choice-group__options{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.choice input{opacity:0;pointer-events:none;position:absolute}.choice span{border:1px solid var(--color-border);background:var(--color-surface);cursor:pointer;border-radius:999px;padding:6px 12px;font-size:.875rem;display:inline-block}.choice input:checked+span{border-color:var(--color-accent);background:var(--color-accent);color:var(--color-accent-text);font-weight:600}.choice input:focus-visible+span{outline:2px solid var(--color-accent);outline-offset:2px}.sheet__actions{grid-template-columns:1fr 1fr;gap:8px;display:grid}.button:disabled{opacity:.5;cursor:default}.button--secondary{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text)}