.art-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.art-card{appearance:none;display:block;width:100%;border:0;padding:0;text-align:left;color:var(--fg);background:transparent;cursor:pointer}.art-card:last-child{grid-column:1/-1}.art-thumb{position:relative;border-radius:16px;overflow:hidden;background:#141321;aspect-ratio:1.2}.art-card:last-child .art-thumb{aspect-ratio:1.9}.art-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s cubic-bezier(.16,1,.3,1),filter .6s}.art-card:hover img,.art-card:focus-visible img{transform:scale(1.09);filter:brightness(1.12)}.art-thumb:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 55%,#050510b0)}.art-open{position:absolute;bottom:18px;right:18px;z-index:1;border:1px solid #ffffff65;border-radius:30px;padding:9px 15px;font-size:11px;background:#0e0c2060;backdrop-filter:blur(12px)}.art-card-meta{display:flex;justify-content:space-between;align-items:center;padding:16px 0 10px;gap:12px;font-size:14px}.art-card-meta small{color:var(--muted);font:10px 'Space Grotesk';letter-spacing:1px}.art-instruction{color:var(--muted);font-size:13px;line-height:1.7;margin:0 0 30px}.art-dialog{padding:0;border:0;background:#070810;color:var(--fg);width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;overflow:hidden;--glow:#a89bff;--gx:50%;--gy:50%;--mx:0px;--my:0px}.art-dialog::backdrop{background:#05050aeb;backdrop-filter:blur(18px)}.art-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}.art-toolbar{display:flex;justify-content:space-between;align-items:center;padding:18px max(22px,4vw);gap:14px;z-index:5}.art-toolbar .caption{color:#c6bdd7}.art-control{border:1px solid #ffffff40;background:#151322c0;color:#f3efff;border-radius:30px;padding:11px 18px;font:12px 'DM Sans';cursor:pointer;backdrop-filter:blur(12px)}.art-control:hover{background:#302745}.art-controls{display:flex;gap:8px}.art-view{position:relative;min-height:0;width:100%;display:grid;place-items:center;perspective:1200px;overflow:hidden;touch-action:pan-y}.art-halo{position:absolute;width:min(95vw,1000px);height:95%;background:radial-gradient(ellipse,var(--glow),transparent 65%);filter:blur(70px);opacity:.18;animation:artHalo 6s ease-in-out infinite alternate}.art-scene{position:relative;width:min(78vw,68dvh,750px);aspect-ratio:1;border-radius:10px;overflow:hidden;background:#141322;box-shadow:0 40px 100px #000b;transform:translate3d(var(--mx),var(--my),0);isolation:isolate}.art-scene[data-kind=dream]{width:min(85vw,98dvh,1150px);aspect-ratio:2148/1610}.art-scene img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none}.art-base{animation:artPan 15s ease-in-out infinite alternate;transform:scale(1)}.art-subject{mask-image:radial-gradient(ellipse var(--sw,30%) var(--sh,35%) at var(--sx,50%) var(--sy,50%),#000 45%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse var(--sw,30%) var(--sh,35%) at var(--sx,50%) var(--sy,50%),#000 45%,transparent 100%);animation:artBreathe 5s ease-in-out infinite;transform-origin:var(--sx) var(--sy);opacity:.88;filter:drop-shadow(0 0 12px #0003)}.art-light{position:absolute;inset:-6%;background:radial-gradient(ellipse 27% 30% at var(--gx) var(--gy),var(--glow),transparent 75%);mix-blend-mode:screen;opacity:.25;animation:artLight 4s ease-in-out infinite alternate;pointer-events:none}.art-mist{position:absolute;inset:-25%;background:radial-gradient(ellipse at 15% 60%,#b8cdfa28,transparent 40%),radial-gradient(ellipse at 85% 70%,#d8daf71b,transparent 35%);filter:blur(18px);mix-blend-mode:screen;animation:artMist 13s ease-in-out infinite alternate;pointer-events:none}.art-scene:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse,transparent 40%,#03040b60);pointer-events:none}.art-scene[data-kind=boat] .art-subject{animation:artBoat 7s ease-in-out infinite}.art-scene[data-kind=poster] .art-subject{animation:artPoster 10s ease-in-out infinite alternate}.art-scene[data-kind=tiger] .art-subject{animation:artTiger 4s ease-in-out infinite}.art-scene[data-kind=forest] .art-subject{animation:artForest 6s ease-in-out infinite}.art-scene[data-kind=dream] .art-subject{animation:artJelly 7s ease-in-out infinite}.art-scene[data-kind=dream] .art-light{animation-duration:7s}.art-bottom{display:grid;grid-template-columns:1fr auto;align-items:center;padding:22px max(22px,4vw) 26px;gap:20px;z-index:5}.art-bottom h2{font:500 clamp(24px,3vw,42px)/1.1 'Space Grotesk';margin:0 0 6px;letter-spacing:-1px}.art-bottom p{font-size:12px;color:#aca6bc;margin:0}.art-navigation{display:flex;gap:8px}.art-navigation button{min-width:46px}.art-paused *{animation-play-state:paused!important}.motion-off .art-dialog *{animation:none!important}.art-scene.art-still *{animation:none!important}.art-sequence-number{font:12px 'Space Grotesk';color:#b9abc9}.art-enter{animation:artReveal 1.3s cubic-bezier(.16,1,.3,1) both}.art-opening .art-scene{animation:artSceneOpen 1.2s cubic-bezier(.16,1,.3,1) both}
@keyframes artSceneOpen{from{opacity:0;transform:translateY(80px) scale(.6) rotate(-7deg)}to{opacity:1;transform:none}}@keyframes artReveal{from{filter:brightness(.2) blur(9px);transform:scale(1.5) rotate(4deg)}to{filter:brightness(1) blur(0);transform:scale(1) rotate(0)}}@keyframes artPan{from{transform:scale(1)}to{transform:scale(1.008)}}@keyframes artBreathe{50%{transform:scale(1.018) translateY(-.4%)}}@keyframes artBoat{0%,100%{transform:translateY(.3%) rotate(-.6deg)}50%{transform:translateY(-1.1%) rotate(.7deg)}}@keyframes artPoster{to{transform:scale(1.018) translateY(-.3%)}}@keyframes artTiger{0%,100%{transform:scale(1)}50%{transform:scale(1.016) translateY(-.3%)}}@keyframes artForest{50%{transform:translateY(-.35%) rotate(.35deg)}}@keyframes artJelly{0%,100%{transform:translate(-.4%,.6%) rotate(-1deg) scale(1)}50%{transform:translate(.8%,-1.8%) rotate(1deg) scale(1.035)}}@keyframes artLight{from{opacity:.12;transform:scale(.95)}to{opacity:.48;transform:scale(1.14)}}@keyframes artMist{from{transform:translate(-8%,3%) scale(1)}to{transform:translate(9%,-3%) scale(1.12)}}@keyframes artHalo{to{opacity:.3;transform:scale(1.15)}}
@media(max-width:650px){.art-grid{gap:24px;grid-template-columns:1fr}.art-card:last-child{grid-column:auto}.art-card:last-child .art-thumb{aspect-ratio:1.2}.art-toolbar{padding:16px;align-items:center}.art-toolbar .caption{font-size:9px;letter-spacing:.7px}.art-control{padding:10px 13px;font-size:11px}.art-controls{gap:6px}.art-scene{width:92vw;border-radius:8px}.art-scene[data-kind=dream]{width:96vw}.art-bottom{padding:20px 18px 26px;gap:12px}.art-bottom h2{font-size:27px}.art-bottom p{font-size:10px;line-height:1.7;max-width:240px}.art-navigation{gap:5px}.art-navigation button{min-width:35px;padding:10px}.art-card-meta{font-size:13px}.art-card-meta small{font-size:9px}}
@media(prefers-reduced-motion:reduce){.art-dialog *{animation:none!important;transition:none!important}}