@import "https://fonts.googleapis.com/css2?family=Fraunces:ital,wght@0,700;0,900;1,700&family=Poppins:wght@400;500;600&display=swap";:root{--primary:#c1440e;--primary-dark:#922f07;--primary-light:#e8602e;--secondary:#1a6b6b;--secondary-light:#2a8f8f;--accent:#f5a623;--accent-light:#ffc85a;--background:#faf3e0;--surface:#fff8ee;--card-bg:#fff8eef2;--text:#2c1810;--text-muted:#7a5c4a;--border:#c1440e2e;--success:#2e7d4f;--success-light:#d4edda;--error:#c0392b;--error-light:#fde8e8;--gold:#d4a017;--radius:16px;--radius-sm:10px;--shadow:0 4px 24px #2c18101a;--shadow-lg:0 8px 40px #2c181026}*{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{background-color:var(--background);color:var(--text);background-image:radial-gradient(circle at 15% 15%,#c1440e12 0%,#0000 55%),radial-gradient(circle at 85% 80%,#1a6b6b12 0%,#0000 55%),url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23C1440E' fill-opacity='0.04'%3E%3Cpath d='M30 0 L60 30 L30 60 L0 30 Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");min-height:100vh;font-family:Poppins,sans-serif;overflow-x:hidden}.app-container{max-width:820px;margin:0 auto;padding:clamp(1rem,4vw,2rem) clamp(1rem,4vw,2rem) 4rem}header{text-align:center;margin-bottom:clamp(1.5rem,4vw,3rem);padding-top:clamp(1rem,3vw,2rem)}h1{color:var(--primary);letter-spacing:-.5px;margin-bottom:.4rem;font-family:Fraunces,serif;font-size:clamp(2rem,7vw,3.2rem);font-weight:900;line-height:1.1}.subtitle{color:var(--text-muted);font-size:clamp(.85rem,2.5vw,1rem);font-weight:400}.gam-bar{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1.5rem;padding:.75rem 1.25rem;display:flex}.gam-stat{color:var(--text);align-items:center;gap:.4rem;font-size:.9rem;font-weight:600;display:flex}.gam-stat .icon{font-size:1.1rem}.gam-level{flex:1;min-width:140px}.gam-level-name{color:var(--primary);justify-content:space-between;margin-bottom:.25rem;font-size:.8rem;font-weight:600;display:flex}.gam-xp-bar{background:#f0e0d0;border-radius:99px;height:8px;overflow:hidden}.gam-xp-fill{background:linear-gradient(90deg, var(--primary), var(--accent));border-radius:99px;height:100%;transition:width .6s}.card{background:var(--card-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border);margin-bottom:1.5rem;padding:clamp(1.25rem,4vw,2rem)}.exercise-title{color:var(--primary-dark);margin-bottom:1.25rem;font-family:Fraunces,serif;font-size:clamp(1.2rem,4vw,1.6rem);font-weight:700}.progress-row{align-items:center;gap:.75rem;margin-bottom:1.25rem;display:flex}.progress-track{background:#f0e0d0;border-radius:99px;flex:1;height:8px;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--secondary), var(--secondary-light));border-radius:99px;height:100%;transition:width .4s}.progress-label{color:var(--text-muted);white-space:nowrap;font-size:.8rem;font-weight:600}.matching-grid{grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem;display:grid}.matching-col{flex-direction:column;gap:.6rem;display:flex}.matching-item{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;text-align:center;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;min-height:44px;padding:clamp(.6rem,2vw,.9rem) clamp(.75rem,2vw,1rem);font-size:clamp(.85rem,2.5vw,.95rem);font-weight:500;transition:all .18s;display:flex}.matching-item:hover:not(.correct):not(.incorrect){border-color:var(--primary);transform:translateY(-2px);box-shadow:0 4px 12px #c1440e26}.matching-item.selected{background:var(--primary);color:#fff;border-color:var(--primary-dark);transform:translateY(-2px);box-shadow:0 4px 12px #c1440e4d}.matching-item.correct{background:var(--success);color:#fff;pointer-events:none;border-color:#1e5c38}.matching-item.incorrect{background:var(--error-light);border-color:var(--error);animation:.3s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.conjugation-prompt{margin-bottom:.5rem;font-size:clamp(.9rem,2.5vw,1rem);line-height:1.5}.input-group{flex-direction:column;gap:.4rem;margin-bottom:1.25rem;display:flex}.input-group label{color:var(--text-muted);font-size:clamp(.85rem,2.5vw,.95rem);font-weight:500}input[type=text]{border-radius:var(--radius-sm);border:2px solid var(--border);background:var(--surface);color:var(--text);-webkit-appearance:none;width:100%;padding:clamp(.6rem,2vw,.75rem) 1rem;font-family:inherit;font-size:clamp(.9rem,2.5vw,1rem);transition:border-color .2s,box-shadow .2s}input[type=text]:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #c1440e1f}input[type=text]::placeholder{color:#c0a898}.paragraph-text{border-left:4px solid var(--accent);border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:#fff3e4;margin-bottom:1.5rem;padding:1rem 1.25rem;font-size:clamp(.95rem,2.5vw,1.1rem);line-height:1.8}.blank-num{background:var(--primary);color:#fff;vertical-align:middle;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;margin:0 2px;font-size:.75rem;font-weight:700;display:inline-flex}.difficulty-tabs{flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem;display:flex}.difficulty-tab{border:2px solid var(--border);background:var(--surface);cursor:pointer;color:var(--text-muted);border-radius:99px;padding:.35rem .85rem;font-family:inherit;font-size:.8rem;font-weight:600;transition:all .15s}.difficulty-tab.active{background:var(--secondary);color:#fff;border-color:var(--secondary)}.hint-btn{border:1px solid var(--accent);color:var(--accent);cursor:pointer;background:0 0;border-radius:99px;margin-left:.5rem;padding:.2rem .6rem;font-family:inherit;font-size:.75rem;font-weight:600;transition:all .15s}.hint-btn:hover{background:var(--accent);color:#fff}.hint-text{color:var(--text-muted);margin-top:.2rem;font-size:.8rem;font-style:italic}.full-paragraph{background:var(--success-light);border-radius:var(--radius-sm);border-left:4px solid var(--success);margin-top:1.25rem;padding:1rem 1.25rem;font-size:.95rem;line-height:1.7}.full-paragraph h4{text-transform:uppercase;letter-spacing:.05em;color:var(--success);margin-bottom:.5rem;font-size:.8rem;font-weight:700}button{cursor:pointer;border:none;border-radius:99px;min-height:44px;padding:clamp(.6rem,2vw,.75rem) clamp(1rem,3vw,1.5rem);font-family:inherit;font-size:clamp(.85rem,2.5vw,1rem);font-weight:600;transition:all .18s}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 2px 8px #c1440e4d}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 4px 16px #c1440e59}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--surface);color:var(--text);border:2px solid var(--border)}.btn-secondary:hover{border-color:var(--primary-light);background:#f0e4d4}.btn-accent{background:var(--accent);color:#fff;box-shadow:0 2px 8px #f5a6234d}.btn-accent:hover{background:#d4880e;transform:translateY(-2px)}.scoreboard{text-align:center}.score-ring-wrap{flex-direction:column;align-items:center;margin:1.5rem 0;display:flex}.score-value{color:var(--primary);font-family:Fraunces,serif;font-size:clamp(3rem,10vw,5rem);font-weight:900;line-height:1}.score-sub{color:var(--text-muted);margin-top:.25rem;font-size:clamp(.85rem,2vw,1rem)}.xp-earned{background:linear-gradient(135deg, var(--accent-light), var(--accent));color:#fff;border-radius:99px;align-items:center;gap:.4rem;margin-top:.75rem;padding:.4rem 1rem;font-size:1rem;font-weight:700;display:inline-flex}.badges-row{flex-wrap:wrap;justify-content:center;gap:.75rem;margin:1.25rem 0;display:flex}.badge-chip{border:1px solid var(--accent);color:var(--primary-dark);background:linear-gradient(135deg,#fff8ee,#ffe8cc);border-radius:99px;align-items:center;gap:.4rem;padding:.35rem .9rem;font-size:.85rem;font-weight:600;animation:.4s pop-in;display:flex}@keyframes pop-in{0%{opacity:0;transform:scale(.5)}70%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.new-badge-label{background:var(--primary);color:#fff;text-transform:uppercase;border-radius:99px;padding:.1rem .4rem;font-size:.65rem;font-weight:700}.answers-list{text-align:left;max-height:320px;margin-top:1.5rem;padding-right:.5rem;overflow-y:auto}.answer-item{border-radius:var(--radius-sm);margin-bottom:.5rem;padding:.65rem .75rem;font-size:.9rem;line-height:1.5}.answer-item.correct-item{background:var(--success-light);border-left:3px solid var(--success)}.answer-item.wrong-item{background:var(--error-light);border-left:3px solid var(--error)}.intro-actions{flex-direction:column;gap:.85rem;max-width:360px;margin:0 auto;display:flex}.intro-desc{color:var(--text-muted);margin-bottom:1.75rem;font-size:clamp(.9rem,2.5vw,1rem);line-height:1.6}.review-tabs{flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem;display:flex}.verb-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.75rem;max-height:480px;padding-right:.25rem;display:grid;overflow-y:auto}.verb-card{background:var(--surface);border-radius:var(--radius-sm);border:1px solid var(--border);padding:.75rem}.verb-card strong{color:var(--primary-dark);margin-bottom:.2rem;display:block}.verb-card span{color:var(--text-muted);font-size:.85rem}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#d4b8a0;border-radius:99px}@media (width<=500px){.matching-grid{grid-template-columns:1fr 1fr;gap:.5rem}.matching-item{padding:.5rem;font-size:.8rem}.gam-bar{gap:.5rem;padding:.6rem .9rem}.gam-level{width:100%;min-width:unset}}@media (width<=380px){.matching-grid{grid-template-columns:1fr}}