:root{--bg:#0f0f13;--bg-card:#1a1a24;--bg-card-hover:#22222e;--surface:#25253a;--text:#e8e8ed;--text-muted:#8888a0;--accent:#6c5ce7;--accent-light:#a29bfe;--green:#00b894;--green-bg:#00b89426;--yellow:#fdcb6e;--yellow-bg:#fdcb6e26;--red:#e17055;--red-bg:#e1705526;--blue:#74b9ff;--blue-bg:#74b9ff26;--radius:12px;--radius-sm:8px;--shadow:0 2px 12px #0000004d}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#app{min-height:100vh}.app-layout{flex-direction:column;min-height:100vh;max-height:100vh;display:flex}.app-header{background:var(--bg-card);border-bottom:1px solid var(--surface);flex-shrink:0;align-items:center;gap:12px;padding:16px 24px;display:flex}.app-header h1{flex:1;font-size:1.2rem;font-weight:600}.header-actions{flex-wrap:wrap;gap:8px;display:flex}.btn{border-radius:var(--radius-sm);cursor:pointer;background:var(--surface);color:var(--text);border:none;align-items:center;gap:4px;padding:8px 16px;font-size:.85rem;font-weight:500;transition:all .15s;display:inline-flex}.btn:hover{filter:brightness(1.2)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-secondary{background:var(--surface);border:1px solid var(--text-muted)}.btn-ghost{color:var(--text-muted);background:0 0}.btn-ghost:hover{color:var(--text);background:var(--surface)}.btn-danger{color:var(--red);background:0 0}.btn-danger:hover{background:var(--red-bg)}.btn-sm{padding:4px 8px;font-size:.8rem}.deck-grid{flex:1;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));align-content:start;gap:16px;padding:24px;display:grid;overflow-y:auto}.deck-card{background:var(--bg-card);border-radius:var(--radius);cursor:pointer;flex-direction:column;gap:16px;padding:20px;transition:background .15s;display:flex}.deck-card:hover{background:var(--bg-card-hover)}.deck-name{margin-bottom:4px;font-size:1.1rem;font-weight:600}.deck-meta{color:var(--text-muted);font-size:.85rem}.deck-card-actions{flex-wrap:wrap;gap:8px;display:flex}.deck-card-actions .btn{flex:1;justify-content:center}.empty-state{text-align:center;color:var(--text-muted);grid-column:1/-1;padding:60px 24px}.empty-icon{margin-bottom:12px;font-size:3rem}.empty-title{color:var(--text);margin-bottom:8px;font-size:1.3rem;font-weight:600}.empty-desc{font-size:.9rem}.study-mode{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:24px;padding:24px;display:flex}.study-empty{color:var(--text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:8px;display:flex}.card-container{perspective:1000px;cursor:pointer;width:100%;max-width:600px;min-height:300px}.card-face{background:var(--bg-card);border-radius:var(--radius);min-height:300px;box-shadow:var(--shadow);backface-visibility:hidden;flex-direction:column;justify-content:center;align-items:center;padding:40px 32px;display:flex}.card-container.flipped .card-front,.card-container:not(.flipped) .card-back{display:none}.card-content{text-align:center;word-break:break-word;white-space:pre-wrap;font-size:1.4rem;line-height:1.6}.word-hl{color:var(--accent-light);font-weight:700}.card-back .word-hl{color:var(--yellow);background:var(--yellow-bg);border-radius:4px;padding:0 4px}.back-word{color:var(--accent-light);border-bottom:1px solid var(--surface);margin-bottom:16px;padding-bottom:12px;font-size:1.5rem;font-weight:700}.back-def{color:var(--text-muted);white-space:pre-wrap;font-size:1rem;line-height:1.7}.hl-in-def{color:var(--yellow);font-weight:700}.word-pos{color:var(--text-muted);vertical-align:super;font-size:.75em;font-weight:500}.word-th{color:var(--green);white-space:nowrap;font-size:.85em;font-weight:400}.back-th-def{color:var(--text-muted);white-space:pre-wrap;margin-top:8px;font-size:.95rem;line-height:1.7}.card-tags{flex-wrap:wrap;justify-content:center;gap:6px;margin-top:16px;display:flex}.tag{background:var(--surface);color:var(--text-muted);border-radius:20px;padding:2px 8px;font-size:.75rem}.study-actions{gap:8px;width:100%;max-width:600px;display:flex}.grade-btn{border-radius:var(--radius-sm);flex:1;justify-content:center;padding:12px 8px;font-size:.85rem;font-weight:600}.grade-again{background:var(--red-bg);color:var(--red)}.grade-hard{background:var(--yellow-bg);color:var(--yellow)}.grade-good{background:var(--green-bg);color:var(--green)}.grade-easy{background:var(--blue-bg);color:var(--blue)}.btn-flip{width:100%;max-width:600px;padding:14px 48px;font-size:1rem}.progress-badge{color:var(--text-muted);background:var(--surface);white-space:nowrap;border-radius:20px;padding:4px 12px;font-size:.8rem}.browse-mode{flex-direction:column;flex:1;display:flex;overflow-y:auto}.browse-toolbar{flex-shrink:0;gap:12px;padding:16px 24px;display:flex}.search-input{border-radius:var(--radius-sm);border:1px solid var(--surface);background:var(--bg-card);color:var(--text);outline:none;flex:1;padding:10px 16px;font-size:.9rem;transition:border-color .15s}.search-input:focus{border-color:var(--accent)}.browse-list{flex-direction:column;flex:1;gap:8px;padding:0 24px 24px;display:flex;overflow-y:auto}.browse-card{background:var(--bg-card);border-radius:var(--radius-sm);align-items:center;gap:16px;padding:16px;transition:background .15s;display:flex}.browse-card:hover{background:var(--bg-card-hover)}.browse-card-main{flex:1;min-width:0}.browse-card-front{white-space:nowrap;text-overflow:ellipsis;margin-bottom:4px;font-weight:600;overflow:hidden}.browse-card-back{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;overflow:hidden}.browse-card-meta{flex-shrink:0;align-items:center;gap:6px;display:flex}.browse-card-date{color:var(--text-muted);font-size:.8rem}.browse-card-actions{flex-shrink:0;gap:4px;display:flex}.badge{white-space:nowrap;border-radius:20px;padding:2px 8px;font-size:.75rem}.badge-deck{background:var(--accent-bg);color:var(--accent-light)}.badge-state{background:var(--surface)}.badge-new{color:var(--blue);background:var(--blue-bg)}.badge-learning{color:var(--yellow);background:var(--yellow-bg)}.badge-review{color:var(--green);background:var(--green-bg)}.badge-relearning{color:var(--red);background:var(--red-bg)}.badge-due{background:var(--red-bg);color:var(--red)}.stats-mode{flex:1;padding:24px;overflow-y:auto}.stats-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;display:grid}.stat-card{background:var(--bg-card);border-radius:var(--radius);text-align:center;padding:24px}.stat-value{color:var(--accent-light);margin-bottom:4px;font-size:2rem;font-weight:700}.stat-label{color:var(--text-muted);font-size:.85rem}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--surface);border-radius:4px}@media (width<=768px){.app-header{flex-wrap:wrap;gap:8px;padding:10px 12px}.app-header h1{flex:auto;min-width:0;font-size:1rem}.header-actions{order:3;gap:4px;width:100%}.header-actions .btn{padding:6px 10px;font-size:.75rem}.deck-grid{grid-template-columns:1fr;gap:10px;padding:12px}.deck-card{gap:10px;padding:14px}.deck-card-actions .btn{padding:6px 8px;font-size:.75rem}.card-face{min-height:200px;padding:24px 16px}.card-content{font-size:1.1rem}.study-mode{gap:16px;padding:12px}.grade-btn{padding:10px 4px;font-size:.75rem}.stats-grid{grid-template-columns:repeat(2,1fr);gap:10px}.stat-card{padding:16px}.stat-value{font-size:1.5rem}.browse-toolbar{flex-direction:column;padding:10px 12px}.browse-list{padding:0 12px 12px}.browse-card{flex-wrap:wrap;padding:10px 12px}.browse-card-meta{order:1;width:100%}.fetch-status{padding:8px 12px!important;font-size:.75rem!important}}.study-mobile{background:var(--bg);flex-direction:column;flex:1;padding:8px 12px 12px;display:flex;overflow:hidden}.card-fullscreen{touch-action:none;-webkit-user-select:none;user-select:none;background:var(--bg-card);border-radius:20px;flex-direction:column;flex:1;align-items:center;gap:12px;padding:24px 24px 20px;transition:transform .2s;display:flex;position:relative;box-shadow:0 4px 24px #0006}.card-fullscreen:before{content:"";background:var(--bg-card);opacity:.3;z-index:-1;border-radius:20px;position:absolute;inset:4px -4px -4px}.card-fullscreen:after{content:"";background:var(--bg-card);opacity:.15;z-index:-2;border-radius:20px;position:absolute;inset:8px -8px -8px}.card-fullscreen .cf-word{color:var(--accent-light);text-align:center;flex-shrink:0;font-size:2.4rem;font-weight:700;line-height:1.2}.card-fullscreen .cf-tags{flex-wrap:wrap;flex-shrink:0;justify-content:center;gap:6px;display:flex}.card-fullscreen .cf-scroll{flex-direction:column;justify-content:center;width:100%;display:flex}.card-fullscreen .cf-back{text-align:center;color:var(--text);white-space:pre-wrap;word-break:break-word;font-size:1rem;line-height:1.7}.card-fullscreen .cf-front{cursor:pointer;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;display:flex}.card-fullscreen .cf-tap-hint{color:var(--text-muted);opacity:.5;font-size:.8rem;animation:2s ease-in-out infinite tap-pulse}@keyframes tap-pulse{0%,to{opacity:.3}50%{opacity:.6}}.card-fullscreen .cf-back-side{flex-direction:column;flex:1;width:100%;animation:.35s ease-out reveal-in;display:none}@keyframes reveal-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.card-fullscreen.revealed .cf-front{display:none}.card-fullscreen.revealed .cf-back-side{display:flex}.cf-back-word{color:var(--accent-light);text-align:center;border-bottom:1px solid var(--surface);margin-bottom:12px;padding-bottom:10px;font-size:1.3rem;font-weight:700}.cf-back-def{text-align:center;color:var(--text-muted);white-space:pre-wrap;word-break:break-word;font-size:.95rem;line-height:1.7}.cf-back-def .hl-in-def{color:var(--yellow);font-weight:700}.cf-back-th-word{color:var(--green);text-align:center;border-top:1px solid var(--surface);margin-top:12px;padding-top:10px;font-size:1.15rem;font-weight:600}.cf-back-th-def{text-align:center;color:var(--text-muted);white-space:pre-wrap;word-break:break-word;margin-top:6px;font-size:.9rem;line-height:1.7}.card-fullscreen .cf-back .word-hl{color:var(--yellow);background:var(--yellow-bg);border-radius:4px;padding:0 4px}.mobile-progress-wrapper{flex:1;align-items:center;gap:8px;max-width:180px;display:flex}.mobile-progress-bar{background:var(--surface);border-radius:3px;flex:1;height:5px;overflow:hidden}.mobile-progress-fill{background:var(--accent);border-radius:3px;height:100%;transition:width .3s}.mobile-progress-text{color:var(--text-muted);white-space:nowrap;font-size:.75rem}@media (width<=768px){.study-actions,.btn-flip{display:none!important}}.swipe-hint{border-radius:var(--radius);z-index:10;pointer-events:none;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);justify-content:center;align-items:center;font-size:1.5rem;font-weight:700;display:none;position:absolute;inset:0}.card-container{touch-action:none;transition:transform .2s;position:relative}