:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%;overflow:hidden;background:#000;color:#fafafa}.app-container{height:100vh;height:100dvh;width:100%;overflow-y:scroll;scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch}.app-container.interacting{scroll-snap-type:none;overflow-y:hidden}.app-slide{height:100vh;height:100dvh;width:100%;scroll-snap-align:start;scroll-snap-stop:always;position:relative;background:#000;overflow:hidden}.slide-preview{position:absolute;inset:0;overflow:hidden}.slide-preview iframe{width:100%;height:100%;border:none;display:block;background:#000}.slide-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}.slide-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem}.slide-placeholder-letter{width:4rem;height:4rem;border-radius:1rem;display:flex;align-items:center;justify-content:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.8rem;font-weight:700;color:#ffffffb3;text-transform:uppercase}.slide-placeholder-name{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;font-weight:500;color:#fff3;letter-spacing:.05em;text-align:center;max-width:80%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tap-overlay{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;background:#00000040;opacity:0;transition:opacity .3s;pointer-events:none}.tap-overlay.visible{opacity:1;pointer-events:auto;cursor:pointer}.tap-overlay-inner{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem 1.5rem;background:#0009;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);border-radius:1rem;animation:tap-pulse 2s ease-in-out infinite}@keyframes tap-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}.tap-overlay-icon{font-size:1.5rem}.tap-overlay-text{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.6rem;text-transform:uppercase;letter-spacing:.2em;color:#fffc}.slide-info{position:absolute;bottom:0;left:0;right:0;z-index:5;padding:1rem 1.25rem;padding-bottom:max(1rem,env(safe-area-inset-bottom));background:linear-gradient(to top,rgba(0,0,0,.8) 0%,rgba(0,0,0,.3) 60%,transparent 100%);pointer-events:none;transition:opacity .2s}.slide-info.hidden{opacity:0}.slide-info>*{pointer-events:auto}.slide-name{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.15rem;font-weight:700;letter-spacing:-.01em;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.6)}.slide-description{margin-top:.2rem;font-size:.8rem;color:#ffffffb3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 3px rgba(0,0,0,.5)}.slide-meta{margin-top:.4rem;display:flex;align-items:center;gap:.75rem}.slide-meta-item{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.65rem;text-transform:uppercase;letter-spacing:.15em;color:#ffffff73;display:flex;align-items:center;gap:.3rem}.slide-actions{position:absolute;right:.75rem;bottom:6.5rem;z-index:5;display:flex;flex-direction:column;align-items:center;gap:1rem;pointer-events:none;transition:opacity .2s}.slide-actions.hidden{opacity:0}.slide-actions>*{pointer-events:auto}.action-btn{display:flex;flex-direction:column;align-items:center;gap:.15rem;background:none;border:none;color:#fff;cursor:pointer;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-decoration:none}.action-icon{width:2.5rem;height:2.5rem;border-radius:50%;background:#00000073;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;font-size:1.1rem;border:1px solid rgba(255,255,255,.12);transition:background .15s}.action-btn:hover .action-icon{background:#ffffff26}.action-label{font-size:.55rem;text-transform:uppercase;letter-spacing:.1em;color:#fff9}.app-header{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:.6rem 1rem;padding-top:max(.6rem,env(safe-area-inset-top));padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right));background:linear-gradient(to bottom,rgba(0,0,0,.5) 0%,transparent 100%);pointer-events:none}.app-header>*{pointer-events:auto}.header-left{display:flex;align-items:center;gap:.75rem}.header-title{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.6rem;text-transform:uppercase;letter-spacing:.25em;color:#ffffff80;cursor:pointer;transition:color .15s}.header-title:hover{color:#fffc}.header-right{display:flex;align-items:center;gap:.5rem}.header-counter{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.6rem;text-transform:uppercase;letter-spacing:.15em;color:#ffffff59;transition:opacity .3s}.header-btn{width:1.6rem;height:1.6rem;border-radius:50%;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#ffffff73;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.7rem;transition:all .15s}.header-btn:hover{background:#ffffff1f;border-color:#ffffff40;color:#fffc}.interact-toggle{position:fixed;bottom:max(1rem,env(safe-area-inset-bottom));right:max(1rem,env(safe-area-inset-right));z-index:100;display:flex;align-items:center;gap:.5rem;padding:.5rem .85rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.6rem;text-transform:uppercase;letter-spacing:.15em;color:#fff;background:#000000b3;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.15);border-radius:999px;cursor:pointer;transition:all .2s}.interact-toggle:hover{background:#ffffff1f;border-color:#ffffff4d}.interact-toggle.active{background:#3b82f64d;border-color:#3b82f680}.interact-dot{width:.4rem;height:.4rem;border-radius:50%;background:#fff6;transition:all .2s}.interact-toggle.active .interact-dot{background:#3b82f6;box-shadow:0 0 6px #3b82f699}.scroll-hint{position:fixed;bottom:3.5rem;left:50%;transform:translate(-50%);z-index:50;display:flex;flex-direction:column;align-items:center;gap:.4rem;pointer-events:none}.scroll-hint-icon{color:#ffffff80;animation:bounce-arrow 1.5s ease-in-out infinite;filter:drop-shadow(0 0 4px rgba(255,255,255,.15))}@keyframes bounce-arrow{0%,to{transform:translateY(0);opacity:.35}50%{transform:translateY(8px);opacity:.8}}.scroll-hint-text{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.55rem;text-transform:uppercase;letter-spacing:.2em;color:#ffffff4d;animation:fade-hint 1.5s ease-in-out infinite}@keyframes fade-hint{0%,to{opacity:.2}50%{opacity:.6}}.kbd-hints{position:fixed;bottom:1rem;left:1rem;z-index:100;display:flex;flex-direction:column;gap:.25rem;opacity:0;transition:opacity .3s;pointer-events:none}.kbd-hints.visible{opacity:1}.kbd-row{display:flex;align-items:center;gap:.35rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.5rem;text-transform:uppercase;letter-spacing:.12em;color:#ffffff40}.kbd{display:inline-flex;align-items:center;justify-content:center;min-width:1.2rem;height:1.2rem;padding:0 .3rem;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:.2rem;font-size:.5rem;color:#fff6}.loading-screen{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background:#000}.loading-spinner{width:2rem;height:2rem;border:2px solid rgba(255,255,255,.08);border-top-color:#fff6;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.65rem;text-transform:uppercase;letter-spacing:.2em;color:#ffffff4d}.loading-progress{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.55rem;color:#fff3;letter-spacing:.1em}.loading-bar-track{width:12rem;height:2px;background:#ffffff0f;border-radius:1px;overflow:hidden}.loading-bar-fill{height:100%;background:linear-gradient(90deg,#ffffff4d,#ffffff80);border-radius:1px;transition:width .3s ease-out}.bg-loading{position:fixed;top:max(2.5rem,calc(env(safe-area-inset-top) + 2rem));left:50%;transform:translate(-50%);z-index:50;display:flex;align-items:center;gap:.5rem;padding:.35rem .75rem;background:#0009;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.08);border-radius:999px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.5rem;text-transform:uppercase;letter-spacing:.15em;color:#ffffff59;animation:fade-in .3s}@keyframes fade-in{0%{opacity:0;transform:translate(-50%) translateY(-4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.bg-loading-dot{width:.35rem;height:.35rem;border-radius:50%;background:#3b82f699;animation:blink 1.2s ease-in-out infinite}@keyframes blink{0%,to{opacity:.4}50%{opacity:1}}.logo{display:flex;align-items:center;gap:.6rem;cursor:pointer;transition:opacity .2s}.logo:hover{opacity:.8}.logo-icon{width:1.75rem;height:1.75rem;flex-shrink:0}.logo-text{font-family:Plus Jakarta Sans,ui-sans-serif,system-ui,-apple-system,sans-serif;font-weight:700;font-size:1.1rem;letter-spacing:-.02em;color:#fff;line-height:1;user-select:none}.grad-0{background:linear-gradient(135deg,#1a1a2e,#16213e)}.grad-1{background:linear-gradient(135deg,#0f3460,#1a1a2e)}.grad-2{background:linear-gradient(135deg,#1a1a2e,#533483)}.grad-3{background:linear-gradient(135deg,#2d132c,#1a1a2e)}.grad-4{background:linear-gradient(135deg,#1a1a2e,#0f3460)}.grad-5{background:linear-gradient(135deg,#16213e,#1a1a2e)}.grad-6{background:linear-gradient(135deg,#1a1a2e,#2d132c)}.grad-7{background:linear-gradient(135deg,#533483,#1a1a2e)}@media(max-width:640px){.logo-icon{width:2.5rem;height:2.5rem}.logo-text{font-size:1.4rem}.header-title,.header-counter{font-size:.8rem}.header-btn{width:2.25rem;height:2.25rem;font-size:1rem}.slide-name{font-size:1.5rem}.slide-description{font-size:1rem}.slide-meta-item{font-size:.85rem;gap:.4rem}.slide-actions{right:1rem;gap:1.25rem}.action-icon{width:3.25rem;height:3.25rem;font-size:1.4rem}.action-label{font-size:.7rem}.interact-toggle{font-size:.8rem;padding:.65rem 1.1rem}.interact-dot{width:.55rem;height:.55rem}.tap-overlay-icon{font-size:2.25rem}.tap-overlay-text{font-size:.85rem}.tap-overlay-inner{padding:1.25rem 2rem;gap:.75rem}.scroll-hint-icon svg{width:32px;height:32px}.scroll-hint-text{font-size:.75rem}.loading-text{font-size:.85rem}.loading-spinner{width:2.75rem;height:2.75rem}.bg-loading{font-size:.7rem}.slide-placeholder-letter{width:5.5rem;height:5.5rem;font-size:2.5rem}.slide-placeholder-name{font-size:1.05rem}}
