.app{min-height:100svh;display:flex;justify-content:center;padding:clamp(1.25rem,4vw,2.5rem) clamp(1.25rem,6vw,2.25rem) clamp(1.5rem,5vw,2.75rem);box-sizing:border-box;position:relative;overflow-x:hidden}.app-home{height:100svh;align-items:center;overflow:hidden}.app-detail{min-height:100svh;justify-content:center}.app-detail.app-locked{height:100svh;align-items:center;overflow:hidden}.app-detail.app-revealed{align-items:flex-start;overflow-y:auto}.hue-overlay{position:fixed;inset:-20%;filter:blur(120px);opacity:0;transition:opacity .52s ease;transform:scale(1.05);background:radial-gradient(140% 140% at 30% 30%,rgba(255,255,255,.9),transparent 55%),radial-gradient(140% 140% at 70% 70%,color-mix(in srgb,var(--accent, #f8fafc) 60%,#ffffff 40%),transparent 65%);z-index:0}.hue-overlay-visible{opacity:.7}.eyebrow{margin:0 0 .4rem;letter-spacing:.08em;text-transform:uppercase;color:#6b7280;font-size:.9rem;font-weight:600}.app-header h1{font-size:2.4rem;line-height:1.1;margin:0 0 .8rem;color:#0f172a}.app-header p{font-size:1.06rem;color:#475569;margin:0}.content{position:relative;z-index:1}.card-stack{position:relative;width:100%;max-width:min(540px,92vw);min-height:0}.card{position:absolute;inset:0;transition:transform .32s ease,opacity .32s ease;pointer-events:none;z-index:1}.card .app-header{height:auto;text-align:center;background:#fffffff5;border:1px solid #eef1f6;box-shadow:0 18px 48px #0f172a0f,0 1px #ffffffb3 inset;border-radius:28px;padding:clamp(1.6rem,5vw,2.6rem) clamp(1.1rem,4vw,1.9rem);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);position:relative;z-index:2;overflow:hidden}.card.active{pointer-events:auto;opacity:1;transform:translate(0);position:relative;inset:auto}.card-left{opacity:0;transform:translate(-120%)}.card-right{opacity:0;transform:translate(120%)}.emoji-bg{position:fixed;inset:-12%;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));grid-auto-rows:1fr;place-items:center;gap:12px;padding:0;pointer-events:none;opacity:.28;transform:translateZ(0);animation:drift 22s linear infinite;z-index:0}.emoji-cell{position:relative;width:clamp(3.6rem,8vw,5.4rem);height:clamp(3.6rem,8vw,5.4rem);display:grid;place-items:center}.bg-emoji{width:100%;height:auto;transition:transform .24s ease,opacity .24s ease}.bg-emoji.slide-out{opacity:0;transform:translateY(-20%) scale(.9)}.selected-layer{position:absolute;inset:0;opacity:0;transform:translateY(12%);transition:opacity .38s ease,transform .38s ease;z-index:1}.selected-layer.slide-in{opacity:1;transform:translateY(0)}.emoji-gap{opacity:0}.button-container{display:grid;gap:.9rem;margin-top:2rem;grid-template-columns:1fr}.button-large{font-size:2.5rem}.button-container.button-large button{font-size:1.25rem}button{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;border-radius:999px;border:1px solid #d4d7de;padding:.85rem 1rem;font-size:1rem;font-weight:800;font-family:inherit;background:linear-gradient(135deg,#fefefe,#f3f6fb,#e9eef5);color:#0f172a;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease;width:100%}button:hover{background:linear-gradient(135deg,#fff,#eef2f8,#e3e8f2);border-color:#c8ccd5;transform:translateY(-1px)}button:active{transform:translateY(1px);background:linear-gradient(135deg,#edf1f7,#e6ecf4)}.button-container button:nth-child(1){background:linear-gradient(135deg,#f0e6ff,#d7bfff,#c69cff);border-color:#c69cff;color:#fff}.button-container button:nth-child(1):hover{background:linear-gradient(135deg,#f5ecff,#dfc9ff,#d0adff);border-color:#b98de7}.button-container button:nth-child(1):active{background:linear-gradient(135deg,#e8d7ff,#d1b3ff,#bf94ff)}.button-container button:nth-child(2){background:linear-gradient(135deg,#2f3034,#1a1b1f 48%,#050607);border-color:#0f1013;color:#fff}.button-container button:nth-child(2):hover{background:linear-gradient(135deg,#3a3b40,#202228,#0a0b0d);border-color:#0b0c0f}.button-container button:nth-child(2):active{background:linear-gradient(135deg,#1f2024,#111216,#000);border-color:#08090b}.button-container button:nth-child(3){background:linear-gradient(135deg,#ff9baa,#ff6e86,#f13f60);border-color:#e63557;color:#fff}.button-container button:nth-child(3):hover{background:linear-gradient(135deg,#ffadba,#ff7c93,#f44c6b);border-color:#d92c50}.button-container button:nth-child(3):active{background:linear-gradient(135deg,#ff8397,#ff637a,#e93758)}.button-container button:nth-child(4){background:linear-gradient(135deg,#c6f3d2,#8de0a3,#4caf50);border-color:#4caf50;color:#fff}.button-container button:nth-child(4):hover{background:linear-gradient(135deg,#d3f6dd,#9ae6ae,#55b958);border-color:#3f9f43;color:#fff}.button-container button:nth-child(4):active{background:linear-gradient(135deg,#bdf1ca,#84daa0,#409f45);color:#fff}.button-container button:nth-child(5){background:linear-gradient(135deg,#cfe4ff,#8ec5ff,#3a8bff);border-color:#2f75e1;color:#fff}.button-container button:nth-child(5):hover{background:linear-gradient(135deg,#d9ecff,#9cd0ff,#4b96ff);border-color:#2b6dd2}.button-container button:nth-child(5):active{background:linear-gradient(135deg,#b7d5ff,#7fbaff,#2f75e1);border-color:#255fb5}.icon{font-size:1.1rem;line-height:1}.icon-img{width:1.35rem;height:1.35rem}.detail{text-align:left}.detail-top{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:1rem}.detail-title{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;color:#0f172a}.ghost{background:transparent;border:1px solid #d4d7de;color:#0f172a;padding:.55rem .9rem;border-radius:12px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease;width:auto;box-shadow:none;transform:none}.ghost:hover{background:#f5f7fb;border-color:#c8ccd5}.video-frame{position:relative;width:100%;padding-top:56.25%;border-radius:18px;overflow:hidden;background:#0f172a;box-shadow:0 12px 30px #0f172a24}.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.reveal-stage{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:18px;overflow:hidden}.reveal-stage>*{position:absolute;inset:0;width:100%;height:100%}.app-detail.app-locked .reveal-stage{height:clamp(360px,52vh,560px);padding-top:0}.reveal-stage .video-frame{height:100%;padding-top:0;width:100%}.present{position:relative;width:100%;height:100%;border-radius:18px;overflow:hidden;border:1px solid rgba(148,163,184,.4);background:radial-gradient(140% 120% at 30% 20%,#ffffffeb,#f1f5f9db 45%,#e2e8f0c7);box-shadow:0 12px 30px #0f172a1a;cursor:pointer;transition:transform .26s cubic-bezier(.2,.9,.2,1),box-shadow .22s ease,border-color .22s ease,opacity .24s ease;transform:translateZ(0)}.present:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 16px 34px #0f172a24;border-color:#64748b8c}.present:active{transform:translateY(1px) scale(.99)}.present:before{content:"";position:absolute;inset:-40%;background:linear-gradient(120deg,transparent 35%,rgba(255,255,255,.65) 50%,transparent 65%);transform:translate(-45%) rotate(10deg);opacity:0;transition:opacity .2s ease;pointer-events:none}.present:hover:before{opacity:1;animation:present-shine .9s ease forwards}.present:disabled{cursor:default}.present.opening{transform:scale(.98)}.open-burst{position:absolute;inset:0;pointer-events:none;z-index:0}.open-burst-item{position:absolute;left:var(--x, 50%);top:-12%;width:2.35rem;height:2.35rem;transform:translate(-50%);opacity:0;animation:open-fall var(--dur, .82s) linear var(--delay, 0ms) forwards}.open-burst-item img{width:100%;height:100%;display:block;transform-origin:center;animation:open-sway var(--swayDur, 2.2s) ease-in-out var(--delay, 0ms) infinite}.present.shaking{animation:present-shake .42s cubic-bezier(.2,.9,.2,1) 1}.reveal-video{opacity:0;transform:scale(.98) translateY(8px);transition:opacity .36s ease,transform .42s cubic-bezier(.2,.9,.2,1);pointer-events:none;width:100%;height:100%}.reveal-stage.revealed .reveal-video{opacity:1;transform:scale(1) translateY(0);pointer-events:auto}.reveal-stage.revealed .present{opacity:0;transform:scale(.92) rotate(-1.5deg);pointer-events:none;animation:present-open .52s cubic-bezier(.2,.9,.2,1) both}.reveal-stage.revealed .present:before{opacity:0}.present-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;padding:1.25rem;text-align:center;pointer-events:none;z-index:1}.present-emoji-slot{display:inline-flex;align-items:center;justify-content:center}.present-emoji-slot.moving{position:absolute;left:var(--present-x, 50%);top:var(--present-y, 38%);transform:translate(-50%,-50%);transition:left .42s cubic-bezier(.18,.95,.2,1),top .42s cubic-bezier(.18,.95,.2,1);will-change:left,top,transform;z-index:2}.present-emoji-slot.clickable{cursor:pointer}.present-emoji{display:inline-block;font-size:3.8rem;line-height:1;transform:translateZ(0);animation:present-emoji-bounce 2.6s ease-in-out infinite}.present-emoji.popping{animation:present-emoji-bounce 2.6s ease-in-out infinite,present-emoji-pop .28s cubic-bezier(.2,.9,.2,1) 1}.present-title{font-weight:800;letter-spacing:-.01em;color:#0f172a;font-size:1.35rem}.present-subtitle{font-weight:600;color:#475569;font-size:1.05rem}.lyrics-wrap{max-height:0;opacity:0;overflow:hidden;transition:max-height .52s cubic-bezier(.2,.9,.2,1),opacity .36s ease}.lyrics-wrap.visible{margin-top:1.2rem;max-height:1600px;opacity:1}.lyrics-section{margin:0}.lyrics-text{margin:0;padding:1rem 1.05rem;border-radius:18px;border:1px solid rgba(148,163,184,.35);background:#ffffffb8;box-shadow:0 10px 24px #0f172a0f;word-break:break-word;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.92rem;line-height:1.45;color:#0f172a}.lyrics-text .lyrics-heading{margin:0 0 .7rem;font-size:1.15rem;font-weight:800;letter-spacing:-.01em;color:#0f172a;font-family:"Baloo 2",system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.lyrics-text .lyrics-body{margin:0;white-space:pre-wrap}@keyframes present-open{0%{opacity:1;transform:scale(1) rotate(0)}60%{opacity:1;transform:scale(1.02) rotate(.8deg)}to{opacity:0;transform:scale(.9) rotate(-2deg)}}@keyframes present-shine{0%{transform:translate(-45%) rotate(10deg)}to{transform:translate(45%) rotate(10deg)}}@keyframes present-shake{0%{transform:translate(0) rotate(0)}18%{transform:translate(-10px) rotate(-1.4deg)}36%{transform:translate(9px) rotate(1.2deg)}54%{transform:translate(-7px) rotate(-1deg)}72%{transform:translate(5px) rotate(.8deg)}to{transform:translate(0) rotate(0)}}@keyframes open-fall{0%{opacity:0;transform:translate(-50%,-8px) scale(.8)}10%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--dx, 0px)),112vh) scale(var(--scale, 1))}}@keyframes open-sway{0%{transform:translate(0) rotate(0)}50%{transform:translate(var(--sway, 0px)) rotate(var(--rot, 0deg))}to{transform:translate(0) rotate(calc(var(--rot, 0deg) * -1))}}@keyframes present-emoji-bounce{0%,to{transform:translateY(0)}45%{transform:translateY(-10px)}70%{transform:translateY(2px)}}@keyframes present-emoji-pop{0%{transform:translateY(0) scale(1)}60%{transform:translateY(-2px) scale(1.28)}to{transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.present-emoji{animation:none}.present:hover:before{animation:none}}@keyframes drift{0%{transform:translateZ(0)}50%{transform:translate3d(-4%,-3%,0)}to{transform:translateZ(0)}}@media(min-width:640px){.app{padding:3.5rem 1.5rem}.card .app-header{padding:2.4rem}.card-stack{min-height:clamp(520px,70vh,720px)}}:root{font-family:"Baloo 2",system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6;font-weight:400;color:#0f172a;background:radial-gradient(circle at 20% 20%,#f9fbff,#f5f7fb 40%,#eef2f7);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;background:transparent}#root{min-height:100vh}