*,*:before,*:after{box-sizing:border-box}:root{--bg: #0f0f14;--bg-top: #12121a;--panel: rgba(255, 255, 255, .06);--panel2: rgba(255, 255, 255, .08);--text: #e8e8ec;--muted: #888;--accent: #0dcaf0;--danger: #f44;--warn: #fa0;--ok: #4c4;--s1: .25rem;--s2: .5rem;--s3: .75rem;--s4: 1rem;--s5: 1.5rem;--s6: 2rem;--r1: 4px;--r2: 8px;--glow: 0 0 20px rgba(13, 202, 240, .15)}body{margin:0;min-height:100vh;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5;color:var(--text);background:var(--bg);background-image:linear-gradient(180deg,var(--bg-top) 0%,var(--bg) 100%)}.app{max-width:980px;margin:0 auto;padding:var(--s4);display:flex;flex-direction:column;gap:var(--s5)}.app>h1{margin:0 0 var(--s2);font-size:1.75rem;font-weight:700;color:var(--text)}.panel{background:var(--panel);border:1px solid rgba(255,255,255,.08);border-radius:var(--r2);box-shadow:0 4px 24px #0003;padding:var(--s4)}.panel h2{margin:0 0 var(--s3);font-size:1.125rem;font-weight:600;color:var(--text)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--s2) var(--s3);font-size:.875rem;font-family:inherit;line-height:1.3;border-radius:var(--r1);border:1px solid transparent;cursor:pointer;transition:opacity .15s,background .15s,border-color .15s}.btn:hover:not(:disabled){opacity:.9}.btn:active:not(:disabled){opacity:.85}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:var(--bg);border-color:var(--accent)}.btn-primary:hover:not(:disabled){filter:brightness(1.1)}.btn-secondary{background:transparent;color:var(--text);border-color:var(--muted)}.btn-secondary:hover:not(:disabled){background:var(--panel2)}.btn-ghost{background:transparent;color:var(--muted);border-color:transparent}.btn-ghost:hover:not(:disabled){color:var(--text);background:var(--panel2)}.input{padding:var(--s2) var(--s3);font-size:.9375rem;font-family:inherit;color:var(--text);background:var(--panel2);border:1px solid rgba(255,255,255,.12);border-radius:var(--r1);min-height:2.25rem;transition:border-color .15s,box-shadow .15s}.input::placeholder{color:var(--muted)}.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #0dcaf033}.input:disabled{opacity:.6;cursor:not-allowed}.card-form{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s3)}.card-form .input{flex:1;min-width:8rem}.card-form .btn{flex-shrink:0}.card-list.panel{padding:var(--s4)}.card-list ul{list-style:none;padding:0;margin:0}.card-list li{padding:var(--s3) 0;border-bottom:1px solid rgba(255,255,255,.06)}.card-list li:last-child{border-bottom:none}.card-list li.card-item{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s2)}.card-item .card-text{flex:1;min-width:0}.card-item .card-actions{display:flex;flex-wrap:wrap;gap:var(--s2);flex-shrink:0;align-items:center}.card-item .card-actions .btn{min-height:2rem}.card-item .card-edit,.card-item .card-delete,.card-item .card-save,.card-item .card-cancel,.card-item .card-review-now{padding:var(--s1) var(--s2);font-size:.875rem}.card-item .card-edit-fields{display:flex;flex-direction:column;gap:var(--s2);flex:1;min-width:0}.card-item .card-edit-fields .input{padding:var(--s2);font-size:.875rem}.card-list li .created{display:block;font-size:.875rem;color:var(--muted);margin-top:var(--s1)}.status{margin:var(--s2) 0;color:var(--muted);font-size:.875rem}.status.error{color:var(--danger)}.review.panel{margin:0}.review-card-wrapper{max-width:720px;margin:0 auto;overflow:hidden}.review-card{padding:var(--s5);border-radius:var(--r2);background:var(--panel2);border:1px solid rgba(255,255,255,.1);box-shadow:var(--glow)}.review-pills{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s3)}.review-pill{display:inline-block;padding:var(--s1) var(--s2);font-size:.75rem;font-weight:500;color:var(--muted);background:var(--panel);border-radius:999px;border:1px solid rgba(255,255,255,.06)}.review-card .review-mode{margin-bottom:var(--s3)}.review-card .review-mode label{margin-right:var(--s3);color:var(--text);font-size:.875rem}.review-card .review-text{font-size:1.125rem;margin:var(--s3) 0;line-height:1.5;color:var(--text)}.review-image-placeholder{aspect-ratio:16 / 9;background:var(--panel);border-radius:var(--r1);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s3);margin-bottom:var(--s3);color:var(--muted);font-size:.875rem;border:1px dashed rgba(255,255,255,.1)}.review-image-placeholder .btn{padding:var(--s2) var(--s3);font-size:.875rem}.review-actions{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin-top:var(--s3)}.review-actions .btn{min-height:2.25rem}.review-score-badge{margin-top:var(--s4);padding:var(--s3) var(--s4);border-radius:var(--r2);font-weight:600;font-size:1rem;display:inline-block;border:1px solid rgba(255,255,255,.1)}.review-score-red{background:#f443;color:#f88;border-color:#ff44444d}.review-score-yellow{background:#fac80026;color:#f0c040;border-color:#fac80040}.review-score-green{background:#4cff4c33;color:#8c8;border-color:#4cff4c59}@keyframes review-shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.review-card-shake{animation:review-shake .5s ease-in-out}@keyframes review-slide-out{to{transform:translate(-100%);opacity:0}}.review-card-leaving{animation:review-slide-out .3s ease-in forwards}@keyframes review-slide-in{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.review-card-entering{animation:review-slide-in .3s ease-out forwards}.review-manual-override{display:flex;align-items:center;gap:var(--s2);margin-bottom:var(--s2);font-size:.875rem;color:var(--muted)}.review-manual-override .btn{padding:var(--s1) var(--s2);font-size:.875rem}.review-attempt-label{font-size:.875rem;color:var(--muted)}.deck-status{display:block;font-size:.75rem;color:var(--muted);margin-top:var(--s1)}.deck-auto-badge{display:inline-block;margin-left:var(--s2);padding:var(--s1) var(--s2);font-size:.75rem;font-weight:600;border-radius:var(--r1)}.practice.panel{padding:var(--s4)}.practice-ask,.practice-fields,.practice-actions{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin-bottom:var(--s3)}.practice-ask .input,.practice-fields .input{flex:1;min-width:10rem}.practice-actions .btn{min-height:2.25rem}.practice-audio{margin-top:var(--s2)}.card-form{padding:var(--s4);background:var(--panel);border:1px solid rgba(255,255,255,.08);border-radius:var(--r2)}
