@font-face{font-family:DM;src:url('../buddy_arrival_02/assets/fonts/dm-sans-latin.woff2') format('woff2');font-display:swap}
@font-face{font-family:Instrument;src:url('../buddy_arrival_02/assets/fonts/instrument-serif-italic-latin.woff2') format('woff2');font-style:italic;font-display:swap}
:root{font-family:DM,system-ui,sans-serif;color:#eeeaf7;background:#080b13;color-scheme:dark}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #bbf4dd;outline-offset:4px}[hidden]{display:none!important}
main{max-width:1280px;margin:0 auto;min-height:100svh;padding:24px 42px 30px;display:flex;flex-direction:column}
header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;min-height:50px}header>a{font-size:12px;color:#a4acbd;justify-self:start}h1{font-size:24px;font-weight:400;letter-spacing:-.035em;margin:0}h1 em{font-family:Instrument,serif;color:#c4e6de}.signature{justify-self:end;color:#b9cece;font-size:24px}
.stage{position:relative;min-height:440px;height:calc(100svh - 235px);max-height:770px;isolation:isolate}.halo{position:absolute;inset:6% 6% 3%;z-index:-1;background:radial-gradient(ellipse at 50% 49%,#8477ae12,transparent 57%)}#buddy-stage{width:100%;height:calc(100% - 56px);display:block;touch-action:pan-y}.stage-caption{position:absolute;bottom:13px;left:0;right:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px}.stage-caption>span{color:#7e899b;font-size:10px;letter-spacing:.15em}h2{font-size:23px;font-weight:400;letter-spacing:-.025em;margin:0}#play{justify-self:end;display:flex;gap:10px;align-items:center;border:1px solid #c4d6e126;border-radius:30px;padding:10px 17px;background:#c4d6e107;font-size:11px;color:#c8d4e5}#play[aria-pressed=true]{background:#c0e8db13;border-color:#b2edcf4d}#play:disabled{opacity:.5;cursor:default}
.shape-options{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.shape-options button{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;background:#11131d;border:1px solid #cac7eb13;border-radius:14px;padding:5px 5px 13px;transition:background .2s,border-color .2s}.shape-options button:hover{background:#1b1c2b;border-color:#cac7eb44}.shape-options button[aria-pressed=true]{background:#252231;border-color:#d2c2f084;box-shadow:inset 0 0 24px #cabbed07}.shape-options canvas{width:100%;height:70px;display:block}.shape-options span{font-size:11px;white-space:nowrap;color:#d8d2e2}#error{position:absolute;left:10%;right:10%;top:42%;text-align:center;color:#ffd2d9}
@media(max-width:700px){main{padding:16px 18px 24px}header{grid-template-columns:auto 1fr;gap:14px}header>a{font-size:10px}h1{justify-self:end;font-size:19px}.signature{display:none}.stage{min-height:360px;height:calc(100svh - 308px)}.stage-caption{bottom:12px}h2{font-size:20px}#play{padding:9px 13px;font-size:10px}.stage-caption>span{font-size:8px}.shape-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.shape-options canvas{height:57px}.shape-options button{padding-bottom:10px;gap:2px}.shape-options span{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.dimension-switch{justify-self:end;display:flex;gap:3px;padding:3px;border:1px solid #c4d6e126;border-radius:30px;background:#12131f}.dimension-switch button{border:0;border-radius:22px;background:transparent;padding:7px 13px;font-size:11px;color:#9f9bae}.dimension-switch button[aria-pressed=true]{background:#d2c2f0;color:#201b2b}.turn-tools{position:absolute;left:0;right:0;top:10px;display:flex;justify-content:space-between;align-items:center;z-index:2;pointer-events:none}.turn-tools span{font-size:10px;color:#7e899b}.turn-tools button{pointer-events:auto;background:transparent;border:1px solid #c4d6e11f;border-radius:20px;padding:7px 12px;font-size:10px;color:#aab4c6}html[data-view=3d] #buddy-stage{cursor:grab;touch-action:none}html[data-view=3d] #buddy-stage:active{cursor:grabbing}
@media(max-width:700px){header{grid-template-columns:auto 1fr auto;gap:9px}h1{font-size:16px}.dimension-switch button{padding:6px 10px;font-size:10px}.turn-tools span{font-size:9px}.turn-tools button{font-size:9px;padding:6px 9px}}

html[data-view=3d] .shape-options{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:1050px){html[data-view=3d] .shape-options{grid-template-columns:repeat(4,minmax(0,1fr))}html[data-view=3d] .shape-options span{white-space:normal;text-align:center}}

@media(max-width:1050px){html[data-view=3d] .shape-options [data-shape=folded-globe]{grid-column:2}html[data-view=3d] .shape-options [data-shape=lotus]{grid-column:3}}