body{padding:0;background:#d2d3d5}.device{width:min(100vw,calc(100svh * 1.448));box-shadow:none}.outside,.edition,.section-label,.gallery-footer{display:none}.screen{left:1.5%;top:2.3%;width:97%;height:81.8%;background:url('assets/background_porto.png') center/cover}.screen:after{box-shadow:none}.webgl-surface{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.screen header{inset:3.7% 3.1% auto}.identity{font-size:1.1cqw;letter-spacing:0}.identity span{font-family:Georgia,'Times New Roman',serif;font-size:1.7cqw;opacity:1;margin-top:.65cqw}.gallery-heading{top:17.7%;left:50%;right:auto;transform:translateX(-50%);gap:1.25cqw}.categories{position:relative;width:16.6cqw;height:4.3cqw;border:1px solid #ebf4ffb0;border-radius:.8cqw;background:linear-gradient(135deg,#c9d4e4b8,#dcd3e2b8);backdrop-filter:blur(16px);box-shadow:inset 0 2px 4px #fff5;gap:0;align-items:center;overflow:hidden;padding:0 .5cqw}.categories:after{content:'';position:absolute;bottom:0;left:.6cqw;right:.6cqw;height:.65cqw;background:repeating-linear-gradient(90deg,transparent 0,transparent .82cqw,#414655 .85cqw,#414655 .89cqw,transparent .92cqw);pointer-events:none}.categories:before{content:'';position:absolute;left:50%;bottom:0;height:.8cqw;width:2px;background:#e34050;z-index:2}.categories button{font-size:.82cqw;white-space:nowrap;flex:1;padding:0 .6cqw .15cqw;color:#30343c;opacity:.6;border:0}.categories button[aria-selected=true]{font-size:1cqw;font-weight:600;opacity:1;border:0;color:#111}.gallery-heading>button{width:3.3cqw;aspect-ratio:1;border:0.3cqw solid #e3e7eab0;border-radius:50%;background:#f7fafb;box-shadow:0 .2cqw .2cqw #fff5,0 .3cqw 0 .12cqw #ffffff32;color:#2874f0;font-size:2cqw;line-height:1}.stage{inset:29% 0 12%;perspective:none;z-index:2;touch-action:pan-y}.world{position:fixed;inset:0;transform:none;pointer-events:none}.project-hit{position:absolute;transform:translate(-50%,-50%);width:2.4cqw;height:2.4cqw;min-width:20px;min-height:20px;pointer-events:auto;border-radius:50%;padding:0}.project-hit span{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.project-hit:focus-visible{outline:2px solid white}.screen footer{bottom:2.6%;left:0;right:0;height:7%;border:0;justify-content:center;gap:4cqw;padding:0;z-index:5}nav{gap:.85cqw;align-items:center}nav button{font-size:1.2cqw;opacity:1;position:relative;padding-bottom:1.4cqw}nav button:after{content:'';position:absolute;bottom:.1cqw;left:calc(50% - .25cqw);width:.5cqw;height:.5cqw;background:#fff;transform:rotate(45deg);border-radius:1px;opacity:.7}nav button.active:before{display:none}nav button.active:after{opacity:1}nav button:hover{opacity:.7}.player img{width:2.9cqw}.player>span{display:none}.hardware-button{background:transparent;box-shadow:none}.hardware-button img{opacity:0}.hardware-button.active{background:#0002;filter:none;box-shadow:inset 0 2px 4px #0005;transform:none}.knob{left:57.1%;top:88.8%;width:5.8%;border-radius:50%;overflow:hidden}.knob span{inset:0;background:url('assets/mockup_porto.png') 60.6157% 96.939% / 1724.1379% auto;border-radius:50%;transform-origin:center}.knob span:before{display:none}#panel{z-index:40}.webgl-lost .stage:after{content:'Graphics paused. Reload to restore WebGL.';position:absolute;top:50%;left:25%;font-size:14px}@media(max-width:600px){body{padding:0}.device{width:100vw}.identity{font-size:1.7cqw}.identity span{font-size:2.4cqw}.categories{width:27cqw;height:6cqw}.categories button{font-size:1.4cqw;padding:0 .8cqw}.categories button[aria-selected=true]{font-size:1.6cqw}.gallery-heading>button{width:5cqw;font-size:3cqw}.gallery-heading{gap:1.7cqw}nav button{font-size:2cqw;padding-bottom:2cqw}nav{gap:1.4cqw}.player img{width:4.4cqw}.screen footer{gap:3cqw}}
.stage{inset:0}.world{position:absolute;inset:0;width:auto;height:auto}.project-hit{border-radius:0}.project-hit:hover:not(:focus-visible){outline:none}
@media(max-width:600px){.identity{font-size:2.8cqw}.identity span{font-size:4cqw;margin-top:.4cqw}.gallery-heading{top:19%;gap:2cqw}.categories{width:58cqw;height:9cqw}.categories button{font-size:2.5cqw}.categories button[aria-selected=true]{font-size:2.8cqw}.gallery-heading>button{width:8cqw;font-size:5cqw}.screen footer{height:13%;bottom:.6%;gap:3cqw}nav button{font-size:3cqw;min-height:32px;padding-bottom:2cqw}nav{gap:1.8cqw}.player img{width:6cqw}.project-hit{min-width:32px;min-height:32px}}
