:root{--bg:#0f1115;--surface:#191d24;--surface-2:#222833;--border:#2c333f;--text:#e8eaed;--muted:#98a0ad;--accent:#4f8cff;--good:#3fb950;--again:#f0603f;--clr-blue:#4f8cff;--clr-green:#3fb950;--clr-purple:#a855f7;--clr-orange:#f0903f;--clr-pink:#ec4899;--clr-teal:#14b8a6;--clr-red:#f0603f;--clr-yellow:#eab308;--radius:14px;--tap:48px;--lh-latin:1.45;--lh-fa:1.85}@media (prefers-color-scheme:light){:root{--bg:#f6f7f9;--surface:#fff;--surface-2:#eef0f4;--border:#d9dde4;--text:#16181d;--muted:#5c6470}}*{box-sizing:border-box}[hidden]{display:none!important}html,body{min-height:100dvh;margin:0}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:var(--lh-latin);-webkit-text-size-adjust:100%;overscroll-behavior-y:contain}.fa,[lang=fa]{font-family:Vazirmatn,IRANSans,Segoe UI,Tahoma,sans-serif;line-height:var(--lh-fa)}.screen{max-width:34rem;padding:calc(1rem + env(safe-area-inset-top)) 1rem calc(1rem + env(safe-area-inset-bottom));margin:0 auto}h1{margin:0 0 .5rem;font-size:1.5rem}.muted{color:var(--muted)}button{min-height:var(--tap);font:inherit;color:inherit;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;padding:0 1rem}button:disabled{opacity:.5;cursor:default}:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}#app{grid-template-rows:auto 1fr auto;min-height:100dvh;display:grid}.app-header{padding:calc(.5rem + env(safe-area-inset-top)) 1rem .5rem;border-block-end:1px solid var(--border);background:var(--surface);z-index:10;justify-content:space-between;align-items:center;gap:.5rem;display:flex;position:sticky;inset-block-start:0}.brand{background:0 0;border:none;min-height:auto;padding:0;font-size:1.15rem;font-weight:700}.header-actions{gap:.35rem;display:flex}.app-nav{border-block-start:1px solid var(--border);background:var(--surface);padding-block-end:env(safe-area-inset-bottom);display:flex;position:sticky;inset-block-end:0}.tab{color:var(--muted);background:0 0;border:none;border-radius:0;flex:1;font-size:.9rem}.tab.active{color:var(--accent);box-shadow:inset 0 2px 0 var(--accent);font-weight:600}#outlet{overflow-y:auto}.stack{flex-direction:column;gap:.75rem;display:flex}.center{text-align:center;align-items:center}.small{font-size:.8rem}.boxed{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:1rem}.screen-title{font-size:1.35rem;font-weight:700}button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}button.ghost{background:0 0}button.danger{border-color:var(--again);color:var(--again);background:0 0}button.small{min-height:36px;padding-inline:.7rem;font-size:.85rem}button.contrast{background:var(--text);border-color:var(--text);color:var(--bg);border-radius:999px;font-weight:700}.actions,.inline-form{flex-wrap:wrap;gap:.5rem;display:flex}.inline-form input{flex:12rem}input[type=text],input[type=email]{min-height:var(--tap);font:inherit;color:inherit;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);inline-size:100%;padding-inline:.75rem}.error-box pre{white-space:pre-wrap;word-break:break-word;background:var(--surface-2);border-radius:var(--radius);color:var(--again);padding:.75rem;overflow-x:auto}.stats-card{--bg:#fff;--surface:#fff;--surface-2:#f2f2f5;--border:#e8e8ee;--text:#16181d;--muted:#6b7280;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:20px;overflow:hidden;box-shadow:0 8px 20px #0f11171a}.stats-track{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;display:flex;overflow-x:auto}.stats-track::-webkit-scrollbar{display:none}.stats-slide{scroll-snap-align:center;box-sizing:border-box;text-align:center;flex-direction:column;flex:0 0 100%;align-items:center;gap:.15rem;padding:1.25rem 1rem 1rem;display:flex}.stats-emoji{font-size:1.5rem}.stats-value{font-size:2rem;font-weight:700;line-height:1.1}.stats-dots{justify-content:center;gap:.1rem;padding-block-end:.85rem;display:flex}.dot{block-size:24px;inline-size:24px;background:0 0;border:none;justify-content:center;align-items:center;min-height:0;padding:0;display:flex}.dot:before{content:"";background:var(--border);border-radius:50%;block-size:6px;inline-size:6px}.dot.active:before{background:var(--text)}.skel-value{border-radius:var(--radius);block-size:2rem;inline-size:2.5rem;display:inline-block}.card-list{flex-direction:column;gap:.5rem;display:flex}.row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex}.row-main{flex:1;min-inline-size:0}.row-title{font-weight:600;display:block}.row-sub{display:block}.row-meta{margin-block-start:.15rem;display:block}.tappable{cursor:pointer}.tappable:hover{border-color:var(--accent)}.counts{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;min-block-size:36px;padding:.6rem 1.25rem;display:flex}.counts.study-bar{min-block-size:48px}.counts-start{flex:1;min-inline-size:0}.icon-btn{min-inline-size:36px;padding:0}.card,.card-body{--bg:#fff;--surface:#fff;--surface-2:#f2f2f5;--border:#e8e8ee;--text:#16181d;--muted:#6b7280}.card{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:20px;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 8px 20px #0f11171a}.card-body{background:var(--surface);color:var(--text);border-radius:14px;flex-direction:column;gap:1rem;margin:4px;padding:1.25rem;display:flex}.card-body.tint-blue{background:color-mix(in srgb, var(--clr-blue) 18%, var(--surface))}.card-body.tint-green{background:color-mix(in srgb, var(--clr-green) 18%, var(--surface))}.card-body.tint-purple{background:color-mix(in srgb, var(--clr-purple) 18%, var(--surface))}.card-body.tint-orange{background:color-mix(in srgb, var(--clr-orange) 18%, var(--surface))}.card-body.tint-pink{background:color-mix(in srgb, var(--clr-pink) 18%, var(--surface))}.card-body.tint-teal{background:color-mix(in srgb, var(--clr-teal) 18%, var(--surface))}.card-body.tint-red{background:color-mix(in srgb, var(--clr-red) 18%, var(--surface))}.card-body.tint-yellow{background:color-mix(in srgb, var(--clr-yellow) 18%, var(--surface))}.card-top{align-items:stretch;gap:.75rem;display:flex}.card-info{flex-direction:column;flex:1;gap:.65rem;min-inline-size:0;display:flex}.card-avatar{flex-shrink:0;justify-content:center;align-items:center;font-weight:600;display:flex}.form-preview .card-avatar{border-radius:50%;block-size:64px;inline-size:64px;font-size:1.75rem}.card-top .card-avatar{border-radius:16px;inline-size:84px;font-size:1.75rem}.card-avatar.avatar-blue{background:color-mix(in srgb, var(--clr-blue) 22%, var(--surface-2));color:var(--clr-blue)}.card-avatar.avatar-green{background:color-mix(in srgb, var(--clr-green) 22%, var(--surface-2));color:var(--clr-green)}.card-avatar.avatar-purple{background:color-mix(in srgb, var(--clr-purple) 22%, var(--surface-2));color:var(--clr-purple)}.card-avatar.avatar-orange{background:color-mix(in srgb, var(--clr-orange) 22%, var(--surface-2));color:var(--clr-orange)}.card-avatar.avatar-pink{background:color-mix(in srgb, var(--clr-pink) 22%, var(--surface-2));color:var(--clr-pink)}.card-avatar.avatar-teal{background:color-mix(in srgb, var(--clr-teal) 22%, var(--surface-2));color:var(--clr-teal)}.card-avatar.avatar-red{background:color-mix(in srgb, var(--clr-red) 22%, var(--surface-2));color:var(--clr-red)}.card-avatar.avatar-yellow{background:color-mix(in srgb, var(--clr-yellow) 22%, var(--surface-2));color:var(--clr-yellow)}.card-avatar.avatar-neutral{background:var(--surface-2);color:var(--muted)}.card-desc{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.card-stats{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.stats-dynamic{display:contents}.card-progress{flex-direction:column;gap:.3rem;min-block-size:1.2rem;display:flex}.card-progress-head{justify-content:space-between;display:flex}.card-progress .bar{flex:none;block-size:8px}.card-progress .bar-fill{background:var(--text)}.form-preview{justify-content:center;padding-block:.25rem .75rem;display:flex}.form-preview .card-body{border-block-end:none;justify-content:center;align-items:center;block-size:100px;inline-size:140px;padding:0;display:flex}.swatch-grid{flex-wrap:wrap;gap:.5rem;display:flex}.swatch{block-size:40px;inline-size:40px;border:2px solid #0000;border-radius:50%;min-height:40px;padding:0}.swatch.avatar-blue{background:var(--clr-blue)}.swatch.avatar-green{background:var(--clr-green)}.swatch.avatar-purple{background:var(--clr-purple)}.swatch.avatar-orange{background:var(--clr-orange)}.swatch.avatar-pink{background:var(--clr-pink)}.swatch.avatar-teal{background:var(--clr-teal)}.swatch.avatar-red{background:var(--clr-red)}.swatch.avatar-yellow{background:var(--clr-yellow)}.swatch.selected{border-color:var(--text)}.skel{background:var(--surface-2);border-radius:999px;animation:1.4s ease-in-out infinite skel-pulse;display:inline-block}.skel-title,.skel-meta,.skel-meta-sm{border-radius:var(--radius);display:block}.skel-title{block-size:1.05rem;inline-size:min(60%,12rem)}.skel-meta{block-size:.8rem;inline-size:min(40%,8rem);margin-block-start:.3rem}.skel-meta-sm{block-size:.8rem;inline-size:5rem}.skel-pill{block-size:1.15rem;inline-size:3.5rem}.skel-btn{border-radius:var(--radius);block-size:36px;inline-size:5.5rem}.skel-btn-full{block-size:48px;inline-size:7rem}.skel-avatar{border-radius:16px;flex-shrink:0;inline-size:84px}.skel-bar{border-radius:999px;block-size:8px;inline-size:100%}@keyframes skel-pulse{0%,to{opacity:1}50%{opacity:.45}}@media (prefers-reduced-motion:reduce){.skel{animation:none}}.pill{white-space:nowrap;border-radius:999px;padding:.2rem .5rem;font-size:.75rem;font-weight:600}.pill.due{background:color-mix(in srgb, var(--accent) 20%, transparent);color:var(--accent)}.pill.fresh{background:color-mix(in srgb, var(--good) 20%, transparent);color:var(--good)}.pill.tag{background:var(--surface-2);color:var(--muted);flex-shrink:0;align-self:flex-start}.study{flex-direction:column;gap:1rem;min-height:100%;display:flex}.study-progress{align-items:center;gap:.75rem;display:flex}.segmented{border:1px solid var(--border);background:var(--surface);border-radius:999px;gap:0;padding:2px;display:flex}.segmented .seg{min-height:var(--tap);color:var(--muted);background:0 0;border:none;border-radius:999px;flex:1;padding-inline:.5rem;font-size:.85rem;font-weight:600}.segmented .seg.active{background:var(--accent);color:#fff}.bar{background:var(--surface-2);border-radius:999px;flex:1;block-size:6px;overflow:hidden}.bar-fill{background:var(--accent);block-size:100%;transition:inline-size .2s}.flashcard{text-align:center;background:var(--surface);border:1px solid var(--border);cursor:pointer;touch-action:pan-y;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border-radius:20px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.75rem;min-block-size:14rem;padding:1.5rem 1rem;transition:opacity .15s;display:flex;position:relative}.flashcard.revealed{cursor:default}.flashcard.swipe-right{border-color:var(--good);background:color-mix(in srgb, var(--good) 12%, var(--surface))}.flashcard.swipe-left{border-color:var(--again);background:color-mix(in srgb, var(--again) 12%, var(--surface))}.flashcard.swipe-up{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, var(--surface))}.flashcard.swipe-down{border-color:var(--muted);background:color-mix(in srgb, var(--muted) 12%, var(--surface))}.swipe-badge{background:var(--surface-2);border:1px solid var(--border);white-space:nowrap;pointer-events:none;border-radius:999px;inline-size:-moz-fit-content;inline-size:fit-content;max-inline-size:calc(100% - 1.5rem);margin-inline:auto;padding:.4rem .9rem;font-size:.95rem;font-weight:600;position:absolute;inset-block-start:50%;inset-inline:0;transform:translateY(-50%);box-shadow:0 2px 12px #00000040}.card-front{font-size:1.75rem;font-weight:600}.hint-btn{min-height:40px;margin-block-start:.5rem;font-size:.85rem}.card-hint{color:var(--muted);border-block-start:1px dashed var(--border);max-inline-size:26rem;margin-block-start:.5rem;padding-block-start:.6rem;font-size:.95rem;font-style:italic}.card-ipa{font-family:ui-monospace,Menlo,monospace;font-size:.95rem}.card-back{border-block-start:1px solid var(--border);flex-direction:column;gap:.5rem;inline-size:100%;padding-block-start:.75rem;display:flex}.card-answer{font-size:1.5rem;font-weight:600}.card-example{font-size:.9rem}.study-tools{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.audio{font-size:1.1rem}.retire{color:var(--muted);font-size:.8rem}.grade-row{gap:.75rem;display:flex}.grade{border:1px solid var(--border);flex-direction:column;flex:1;align-items:center;gap:.15rem;min-height:60px;font-weight:600;display:flex}.grade-when{opacity:.8;font-size:.75rem;font-weight:400}.grade.again{background:color-mix(in srgb, var(--again) 18%, transparent);border-color:var(--again);color:var(--again)}.grade.good{background:color-mix(in srgb, var(--good) 18%, transparent);border-color:var(--good);color:var(--good)}.preview-overlay{z-index:50;cursor:pointer;background:#0009;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.preview-panel{cursor:default;text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:20px;flex-direction:column;align-items:center;gap:.75rem;max-block-size:85dvh;inline-size:min(100%,30rem);padding:1.25rem;display:flex;overflow-y:auto}.preview-head{justify-content:space-between;align-items:center;inline-size:100%;display:flex}.sense{border-block-start:1px dashed var(--border);flex-direction:column;gap:.1rem;padding-block-start:.4rem;display:flex}.sense-label{text-transform:uppercase;letter-spacing:.04em}.sense-text{font-size:1.05rem}.note-wrap{border-block-start:1px solid var(--border);text-align:start;flex-direction:column;gap:.3rem;inline-size:100%;margin-block-start:.5rem;padding-block-start:.75rem;display:flex}.note-head{justify-content:space-between;align-items:center;display:flex}.card-field{inline-size:100%;min-block-size:var(--tap);resize:none;font:inherit;color:inherit;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);unicode-bidi:plaintext;padding:.6rem .75rem;overflow:hidden}.note-box{resize:vertical;min-block-size:3.5rem;inline-size:100%;font:inherit;color:inherit;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);direction:inherit;unicode-bidi:plaintext;padding:.5rem .65rem}.msg{border-radius:var(--radius);background:var(--surface-2);padding:.6rem .75rem;font-size:.875rem}.msg.bad{color:var(--again);border:1px solid var(--again)}.msg.good{color:var(--good);border:1px solid var(--good)}@media (min-width:40rem){.flashcard{min-block-size:18rem}.card-front{font-size:2.25rem}}
