:root{color-scheme:light;--bg: #f4f1de;--surface: #fffaf0;--surface-raised: #ffffff;--accent: #0f4c5c;--accent-soft: #2f7a8a;--text: #1f2933;--muted: #52606d;--border: #d9d4c7;--page-gradient-start: #fffdf7;--card-gradient-start: #ffffff;--card-gradient-end: #fdf6eb;--control-bg: #ffffff;--control-hover: #eff8fa;--on-accent: #ffffff;--error: #b91c1c;--badge-bg: #fef3c7;--badge-border: #f59e0b;--badge-text: #7c2d12;--badge-info-bg: #ecfeff;--badge-info-border: #06b6d4;--badge-info-text: #0e7490}:root[data-theme=sunset]{color-scheme:light;--bg: #f8e8da;--surface: #fff5eb;--surface-raised: #fffaf5;--accent: #8a3d2b;--accent-soft: #b65c45;--text: #2f1f1a;--muted: #6f4f44;--border: #e9c9b9;--page-gradient-start: #fff8f2;--card-gradient-start: #fffdf9;--card-gradient-end: #ffeede;--control-bg: #fffaf5;--control-hover: #ffe5d4;--on-accent: #fffaf7;--error: #9f1239;--badge-bg: #ffe8b6;--badge-border: #f59e0b;--badge-text: #7c2d12;--badge-info-bg: #ffe7df;--badge-info-border: #f97316;--badge-info-text: #9a3412}:root[data-theme=night]{color-scheme:dark;--bg: #0f172a;--surface: #111c2f;--surface-raised: #182742;--accent: #7dd3fc;--accent-soft: #4c94c7;--text: #e2e8f0;--muted: #9fb4cc;--border: #324765;--page-gradient-start: #1b2b49;--card-gradient-start: #1e2e4d;--card-gradient-end: #16253f;--control-bg: #182742;--control-hover: #24385c;--on-accent: #031523;--error: #fca5a5;--badge-bg: #3f320f;--badge-border: #f59e0b;--badge-text: #fcd34d;--badge-info-bg: #0f3144;--badge-info-border: #38bdf8;--badge-info-text: #a5f3fc}*{box-sizing:border-box}html,body,#root{min-height:100%}html{background:radial-gradient(circle at top left,var(--page-gradient-start),var(--bg))}body{margin:0;font-family:Avenir Next,Segoe UI,sans-serif;color:var(--text);background:transparent}button,select,input{font:inherit}select{border:1px solid var(--border);border-radius:8px;padding:.32rem .5rem;background:var(--control-bg);color:var(--text)}input[type=checkbox],input[type=range]{accent-color:var(--accent)}.app{max-width:1040px;margin:0 auto;padding:1rem}.header h1{margin:0;color:var(--accent)}.header p{margin:.5rem 0 0;color:var(--muted)}.mode-switch{margin-top:1rem;display:flex;gap:.6rem}.mode-switch button{border:1px solid var(--border);background:var(--control-bg);color:var(--text);border-radius:10px;padding:.45rem .85rem;cursor:pointer}.mode-switch button.active{border-color:var(--accent);color:var(--on-accent);background:var(--accent)}.controls{margin-top:1rem;display:grid;grid-template-columns:repeat(2,minmax(260px,1fr));gap:1rem;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:.75rem}.controls-column{display:grid;gap:.7rem;align-content:start}.select-row{display:grid;grid-template-columns:115px minmax(0,1fr);align-items:center;gap:.7rem}.select-row span{color:var(--muted);font-weight:600}.select-row select{width:100%}.controls .check{display:flex;align-items:center;gap:.5rem;color:var(--muted);font-weight:600}.range-control{display:grid;gap:.45rem;color:var(--muted);font-weight:600}.range-wrap{position:relative;height:42px}.range-wrap input[type=range]{position:absolute;left:0;right:0;width:100%;margin:0}.range-wrap input[type=range]:first-child{top:3px}.range-wrap input[type=range]:last-child{top:19px}.range-hint{font-size:.78rem;color:var(--muted)}.layout{margin-top:1rem;display:grid;grid-template-columns:300px 1fr;gap:1rem}.categories{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:.75rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;align-content:start}.categories button{text-align:left;border:1px solid var(--border);background:var(--control-bg);color:var(--text);border-radius:8px;padding:.55rem;cursor:pointer}.categories button.active{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.deck{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1rem}.deck-header{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}.deck-header h2{margin:0}.deck-header p{margin:0;color:var(--muted)}.card-shell{margin-top:.75rem;display:grid;gap:.85rem}.flash-card-wrap{position:relative}.flash-card{width:100%;min-height:210px;border:2px solid var(--accent-soft);border-radius:14px;background:linear-gradient(180deg,var(--card-gradient-start),var(--card-gradient-end));color:var(--text);padding:1.2rem 1.2rem 3.1rem;text-align:left;cursor:pointer}.flash-card-both{padding-top:.95rem;padding-bottom:2.65rem}.audio-icon-button{position:absolute;right:.75rem;bottom:.75rem;width:2.2rem;height:2.2rem;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--accent);background:var(--surface-raised);color:var(--accent);border-radius:999px;cursor:pointer}.audio-icon-button svg{width:1.2rem;height:1.2rem;fill:currentColor}.audio-icon-button:hover{background:var(--control-hover)}.translate-button{position:absolute;left:.75rem;bottom:.75rem;border:1px solid var(--accent);background:var(--surface-raised);color:var(--accent);border-radius:999px;padding:.35rem .7rem;text-decoration:none;font-size:.82rem;font-weight:600}.translate-button:hover{background:var(--control-hover)}.face-label{margin:0;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.75rem}.face-text{margin:.7rem 0;font-size:clamp(1.4rem,3vw,2rem);font-weight:700}.flash-card-both .face-text{margin:.4rem 0 .55rem}.hint{margin:0;color:var(--muted)}.card-image-wrap{margin:0}.card-image{width:100%;max-height:250px;border-radius:10px;object-fit:cover;border:1px solid var(--border)}.card-image-wrap figcaption{font-size:.75rem;margin-top:.35rem}.card-footer{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}.badge{margin:0;background:var(--badge-bg);border:1px solid var(--badge-border);color:var(--badge-text);border-radius:999px;padding:.2rem .65rem;font-size:.85rem}.badge.commonness{background:var(--badge-info-bg);border-color:var(--badge-info-border);color:var(--badge-info-text)}.deck-actions button,.deck-nav-actions button{border:1px solid var(--accent);background:var(--control-bg);color:var(--accent);border-radius:8px;padding:.4rem .7rem;cursor:pointer}.deck-actions button:hover,.deck-nav-actions button:hover{background:var(--control-hover)}.notes,.tags,.context{margin:0;color:var(--muted)}.deck-actions{display:flex;flex-wrap:wrap;gap:.55rem}.card-with-nav{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.75rem;align-items:start}.deck-nav-actions{margin-top:.75rem;display:grid;gap:.55rem}.loading{min-height:50vh;display:grid;place-content:center}.error{color:var(--error)}.common-list-panel{margin-top:1rem;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1rem}.list-tabs{display:flex;gap:.55rem}.list-tabs button{border:1px solid var(--border);background:var(--control-bg);color:var(--text);border-radius:8px;padding:.35rem .7rem;cursor:pointer}.list-tabs button.active{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.common-list{margin:.8rem 0 0;padding:0;list-style:none;display:grid;gap:.45rem}.common-list li{display:grid;grid-template-columns:70px 1fr 70px;align-items:center;gap:.5rem;border:1px solid var(--border);border-radius:8px;background:var(--surface-raised);padding:.45rem .6rem}.common-list .rank{color:var(--muted);font-size:.8rem}.common-list .score{justify-self:end;font-weight:700;color:var(--accent)}@media (max-width: 900px){.controls,.layout{grid-template-columns:1fr}.categories{grid-template-columns:repeat(2,minmax(0,1fr))}.common-list li{grid-template-columns:60px 1fr 60px}.card-with-nav{grid-template-columns:1fr}.deck-nav-actions{margin-top:0;grid-template-columns:repeat(3,minmax(0,1fr))}}