:root{--canvas: #0C0C0F;--canvas-card: #141417;--canvas-surface: #1C1C21;--canvas-line: #2E2E35;--ink: #F0EFFA;--ink-muted: #9998AA;--ink-soft: #6B6A7A;--ink-fade: #42415A;--coral: #FF5C35;--coral-hover: #FF7A56;--coral-dim: #CC3E1A;--coral-glow: rgba(255,92,53,.22);--amber: #FFB74A;--lime: #B8E62E;--success: #B8E62E;--warn: #FFB74A;--danger: #EF5B5B}html{background-color:var(--canvas);color-scheme:dark}body{background-color:var(--canvas);background-image:radial-gradient(900px 520px at 8% -8%,rgba(255,92,53,.14),transparent 60%),radial-gradient(760px 500px at 96% 6%,rgba(184,230,46,.08),transparent 55%);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}.btn-coral{background:linear-gradient(145deg,var(--coral),var(--coral-dim));color:#1a0700;box-shadow:0 3px #9c2f14,0 8px 20px #ff5c354d;transition:transform .12s cubic-bezier(.34,1.56,.64,1),box-shadow .12s ease}.btn-coral:hover{transform:translateY(-2px) scale(1.04) rotate(-1deg);box-shadow:0 5px #9c2f14,0 12px 26px #ff5c356b}.btn-coral:active{transform:translateY(1px) scale(.99);box-shadow:0 1px #9c2f14,0 4px 10px #ff5c3552}.fx-card{transition:transform .16s cubic-bezier(.34,1.56,.64,1),border-color .16s ease,box-shadow .16s ease}.fx-card:hover{transform:translateY(-6px) rotate(-1deg) scale(1.03);box-shadow:0 18px 34px #00000073}.sticker{display:inline-flex;align-items:center;gap:5px;font-weight:800;font-size:11px;letter-spacing:.02em;padding:5px 10px;border-radius:9px;box-shadow:0 2px #00000040}.sticker.coral{background:var(--coral);color:#fff}.sticker.amber{background:var(--amber);color:#1a0f00}.sticker.lime{background:var(--lime);color:#12180a}.progress-pill .dot{width:7px;height:7px;border-radius:50%;background:var(--amber);animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.safe-bottom{padding-bottom:calc(env(safe-area-inset-bottom) + 16px)}:focus-visible{outline:2px solid var(--coral);outline-offset:2px}body>header.sticky{background-color:#141417d9!important;border-bottom-color:var(--canvas-line)!important}body>header.sticky #mobile-menu>div{background-color:#141417f2!important;border-top-color:var(--canvas-line)!important}body>header.sticky a.font-heading,body>header.sticky span.font-heading{color:var(--ink)!important}body>header.sticky nav a.text-slate-600,body>header.sticky #mobile-menu a.text-slate-600,body>header.sticky #mobile-menu a.text-slate-900{color:var(--ink-muted)!important}body>header.sticky nav a.text-slate-600:hover,body>header.sticky #mobile-menu a.text-slate-600:hover{color:var(--ink)!important}body>header.sticky button#mobile-menu-btn{color:var(--ink-muted)!important}body>header.sticky button#mobile-menu-btn:hover{color:var(--ink)!important}body>header.sticky .group>div.absolute>div{background:var(--canvas-card)!important;border-color:var(--canvas-line)!important;box-shadow:0 24px 70px #0000008c!important}body>header.sticky .group>div.absolute a:hover{background:var(--canvas-surface)!important}body>header.sticky .group>div.absolute a>span:first-child{background:var(--canvas-surface)!important;color:var(--coral)!important}body>header.sticky .group>div.absolute .text-slate-950{color:var(--ink)!important}body>header.sticky .group>div.absolute .text-slate-500{color:var(--ink-muted)!important}body>footer.bg-slate-900{background:var(--canvas-card)!important;color:var(--ink-muted)!important;border-top:1px solid var(--canvas-line)}body>footer.bg-slate-900 .text-white{color:var(--ink)!important}body>footer.bg-slate-900 .text-slate-400,body>footer.bg-slate-900 .text-slate-500,body>footer.bg-slate-900 .text-slate-600{color:var(--ink-muted)!important}body>footer.bg-slate-900 .border-slate-800{border-color:var(--canvas-line)!important}body>footer.bg-slate-900 a:hover{color:var(--coral-hover)!important}@media (max-width: 767px){body>header.sticky #mobile-menu a,body>header.sticky #mobile-menu button,body>footer.bg-slate-900 a{min-height:44px;display:inline-flex;align-items:center}}button[aria-label="Send Feedback"]{background-color:var(--coral)!important}button[aria-label="Send Feedback"]:hover{background-color:var(--coral-hover)!important}div.fixed.bottom-4.right-4.w-80{background:var(--canvas-card)!important;border-color:var(--canvas-line)!important}div.fixed.bottom-4.right-4.w-80 h3{color:var(--ink)!important}div.fixed.bottom-4.right-4.w-80 textarea,div.fixed.bottom-4.right-4.w-80 input{background:var(--canvas-surface)!important;border-color:var(--canvas-line)!important;color:var(--ink)!important}div.fixed.bottom-4.right-4.w-80 textarea:focus,div.fixed.bottom-4.right-4.w-80 input:focus{--tw-ring-color: var(--coral) !important}div.fixed.bottom-4.right-4.w-80 button.bg-blue-600{background:var(--coral)!important;color:#1a0700!important}div.fixed.bottom-4.right-4.w-80 button.bg-blue-600:hover{background:var(--coral-hover)!important}.template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}@media (min-width: 768px){.template-grid{grid-template-columns:repeat(auto-fill,minmax(150px,200px));gap:16px;justify-content:center}}@media (pointer: fine){.template-card{transition:transform cubic-bezier(.34,1.56,.64,1) .28s,box-shadow .28s ease-out;will-change:transform}.template-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 0 0 2px #ff5c35,0 24px 48px #00000080}}.template-card[data-state=playing]:before,.template-card[data-state=playing]:after{content:"";position:absolute;top:0;width:10px;height:100%;z-index:2;pointer-events:none;background-image:repeating-linear-gradient(to bottom,transparent 0px,transparent 6px,#FF5C35 6px,#FF5C35 7px,transparent 7px,transparent 14px);animation:filmAdvance .25s steps(1) infinite;border-radius:12px 0 0 12px}.template-card[data-state=playing]:before{left:0}.template-card[data-state=playing]:after{right:0;border-radius:0 12px 12px 0}@keyframes filmAdvance{0%{background-position:0 0}to{background-position:0 14px}}.template-card[data-state=playing]{box-shadow:0 0 0 2px #ff5c35,0 0 0 5px #ff5c3538,0 24px 48px #0000008c}.badge-paw[data-animate=true] svg{animation:pawWag .5s ease-in-out 3 forwards;transform-origin:center;display:inline-block}@keyframes pawWag{0%,to{rotate:-4deg}50%{rotate:4deg}}@keyframes shimmer{0%,to{opacity:.4}50%{opacity:.7}}@keyframes indeterminate{0%{left:-40%;width:40%}to{left:100%;width:40%}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.progress-pill .dot{animation:none!important;opacity:1!important}.fx-card:hover{transform:translateY(-2px)!important;transition:transform .15s ease-out!important}.btn-coral:hover{transform:none!important}.paywall-modal{transform:none!important;opacity:1!important}.template-card[data-state=playing]:before,.template-card[data-state=playing]:after{animation:none}.template-card:hover{transform:translateY(-4px)!important;transition:transform .15s ease-out!important}}
