@import "https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap";:root{--color-ink:#171717;--color-ink-light:#2d2d2d;--color-ink-muted:#555;--color-paper:#f7f3ea;--color-paper-card:#fff;--color-cream:#ede4d4;--color-cream-dark:#e2d6c1;--color-soft-pink:#e8b9b7;--color-soft-pink-dark:#d99b98;--color-dusty-blue:#aebcc4;--color-dusty-blue-dark:#8e9ea8;--color-film-green:#a9b49a;--color-film-green-dark:#8f9d7f;--color-warm-yellow:#e4c47a;--color-warm-yellow-dark:#d4af5f;--color-danger:#d9534f;--color-danger-bg:#fdf2f2;--font-comic:"Fredoka", "Comic Neue", "Chalkboard SE", "Comic Sans MS", cursive, sans-serif;--font-sans:"Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"Courier New", Courier, monospace;--radius-xs:4px;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--radius-pill:9999px;--stroke-thin:1px solid #1717171f;--stroke-medium:2px solid var(--color-ink);--stroke-thick:3.5px solid var(--color-ink);--stroke-paper:1px solid var(--color-cream);--shadow-flat:0 1px 3px #0000000d;--shadow-soft:0 4px 16px #1717170f;--shadow-hard:3px 3px 0px var(--color-ink);--shadow-hard-lg:5px 5px 0px var(--color-ink);--shadow-photo:0 8px 30px #0000001f;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--space-12:3rem;--space-16:4rem;--space-24:6rem;--transition-fast:.15s ease;--transition-normal:.25s cubic-bezier(.16, 1, .3, 1);--transition-bounce:.35s cubic-bezier(.34, 1.56, .64, 1);--container-max-width:1200px;--header-height:72px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font-sans);color:var(--color-ink);background-color:var(--color-paper);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth;font-size:16px;line-height:1.5}body{background-color:var(--color-paper);background-image:radial-gradient(#1717170a 1px,#0000 1px);background-size:24px 24px;flex-direction:column;min-height:100vh;display:flex;overflow-x:hidden}#root{flex-direction:column;min-height:100vh;display:flex}h1,h2,h3,h4,.font-comic,.brand-text{font-family:var(--font-comic);color:var(--color-ink);letter-spacing:-.01em;font-weight:700;line-height:1.15}h1{font-size:clamp(2.25rem,5vw,3.75rem)}h2{font-size:clamp(1.75rem,3.5vw,2.75rem)}h3{font-size:clamp(1.25rem,2.5vw,1.85rem)}p{color:var(--color-ink-light);line-height:1.6}a{color:inherit;text-decoration:none}img,svg{max-width:100%;display:block}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;background:0 0;border:none;outline:none}button{cursor:pointer;touch-action:manipulation}.container{width:100%;max-width:var(--container-max-width);padding:0 var(--space-6);margin:0 auto}.main-content{padding-top:var(--space-8);padding-bottom:var(--space-16);flex:1}.btn{justify-content:center;align-items:center;gap:var(--space-2);font-family:var(--font-comic);border-radius:var(--radius-md);border:var(--stroke-medium);transition:transform var(--transition-fast), background-color var(--transition-fast), box-shadow var(--transition-fast);-webkit-user-select:none;user-select:none;text-align:center;padding:.75rem 1.5rem;font-size:1.05rem;font-weight:600;display:inline-flex;position:relative}.btn-primary{background-color:var(--color-ink);color:var(--color-paper);box-shadow:var(--shadow-hard)}.btn-primary:hover{box-shadow:var(--shadow-hard-lg);background-color:var(--color-ink-light);transform:translate(-2px,-2px)}.btn-primary:active{box-shadow:1px 1px 0px var(--color-ink);transform:translate(1px,1px)}.btn-secondary{background-color:var(--color-cream);color:var(--color-ink);box-shadow:var(--shadow-hard)}.btn-secondary:hover{box-shadow:var(--shadow-hard-lg);background-color:var(--color-paper-card);transform:translate(-2px,-2px)}.btn-secondary:active{box-shadow:1px 1px 0px var(--color-ink);transform:translate(1px,1px)}.btn-accent{background-color:var(--color-warm-yellow);color:var(--color-ink);box-shadow:var(--shadow-hard)}.btn-accent:hover{box-shadow:var(--shadow-hard-lg);transform:translate(-2px,-2px)}.btn-ghost{color:var(--color-ink);background-color:#0000;border-color:#0000}.btn-ghost:hover{background-color:var(--color-cream)}.btn-danger{background-color:var(--color-danger-bg);color:var(--color-danger);border-color:var(--color-danger)}.btn-danger:hover{background-color:var(--color-danger);color:#fff}.btn:disabled{opacity:.55;cursor:not-allowed;box-shadow:none!important;transform:none!important}.paper-card{background:var(--color-paper-card);border:var(--stroke-medium);border-radius:var(--radius-lg);padding:var(--space-8);box-shadow:var(--shadow-hard);position:relative}.badge{align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);font-family:var(--font-comic);border-radius:var(--radius-sm);border:var(--stroke-medium);background-color:var(--color-cream);color:var(--color-ink);font-size:.85rem;font-weight:600;display:inline-flex}:focus-visible{outline:3px solid var(--color-ink);outline-offset:2px}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-paper);border-radius:6px}::-webkit-scrollbar-thumb{background:var(--color-ink);border:2px solid var(--color-paper);border-radius:6px}::-webkit-scrollbar-thumb:hover{background:var(--color-ink-light)}::-webkit-scrollbar-corner{background:var(--color-paper)}::-webkit-scrollbar-button{width:0;height:0;display:none}*{scrollbar-width:thin;scrollbar-color:var(--color-ink) var(--color-paper)}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.no-scrollbar::-webkit-scrollbar{display:none}.studio-workspace{gap:var(--space-8);grid-template-columns:360px 1fr;align-items:start;width:100%;max-width:100%;display:grid}.studio-sidebar{box-sizing:border-box;width:100%;max-width:100%}.studio-canvas-container{box-sizing:border-box;width:100%;max-width:100%;overflow:hidden}@media (width<=960px){.studio-workspace{gap:var(--space-6);flex-direction:column-reverse;display:flex}.studio-sidebar,.studio-canvas-container{padding:var(--space-4)!important}.studio-header-actions{gap:var(--space-2);width:100%;display:flex}.studio-header-actions .btn{flex:1;padding:.6rem .8rem;font-size:.9rem}}.footer-root{background-color:var(--color-cream);border-top:var(--stroke-medium);padding-top:var(--space-12);padding-bottom:var(--space-8);margin-top:var(--space-12);width:100%}.footer-grid{gap:var(--space-12);grid-template-columns:2fr 3fr;align-items:start;display:grid}.footer-brand{gap:var(--space-4);flex-direction:column;display:flex}.footer-tagline{max-width:340px;color:var(--color-ink-muted);font-size:.95rem}.footer-mascot-author{align-items:center;gap:var(--space-3);margin-top:var(--space-2);font-family:var(--font-comic);color:var(--color-ink);font-size:.85rem;font-weight:600;display:flex}.footer-links{gap:var(--space-8);flex-wrap:wrap;justify-content:flex-end;display:flex}.footer-col h4{margin-bottom:var(--space-3);font-size:1rem;font-family:var(--font-comic)}.footer-col ul{gap:var(--space-2);flex-direction:column;list-style:none;display:flex}.footer-col a{color:var(--color-ink-light);transition:color var(--transition-fast);font-size:.95rem}.footer-col a:hover{color:var(--color-ink)}.footer-bottom{margin-top:var(--space-12);padding-top:var(--space-4);color:var(--color-ink-muted);justify-content:space-between;align-items:center;gap:var(--space-2);border-top:1px solid #1717171f;flex-wrap:wrap;font-size:.85rem;display:flex}@media (width<=850px){.footer-root{margin-top:var(--space-12)!important;padding-top:var(--space-8)!important;padding-bottom:var(--space-6)!important}.footer-grid{gap:var(--space-8);flex-direction:column;display:flex}.footer-tagline{max-width:100%}.footer-links{gap:var(--space-6);grid-template-columns:repeat(2,1fr);justify-content:flex-start;width:100%;display:grid}.footer-bottom{margin-top:var(--space-8);text-align:center;align-items:center;gap:var(--space-2);flex-direction:column}}.export-workspace{gap:var(--space-8);grid-template-columns:360px 1fr;align-items:start;width:100%;max-width:100%;display:grid}.export-sidebar{box-sizing:border-box;width:100%;max-width:100%}.export-canvas-container{box-sizing:border-box;width:100%;max-width:100%;overflow:hidden}@media (width<=960px){.export-workspace{gap:var(--space-6);flex-direction:column-reverse;display:flex}.export-sidebar{padding:var(--space-4)!important}.export-canvas-container{padding:var(--space-4)!important;min-height:auto!important}.export-header-actions{gap:var(--space-2);width:100%;display:flex}.export-header-actions .btn{flex:1;padding:.6rem .8rem;font-size:.9rem}}@keyframes mascotBreathe{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-6px)rotate(1deg)}}@keyframes mascotBounce{0%,to{transform:translateY(0)scale(1)}30%{transform:translateY(-16px)scale(.95,1.05)}50%{transform:translateY(0)scale(1.05,.95)}70%{transform:translateY(-6px)scale(.98,1.02)}}@keyframes mascotWiggle{0%,to{transform:rotate(0)scale(1)}20%{transform:rotate(-10deg)scale(1.05)}40%{transform:rotate(10deg)scale(1.05)}60%{transform:rotate(-8deg)scale(1.02)}80%{transform:rotate(8deg)scale(1.02)}}@keyframes mascotFloat{0%,to{transform:translateY(0)rotate(-2deg)}50%{transform:translateY(-12px)rotate(3deg)}}@keyframes mascotSpin{0%{transform:rotate(0)scale(1)}50%{transform:rotate(180deg)scale(1.2)}to{transform:rotate(360deg)scale(1)}}@keyframes flashBulbGlow{0%,to{opacity:.3;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}@keyframes floatParticle{0%{opacity:1;transform:translateY(0)scale(.6)rotate(0)}to{opacity:0;transform:translateY(-40px)scale(1.2)rotate(25deg)}}.anim-idle{animation:4s ease-in-out infinite mascotBreathe}.anim-bounce{animation:1.2s cubic-bezier(.28,.84,.42,1) infinite mascotBounce}.anim-wiggle{animation:1s ease-in-out infinite mascotWiggle}.anim-float{animation:3.5s ease-in-out infinite mascotFloat}.anim-spin{animation:.8s cubic-bezier(.34,1.56,.64,1) mascotSpin}.anim-flash-glow{animation:.6s ease-in-out infinite flashBulbGlow}.mascot-interactive{cursor:pointer;transition:transform var(--transition-fast)}.mascot-interactive:hover{transform:scale(1.08)rotate(-3deg)}.mascot-interactive:active{transform:scale(.95)rotate(3deg)}@media (prefers-reduced-motion:reduce){.anim-idle,.anim-bounce,.anim-wiggle,.anim-float,.anim-spin,.anim-flash-glow{animation:none!important}}@media (width<=1024px){.container{padding:0 var(--space-4)}.studio-workspace{flex-direction:column}.studio-sidebar{max-height:280px;overflow-y:auto;width:100%!important}.studio-canvas-container{padding:var(--space-4)!important}}@media (width<=768px){:root{--header-height:64px}h1{font-size:2.15rem}h2{font-size:1.65rem}.btn{padding:.65rem 1.15rem;font-size:.95rem}.nav-desktop-links{display:none!important}.nav-mobile-toggle{display:flex!important}.hero-grid{text-align:center;gap:var(--space-8)!important;grid-template-columns:1fr!important}.hero-cta-group{justify-content:center}.booth-mode-grid{grid-template-columns:1fr!important}.footer-grid{text-align:center;gap:var(--space-6)!important;grid-template-columns:1fr!important}.footer-links{justify-content:center}}@media (width<=480px){.paper-card{padding:var(--space-4);border-radius:var(--radius-md)}.btn{width:100%}}