:root{--bg: #e9e7fe;--panel: rgba(20, 24, 34, .78);--panelBorder: rgba(255,255,255,.12);--text: rgba(255,255,255,.92);--muted: rgba(255,255,255,.7);--muted2: rgba(255,255,255,.55);--accent: rgba(255,255,255,.92);color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;--fx-scale: 1;--fx-heart-size: clamp(180px, 14vmin, 420px);--fx-confetti-w: clamp(18px, 1.2vmin, 34px);--fx-confetti-h: clamp(10px, .75vmin, 22px);--fx-spark-size: clamp(12px, 1vmin, 26px);--fx-shadow: 0 2.2vmin 5.5vmin rgba(0,0,0,.28);--fx-glow: 0 0 3.2vmin rgba(255,255,255,.45);--fx-heart-shadow: 0 3.2vmin 8.5vmin rgba(255, 60, 110, .28);--fx-heart-rise: -18vmin}html,body{height:100%}body{margin:0;background:radial-gradient(1200px 800px at 50% 30%,rgba(40,48,80,.25),transparent 60%),radial-gradient(900px 600px at 15% 15%,rgba(255,255,255,.08),transparent 40%),var(--bg);color:var(--text);overflow:hidden}#app{height:100%}.stage{position:relative;height:100vh;width:100vw}.viewer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.viewer canvas{width:100%;height:100%;object-fit:contain;display:block}#pdfCanvas{position:absolute;inset:0}#pointerCanvas{position:absolute;inset:0;pointer-events:none}.fx-layer{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden;background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.06),transparent 55%)}.fx-heart{position:absolute;width:calc(var(--fx-heart-size) * var(--fx-scale));height:calc(var(--fx-heart-size) * var(--fx-scale));transform:translate3d(-50%,-50%,0) rotate(-45deg);background:linear-gradient(135deg,#ff4678fa,#ff78b4fa);border-radius:clamp(16px,1.1vmin,28px) 0 clamp(10px,.8vmin,18px) 0;box-shadow:var(--fx-heart-shadow);filter:saturate(1.08) contrast(1.05);will-change:transform,opacity;animation:heart-pop 1.25s cubic-bezier(.18,.9,.2,1) forwards}.fx-heart:before,.fx-heart:after{content:"";position:absolute;width:100%;height:100%;background:inherit;border-radius:50%}.fx-heart:before{top:-50%;left:0}.fx-heart:after{left:50%;top:0}.fx-confetti{position:absolute;width:calc(var(--fx-confetti-w) * var(--fx-scale));height:calc(var(--fx-confetti-h) * var(--fx-scale));border-radius:clamp(3px,.25vmin,6px);background:hsl(var(--hue) 92% 60%);transform:translate3d(-50%,-50%,0) rotate(var(--rot));box-shadow:var(--fx-shadow);will-change:transform,opacity;animation:confetti-fall 1.6s cubic-bezier(.15,.85,.25,1) forwards}.fx-spark{position:absolute;width:calc(var(--fx-spark-size) * var(--fx-scale));height:calc(var(--fx-spark-size) * var(--fx-scale));border-radius:999px;background:hsl(var(--hue) 95% 62%);transform:translate3d(-50%,-50%,0);box-shadow:var(--fx-glow);will-change:transform,opacity,filter;animation:spark-fly 2s cubic-bezier(.12,.9,.25,1) forwards;filter:blur(.1vmin)}@keyframes heart-pop{0%{transform:translate3d(-50%,-50%,0) rotate(-45deg) scale(.55);opacity:0;filter:saturate(1.05) contrast(1.02)}30%{transform:translate3d(-50%,-50%,0) rotate(-45deg) scale(1.1);opacity:1}60%{transform:translate3d(-50%,-50%,0) rotate(-45deg) scale(1);opacity:1}to{transform:translate3d(-50%,calc(-50% + var(--fx-heart-rise)),0) rotate(-45deg) scale(.92);opacity:0;filter:saturate(1) contrast(1)}}@keyframes confetti-fall{0%{transform:translate3d(-50%,-50%,0) rotate(var(--rot));opacity:0}12%{opacity:1}to{transform:translate3d(calc(-50% + var(--dx)),calc(-50% + var(--dy)),0) rotate(calc(var(--rot) * 2.4));opacity:0}}@keyframes spark-fly{0%{transform:translate3d(-50%,-50%,0) scale(.9);opacity:0;filter:blur(.15vmin)}20%{opacity:1}to{transform:translate3d(calc(-50% + var(--dx)),calc(-50% + var(--dy)),0) scale(.25);opacity:0;filter:blur(.35vmin)}}.dropzone{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);padding:8rem 20rem;color:#000;text-align:center;border-radius:18px;border:1px dashed rgba(255,255,255,.24);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 20px 60px #00000059;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease,border-color .25s ease}.dropzone .dropTitle{font-size:20px;font-weight:600;letter-spacing:.2px}.dropzone .dropHint{font-size:16px;margin-top:6px}.stage:not(.has-pdf) .dropzone{opacity:1;pointer-events:auto}.stage.dragging .dropzone{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1.02);border-color:#fff9}.topbar{position:absolute;left:14px;right:14px;top:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none;opacity:.6}.stage:not(.has-pdf) .topbar{opacity:1}.brand{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--panel);border:1px solid var(--panelBorder);border-radius:14px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:auto}.brandTitle{font-size:13px;font-weight:700;letter-spacing:.2px}.pill{padding:8px 10px;background:var(--panel);border:1px solid var(--panelBorder);border-radius:999px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:12px;color:var(--muted);pointer-events:auto}.hint{position:absolute;left:50%;top:56%;transform:translate(-50%,-50%);text-align:center;width:min(680px,92vw);pointer-events:none}.hint h2{margin:0 0 8px;font-size:clamp(18px,3.2vw,28px);letter-spacing:.2px}.hint p{margin:0;color:var(--muted);font-size:clamp(12px,1.8vw,14px)}.camera-orb{position:absolute;background:#00000073;border:1px solid rgba(255,255,255,.18);border-radius:50%;overflow:hidden;box-shadow:0 24px 60px #00000073;display:grid;place-items:center;top:80%;left:50%;transform:scaleX(-1) translate(50%,-50%);transition:all .2s ease-in;width:320px;height:240px;z-index:9;opacity:75%;pointer-events:none;-webkit-mask-image:radial-gradient(circle,black 50%,rgba(0,0,0,.21) 50%,rgba(0,0,0,0) 60%);mask-image:radial-gradient(circle,#000 50%,#0003 50%,#0000 60%)}.camera-orb video,.camera-orb canvas{position:absolute;inset:0;width:100%;height:100%;display:block;filter:blur(10px) saturate(.8) brightness(.85);transition:filter .35s ease,opacity .35s ease}.camera-orb.is-active video,.camera-orb.is-active canvas{filter:none}.cameraLabel{position:absolute;bottom:10px;padding:4px 8px;background:#00000059;border:1px solid rgba(255,255,255,.16);border-radius:999px;font-size:11px;color:var(--muted);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.iconBtn{height:36px;width:36px;display:grid;place-items:center;border-radius:12px;background:#00000040;border:1px solid rgba(255,255,255,.18);cursor:pointer}.iconBtn:hover{background:#ffffff0f}.iconBtn:active{transform:translateY(1px)}.drawer{position:absolute;left:14px;top:64px;width:min(420px,92vw);background:var(--panel);border:1px solid var(--panelBorder);border-radius:16px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 30px 80px #00000073;padding:12px;display:none;pointer-events:auto}.drawer.open{display:block}.drawer h3{margin:0 0 10px;font-size:13px;color:var(--text)}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}button,input[type=file]::file-selector-button{background:#ffffff12;color:var(--text);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:8px 10px;font-size:13px;cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}input[type=range]{width:100%}.kv{display:grid;grid-template-columns:140px 1fr;gap:10px;align-items:center;margin-top:10px}.kv label{font-size:12px;color:var(--muted)}.kv .v{font-size:12px;color:var(--muted2);text-align:right}hr{border:none;border-top:1px solid rgba(255,255,255,.1);margin:12px 0}.debug{margin-top:10px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:11px;color:#ffffffbf;white-space:pre-wrap;word-break:break-word}kbd{padding:2px 6px;border:1px solid rgba(255,255,255,.18);border-bottom-width:2px;border-radius:8px;background:#00000040;font-size:12px;color:var(--muted)}
