:root{color:#f4ecff;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--nav-height:0px;--gold:#ffcb80;--accent:#ce9aff;background:#100c19;font-family:Inter,Arial,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{padding-top:var(--nav-height)}#app{height:calc(100dvh - var(--nav-height))}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:#271a38;border:1px solid #8c6caf65;border-radius:9px;min-height:38px}button:disabled{cursor:default;opacity:.48}button:focus-visible{outline-offset:2px;outline:3px solid #ffce82}button:not(:disabled):hover{filter:brightness(1.18)}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}.observatory{background:linear-gradient(#170e2670,#100b1ba0),url(/demos/obsidian-drop/assets/world-MlMhvr8q.webp) 50%/cover;grid-template-rows:56px minmax(0,1fr) 64px 82px;max-width:1500px;height:100%;margin:auto;display:grid;position:relative}header{z-index:2;background:#100c1bcc;border-bottom:1px solid #b585cf33;align-items:center;gap:16px;padding:8px 24px;display:flex}header .wordmark{letter-spacing:1px;color:#dfc6ff;text-shadow:0 2px 2px #000;white-space:nowrap;font:700 clamp(18px,2.5vw,27px)/1 Georgia,serif}.wordmark b{color:#ffd088}header>span{color:#cbb5db;flex:1;font-size:12px}header button{width:38px;font-size:23px}.chamber{grid-template-columns:minmax(0,1fr) 210px;gap:12px;min-height:0;padding:6px 24px 0;display:grid}.drop-zone{grid-template-rows:26px minmax(0,1fr) 36px;min-height:0;display:grid}.flight-caption{color:#f3dcb8;justify-content:space-between;align-items:center;gap:8px;width:100%;max-width:810px;margin:auto;font-size:13px;font-weight:700;display:flex}.flight-caption small{letter-spacing:1px;color:#c4aed4;font:700 10px Arial}.board-wrap{width:100%;max-width:840px;height:100%;min-height:0;margin:auto;position:relative}canvas{width:100%;height:100%;display:block}#pockets{grid-template-columns:repeat(13,minmax(0,1fr));gap:3px;height:30px;display:grid;position:absolute;bottom:0;left:2.2%;right:2.2%}#pockets button{color:#ffefd9;background:color-mix(in srgb,#6540a0 calc(100% - var(--heat)*70%),#f08b2d);border-color:#d5a77955;border-radius:3px 3px 8px 8px;min-height:0;padding:0;font-size:clamp(10px,1.2vw,14px);font-weight:800;box-shadow:0 3px #090713}#pockets .landed{color:#281832;background:#ffd693;animation:.55s ease-out land;box-shadow:0 0 18px #fba34c}#pockets .selected{outline-offset:1px;outline:2px solid #fff}.pocket-info{color:#d2bfe1;justify-content:center;align-items:center;gap:10px;font-size:12px;display:flex}.pocket-info b{color:#ffdb9f;font-size:18px}.pocket-info button{text-underline-offset:3px;background:0 0;border:0;font-size:10px;text-decoration:underline}.lab{flex-direction:column;min-height:0;display:flex;position:relative}.profile-heading{letter-spacing:2px;color:#c9b0dd;margin:6px 0 8px;font-size:10px}#profiles{z-index:1;flex-direction:column;gap:6px;display:flex}#profiles button{text-align:left;background:linear-gradient(110deg,#382048e8,#151326f5);grid-template-columns:25px 1fr auto;align-items:center;column-gap:5px;padding:8px 11px;display:grid}#profiles i{color:#bd8cfa;grid-row:span 2;font-style:normal}#profiles b{font-family:Georgia;font-size:18px}#profiles span{color:#ccbedb;font-size:11px}#profiles small{color:#ceadc0;grid-column:2/4;font-size:9px}#profiles [aria-pressed=true]{background:linear-gradient(110deg,#744023,#22182d);border-color:#ffd08b;box-shadow:inset 3px 0 #ffd18c}#profiles [aria-pressed=true] i{color:#ffc87c}.scientist{pointer-events:none;flex-direction:column;flex:1;justify-content:flex-end;align-items:center;min-height:0;display:flex;position:relative}.scientist img{object-fit:contain;object-position:bottom;filter:drop-shadow(0 0 18px #a953db33);max-width:125%;height:95%;animation:5s ease-in-out infinite breathe;position:absolute;bottom:10px}.scientist strong,.scientist span{z-index:1;text-shadow:0 2px 6px #000;background:#170e209c;padding:3px 12px}.scientist strong{letter-spacing:2px;font:700 12px Georgia}.scientist span{letter-spacing:2px;font-size:8px}.result{background:linear-gradient(90deg,#0000,#351f43b0,#0000);border-top:1px solid #c295d535;border-bottom:1px solid #c295d535;justify-content:center;align-items:center;gap:16px;margin:0 24px;display:flex}.result>span{color:#e5cff5;font:700 16px Georgia}.result>b{color:#ffdc99;font-variant-numeric:tabular-nums;font-size:32px}.result small{color:#d0bedc;font-size:12px}footer{background:#110c1ce6;justify-content:center;align-items:center;gap:35px;padding:8px 20px;display:flex}footer small{letter-spacing:1.3px;color:#c3add4;margin-bottom:5px;font-size:9px;display:block}footer b{font-variant-numeric:tabular-nums;font-size:23px}.stake{text-align:center}.stake span{align-items:center;gap:13px;display:flex}.stake button{border-radius:50%;width:34px;min-height:34px;font-size:20px}.primary{color:#28142c;letter-spacing:.7px;background:linear-gradient(125deg,#ffe2ad,#fba452);border:1px solid #ffddba;padding:16px 24px;font-size:15px;font-weight:900;box-shadow:0 4px #7c452d}#speed{min-width:82px;padding:9px;font-size:10px}.intro{z-index:8;background:#130e20;grid-template-columns:minmax(0,1.75fr) minmax(260px,1fr);display:grid;position:absolute;inset:0}.intro-art{background:#170d24;align-items:center;min-height:0;display:flex;overflow:hidden}.intro-art img{object-fit:contain;width:100%;height:100%}.intro-copy{background:radial-gradient(at top,#4a2355,#110c1b);flex-direction:column;justify-content:center;gap:16px;padding:30px;display:flex}.intro-copy h1{color:#ffdeb0;margin:0;font:700 clamp(25px,3.1vw,44px)/1.12 Georgia}.intro-copy p{color:#cdb9db;margin:0;font-size:15px;line-height:1.6}.intro-copy small{color:#c4aed3;font-size:10px;line-height:1.5}.intro-copy .primary{margin:8px 0}.intro-copy small:first-child{letter-spacing:1px;color:#e0b0f9}dialog{color:#efdeff;background:#1d142c;border:1px solid #9664b8;border-radius:15px;width:min(660px,94vw);max-height:90dvh;padding:30px;overflow:auto;box-shadow:0 24px 90px #0009}dialog::backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#08040fc9}dialog h2{color:#ffdc9d;max-width:90%;font:700 26px Georgia}dialog p{color:#d1c0de;font-size:14px;line-height:1.7}dialog .close{width:34px;font-size:22px;position:absolute;top:12px;right:12px}.rules-table{overflow-x:auto}table{text-align:center;border-collapse:collapse;width:100%;font-size:13px}td,th{border-bottom:1px solid #63496f66;padding:7px}th{color:#ffd291}summary{cursor:pointer;font-size:12px}body .demo-navigation{background:#100c1b}@keyframes breathe{50%{transform:translateY(-3px)}}@keyframes land{0%{filter:brightness(2);transform:translateY(7px)}50%{transform:translateY(-4px)}to{transform:translateY(0)}}@media (height<=620px) and (width>=641px){.observatory{grid-template-rows:44px minmax(0,1fr) 44px 66px}.chamber{grid-template-columns:minmax(0,1fr) 175px;padding:3px 18px 0}.drop-zone{grid-template-rows:22px minmax(0,1fr) 30px}header{padding:4px 18px}header button{height:32px;min-height:32px}#profiles button{min-height:39px;padding:5px 8px}#profiles b{font-size:15px}#profiles small{font-size:8px}.profile-heading{margin:3px 0 5px}footer{gap:25px;padding:5px 18px}.primary{padding:12px 18px;font-size:12px}.result b{font-size:26px}.result>span{font-size:14px}.result small{font-size:11px}footer b{font-size:21px}#pockets{height:25px}.scientist strong{font-size:10px}.scientist span{display:none}.intro-copy{gap:12px;padding:22px}}@media (width<=640px){.observatory{grid-template-rows:48px minmax(0,1fr) 76px 126px}header{gap:8px;padding:8px 12px}header>span{display:none}header .wordmark{flex:1;font-size:22px}header button{width:32px;height:32px;min-height:32px}.chamber{flex-direction:column-reverse;gap:8px;padding:8px 8px 0;display:flex}.lab{flex:none}.profile-heading,.scientist{display:none}#profiles{flex-direction:row;gap:5px}#profiles button{flex:1;grid-template-columns:1fr auto;column-gap:4px;min-width:0;padding:7px}#profiles i{display:none}#profiles b{font-size:17px}#profiles small{grid-column:1/3;font-size:9px}#profiles span{font-size:10px}.drop-zone{flex:1;grid-template-rows:28px minmax(0,1fr) 36px}.flight-caption{padding:0 4px;font-size:12px}.flight-caption small{font-size:9px}.board-wrap{max-width:480px}#pockets{gap:2px;height:29px;left:1%;right:1%}#pockets button{font-size:10px}.pocket-info{gap:7px;font-size:10px}.pocket-info b{font-size:17px}.pocket-info button{font-size:9px}.result{grid-template-columns:auto auto;align-content:center;gap:2px 13px;margin:0 8px;display:grid}.result>span{font-size:14px}.result b{font-size:30px}.result small{text-align:center;grid-column:1/3;font-size:12px}.result b:empty{display:none}footer{grid-template-columns:1fr 1.1fr .6fr;gap:8px 12px;padding:8px 14px;display:grid}footer>div:first-child{grid-column:1}footer .stake{grid-area:1/2/auto/4}footer #drop{grid-area:2/1/auto/3;padding:11px 8px}footer #speed{grid-area:2/3;min-width:0;font-size:9px}footer b{font-size:21px}footer small{font-size:9px}.stake span{justify-content:center;gap:12px}.intro{grid-template-rows:minmax(0,1.12fr) minmax(245px,1fr);grid-template-columns:1fr}.intro-art img{object-fit:contain}.intro-copy{text-align:center;gap:11px;padding:20px 25px}.intro-copy h1{font-size:30px}.intro-copy p{font-size:14px}.intro-copy .primary{margin:0}.intro-copy small{font-size:9px}dialog{padding:24px 18px}dialog h2{font-size:23px}dialog p{font-size:13px}}@media (height<=430px) and (width>=641px){.observatory{grid-template-rows:36px minmax(0,1fr) 34px 55px}.chamber{grid-template-columns:minmax(0,1fr) 150px}.drop-zone{grid-template-rows:18px minmax(0,1fr) 24px}.flight-caption{font-size:11px}.flight-caption small{font-size:8px}.pocket-info{font-size:10px}.pocket-info b{font-size:15px}#pockets{height:21px}#pockets button{font-size:10px}footer b{font-size:17px}footer small{margin-bottom:2px;font-size:8px}.primary{padding:9px 12px}.scientist{display:none}#profiles button{min-height:34px;padding:3px 6px}.result>b{font-size:23px}.result>span{font-size:12px}.intro-copy h1{font-size:25px}.intro-copy p{font-size:12px}.intro-copy{gap:7px;padding:16px}header .wordmark{font-size:20px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.demo-navigation{z-index:100;background:#0c1120;border-bottom:1px solid #ffffff20;justify-content:space-between;align-items:center;height:44px;padding:0 16px;font:600 14px/1 system-ui,sans-serif;display:flex;position:fixed;inset:0 0 auto}.demo-navigation a{color:#f4e5b8;letter-spacing:.04em;align-items:center;min-width:44px;min-height:44px;text-decoration:none;display:inline-flex}.demo-navigation a:hover{color:#fff}.demo-navigation a:focus-visible{outline-offset:-4px;outline:2px solid #f4e5b8}.has-demo-navigation .cabinet{top:calc(50% + 22px)}.has-demo-navigation.fluid-demo #app{height:calc(100dvh - 44px);margin-top:44px}.has-demo-navigation.fluid-demo .cabinet{width:min(100vw,177.778dvh - 78.2222px);height:min(100dvh - 44px,56.25vw);top:auto}@media (width<=620px) and (orientation:portrait){.has-demo-navigation.fluid-demo .cabinet{width:100vw;height:calc(100dvh - 44px)}}