:root{--font-size:16px;--background:#f1f5f9;--foreground:#0f172a;--card:#fff;--card-foreground:#1e293b;--popover:#fff;--popover-foreground:#1e293b;--primary:#6366f1;--primary-foreground:#fff;--secondary:#f1f5f9;--secondary-foreground:#334155;--muted:#f1f5f9;--muted-foreground:#94a3b8;--accent:#f59e0b;--accent-foreground:#0f172a;--destructive:#ef4444;--destructive-foreground:#fff;--border:#e2e8f0;--input:transparent;--input-background:#f8fafc;--switch-background:#cbd5e1;--font-weight-normal:400;--font-weight-medium:500;--ring:#6366f1;--chart-1:#6366f1;--chart-2:#f59e0b;--chart-3:#10b981;--chart-4:#f97316;--chart-5:#8b5cf6;--radius:.75rem;--radius-sm:calc(var(--radius) - 4px);--radius-md:calc(var(--radius) - 2px);--radius-lg:var(--radius);--radius-xl:calc(var(--radius) + 4px);--sidebar:#fff;--sidebar-foreground:#1e293b;--sidebar-primary:#6366f1;--sidebar-primary-foreground:#fff;--sidebar-accent:#f1f5f9;--sidebar-accent-foreground:#334155;--sidebar-border:#e2e8f0;--sidebar-ring:#6366f1}*,:before,:after{box-sizing:border-box;border-color:var(--border)}:focus-visible{outline:2px solid var(--ring);outline-offset:2px;border-radius:var(--radius-sm)}html{font-size:var(--font-size)}body{background:var(--background);color:var(--foreground);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6}#root{min-height:100vh}h1{font-size:1.5rem;font-weight:var(--font-weight-medium);line-height:1.5}h2{font-size:1.25rem;font-weight:var(--font-weight-medium);line-height:1.5}h3{font-size:1.125rem;font-weight:var(--font-weight-medium);line-height:1.5}h4,label{font-size:1rem;font-weight:var(--font-weight-medium);line-height:1.5}button{font-family:inherit;font-size:1rem;font-weight:var(--font-weight-medium);cursor:pointer;line-height:1.5}input,select,textarea{font-family:inherit;font-size:1rem;font-weight:var(--font-weight-normal);line-height:1.5}a{color:var(--primary);text-decoration:none}a:hover{color:#4f46e5}
:root{--color-primary:#0f172a;--color-accent:#6366f1;--color-accent-hover:#4f46e5;--color-bg:#f1f5f9;--color-surface:#fff;--color-border:#e2e8f0;--color-text:#0f172a;--color-text-muted:#64748b;--color-achievement:#f59e0b}*{box-sizing:border-box}body{font-family:var(--font-sans),-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;background-color:var(--color-bg);color:var(--color-text);margin:0;line-height:1.5}a{color:inherit;text-decoration:none;transition:color .2s}.layout{flex-direction:column;min-height:100vh;display:flex}.layout-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.layout-brand{color:var(--color-text);font-size:1.25rem;font-weight:700}.layout-brand:hover{color:var(--color-accent)}.layout-nav{gap:1.5rem;display:flex}.layout-nav a{color:var(--color-text-muted)}.layout-nav a:hover{color:var(--color-accent)}.layout-main{flex:1;width:100%;max-width:56rem;margin:0 auto;padding:2rem 1.5rem 4rem}.layout-main--wide{max-width:95vw!important}.layout-main--grading,.layout-main--manage,.layout-main--home{width:100%;max-width:none!important;margin:0!important;padding:0!important}.layout-main--fullscreen{flex-direction:column;max-width:none;height:100vh;margin:0;padding:0;display:flex;overflow:hidden}.layout-main--test-result{width:100%!important;max-width:none!important}.layout-main--attempt-result{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}.layout-main--result-ai{max-width:95vw!important}.btn{cursor:pointer;border:1px solid #0000;border-radius:.5rem;padding:.625rem 1.25rem;font-weight:500;transition:all .2s;display:inline-block}.btn-primary{background:var(--color-accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-accent-hover);color:#fff}.btn-ghost{color:var(--color-text-muted);border-color:var(--color-border);background:0 0}.btn-ghost:hover{color:var(--color-accent);border-color:var(--color-accent)}.muted{color:var(--color-text-muted)}.error{color:#ef4444}.page{animation:.2s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.toast-notification{color:#fff;z-index:9999;background-color:#333;border-radius:4px;max-width:min(420px,100vw - 24px);padding:10px 20px;font-size:.9rem;animation:2s ease-in-out forwards fadeInOut;position:fixed;bottom:20px;left:20px;right:auto;box-shadow:0 2px 5px #0003}.toast-success{background-color:#22c55e}.toast-error{background-color:#ef4444}.toast-warning{background-color:#eab308}@keyframes fadeInOut{0%{opacity:0;transform:translateY(20px)}10%{opacity:1;transform:translateY(0)}80%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#0f172a99;justify-content:center;align-items:center;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.modal-content.premium-modal{background:#fff;border:1px solid #e2e8f0;border-radius:1.5rem;width:90%;max-width:450px;padding:0;animation:.3s cubic-bezier(.16,1,.3,1) slideUp;overflow:hidden;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.modal-header{background:#f8fafc;border-bottom:1px solid #f1f5f9;padding:1.5rem 2rem}.modal-title{color:#1e293b;letter-spacing:-.5px;margin:0;font-size:1.25rem;font-weight:800}.modal-danger .modal-title{color:#6366f1}.modal-body{padding:2rem}.modal-message{color:#475569;margin:0;font-size:1rem;line-height:1.6}.modal-actions{background:#f8fafc;border-top:1px solid #f1f5f9;justify-content:flex-end;gap:1rem;padding:1.5rem 2rem;display:flex}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.layout-main--profile{max-width:90rem!important}.layout-main--analytics{max-width:none!important}.layout-main--writing-live{width:100%;max-width:none!important;margin:0!important}.layout-main--homework-lesson,.layout-main--homework-detail{width:100%;max-width:none!important}
@media (max-width:768px){.layout-main{padding:1.5rem 1rem 3rem}.layout-main--wide,.layout-main--result-ai{max-width:100vw!important;padding:1rem!important}.modal-content.premium-modal{border-radius:1rem;width:95%;max-width:95vw}.modal-header,.modal-body,.modal-actions{padding:1.25rem 1.5rem}.modal-title{font-size:1.1rem}.toast-notification{width:min(420px,100vw - 20px);bottom:10px;left:10px;right:auto}}@media (max-width:480px){.layout-main{padding:1rem .75rem 2rem}.btn{padding:.5rem 1rem;font-size:.9rem}}