:root{--color-primary:#4f46e5;--color-primary-light:#818cf8;--color-secondary:#f59e0b;--color-secondary-light:#fbbf24;--color-accent:#ec4899;--color-background:#f0f9ff;--color-surface:#fff;--color-text-main:#1f2937;--color-text-muted:#6b7280;--color-border:#e5e7eb;--pastel-blue:#bae6fd;--pastel-green:#bbf7d0;--pastel-yellow:#fef08a;--pastel-pink:#fbcfe8;--pastel-purple:#e9d5ff;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--radius-sm:.5rem;--radius-md:1rem;--radius-lg:1.5rem;--radius-full:9999px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--shadow-glow:0 0 15px #4f46e54d}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--color-background);color:var(--color-text-main);-webkit-font-smoothing:antialiased;font-family:Be Vietnam Pro,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5}.glass{-webkit-backdrop-filter:blur(10px);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);background:#ffffffb3;border:1px solid #ffffff80}.glass-premium{-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-lg);background:#ffffffd9;border:1px solid #fff9;box-shadow:0 8px 32px #1f26871a}@keyframes gradient-x{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.bg-animated-gradient{background:linear-gradient(-45deg,#ff9a9e,#fecfef,#a1c4fd,#c2e9fb) 0 0/400% 400%;animation:15s infinite gradient-x}h1,h2,h3,h4,h5,h6{color:var(--color-text-main);font-weight:700}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:var(--space-2)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.btn{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-full);cursor:pointer;border:none;font-family:inherit;font-size:1rem;font-weight:700;transition:all .2s;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--color-primary), var(--color-primary-light));color:#fff;box-shadow:0 4px 14px #4f46e563}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4f46e566}.btn-secondary{color:var(--color-primary);border:2px solid var(--color-primary-light);background:#fff}.btn-secondary:hover{background:var(--color-background);transform:translateY(-1px)}.btn-icon{border:1px solid var(--color-border);color:var(--color-text-muted);cursor:pointer;background:#fff;border-radius:50%;justify-content:center;align-items:center;padding:.5rem;transition:all .2s;display:flex}.btn-icon:hover{background:var(--color-background);color:var(--color-primary)}.input-group{gap:var(--space-2);flex-direction:column;display:flex}.input-label{color:var(--color-text-main);align-items:center;gap:.5rem;font-size:.95rem;font-weight:600;display:flex}.input-field,.select-field{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);border:2px solid var(--color-border);color:var(--color-text-main);background:#fff;outline:none;font-family:inherit;font-size:1rem;transition:all .2s}.input-field:focus,.select-field:focus{border-color:var(--color-primary);box-shadow:0 0 0 4px #4f46e51a}.textarea-field{resize:vertical;min-height:100px}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-pulse{animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}@media print{body{background:#fff}.no-print{display:none!important}.printable-area{width:100%;box-shadow:none;border:none;margin:0;padding:0}@page{margin:1cm;size:auto}}.show-desktop{display:flex}.show-desktop-block{display:block}.hidden-mobile{display:flex}.show-mobile,.show-mobile-block{display:none}.flex-wrap-mobile{flex-wrap:nowrap}@media (width<=768px){.main-content{flex-direction:column!important}.sidebar{border-bottom:2px solid var(--color-border);border-right:none!important;width:100%!important;min-height:auto!important}.preview-area,.game-area,.admin-main{width:100%!important;padding:1rem!important}header.header{flex-direction:column;gap:1rem;height:auto!important;padding:1rem!important}.header-actions{flex-wrap:wrap;justify-content:center;gap:.5rem;width:100%}.header-actions input{max-width:300px;width:100%!important}table{white-space:nowrap;display:block;overflow-x:auto}h1{font-size:clamp(2rem,6vw,3rem)!important}h2{font-size:clamp(1.5rem,5vw,2.5rem)!important}.hidden-mobile,.show-desktop,.show-desktop-block{display:none!important}.show-mobile{display:flex!important}.show-mobile-block{display:block!important}.flex-wrap-mobile{flex-wrap:wrap!important}.flex-row-scroll-mobile{padding-bottom:.5rem;overflow-x:auto;flex-direction:row!important}}.app-container{flex-direction:column;height:100vh;display:flex;overflow:hidden}.header{border-bottom:1px solid var(--color-border);height:70px;padding:0 var(--space-6);z-index:10;background:#fff;justify-content:space-between;align-items:center;display:flex}.header-logo{align-items:center;gap:var(--space-4);color:var(--color-primary);font-size:1.5rem;font-weight:700;display:flex}.header-actions{align-items:center;gap:var(--space-4);display:flex}.main-content{background:var(--color-background);flex:1;display:flex;overflow:hidden}.sidebar{border-right:1px solid var(--color-border);width:380px;box-shadow:var(--shadow-sm);z-index:5;background:#fff;flex-direction:column;display:flex;overflow-y:auto}.sidebar-header{padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--color-border);align-items:center;gap:var(--space-2);color:var(--color-text-main);font-size:1.25rem;font-weight:700;display:flex}.sidebar-content{padding:var(--space-6);gap:var(--space-6);flex-direction:column;display:flex}.preview-area{padding:var(--space-8);background-image:radial-gradient(var(--color-border) 1px, transparent 1px);background-size:20px 20px;flex:1;justify-content:center;align-items:flex-start;display:flex;overflow-y:auto}.printable-page{box-shadow:var(--shadow-lg);border-radius:var(--radius-sm);transform-origin:top;color:#000;background:#fff;padding:20mm;font-family:Times New Roman,Times,serif;font-size:13.5pt;line-height:1.5;transition:width .3s,min-height .3s;position:relative;overflow:hidden}.page-a4-portrait{width:210mm;min-height:297mm}.page-a4-landscape{width:297mm;min-height:210mm}.page-a3-portrait{width:297mm;min-height:420mm}.page-a3-landscape{width:420mm;min-height:297mm}.printable-page:before,.printable-page:after{content:"";width:100%;position:absolute;left:0}.toolbar-btn{cursor:pointer;color:#334155;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-family:serif;font-size:1.2rem;transition:all .2s;display:flex}.toolbar-btn:hover{background:#f1f5f9;transform:translateY(-2px)}.color-btn{border:2px solid #fff;width:24px;height:24px;margin:6px;box-shadow:0 0 0 1px #cbd5e1}.template-colorful{background-color:#fff;border:4px solid #f43f5e;border-radius:20px;position:relative;overflow:hidden;box-shadow:0 10px 30px #f43f5e1a}.template-colorful:before{content:"";background:repeating-linear-gradient(45deg,#f43f5e,#f43f5e 20px,#3b82f6 20px 40px,#eab308 40px 60px);height:15px;position:absolute;top:0;left:0;right:0}.template-colorful .worksheet-content{padding-top:2rem}.template-colorful .a4-header{border-bottom:2px dashed #f43f5e}.template-nature{background:url(https://img.freepik.com/free-vector/hand-drawn-jungle-background_23-2148972580.jpg) 50%/cover no-repeat;border:none;padding:2.5rem;box-shadow:0 15px 40px #22c55e26}.template-nature .worksheet-content{background:#fffffff2;border-radius:1.5rem;padding:3rem;box-shadow:0 10px 30px #0000001a}.template-nature .a4-header{border-bottom:3px double #22c55e}.template-nature .worksheet-title{color:#15803d;text-shadow:1px 1px #bbf7d0}.template-space{background:url(https://img.freepik.com/free-vector/outer-space-background-with-planets-stars_107791-15550.jpg) 50%/cover no-repeat;border:none;padding:2.5rem;box-shadow:0 15px 40px #312e814d}.template-space .worksheet-content{background:#fffffff5;border-radius:1.5rem;padding:3rem;box-shadow:0 10px 30px #0003}.template-space .a4-header{border-bottom:2px solid #312e81}.template-space .worksheet-title{color:#312e81;text-shadow:2px 2px #cbd5e1}.a4-header{justify-content:space-between;margin-bottom:2rem;padding-bottom:1rem;display:flex}.school-info{flex-direction:column;gap:.5rem;font-weight:600;display:flex}.student-info{flex-direction:column;gap:.5rem;min-width:250px;display:flex}.dotted-line{border-bottom:1px dotted #94a3b8;flex:1;height:1.2rem;margin-left:.5rem;display:inline-block}.worksheet-title{text-align:center;text-transform:uppercase;margin:2rem 0;font-size:1.8rem;font-weight:700}@media print{@page{margin:20mm;size:auto}body{-webkit-print-color-adjust:exact;print-color-adjust:exact;background:0 0}.sidebar,.header,.hover-actions,.no-print{display:none!important}.app-container,.main-content,.preview-area{background:0 0;height:auto;padding:0;overflow:visible}.printable-page{box-shadow:none!important;background:0 0!important;border:none!important;border-radius:0!important;width:100%!important;min-height:auto!important;margin:0!important;padding:0!important}.printable-page:before,.printable-page:after{display:none!important}.question-block{page-break-inside:avoid;break-inside:avoid}}.custom-checkbox{appearance:none;cursor:pointer;background-color:#fff;border:1.5px solid #cbd5e1;border-radius:4px;justify-content:center;align-items:center;width:20px;height:20px;margin:0;padding:0;transition:all .2s;display:inline-flex;position:relative}.custom-checkbox:checked{background-color:#4f46e5;border-color:#4f46e5}.custom-checkbox:checked:after{content:"✓";color:#fff;font-size:14px;font-weight:800;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
