.lab-filter{flex-wrap:wrap;gap:8px;margin:24px 0;display:flex}.lab-filter button,.experiment-main button{border:1px solid var(--border);background:var(--card);min-height:48px;color:var(--foreground);cursor:pointer;border-radius:12px;padding:10px 16px}.lab-filter [aria-pressed=true]{background:var(--primary);color:#fff}.lab-preview{color:#6341e8;background:#ede9ff;border-radius:14px;justify-content:center;align-items:center;gap:12px;height:150px;margin-bottom:18px;display:flex;overflow:hidden}.lab-preview-cloud{flex-wrap:wrap;padding:16px;font-size:1.3rem;font-weight:700}.lab-preview-cloud span:nth-child(2){color:#067a68;font-size:2rem}.lab-preview-palette i{border-radius:20px;width:32px;height:75px}.lab-card-beta{color:#b91c1c;background:#fee2e2;border-radius:6px;padding:4px 7px;font-size:.65rem}.dark .lab-card-beta{color:#ffb4bd;background:#4c1821}.lab-soon{color:var(--muted);flex-wrap:wrap;gap:12px;padding:0;list-style:none;display:flex}.lab-soon li{border:1px solid var(--border);border-radius:12px;padding:10px 14px}.experiment-main{max-width:1200px;margin:auto;padding:28px 24px 64px}.experiment-main h1{margin:20px 0 12px;font-size:clamp(1.8rem,4vw,2.8rem)}.experiment-main p{line-height:1.6}.experiment-main a{color:var(--primary)}.experiment-upload{border:2px dashed var(--border);background:var(--card);border-radius:18px;flex-wrap:wrap;align-items:center;gap:20px;margin:20px 0;padding:24px;display:flex}.experiment-upload input{max-width:100%;min-height:44px}.experiment-viewer{background:var(--soft);border:1px solid var(--border);perspective:1200px;border-radius:18px;justify-content:center;align-items:center;min-height:250px;padding:18px;display:flex}.experiment-viewer img{object-fit:contain;max-width:100%;max-height:70dvh;box-shadow:0 8px 28px #17142e22}.experiment-viewer:-webkit-full-screen{background:#17142e;border:0;border-radius:0}.experiment-viewer:fullscreen{background:#17142e;border:0;border-radius:0}.experiment-viewer:-webkit-full-screen img{max-height:94dvh}.experiment-viewer:fullscreen img{max-height:94dvh}.experiment-page-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin:18px 0;display:flex}.page-turn{animation:.25s ease-out lab-turn}@keyframes lab-turn{0%{opacity:.65;transform:rotateY(-8deg)}to{opacity:1;transform:none}}.experiment-main .experiment-primary{color:#fff;background:#6341e8;font-weight:650}.experiment-main button:disabled{opacity:.5;cursor:not-allowed}.experiment-main button:focus-visible{outline:3px solid var(--primary);outline-offset:3px}.experiment-main a:focus-visible{outline:3px solid var(--primary);outline-offset:3px}.experiment-viewer:focus-visible{outline:3px solid var(--primary);outline-offset:3px}.experiment-error{color:#a72738;background:#ffedf0;border-radius:12px;padding:16px}.dark .experiment-error{color:#ffd8df;background:#4a202a}.experiment-filename{overflow-wrap:anywhere;color:var(--muted);font-size:.9rem}.cloud-preview svg{border-radius:18px;width:100%;height:auto;display:block}.word-counts{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0;list-style:none;display:grid}.word-counts li{border-bottom:1px solid var(--border);overflow-wrap:anywhere;justify-content:space-between;gap:8px;padding:8px;display:flex}.palette-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:0;list-style:none;display:grid}.palette-list li{background:var(--card);border:1px solid var(--border);border-radius:16px;flex-direction:column;gap:10px;padding:16px;display:flex}.palette-list li>span{border:1px solid var(--border);border-radius:12px;height:80px}.palette-list small,.experiment-privacy{color:var(--muted)}.lab-whiteboard{border:1px solid var(--border);border-radius:16px;height:75dvh;min-height:440px;position:relative;overflow:hidden}@media (max-width:767px){.experiment-main{padding:20px 12px 40px}.experiment-upload{padding:16px}.experiment-page-actions{gap:8px}.experiment-page-actions button{flex:1}.palette-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.word-counts{grid-template-columns:repeat(2,minmax(0,1fr))}.lab-preview{height:105px}.lab-whiteboard{height:70dvh;min-height:380px}}@media (prefers-reduced-motion:reduce){.page-turn{animation:none}}.lab-preview-book>div{color:#4b3658;background:#fff9ee;border-radius:4px;width:95px;height:120px;padding:14px;transform:rotate(-5deg);box-shadow:0 8px 18px #17142e14}.lab-preview-book>div+div{background:#fff;transform:rotate(5deg)}.lab-preview-book b{font-size:.7rem}.lab-preview-book span{border-top:2px solid #c4b5dc;margin-top:12px;display:block}.lab-preview-book>div+div svg{color:#067a68}@media (max-width:767px){.lab-preview-book>div{width:80px;height:85px;padding:10px}.lab-preview-book span{margin-top:8px}.experiment-main .flipbook-download{bottom:max(12px,env(safe-area-inset-bottom));z-index:5;width:100%;position:sticky;box-shadow:0 6px 24px #17142e25}}[data-theme=dark] .lab-card-beta{color:#ffb4bd;background:#4c1821}[data-theme=dark] .experiment-error{color:#ffd8df;background:#4a202a}.visual-heading{background:linear-gradient(120deg,var(--soft),var(--card));border:1px solid var(--border);border-radius:18px;padding:20px}.visual-heading h1{margin:12px 0}.visual-status{justify-content:space-between;align-items:center;gap:12px;display:flex}.visual-workspace{grid-template-columns:240px minmax(0,1fr);gap:24px;display:grid}.visual-settings{border:1px solid var(--border);background:var(--card);border-radius:16px;align-self:start;min-width:0;padding:18px}.visual-settings legend{padding:0 8px;font-weight:700}.visual-settings label{flex-direction:column;gap:8px;margin-bottom:16px;font-size:.9rem;display:flex}.visual-settings select,.visual-settings input:not([type=checkbox]){border:1px solid var(--border);background:var(--background);min-height:44px;color:var(--foreground);border-radius:10px;width:100%;min-width:0;padding:8px}.visual-settings select{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark] .visual-settings select{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.visual-settings .visual-check{flex-direction:row;align-items:center}.visual-check input{flex-shrink:0;width:22px;height:22px}.visual-settings p{color:var(--muted);font-size:.85rem}.visual-pen-tools{flex-wrap:wrap;gap:6px;margin-bottom:14px;display:flex}.visual-pen-tools button{flex:1;padding:8px}.visual-pen-tools [aria-pressed=true]{color:#fff;background:#6541e8}.visual-document{min-width:0}.sketch-board{background:var(--soft);border:1px solid var(--border);text-align:center;border-radius:16px;padding:16px}.sketch-board canvas{cursor:crosshair;background:#fff;width:100%;height:auto;margin:auto;display:block;box-shadow:0 8px 24px #17142e22}.sketch-board canvas:focus-visible{outline:3px solid var(--primary);outline-offset:4px}.visual-result{background:var(--card);border:1px solid var(--border);border-radius:16px;margin-top:16px;padding:18px}.visual-result h2{font-size:1.2rem}.visual-export{flex-wrap:wrap;justify-content:center;gap:12px;padding:18px 0;display:flex}.visual-export button{min-height:48px}.visual-studio .support-message{margin-top:24px}@media (max-width:767px){.visual-workspace{grid-template-columns:1fr;gap:14px}.visual-heading{padding:16px}.visual-settings{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px;display:grid}.visual-settings label{margin:0}.visual-settings p,.visual-settings .visual-check,.visual-pen-tools{grid-column:1/-1}.visual-settings p{margin:0}.sketch-board{padding:8px}.visual-export{background:var(--card);border-top:1px solid var(--border);padding:12px 8px max(12px,env(safe-area-inset-bottom));z-index:8;position:sticky;bottom:0}.visual-export .experiment-primary{width:100%}.visual-settings input[type=color]{padding:3px}}.lab-preview-collage{grid-template-columns:repeat(2,70px);gap:8px;padding:12px;display:grid}.lab-preview-collage i{border-radius:5px;height:50px;padding:8px}.lab-preview-collage span{background:#ffffffb0;border-radius:3px;width:100%;height:22px;display:block}.lab-preview-gif{position:relative}.lab-preview-gif i{background:#ffbe86;border:3px solid #fff;border-radius:8px;width:80px;height:105px;position:absolute;transform:translate(-25px)rotate(-12deg)}.lab-preview-gif i:nth-child(2){background:#62c7b4;transform:rotate(-3deg)}.lab-preview-gif i:nth-child(3){background:#8065ec;transform:translate(25px)rotate(10deg)}.lab-preview-gif svg{z-index:1;color:#fff}