*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;background:#1778b7}
body{overflow:hidden;font-family:Arial,Helvetica,sans-serif}
.site{width:100vw;height:100vh;height:100dvh;display:grid;place-items:center;overflow:hidden;background:#1778b7}
.scene{position:relative;aspect-ratio:3/2;width:max(100vw,calc(100dvh * 1.5));height:auto;line-height:0;overflow:hidden;flex:0 0 auto}
.scene-art{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}

.ui-panel{position:absolute;left:48.2%;top:49.4%;width:27.8%;aspect-ratio:4/3;z-index:6;animation:panelFloat 6.5s ease-in-out infinite}
.panel-base{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 1vw 1.2vw rgba(0,0,0,.18));pointer-events:none;user-select:none}
.ca-button,.action-btn{border:0;background:transparent;padding:0;margin:0;display:block;text-decoration:none;cursor:pointer}
.ca-button{position:absolute;left:8.3%;top:14.6%;width:83.4%;aspect-ratio:3/1;color:#f4f8ff;font-weight:700;text-align:left;transition:transform .18s ease,filter .18s ease}
.ca-button img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
#caValue{position:absolute;left:6.2%;right:24%;top:50%;transform:translateY(-50%);font-size:clamp(9px,1vw,19px);line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 1px rgba(0,0,0,.26)}
.ca-button:hover{transform:translateY(-.18vw) scale(1.018);filter:brightness(1.04)}
.ca-button.copied{animation:copyPop .42s ease}
.action-row{position:absolute;left:8.5%;top:45.8%;width:83.1%;display:flex;justify-content:space-between;align-items:center;gap:2.5%}
.action-btn{position:relative;width:48.7%;aspect-ratio:3/1;transform-origin:center;transition:transform .18s ease,filter .18s ease;animation:gentlePulse 3.6s ease-in-out infinite}
.action-btn.dex{animation-delay:.5s}
.action-btn img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 .4vw .5vw rgba(0,0,0,.14));pointer-events:none;user-select:none}
.action-btn:hover{transform:translateY(-.22vw) scale(1.04);filter:brightness(1.05)}
.action-btn:active,.ca-button:active{transform:scale(.985)}
.panel-meta{position:absolute;bottom:13%;color:#12253b;font-weight:800;letter-spacing:.02em;line-height:.98;text-shadow:0 1px 0 rgba(255,255,255,.15)}
.panel-meta.left{left:12.8%;font-size:clamp(8px,1vw,18px)}
.panel-meta.right{right:10.8%;text-align:center;font-size:clamp(7px,.77vw,14px)}
.disabled{opacity:.55;pointer-events:none;filter:saturate(.7)}
.mobile-controls{display:none!important}
@keyframes panelFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-.35vw)}}
@keyframes gentlePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}
@keyframes copyPop{0%{transform:scale(1)}50%{transform:scale(1.025)}100%{transform:scale(1)}}
@media (max-width:900px){.ui-panel{left:55.6%;top:60.2%;width:30.5%}}
@media (max-width:700px){body{overflow:auto}.site{grid-template-rows:auto auto;align-content:start;justify-items:center;overflow:visible;padding:8px 0 18px;min-height:100dvh;height:auto}.scene{width:100vw;max-width:100vw;height:auto}.ui-panel{display:none}.mobile-controls{display:flex!important;flex-direction:column;gap:10px;width:min(94vw,560px);margin-top:12px;padding:14px;border-radius:18px;background:rgba(10,39,74,.9);box-shadow:0 10px 30px rgba(0,0,0,.24);color:#fff}.mobile-token{font-size:20px;font-weight:800;display:flex;justify-content:space-between;align-items:center}.mobile-token span{opacity:.82}.mobile-ca{position:relative;border:0;background:transparent;padding:0;cursor:pointer;width:100%;aspect-ratio:3/1}.mobile-ca img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}#mobileCaValue{position:absolute;left:5%;right:22%;top:50%;transform:translateY(-50%);color:#f5f9ff;font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mobile-actions a{display:block;transition:transform .18s ease,filter .18s ease}.mobile-actions a:hover{transform:translateY(-2px)}.mobile-actions a img{width:100%;height:auto;display:block}}
