@import"https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600&family=Instrument+Sans:wght@400;500;600;700&display=swap";:root{--color-black: #0a0a0a;--color-charcoal: #141414;--color-graphite: #1e1e1e;--color-slate: #2a2a2a;--color-ash: #3d3d3d;--color-silver: #8a8a8a;--color-pearl: #c4c4c4;--color-cream: #f5f3f0;--color-white: #ffffff;--accent-primary: #e8c4ff;--accent-secondary: #c4e8ff;--accent-glow: rgba(232, 196, 255, .4);--font-display: "Playfair Display", Georgia, serif;--font-body: "Instrument Sans", -apple-system, sans-serif;--ease-expo: cubic-bezier(.16, 1, .3, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1);--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--space-4xl: 96px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:var(--font-body);background-color:var(--color-black);color:var(--color-pearl);min-height:100vh;overflow-x:hidden;position:relative}body{background-size:cover;background-position:center;background-attachment:fixed}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#0a0a0aeb,#0a0a0ad9 40%,#0a0a0abf);z-index:0;pointer-events:none}body:after{content:"";position:fixed;top:-50%;right:-30%;width:80vw;height:80vw;background:radial-gradient(ellipse at center,var(--accent-glow) 0%,transparent 60%);z-index:0;pointer-events:none;animation:pulseGlow 8s ease-in-out infinite alternate;filter:blur(100px)}@keyframes pulseGlow{0%{opacity:.3;transform:scale(1) rotate(0)}to{opacity:.5;transform:scale(1.1) rotate(10deg)}}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(60px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeSlideRight{0%{opacity:0;transform:translate(-40px)}to{opacity:1;transform:translate(0)}}@keyframes lineExpand{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes gentlePulse{0%,to{box-shadow:0 0 0 0 var(--accent-glow)}50%{box-shadow:0 0 40px 10px var(--accent-glow)}}@keyframes shimmerSlide{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes typewriter{0%{width:0}to{width:100%}}.webpage{position:relative;z-index:2;min-height:100vh;display:grid;grid-template-rows:auto 1fr;max-width:1200px;margin:0 auto;padding:var(--space-3xl) var(--space-xl)}header{margin-bottom:var(--space-4xl);animation:fadeSlideUp 1s var(--ease-expo)}header h1{font-family:var(--font-display);font-size:clamp(4rem,12vw,8rem);font-weight:400;font-style:italic;color:var(--color-white);letter-spacing:-.03em;line-height:.9;margin-bottom:var(--space-lg);position:relative;display:inline-block}header h1:after{content:"";position:absolute;bottom:-8px;left:0;width:120px;height:3px;background:linear-gradient(90deg,var(--accent-primary),var(--accent-secondary));transform-origin:left;animation:lineExpand .8s var(--ease-expo) .5s both}.subtitle{font-family:var(--font-body);font-size:.75rem;font-weight:600;letter-spacing:.4em;text-transform:uppercase;color:var(--color-silver);margin-top:var(--space-xl);padding-left:2px;opacity:0;animation:fadeSlideRight .8s var(--ease-expo) .8s forwards}.container{display:grid;grid-template-columns:1fr;gap:var(--space-3xl);animation:fadeSlideUp 1s var(--ease-expo) .3s both}#generator-form{display:flex;flex-direction:column;gap:var(--space-xl)}.form-row{display:flex;align-items:center;gap:var(--space-xl);flex-wrap:wrap}.input-group{display:flex;align-items:center;gap:var(--space-md);position:relative}label{font-family:var(--font-body);font-size:.7rem;font-weight:600;letter-spacing:.25em;text-transform:uppercase;color:var(--color-silver);transition:color .4s var(--ease-smooth)}.input-group:hover label,.input-group:focus-within label{color:var(--accent-primary)}input[type=number]{width:80px;padding:var(--space-md) var(--space-lg);font-family:var(--font-display);font-size:1.5rem;font-weight:500;font-style:italic;color:var(--color-white);background:transparent;border:none;border-bottom:2px solid var(--color-ash);transition:all .4s var(--ease-expo);-moz-appearance:textfield;text-align:center}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]:focus{outline:none;border-color:var(--accent-primary)}input[type=number]::placeholder{color:var(--color-ash)}input[type=checkbox]{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:52px;height:28px;background:var(--color-graphite);border:2px solid var(--color-ash);border-radius:14px;cursor:pointer;position:relative;transition:all .4s var(--ease-expo)}input[type=checkbox]:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;background:var(--color-silver);border-radius:50%;transition:all .4s var(--ease-spring)}input[type=checkbox]:hover{border-color:var(--color-silver)}input[type=checkbox]:checked{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));border-color:transparent}input[type=checkbox]:checked:after{left:27px;background:var(--color-white);box-shadow:0 2px 8px #0000004d}input[type=checkbox]:focus{outline:none;box-shadow:0 0 0 3px #e8c4ff33}.button-row{display:flex;justify-content:flex-start;padding-top:var(--space-md)}button{font-family:var(--font-body);font-size:.7rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--color-pearl);background:transparent;border:1px solid var(--color-ash);border-radius:0;padding:var(--space-lg) var(--space-2xl);cursor:pointer;position:relative;overflow:hidden;transition:all .4s var(--ease-expo)}button:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--accent-primary);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease-expo);z-index:-1}button:hover{color:var(--color-black);border-color:var(--accent-primary)}button:hover:before{transform:scaleX(1)}button:active{transform:scale(.98)}.output-section{margin-top:var(--space-xl);position:relative}.output-label{display:flex;align-items:center;gap:var(--space-md);font-family:var(--font-body);font-size:.65rem;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--color-silver);margin-bottom:var(--space-lg)}.output-label:before{content:"";display:block;width:32px;height:2px;background:linear-gradient(90deg,var(--accent-primary),transparent)}.textarea-wrapper{position:relative}#generated-text{width:100%;height:400px;padding:var(--space-2xl);padding-right:70px;font-family:var(--font-display);font-size:1.125rem;font-weight:400;line-height:2.2;letter-spacing:.01em;color:var(--color-charcoal);background:var(--color-cream);border:none;resize:none;transition:all .5s var(--ease-expo)}#generated-text:focus{outline:none;box-shadow:0 0 0 4px var(--accent-glow)}#generated-text::placeholder{color:var(--color-ash);font-style:italic}#generated-text::-webkit-scrollbar{width:8px}#generated-text::-webkit-scrollbar-track{background:transparent}#generated-text::-webkit-scrollbar-thumb{background:var(--color-ash);border-radius:0}#generated-text::-webkit-scrollbar-thumb:hover{background:var(--color-silver)}.copy-btn{position:absolute;top:var(--space-lg);right:var(--space-lg);width:44px;height:44px;padding:0;display:flex;align-items:center;justify-content:center;background:var(--color-white);border:2px solid var(--color-pearl);cursor:pointer;transition:all .3s var(--ease-expo);z-index:10;letter-spacing:normal}.copy-btn:before{display:none}.copy-btn:hover{background:var(--color-charcoal);border-color:var(--color-charcoal);color:var(--color-white);transform:translateY(-2px) scale(1.05);box-shadow:0 8px 24px #00000026}.copy-btn:active{transform:translateY(0) scale(1)}.copy-btn svg{width:18px;height:18px;stroke-width:2;color:var(--color-charcoal);transition:color .3s ease}.copy-btn:hover svg{color:var(--color-white)}.copy-btn.copied{background:var(--accent-primary);border-color:var(--accent-primary);animation:gentlePulse .6s ease}.copy-btn.copied svg{color:var(--color-black)}@media (min-width: 768px){.webpage{padding:var(--space-4xl) var(--space-3xl)}.container{grid-template-columns:1fr 1fr;gap:var(--space-4xl);align-items:start}#generator-form{position:sticky;top:var(--space-4xl)}.form-row{flex-direction:column;align-items:flex-start;gap:var(--space-xl)}.output-section{margin-top:0}#generated-text{height:500px}}@media (max-width: 767px){.webpage{padding:var(--space-2xl) var(--space-md)}header{margin-bottom:var(--space-2xl)}header h1{font-size:clamp(2.5rem,15vw,4rem)}.subtitle{font-size:.65rem;letter-spacing:.3em}.form-row{gap:var(--space-lg)}button{width:100%;padding:var(--space-md) var(--space-xl)}#generated-text{height:350px;padding:var(--space-lg);padding-right:60px;font-size:1rem}.copy-btn{top:var(--space-md);right:var(--space-md);width:40px;height:40px}}@media (max-width: 380px){header h1{font-size:2.2rem}.subtitle{font-size:.6rem;letter-spacing:.2em}.input-group{flex-direction:column;align-items:flex-start;gap:var(--space-sm)}input[type=number]{width:100%;text-align:left}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}body:after{animation:none;opacity:.4}}@media (prefers-contrast: high){:root{--color-silver: #b0b0b0;--color-pearl: #e0e0e0;--accent-primary: #ff9ef5;--accent-secondary: #9ef5ff}button{border-width:2px}input[type=number]{border-width:3px}}@media print{body:before,body:after{display:none}.webpage{max-width:100%;padding:20px}header h1{color:#000;font-size:2rem}#generated-text{height:auto;min-height:300px;border:1px solid #ddd}button,.copy-btn{display:none}}