*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:radial-gradient(2px 2px at 20px 30px,#eee,transparent),radial-gradient(2px 2px at 40px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 90px 40px,#fff,transparent),radial-gradient(1px 1px at 130px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 160px 30px,#fff,transparent),radial-gradient(1px 1px at 200px 60px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 230px 10px,#eee,transparent),radial-gradient(2px 2px at 270px 50px,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 300px 90px,#fff,transparent),radial-gradient(1px 1px at 350px 20px,rgba(255,255,255,.9),transparent),linear-gradient(135deg,#0c0c0c,#1a1a2e,#16213e);background-size:400px 200px;color:#fff;min-height:100vh;line-height:1.6;text-shadow:1px 1px 0 #000}#app{max-width:1400px;margin:0 auto;padding:2rem}.header{text-align:center;margin-bottom:3rem}.header h1{font-size:38px;letter-spacing:1px;color:#0ff;animation:flicker 3s infinite;text-align:center;margin:18px 0;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.3)}@keyframes flicker{0%,18%,22%,25%,53%,57%,to{opacity:1}20%,24%,55%{opacity:.3}}.header p{font-size:1.2rem;opacity:.9;font-weight:300}.main{display:flex;flex-direction:column;gap:2rem}.controls{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:1rem}@media (max-width: 768px){.controls{flex-direction:column}}.generate-btn,.download-btn{background:linear-gradient(45deg,#ff6b6b,#ee5a24);border:none;color:#fff;padding:1rem 2rem;font-size:1.1rem;font-weight:600;border-radius:50px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ff6b6b4d;margin:.5rem;min-height:3.2rem;display:inline-flex;align-items:center;justify-content:center;line-height:1.2}.download-btn{background:linear-gradient(45deg,#00d4aa,#01a3a4);box-shadow:0 4px 15px #00d4aa4d}.generate-btn:hover:not(:disabled),.download-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #ff6b6b66}.download-btn:hover:not(:disabled){box-shadow:0 6px 20px #00d4aa66}.generate-btn:disabled,.download-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.status{font-size:1rem;text-align:center;min-height:1.5rem;opacity:.9}.collage-container{position:relative;background:#ffffff1a;border-radius:12px;padding:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);overflow:hidden;animation:dreamPulse 8s ease-in-out infinite}@keyframes dreamPulse{0%,to{opacity:.95;transform:scale(1)}50%{opacity:1;transform:scale(1.005)}}#collageCanvas{width:100%;height:auto;border-radius:8px;box-shadow:0 8px 32px #0000004d,inset 0 0 100px #00000080;display:block;filter:contrast(115%) saturate(130%) sepia(.15);transition:filter .2s ease}#collageCanvas:hover{filter:contrast(150%) saturate(160%) sepia(.3) hue-rotate(10deg)}#crt-overlay{pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent 98%,rgba(0,255,0,.03) 100%),linear-gradient(0deg,transparent 98%,rgba(0,0,255,.03) 100%);background-size:3px 3px,3px 3px;mix-blend-mode:overlay;opacity:.4;animation:crt-flicker .15s infinite linear alternate}@keyframes crt-flicker{0%{opacity:.4}to{opacity:.35}}.slice-link{transition:background-color .2s ease}.slice-link:hover{background-color:#ffffff1a;filter:brightness(1.1)}.pages-list{background:#ffffff1a;border-radius:12px;padding:1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);opacity:0;transform:translateY(20px);transition:all .6s ease}.pages-list.show{opacity:1;transform:translateY(0)}.pages-list h3{margin-bottom:1.5rem;font-size:1.3rem;font-weight:600;text-align:center}.pages-grid{display:flex;flex-direction:column;gap:1rem}.page-item{display:flex;align-items:flex-start;gap:1rem;padding:1rem;background:#ffffff0d;border-radius:8px;transition:all .3s ease}.page-item:hover{background:#ffffff1a;transform:translateY(-1px)}.page-number{background:#fff3;color:#fff;width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:600;flex-shrink:0}.page-content{flex:1;min-width:0}.page-title{color:#87ceeb;text-decoration:none;font-weight:600;font-size:1.1rem;display:block;margin-bottom:.25rem;transition:color .3s ease;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.page-title:hover{color:#fff;text-decoration:underline}.page-extract{font-size:.9rem;opacity:.8;line-height:1.4;margin:0}@media (max-width: 768px){#app{padding:1rem}.header h1{font-size:2rem}.header p{font-size:1rem}.generate-btn,.download-btn{padding:.8rem 1.5rem;font-size:1rem;min-height:2.8rem}.page-item{padding:.75rem}.page-title{font-size:1rem;white-space:normal;overflow:visible;text-overflow:unset;line-height:1.3}.page-extract{font-size:.85rem}.pages-list{padding:1rem}}@media (max-width: 480px){.page-item{flex-direction:column;align-items:center;text-align:center;gap:.5rem}.page-content{width:100%}}@media (prefers-reduced-motion: reduce){.generate-btn,.download-btn,.page-item,.slice-link{transition:none}.generate-btn:hover:not(:disabled),.download-btn:hover:not(:disabled){transform:none}.page-item:hover{transform:none}.header h1,.collage-container,#crt-overlay{animation:none}}@media (prefers-contrast: high){.collage-container,.pages-list{border:2px solid rgba(255,255,255,.5)}.page-title{color:#fff}.page-extract{opacity:1}}