:root{--font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--color-bg: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);--color-text-primary: #f1f5f9;--color-text-secondary: #94a3b8;--color-indigo-600: #6366f1;--color-indigo-700: #4f46e5;--color-indigo-800: #4338ca;--color-gray-200: #1e293b;--color-gray-300: #334155;--color-gray-700: #64748b;--color-accent: #facc15;--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .6), 0 2px 4px -2px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .6), 0 4px 6px -2px rgba(0, 0, 0, .4);--radius-md: .5rem;--radius-lg: 1rem;--transition-ease: cubic-bezier(.4, 0, .2, 1)}html{scroll-behavior:smooth}body{margin:0;padding:0;min-height:100vh;font-family:var(--font-sans);background:var(--color-bg);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;justify-content:center;align-items:center}body>*{max-width:60rem;width:100%}h1,h2,h3{color:var(--color-accent);margin:.5rem 0;text-shadow:0 1px 2px rgba(250,204,21,.15);transition:transform .3s var(--transition-ease)}h1:hover,h2:hover,h3:hover{transform:translateY(-2px)}h1{font-size:2.5rem;font-weight:800}h2{font-size:1.5rem;border-bottom:2px solid var(--color-gray-300);padding-bottom:.75rem;margin-bottom:1.25rem}.card{background-color:#1e293b;border-radius:var(--radius-lg);padding:2rem;box-shadow:var(--shadow-md);width:100%;max-width:56rem;border:1px solid var(--color-gray-300);transition:transform .3s var(--transition-ease),box-shadow .3s var(--transition-ease);animation:slideIn .5s var(--transition-ease) forwards;display:flex;flex-direction:column;align-items:center}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}textarea{width:100%;min-height:16rem;max-height:24rem;border:1px solid var(--color-gray-300);border-radius:var(--radius-md);padding:1rem;font-family:inherit;font-size:1rem;background-color:#0f172a;color:var(--color-text-primary);box-shadow:inset 0 1px 3px #0006;resize:vertical;overflow-y:auto;transition:border-color .2s var(--transition-ease),box-shadow .2s var(--transition-ease),transform .3s var(--transition-ease);margin-bottom:2rem;margin-left:2rem;margin-right:2rem}textarea:focus{outline:none;border-color:var(--color-indigo-600);box-shadow:0 0 0 4px #6366f140;transform:scale(1.01)}.output-content{max-height:24rem;overflow-y:auto;line-height:1.7;padding:.5rem;border-radius:var(--radius-md);background-color:#0f172a;color:var(--color-text-primary);user-select:text;width:100%;margin-bottom:1rem}.output{width:100%;margin-bottom:2rem}table{width:100%;border-collapse:collapse;margin-top:.75rem}th,td{padding:1rem;text-align:left;transition:background-color .2s var(--transition-ease)}th{font-weight:600;color:var(--color-accent);background-color:#facc150d}td{color:var(--color-text-primary)}tr{border-bottom:1px solid var(--color-gray-300);transition:background-color .2s var(--transition-ease)}tr:nth-child(2n){background-color:#1e293b80}tr:hover{background-color:#facc151a}button{background-color:var(--color-accent);color:#0f172a;border:none;border-radius:var(--radius-md);padding:.5rem 1rem;cursor:pointer;transition:background-color .2s var(--transition-ease),transform .2s var(--transition-ease);font-size:.875rem;min-width:6rem;height:2rem}button:hover{background-color:var(--color-indigo-700);color:#fff;transform:scale(1.05)}button:active{transform:scale(.95)}.copy-button{margin-top:.5rem}.button-group{display:flex;gap:.5rem;margin-top:.5rem;align-items:center;justify-content:flex-end;width:100%}nav{display:flex;justify-content:space-between;align-items:center;width:100%;padding:1rem 2rem;background-color:#1e293b;box-shadow:var(--shadow-md);border-bottom:1px solid var(--color-gray-300);position:sticky;top:0;z-index:1000}.nav-brand{font-size:1.5rem;font-weight:700;color:var(--color-accent);text-decoration:none;transition:color .3s var(--transition-ease),transform .3s var(--transition-ease)}.nav-brand:hover{color:var(--color-indigo-600);transform:translate(5px)}.nav-links{display:flex;gap:1.5rem}.nav-links a{text-decoration:none;color:var(--color-text-primary);font-weight:500;transition:color .3s var(--transition-ease),transform .3s var(--transition-ease)}.nav-links a:hover{color:var(--color-accent);transform:translateY(-2px)}.buy-coffee{margin-left:1rem;padding:.25rem .75rem;background-color:transparent;border:1px solid var(--color-gray-300);border-radius:var(--radius-md);color:var(--color-text-primary);cursor:pointer;transition:background-color .3s var(--transition-ease),transform .3s var(--transition-ease)}.buy-coffee:hover{background-color:var(--color-gray-300);transform:scale(1.05)}footer{margin-top:4rem;text-align:center;font-size:.875rem;color:var(--color-text-secondary);padding:2rem 1rem;background-color:#1e293b;border-top:1px solid var(--color-gray-300);border-radius:var(--radius-lg)}.footer-links{margin-top:.5rem;display:flex;justify-content:center;gap:1.5rem}.footer-links a{color:var(--color-accent);text-decoration:none;font-weight:500}.footer-links a:hover{text-decoration:underline}@media (max-width: 640px){.card{padding:1.5rem}textarea{min-height:12rem}nav{flex-direction:column;padding:1rem}.nav-brand{margin-bottom:1rem}.nav-links{flex-direction:column;gap:.75rem}.buy-coffee{margin-left:0;margin-top:.5rem}.footer-links{flex-direction:column;gap:.5rem}}.coffee-dropdown{position:relative;display:inline-block}.coffee-menu{position:absolute;top:100%;left:0;margin-top:.25rem;background-color:#1e293b;border:1px solid var(--color-gray-300);border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:.5rem;z-index:100;display:flex;flex-direction:column;gap:.25rem;min-width:6.25rem}.coffee-menu button{background:transparent;border:none;color:var(--color-text-primary);padding:.25rem .75rem;text-align:left;cursor:pointer;border-radius:var(--radius-md);transition:background-color .2s var(--transition-ease);font-size:.95rem}.coffee-menu button:hover{background-color:var(--color-gray-300);color:var(--color-bg)}@media (max-width: 640px){.coffee-menu{right:0;left:auto;min-width:8rem}}.animate-fade-in.svelte-1ul2sa6.svelte-1ul2sa6{animation:svelte-1ul2sa6-fadeIn 1s var(--transition-ease)}@keyframes svelte-1ul2sa6-fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.navbar.svelte-1ul2sa6.svelte-1ul2sa6{width:100%;max-width:60rem;display:flex;align-self:center;justify-content:space-between;align-items:center;padding:1rem 2rem;background-color:#1e293b;box-shadow:var(--shadow-md);border-radius:var(--radius-lg);margin-bottom:2rem;position:sticky;top:0;z-index:50}.nav-left.svelte-1ul2sa6.svelte-1ul2sa6{display:flex;align-items:center;gap:1rem}.brand.svelte-1ul2sa6.svelte-1ul2sa6{font-size:1.25rem;font-weight:700;color:var(--color-accent);text-decoration:none;transition:transform .3s var(--transition-ease)}.brand.svelte-1ul2sa6.svelte-1ul2sa6:hover{transform:scale(1.05);text-decoration:underline}.coffee-dropdown.svelte-1ul2sa6.svelte-1ul2sa6{position:relative;display:inline-block}.coffee-button.svelte-1ul2sa6.svelte-1ul2sa6{background-color:var(--color-indigo-600);color:#fff;border:none;border-radius:var(--radius-md);padding:.5rem 1rem;cursor:pointer;font-size:.875rem;transition:background-color .2s var(--transition-ease),transform .2s var(--transition-ease)}.coffee-button.svelte-1ul2sa6.svelte-1ul2sa6:hover{background-color:var(--color-indigo-800);transform:scale(1.05)}.coffee-menu.svelte-1ul2sa6.svelte-1ul2sa6{position:absolute;top:100%;left:0;background-color:#2d3748;border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:10;min-width:100px;margin-top:0}.coffee-menu.svelte-1ul2sa6 button.svelte-1ul2sa6{display:block;width:100%;padding:.5rem 1rem;background:none;border:none;color:#e2e8f0;text-align:left;cursor:pointer;font-size:.875rem}.coffee-menu.svelte-1ul2sa6 button.svelte-1ul2sa6:hover{background-color:var(--color-indigo-600)}.nav-right.svelte-1ul2sa6.svelte-1ul2sa6{display:flex;gap:1rem}.nav-link.svelte-1ul2sa6.svelte-1ul2sa6{color:var(--color-text-primary);text-decoration:none;font-weight:500;transition:color .2s var(--transition-ease),transform .2s var(--transition-ease)}.nav-link.svelte-1ul2sa6.svelte-1ul2sa6:hover{color:var(--color-accent);transform:translateY(-2px)}.footer-links.svelte-1ul2sa6 a.svelte-1ul2sa6{color:var(--color-accent);text-decoration:none;font-weight:500}.footer-links.svelte-1ul2sa6 a.svelte-1ul2sa6:hover{text-decoration:underline}
