:root{--night-900:#0b1024;--night-800:#131a35;--night-700:#1c2347;--night-600:#2a3260;--night-500:#3b446f;--night-ink:#e8eaf3;--night-ink-2:#b6bbd2;--night-ink-3:#7c83a2;--paper-50:#fbf5e9;--paper-100:#f6efdc;--paper-200:#efe5c9;--paper-300:#e3d3ad;--paper-ink:#2a221b;--paper-ink-2:#5a4d3e;--paper-ink-3:#8a7a64;--violet:#8b5cf6;--pink:#ec4899;--amber:#f59e0b;--grad:linear-gradient(135deg,var(--violet)0%,var(--pink)50%,var(--amber)100%);--grad-soft:linear-gradient(135deg,#b69cf9 0%,#f7a3c8 50%,#ffd28a 100%);--ink-violet:#5b3aa3;--ink-pink:#b13670;--ink-amber:#b06a06;--color-background:var(--night-900);--color-surface:var(--night-700);--color-primary:var(--violet);--color-primary-hover:#7c3aed;--color-secondary:var(--pink);--color-text:var(--night-ink);--color-text-muted:var(--night-ink-2);--color-accent:var(--amber);--font-serif:"Young Serif","Cormorant Garamond",Georgia,"Times New Roman",serif;--font-sans:"Outfit",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;--font-hand:"Caveat","Bradley Hand","Comic Sans MS",cursive;--font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-xl:28px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;--shadow-glow:0 0 20px #8b5cf64d;--sh-paper:0 1px 0 #0000000a,0 8px 22px -10px #140f0559,0 24px 50px -30px #140f0573;--sh-paper-hi:0 2px 0 #0000000d,0 18px 40px -14px #140f0580,0 40px 80px -40px #140f058c}.night{background-color:var(--night-900);background-image:radial-gradient(1.5px 1.5px at 12% 18%,#fff9,#0000 50%),radial-gradient(1px 1px at 28% 72%,#ffffff80,#0000 50%),radial-gradient(1px 1px at 55% 28%,#ffffff73,#0000 50%),radial-gradient(1.5px 1.5px at 78% 55%,#fff9,#0000 50%),radial-gradient(1px 1px at 88% 22%,#ffffff80,#0000 50%),radial-gradient(1px 1px at 41% 88%,#ffffff80,#0000 50%),radial-gradient(1px 1px at 8% 92%,#fff6,#0000 50%),radial-gradient(1px 1px at 92% 78%,#ffffff73,#0000 50%),radial-gradient(1.5px 1.5px at 62% 62%,#ffffff8c,#0000 50%),radial-gradient(at 30% 0,#8b5cf62e,#0000 60%),radial-gradient(at 80% 100%,#ec48991f,#0000 60%),linear-gradient(#0b1024 0%,#131a35 100%);background-attachment:fixed}.paper{background-color:var(--paper-100);color:var(--paper-ink);background-image:radial-gradient(circle at 20% 30%,#785a280b 0 1px,#0000 1.5px),radial-gradient(circle at 70% 60%,#785a280a 0 1px,#0000 1.5px),radial-gradient(circle at 40% 80%,#785a2809 0 1px,#0000 1.5px),radial-gradient(#0000 50%,#7850140f 100%),linear-gradient(#faf2dd 0%,#f3e9cd 100%);background-size:6px 6px,9px 9px,13px 13px,100% 100%,100% 100%}.paper-cream{background-color:var(--paper-50);color:var(--paper-ink);background-image:radial-gradient(circle at 25% 35%,#785a280a 0 1px,#0000 1.5px),radial-gradient(circle at 65% 75%,#785a2808 0 1px,#0000 1.5px),radial-gradient(#0000 60%,#7850140d 100%),linear-gradient(#fdf7e7 0%,#f7eed5 100%)}.ink-stamp{font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--paper-ink-3);font-size:9px}.ink-stamp-night{font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--night-ink-3);font-size:9px}.handwritten{font-family:var(--font-hand)}.brand-grad-text{background:var(--grad);-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text}.art-placeholder{background:repeating-linear-gradient(135deg,#0000000f 0 1px,#0000 1px 9px),linear-gradient(160deg,#d9c89d 0%,#c9b27a 100%);position:relative;overflow:hidden}.art-placeholder.night-art{background:repeating-linear-gradient(135deg,#ffffff0a 0 1px,#0000 1px 9px),linear-gradient(160deg,#2a3260 0%,#1a2148 100%)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--color-background);color:var(--color-text);font-family:var(--font-sans);flex-direction:column;min-height:100dvh;line-height:1.6;display:flex;overflow-x:hidden}main{padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);padding-bottom:env(safe-area-inset-bottom)}h1,h2,h3,h4,h5,h6{font-family:var(--font-serif);font-weight:700;line-height:1.2}button{cursor:pointer;background:0 0;border:none;font-family:inherit}input,textarea,select{font-family:inherit}.sticker-pulse{animation:1.4s ease-in-out infinite sticker-pulse-anim;display:inline-block}@keyframes sticker-pulse-anim{0%,to{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}@media (prefers-reduced-motion:reduce){.sticker-pulse{animation:none}}.container{width:100%;max-width:800px;margin:0 auto;padding:0 40px}.btn{border-radius:var(--radius-md);justify-content:center;align-items:center;padding:12px 24px;font-size:1.1rem;font-weight:600;text-decoration:none;transition:all .2s;display:inline-flex}.btn-primary{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:#fff;box-shadow:var(--shadow-lg),var(--shadow-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a,0 0 30px #8b5cf680}.card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);border:1px solid #ffffff0d;padding:24px}.input-group{gap:12px;display:flex}.input{border-radius:var(--radius-md);color:#fff;background:#0003;border:2px solid #ffffff1a;flex:1;padding:12px 16px;font-size:1rem;transition:border-color .2s}.input:focus{border-color:var(--color-primary);outline:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.8s cubic-bezier(.22,1,.36,1) forwards fadeIn}@keyframes pageTurn{0%{opacity:0;transform:perspective(1000px)rotateY(10deg)translate(20px)}to{opacity:1;transform:perspective(1000px)rotateY(0)translate(0)}}.animate-page-turn{animation:1s cubic-bezier(.22,1,.36,1) forwards pageTurn}@keyframes sparkle{0%{opacity:0;transform:scale(0)rotate(0)}50%{opacity:1;transform:scale(1.2)rotate(180deg)}to{opacity:0;transform:scale(1)rotate(360deg)}}.sparkle{background:radial-gradient(circle,#fff 0%,#0000 70%);width:20px;height:20px;animation:1s ease-in-out infinite sparkle;position:absolute}@keyframes magicSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.magic-loader{border:4px solid #ffffff1a;border-top:4px solid var(--color-primary);border-right:4px solid var(--color-secondary);border-radius:50%;width:80px;height:80px;margin-bottom:24px;animation:1s linear infinite magicSpin;box-shadow:0 0 30px #8b5cf680}
