:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#0a0a0f;--accent:#c084fc;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font:16px/1.5 system-ui,-apple-system,sans-serif}*,:before,:after{box-sizing:border-box}body{margin:0}h1,h2{color:var(--text-h);font-weight:600}a{color:inherit}.gallery{min-height:100svh;padding:0 24px 48px;animation:.4s ease-out fadeUp}@keyframes fadeUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.gallery-header{text-align:center;padding:48px 0 32px}.gallery-header h1{letter-spacing:-1.5px;margin:0 0 8px;font-size:48px}.gallery-header p{color:var(--text);margin:0;font-size:18px}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;max-width:1200px;margin:0 auto;display:grid}.scene-card{color:#fff;aspect-ratio:4/3;animation:.4s ease-out backwards fadeUp;animation-delay:calc(var(--card-index,0) * 40ms);border-radius:12px;text-decoration:none;transition:transform .2s,box-shadow .2s;display:block;position:relative;overflow:hidden}.scene-card:hover{transform:translateY(-4px)scale(1.02);box-shadow:0 12px 32px #0006}.scene-card-bg{background:radial-gradient(ellipse at 30% 20%, #ffffff26 0%, transparent 50%), radial-gradient(ellipse at 70% 80%, #0000004d 0%, transparent 50%), var(--card-color,#333);position:absolute;inset:0}.scene-card-content{z-index:1;box-sizing:border-box;background:linear-gradient(#0000 40%,#0009);flex-direction:column;justify-content:flex-end;height:100%;padding:20px;display:flex;position:relative}.scene-card-type{text-transform:uppercase;letter-spacing:1.5px;opacity:.7;margin-bottom:4px;font-size:11px}.scene-card h2{color:#fff;margin:0;font-size:22px}.scene-card p{opacity:.8;margin:4px 0 0;font-size:14px;line-height:1.4}.viewer{opacity:0;background:#000;transition:opacity .3s ease-in;position:fixed;inset:0}.viewer-visible{opacity:1}.viewer-canvas{outline:none;width:100%;height:100%;display:block}.viewer-loading{z-index:10;color:#fff;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}.spinner{border:3px solid #fff3;border-top-color:#fff;border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.viewer-error{z-index:10;color:#fff;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}.viewer-overlay{z-index:5;pointer-events:none;justify-content:space-between;align-items:center;padding:16px 20px;display:flex;position:absolute;top:0;left:0;right:0}.viewer-overlay-left{align-items:center;gap:12px;display:flex}.viewer-overlay-right{align-items:center;gap:8px;display:flex}.back-button{pointer-events:auto;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#00000080;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;font-size:20px;text-decoration:none;transition:background .2s;display:flex}.back-button:hover{background:#000000b3}.nav-button{pointer-events:auto;color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#00000080;border:none;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;font-size:24px;line-height:1;transition:background .2s;display:flex}.nav-button:hover{background:#000000b3}.scene-title{color:#ffffffe6;font-size:14px;font-weight:500}.scene-counter{color:#ffffff80;font-variant-numeric:tabular-nums;font-size:13px}.audio-toggle{font-size:18px}.audio-toggle.audio-on{background:#c084fc66}.back-link{color:var(--accent,#c084fc)}@media (width<=640px){.gallery-header{padding:32px 0 24px}.gallery-header h1{font-size:32px}.gallery-grid{grid-template-columns:1fr}.scene-counter{display:none}.back-button,.nav-button{width:44px;height:44px;font-size:26px}.audio-toggle{font-size:20px}.viewer-overlay{padding:12px 16px}.scene-title{font-size:13px}}@media (hover:none) and (pointer:coarse){.scene-card{-webkit-tap-highlight-color:transparent}.scene-card:active{transform:scale(.97)}}