:root{--primary:#6366f1;--primary-light:#818cf8;--secondary:#ec4899;--accent:#10b981;--dark:#0f0a1f;--card-bg:rgba(255, 255, 255, 0.03)}body{background:var(--dark)!important;color:#fff}.page-title{text-align:center;padding:2rem 1rem;background:linear-gradient(180deg,rgba(99,102,241,.15) 0,transparent 100%);position:relative}.page-title h1{font-family:Poppins,sans-serif;font-size:clamp(2rem, 5vw, 3.5rem);font-weight:900;background:linear-gradient(135deg,#fff 0,#a5b4fc 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.5rem}.page-title p{color:rgba(255,255,255,.6);font-size:1.1rem}.app{max-width:1600px;margin:0 auto;padding:0 1.5rem 3rem;display:grid;grid-template-columns:320px 1fr;gap:1.5rem}@media screen and (max-width:1000px){.app{grid-template-columns:1fr;overflow-x:hidden}}@media screen and (max-width:600px){.app{padding:0 .75rem 2rem}.panel{min-width:0}}.panel{display:flex;flex-direction:column;gap:1rem}.card{background:var(--card-bg);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:1.25rem}.card-title{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.72);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.card-title i{color:var(--primary-light)}.solids-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.solid-btn{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;background:rgba(255,255,255,.02);border:2px solid rgba(255,255,255,.08);border-radius:12px;cursor:pointer;transition:all .3s;color:rgba(255,255,255,.6);font-size:.7rem;font-weight:600}.solid-btn i{font-size:1.4rem}.solid-btn:hover{border-color:var(--primary);background:rgba(99,102,241,.1);color:#fff}.solid-btn.active{background:linear-gradient(135deg,var(--primary),var(--secondary));border-color:transparent;color:#fff;box-shadow:0 8px 32px rgba(99,102,241,.3)}.progress-section{text-align:center}.progress-value{font-family:Poppins,sans-serif;font-size:3.5rem;font-weight:900;background:linear-gradient(135deg,var(--primary-light),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;line-height:1}.progress-label{font-size:.8rem;color:rgba(255,255,255,.78);margin-bottom:1rem}.slider-container{position:relative;height:8px;background:rgba(255,255,255,.1);border-radius:4px;margin-bottom:1.5rem}.slider-fill{position:absolute;left:0;top:0;height:100%;background:linear-gradient(90deg,var(--primary),var(--secondary));border-radius:4px;transition:width .1s}.slider-input{position:absolute;width:100%;height:100%;opacity:0;cursor:pointer}.slider-thumb{position:absolute;top:50%;transform:translate(-50%,-50%);width:24px;height:24px;background:#fff;border-radius:50%;box-shadow:0 2px 10px rgba(0,0,0,.3);pointer-events:none;transition:transform .1s}.slider-input:focus-visible~.slider-thumb{box-shadow:0 0 0 3px var(--primary-light),0 2px 10px rgba(0,0,0,.3)}.steps-container{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}.step-item{display:flex;align-items:center;gap:.75rem;padding:.6rem .75rem;background:rgba(255,255,255,.02);border-radius:8px;font-size:.85rem;color:rgba(255,255,255,.78);transition:all .3s}.step-item.active{background:rgba(99,102,241,.15);color:#fff}.step-item.done{color:var(--accent)}.step-num{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);border-radius:50%;font-size:.75rem;font-weight:700}.step-item.active .step-num{background:var(--primary)}.step-item.done .step-num{background:var(--accent)}.step-item.done .step-num i{font-size:.7rem}.btn-group{display:flex;gap:.5rem}.btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem;border:none;border-radius:10px;font-size:.85rem;font-weight:700;cursor:pointer;transition:all .3s}.btn-primary{background:linear-gradient(135deg,var(--primary),#4f46e5);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(99,102,241,.4)}.btn-secondary{background:rgba(255,255,255,.08);color:#fff}.btn-secondary:hover{background:rgba(255,255,255,.12)}.btn-success{background:linear-gradient(135deg,var(--accent),#059669);color:#fff}.btn-success.playing{background:linear-gradient(135deg,#ef4444,#dc2626)}.speed-row{display:flex;align-items:center;gap:.5rem;margin-top:.75rem}.speed-label{font-size:.8rem;color:rgba(255,255,255,.78)}.speed-btns{display:flex;gap:.25rem;flex:1}.speed-btn{flex:1;padding:.4rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:6px;color:rgba(255,255,255,.78);font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s}.speed-btn:hover{background:rgba(255,255,255,.1);color:#fff}.speed-btn.active{background:#4f46e5;border-color:#4f46e5;color:#fff}.colors-grid{display:flex;gap:.5rem;flex-wrap:wrap}.color-btn{width:36px;height:36px;border-radius:10px;border:3px solid transparent;cursor:pointer;transition:all .2s;position:relative}.color-btn:hover{transform:scale(1.1)}.color-btn.active{border-color:#fff;box-shadow:0 0 20px currentColor}.color-btn i{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.8rem;opacity:0;transition:opacity .2s}.color-btn.active i{opacity:1}.option{display:flex;align-items:center;justify-content:space-between;padding:.6rem 0}.option:not(:last-child){border-bottom:1px solid rgba(255,255,255,.05)}.option-label{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:rgba(255,255,255,.7)}.option-label i{width:18px;color:rgba(255,255,255,.72)}.toggle{width:44px;height:24px;background:rgba(255,255,255,.1);border-radius:12px;position:relative;cursor:pointer;transition:background .3s}.toggle.active{background:linear-gradient(135deg,var(--primary),var(--secondary))}.toggle::after{content:'';position:absolute;top:2px;left:2px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform .3s}.toggle.active::after{transform:translateX(20px)}.toggle:focus-visible{outline:2px solid var(--primary-light);outline-offset:2px}.info-card{background:linear-gradient(135deg,rgba(251,191,36,.1),rgba(245,158,11,.05));border:1px solid rgba(251,191,36,.2)}.info-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}.info-icon{width:40px;height:40px;background:linear-gradient(135deg,#f59e0b,#d97706);border-radius:10px;display:flex;align-items:center;justify-content:center}.info-name{font-size:1.1rem;font-weight:800}.info-list{list-style:none;font-size:.85rem;color:rgba(255,255,255,.7)}.info-list li{display:flex;align-items:center;gap:.5rem;padding:.25rem 0}.info-list i{width:16px;color:#f59e0b}.viewer{background:var(--card-bg);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.06);border-radius:20px;overflow:hidden;display:flex;flex-direction:column}.app:fullscreen{max-width:none;width:100vw;height:100vh;padding:1rem;margin:0;box-sizing:border-box;background:var(--dark);overflow-y:auto}.app:fullscreen .panel{overflow-y:auto;max-height:calc(100vh - 2rem)}.app:fullscreen .viewer{height:calc(100vh - 2rem)}@media screen and (max-width:1000px){.app:fullscreen{grid-template-columns:260px 1fr;gap:.75rem;padding:.75rem}}.viewer-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background:rgba(0,0,0,.2);border-bottom:1px solid rgba(255,255,255,.05);flex-wrap:wrap;gap:.75rem}.viewer-title{display:flex;align-items:center;gap:.5rem;font-weight:700}.viewer-title i{color:var(--primary-light)}.viewer-stats{display:flex;gap:1.5rem;font-size:.85rem;color:rgba(255,255,255,.78)}.stat{display:flex;align-items:center;gap:.4rem}.stat i{color:var(--primary-light)}.stat-val{color:#fff;font-weight:700}.viewer-btns{display:flex;gap:.4rem}.viewer-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);border:none;border-radius:8px;color:#fff;cursor:pointer;transition:all .2s}.viewer-btn:hover{background:rgba(255,255,255,.15)}#canvas-container{flex:1;min-height:500px;background:radial-gradient(ellipse at bottom,#1a1744 0,#0a0812 100%);position:relative}@media screen and (max-width:768px){#canvas-container{min-height:400px}}.viewer-footer{display:flex;justify-content:center;gap:2rem;padding:.75rem;background:rgba(0,0,0,.2);font-size:.8rem;color:rgba(255,255,255,.72);flex-wrap:wrap}.hint{display:flex;align-items:center;gap:.4rem}.hint i{color:var(--primary-light)}.loading{position:absolute;inset:0;background:rgba(10,8,18,.95);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;z-index:10;transition:opacity .5s}.loading.hidden{opacity:0;pointer-events:none}.spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--primary-light);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;top:1.5rem;left:50%;transform:translateX(-50%) translateY(-100px);background:linear-gradient(135deg,var(--accent),#059669);color:#fff;padding:1rem 2rem;border-radius:100px;font-weight:700;display:flex;align-items:center;gap:.75rem;box-shadow:0 10px 40px rgba(16,185,129,.4);z-index:1000;opacity:0;transition:all .5s cubic-bezier(.4, 0, .2, 1)}.toast.show{transform:translateX(-50%) translateY(0);opacity:1}.toast.warn{background:linear-gradient(135deg,#f59e0b,#dc2626);box-shadow:0 10px 40px rgba(239,68,68,.4);max-width:min(90vw,560px);text-align:center;border-radius:20px}.confetti-container{position:fixed;inset:0;pointer-events:none;z-index:999;overflow:hidden}.confetti{position:absolute;opacity:0;animation:confetti-fall 3s ease-out forwards}@keyframes confetti-fall{0%{transform:translateY(-20px) rotate(0);opacity:1}100%{transform:translateY(100vh) rotate(720deg);opacity:0}}.face-label{position:absolute;font-family:Poppins,sans-serif;font-weight:900;font-size:.8rem;color:rgba(255,255,255,.15);pointer-events:none}.patrons-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.patron-btn{padding:.6rem .8rem;background:rgba(255,255,255,.02);border:2px solid rgba(255,255,255,.08);border-radius:8px;color:rgba(255,255,255,.6);font-size:.8rem;font-weight:600;cursor:pointer;transition:all .3s}.patron-btn:hover{border-color:var(--primary);background:rgba(99,102,241,.1);color:#fff}.patron-btn.active{background:linear-gradient(135deg,var(--primary),var(--secondary));border-color:transparent;color:#fff}.patron-btn.false-pattern{border-color:rgba(239,68,68,.5);color:#f87171}.patron-btn.false-pattern:hover{border-color:#ef4444;background:rgba(239,68,68,.1);color:#ef4444}.patron-btn.false-pattern.active{background:linear-gradient(135deg,#ef4444,#b91c1c);box-shadow:0 8px 32px rgba(239,68,68,.3)}.favorites-bar{max-width:1600px;margin:0 auto;padding:0 1.5rem .5rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.favorites-bar .fav-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.72)}.fav-chip{padding:.35rem .75rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:100px;color:rgba(255,255,255,.7);font-size:.78rem;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:.4rem}.fav-chip:hover{background:rgba(99,102,241,.15);border-color:var(--primary);color:#fff}.fav-chip .fav-remove{font-size:.65rem;opacity:.5}.fav-chip .fav-remove:hover{opacity:1;color:#ef4444}.fav-star{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:0 0;border:2px solid rgba(255,255,255,.1);border-radius:8px;color:rgba(255,255,255,.3);cursor:pointer;transition:all .2s;font-size:.9rem}.fav-star:hover{border-color:#f59e0b;color:#f59e0b}.fav-star.active{border-color:#f59e0b;color:#f59e0b;background:rgba(245,158,11,.15)}.favorites-bar.empty{display:none}.quiz-overlay{position:fixed;inset:0;background:rgba(10,8,18,.92);backdrop-filter:blur(10px);z-index:500;display:none;align-items:center;justify-content:center;flex-direction:column;gap:1.5rem}.quiz-overlay.active{display:flex}.quiz-box{background:var(--card-bg);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:2rem;max-width:520px;width:90%;text-align:center}.quiz-question{font-size:1.2rem;font-weight:700;margin-bottom:1.5rem}.quiz-choices{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1.5rem}.quiz-choice{padding:1rem;background:rgba(255,255,255,.04);border:2px solid rgba(255,255,255,.1);border-radius:12px;color:rgba(255,255,255,.8);font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s}.quiz-choice:hover{border-color:var(--primary);background:rgba(99,102,241,.1)}.quiz-choice.correct{border-color:var(--accent);background:rgba(16,185,129,.15);color:var(--accent)}.quiz-choice.wrong{border-color:#ef4444;background:rgba(239,68,68,.15);color:#ef4444}.quiz-score{font-size:.85rem;color:rgba(255,255,255,.78)}.quiz-score strong{color:var(--primary-light);font-size:1.1rem}.quiz-close{position:absolute;top:1.5rem;right:1.5rem;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.08);border:none;color:#fff;font-size:1.2rem;cursor:pointer}.measurement-label{position:absolute;font-family:Poppins,sans-serif;font-size:.7rem;font-weight:700;color:#f59e0b;background:rgba(0,0,0,.6);padding:.15rem .4rem;border-radius:4px;pointer-events:none;white-space:nowrap}@media print{body{background:#fff!important;color:#000!important}.confetti-container,.favorites-bar,.page-title,.panel,.quiz-overlay,.toast,.viewer-footer,.viewer-header,footer,header,nav{display:none!important}.app{display:block!important;padding:0!important}.viewer{border:none!important;background:0 0!important;backdrop-filter:none!important;page-break-inside:avoid}#canvas-container{display:none!important}#printSnapshot{display:block!important;position:fixed!important;top:0!important;left:0!important;width:100vw!important;height:100vh!important;object-fit:contain!important;background:#fff!important;z-index:99999!important;page-break-inside:avoid}body>:not(#printSnapshot):not(script):not(style):not(link){display:none!important}.print-info{display:block!important;text-align:center;padding:1rem;font-family:Poppins,sans-serif;color:#000;border-bottom:2px solid #333;margin-bottom:1rem}.print-info h2{font-size:1.5rem;margin:0 0 .3rem}.print-info p{font-size:.9rem;color:#555;margin:0}}.print-info{display:none}#printSnapshot{display:none}.kbd{display:inline-block;padding:.1rem .35rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:4px;font-size:.65rem;font-family:monospace;color:rgba(255,255,255,.72);margin-left:.3rem;vertical-align:middle}[data-theme=dark] body{background:linear-gradient(135deg,#0f172a 0,#1a1f35 100%)!important}