*{box-sizing:border-box}body{margin:0;font:15px system-ui,sans-serif;background:#0c1423;color:#eaf0f7}a{color:#74cfdf}button{background:#26384c;border:1px solid #435972;border-radius:8px;color:white;padding:9px 14px;cursor:pointer}button:hover{background:#34526c}header,footer{padding:18px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}header{border-bottom:1px solid #29394b}.viewer{height:100dvh;display:flex;flex-direction:column}.viewer main{flex:1;min-height:100px;position:relative;overflow:hidden;touch-action:none}.viewer canvas{display:block;width:100%;height:100%;cursor:grab}.viewer canvas:active{cursor:grabbing}.viewer img{position:absolute;width:100%;height:100%;object-fit:contain;padding:24px}.viewer footer{font-size:13px;background:#131f30}.viewer #controls{display:flex;gap:6px;align-items:center;flex-wrap:wrap}[hidden]{display:none!important}.gallery{max-width:1180px;margin:50px auto;padding:0 24px}.gallery h1{font-size:clamp(30px,5vw,52px);letter-spacing:-.04em}.gallery p{color:#adbdcf;line-height:1.7}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:32px}.gallery-card{display:block;color:inherit;text-decoration:none;border:1px solid #2e4056;border-radius:18px;background:#152237;padding:22px;overflow:hidden}.gallery-card img{width:100%;height:220px;object-fit:contain}.gallery-card .cube{font-size:90px;height:220px;display:grid;place-items:center;color:#74cfdf}.gallery-card:hover{border-color:#74cfdf}input[type=color]{width:40px;height:35px;background:transparent;border:0}