@import"https://fonts.googleapis.com/css2?family=Indie+Flower&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap";*{box-sizing:border-box;margin:0;padding:0}body{font-family:Space Mono,monospace;padding:20px;background-color:#f8f9fa;color:light-dark(#343a40,#f8f9fa);line-height:1.6;max-width:1200px;margin:20px auto}.container{display:flex;flex-direction:column;gap:8px}h1{margin-bottom:40px;color:#2d2d7b;letter-spacing:1px;text-shadow:0 2px 8px #e0e7ff;text-align:center;position:relative;display:inline-block}h1:after{content:"";position:absolute;bottom:-5px;left:0;width:100%;height:4px;background-color:#2d2d7b;border-radius:2px;z-index:-1;transform:rotate(-1deg);transition:height .3s,transform .3s}h1:hover:after{height:8px;transform:rotate(-2deg)}#examples{list-style:none;padding:0;cursor:pointer}#examples li{margin-bottom:10px;padding:15px 20px;border:1px solid light-dark(#dee2e6,#495057);border-radius:6px;background-color:#fffbe7;box-shadow:0 2px 8px #2c3e5012;transition:all .3s ease}#examples li:hover{background-color:#ffe7fa;border-color:light-dark(#adb5bd,#adb5bd);box-shadow:0 4px 16px #2c3e5021;transform:translateY(-3px)}#examples li:active{transform:scale(.98);background-color:#e0e7ff;transition:all .1s ease}#slideshow{display:flex;flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;gap:25px;margin-bottom:20px;padding:10px 5px 20px;border:1px solid light-dark(#e9ecef,#495057);border-radius:8px;background-color:light-dark(#ffffff,#343a40);box-shadow:0 2px 8px light-dark(rgba(0,0,0,.05),rgba(255,255,255,.05))}#slideshow[hidden]{display:none}.slide{border:1px solid light-dark(#ced4da,#495057);padding:25px;font-family:Indie Flower,cursive;scroll-snap-align:center;background-color:#fff;box-shadow:0 4px 16px #2c3e5021;border-radius:8px;display:flex;flex-direction:column;align-items:center;min-width:380px;transition:transform .2s ease-in-out;animation:slide-appear .5s ease-out forwards;opacity:0}@keyframes slide-appear{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.slide:hover{transform:translateY(-3px);box-shadow:0 8px 24px #2c3e502e}.slide div{font-size:24px;text-align:center;text-wrap:balance;margin-top:20px;color:#495057}.slide img{height:320px;max-width:100%;object-fit:contain;border-radius:6px;border:3px solid transparent;background:linear-gradient(120deg,#7c2d7b,#2d2d7b) border-box;transition:all .3s ease}.slide:hover img{transform:scale(1.02);border:3px solid transparent;background:linear-gradient(120deg,#2d2d7b,#7c2d7b) border-box}.user-turn{font-weight:700;padding:15px 20px;background-color:light-dark(#e7f5ff,#0b3d66);border-radius:6px;border-left:4px solid light-dark(#1c7ed6,#66b2ff);animation:fade-in .4s ease-out}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}textarea#input{width:100%;padding:15px 20px;border:1px solid light-dark(#ced4da,#495057);border-radius:6px;font-family:Space Mono,monospace;margin-top:8px;min-height:90px;resize:vertical;transition:all .3s ease;background-color:#fffbe7;color:light-dark(#343a40,#f8f9fa)}textarea#input:focus{outline:none;border-color:light-dark(#1c7ed6,#66b2ff);box-shadow:0 0 0 2px light-dark(rgba(28,126,214,.2),rgba(102,178,255,.2));transform:translateY(-2px)}.input-area{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}.input-controls{display:flex;gap:8px;justify-content:flex-end}.input-controls button{padding:10px 15px;border:1px solid light-dark(#ced4da,#495057);border-radius:6px;background-color:#d0e9ff;color:#2d2d7b;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #2c3e5012;position:relative;overflow:hidden}.input-controls button:hover{background-color:#ffe7fa;color:#7c2d7b;box-shadow:0 4px 16px #2c3e5021;transform:translateY(-2px)}.input-controls button:active{transform:scale(.95);transition:all .1s ease}.input-controls button#stop-button{background-color:#ffd6d6;color:#c00;border-color:light-dark(#fbb,#300);border-radius:6px;padding:10px 15px;cursor:pointer;transition:all .3s ease}.input-controls button#stop-button:hover{background-color:#ffb8b8;color:#fff;border-color:light-dark(#faa,#400);transform:translateY(-2px)}.input-controls button#download-slides-button,#download-slides-button{background-color:light-dark(#d0e9ff,#1a4a75);border-color:light-dark(#b0d7ff,#2a6aa5);color:light-dark(#004085,#e0f0ff);padding:10px 15px;border-radius:6px;cursor:pointer;transition:all .3s ease;margin-top:20px;display:block;margin-left:auto;margin-right:auto}.input-controls button#download-slides-button:hover,#download-slides-button:hover{background-color:light-dark(#b0d7ff,#2a6aa5);border-color:light-dark(#90c5ff,#3a8ac5);transform:translateY(-2px)}#download-slides-button:active{transform:scale(.95);transition:all .1s ease}#loading{padding:15px 20px;background-color:#e7f5ff;color:#2d2d7b;border-radius:6px;border-left:4px solid light-dark(#1c7ed6,#66b2ff);margin-bottom:20px;text-align:center;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}#output+p{margin-bottom:8px;font-weight:700;color:light-dark(#495057,#dee2e6)}#error{font-weight:700;padding:15px 20px;background-color:#ffe7e7;color:#c00;border-radius:6px;border-left:4px solid light-dark(#d61c1c,#ff6666);animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}footer{margin-top:40px;text-align:center;display:flex;justify-content:center;gap:24px}footer a{text-decoration:none;display:inline-block;transition:all .2s ease-in-out}footer a:hover,footer a:focus{filter:brightness(1.2);transform:scale(1.05)}footer a img{filter:drop-shadow(0 2px 8px #e0e7ff);transition:filter .3s,transform .3s;width:32px;height:32px}footer a:hover img,footer a:focus img{filter:drop-shadow(0 4px 16px #ffe7fa);transform:scale(1.1) rotate(-3deg)}footer a:active img{transform:scale(.95) rotate(0);transition:all .1s ease}.made-by{margin-top:32px;text-align:center;color:#888}.made-by a{position:relative;font-weight:700;color:#2d2d7b;text-decoration:none}.made-by a:after{content:"";display:block;height:3px;width:100%;background-color:#7c2d7b;border-radius:2px;margin-top:2px;transition:width .3s,transform .3s}.made-by a:hover:after{width:120%;transform:translate(-10%)}.fade-in{animation:fade-in .8s ease-out}.fade-in-delay-1{animation:fade-in .8s ease-out .2s forwards;opacity:0}.fade-in-delay-2{animation:fade-in .8s ease-out .4s forwards;opacity:0}.fade-in-delay-3{animation:fade-in .8s ease-out .6s forwards;opacity:0}.alert{padding:15px 20px;margin-bottom:15px;border-radius:6px;font-weight:500;animation:slide-in-up .3s ease-out;position:fixed;top:20px;right:20px;max-width:300px;z-index:1000;box-shadow:0 4px 12px #00000026}@keyframes slide-in-up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.alert-info{background-color:#d0e9ff;border-left:4px solid #1c7ed6;color:#004085}.alert-success{background-color:#d4ffea;border-left:4px solid #0ca678;color:#087f5b}.ripple{position:absolute;border-radius:50%;background-color:#ffffffb3;transform:scale(0);animation:ripple .6s linear;pointer-events:none}@keyframes ripple{to{transform:scale(4);opacity:0}}
