:root{color:#111827;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{background:#0f172a;min-height:100vh;margin:0}.app{z-index:1;min-height:100vh;padding:calc(env(safe-area-inset-top,0px) + 24px) 24px 24px;background:0 0;position:relative}main{flex-direction:column;align-items:center;display:flex}.status-text{color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1f;border:1px solid #ffffff29;border-radius:14px;padding:10px 14px}.feedback{color:#fff;text-align:center;margin-top:12px}.feedback-mistake-move{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ef444438;border:1px solid #ef444466;border-radius:12px;padding:10px 12px;font-weight:700;animation:.25s card-fade-in}.mistake-move-banner{text-align:center;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ef44443d;border:1px solid #ef44446b;border-radius:14px;width:min(100%,500px);margin:0 auto 12px;padding:12px 14px;font-weight:700;animation:.2s card-fade-in;box-shadow:0 10px 28px #ef44442e}.top-bar{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:32px;display:flex}.brand-block{flex-direction:column;gap:10px;display:flex}.app-title{letter-spacing:-.04em;background:linear-gradient(135deg,#fff 0%,#ddd6fe 35%,#c4b5fd 65%,#fff 100%);color:#0000;text-shadow:0 8px 30px #8b5cf647;-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(2.2rem,4vw,3.4rem);font-weight:800;line-height:1}.active-profile{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#f5f3ff;background:#ffffff1f;border:1px solid #ffffff2e;border-radius:999px;align-items:center;gap:10px;width:fit-content;margin:0;padding:8px 12px;display:inline-flex;box-shadow:0 10px 30px #0f172a1f}.profile-label{letter-spacing:.08em;text-transform:uppercase;color:#d8b4fe;font-size:.78rem;font-weight:700}.profile-name{color:#fff;font-size:1rem;font-weight:700}.header-right{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:14px;display:flex}.streak{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;background:#ffffff24;border:1px solid #ffffff2e;border-radius:999px;align-items:center;gap:10px;padding:12px 16px;font-weight:700;display:inline-flex;box-shadow:0 10px 30px #0f172a24}.streak-emoji{font-size:1.2rem;line-height:1}.streak-label{color:#fde68a;text-transform:uppercase;letter-spacing:.06em;font-size:.9rem}.streak-value{color:#fff;font-size:1.1rem}.pile-toggle-group{flex-wrap:wrap;gap:10px;display:flex}.pile-toggle-button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff38;border-radius:999px;padding:10px 14px;font-size:.95rem;transition:transform .15s,background .15s,border-color .15s}.pile-toggle-button:hover{background:#fff3;transform:translateY(-1px)}.pile-toggle-button.active{background:#ffffff42;border-color:#fff6;font-weight:700}.pile-toggle-button.mistakes{color:#fecaca}.pile-toggle-button.active.mistakes{color:#fff;background:#ef444433;border-color:#ef444473}.flashcard-wrapper{perspective:1000px;width:min(100%,500px);margin:0 auto;animation:.25s card-fade-in}.card-flip-container{width:100%;min-height:220px;transform-style:preserve-3d;cursor:pointer;transition:transform .6s;position:relative}.card-flip-container.flipped{transform:rotateY(180deg)}.card-face{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);text-align:center;backface-visibility:hidden;background:#ffffffe6;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;padding:40px 24px;display:flex;position:absolute;inset:0;box-shadow:0 12px 36px #0f172a2e}.card-front{transform:rotateY(0)}.card-back{transform:rotateY(180deg)}.card-face h2{color:#111827;margin:0;font-size:clamp(2rem,5vw,2.5rem);line-height:1.1}.card-hint{color:#4b5563;pointer-events:none;margin-top:16px;font-size:.95rem}.mistake-card .card-face{background:#fef2f2e6;border:2px solid #ef4444;box-shadow:0 14px 34px #ef44442e}.mistake-card .card-hint{color:#b91c1c}.empty-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center;background:#ffffffe0;border-radius:18px;justify-content:center;align-items:center;width:min(100%,500px);min-height:220px;margin:0 auto;padding:40px 24px;display:flex;box-shadow:0 12px 36px #0f172a2e}.answer-form{gap:12px;width:100%;margin-top:20px;display:flex}.answer-input,.add-card-form input{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffffe0;border:1px solid #ffffff2e;border-radius:12px;flex:1;min-width:0;padding:12px 14px;font-size:1rem}.answer-input:focus,.add-card-form input:focus{border-color:#8b5cf6;outline:none;box-shadow:0 0 0 3px #8b5cf62e}.answer-input-wrong{background:#fef2f2;border:2px solid #dc2626;outline:none;animation:.45s wrong-answer-shake}.answer-input-correct{background:#f0fdf4;border:2px solid #16a34a;outline:none;animation:.3s correct-answer-pop}.answer-form button,.add-card-form button,.floating-add-button{cursor:pointer;border:none;border-radius:12px;padding:12px 16px;font-size:1rem;font-weight:700;transition:transform .15s,background .15s}.answer-form button,.add-card-form button{color:#fff;background:linear-gradient(135deg,#84cc16,#65a30d)}.answer-form button:hover,.add-card-form button:hover{transform:translateY(-1px)}.floating-add-button{color:#111827;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffe0;border-radius:50%;width:58px;height:58px;font-size:2rem;position:fixed;bottom:24px;right:24px;box-shadow:0 10px 30px #0f172a38}.floating-add-button:hover{transform:translateY(-1px)}.modal{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:3;background:#ffffffeb;border-radius:18px;padding:16px;position:fixed;bottom:96px;right:24px;box-shadow:0 14px 38px #0f172a33}.add-card-form{flex-direction:column;gap:12px;width:320px;display:flex}.add-card-form h3{margin:0 0 4px}.mistakes-status{color:#fff;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#b91c1c3d;border:1px solid #ef444459;border-radius:14px;width:min(100%,420px);margin:0 auto 12px;padding:12px 14px;font-weight:600}.mistake-progress-pills{justify-content:center;gap:8px;margin-top:10px;display:flex}.pill{background:#fecaca;border-radius:999px;width:26px;height:10px}.pill.filled{background:#dc2626}.profile-gate-shell{z-index:1;background:0 0;justify-content:center;align-items:center;min-height:100vh;padding:16px;display:flex;position:relative}.profile-gate-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffe6;border-radius:18px;width:100%;max-width:420px;padding:28px;box-shadow:0 12px 36px #0f172a33}.title{text-align:center;margin:0 0 20px;font-size:1.8rem}.create-form,.profile-select-form{gap:8px;margin-bottom:16px;display:flex}.profile-select-form{align-items:center}.input{background:#fff;border:1px solid #d1d5db;border-radius:10px;flex:1;min-width:0;padding:10px 12px;font-size:1rem}.input:focus{border-color:#6366f1;outline:none}.primary-button{color:#fff;cursor:pointer;background:#6366f1;border:none;border-radius:10px;padding:10px 14px;font-weight:600}.primary-button:hover{background:#4f46e5}.divider{background:#e5e7eb;height:1px;margin:16px 0}.muted{color:#6b7280;text-align:center}.error{color:#dc2626;text-align:center;margin-top:12px}.danger-button{color:#fff;cursor:pointer;background:#dc2626;border:none;border-radius:10px;padding:10px 14px;font-weight:600}.danger-button:hover{background:#b91c1c}.bg-container{z-index:0;pointer-events:none;background:#140b2e;position:fixed;inset:0;overflow:hidden}.bg-gradient{filter:blur(80px);opacity:.75;background:radial-gradient(circle,#7c3aed,#0000 60%);width:150%;height:150%;animation:10s ease-in-out infinite move1;position:absolute}.bg-gradient2{filter:blur(90px);opacity:.65;background:radial-gradient(circle at 30% 70%,#4f46e5,#0000 60%);width:150%;height:150%;animation:12s ease-in-out infinite move2;position:absolute}.bg-gradient3{filter:blur(100px);opacity:.65;background:radial-gradient(circle at 70% 30%,#9333ea,#0000 60%);width:150%;height:150%;animation:14s ease-in-out infinite move3;position:absolute}@keyframes move1{0%{transform:translate(-30%,-30%)}50%{transform:translate(30%,20%)}to{transform:translate(-30%,-30%)}}@keyframes move2{0%{transform:translate(35%,-20%)}50%{transform:translate(-30%,25%)}to{transform:translate(35%,-20%)}}@keyframes move3{0%{transform:translate(-20%,35%)}50%{transform:translate(25%,-30%)}to{transform:translate(-20%,35%)}}@keyframes wrong-answer-shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}@keyframes correct-answer-pop{0%{transform:scale(1)}50%{transform:scale(1.03)}to{transform:scale(1)}}@keyframes card-fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.mobile-streak{display:none}@media (width<=640px){.app{padding:calc(env(safe-area-inset-top,0px) + 16px) 16px calc(env(safe-area-inset-bottom,0px) + 16px)}.top-bar{flex-direction:column;align-items:flex-start;gap:12px}.mobile-streak{justify-content:center;margin:10px 0 8px;display:flex}.header-right .streak{display:none}.app-title{font-size:2rem}.header-right{justify-content:flex-start;align-items:flex-start;width:100%}.pile-toggle-group{width:100%}.answer-form{flex-direction:column;margin-top:10px}.modal{bottom:88px;left:16px;right:16px}.add-card-form,.brand-block{width:100%}}@media (width<=480px){.create-form,.profile-select-form{flex-direction:column}}