.floating-orb{position:absolute!important;width:50px;height:50px;display:flex;align-items:center;justify-content:center;color:var(--color-text, #333);font-family:Courier New,monospace;font-weight:700;font-size:.9em;cursor:pointer;transition:none;-webkit-user-select:none;user-select:none;border:2px solid var(--color-text, #333);background:var(--color-background-neutral, #f5f5f5);box-shadow:inset 1px 1px #fffc,inset -1px -1px #0000004d,2px 2px #0003}.floating-orb:hover{background:#ffffff1a}.floating-orb:active{transform:translate(1px,1px);box-shadow:inset -1px -1px #fffc,inset 1px 1px #0000004d,1px 1px #0003}.component-store{width:100%;overflow:hidden}.items-grid{display:flex;flex-wrap:wrap;flex-direction:row;gap:.2em;flex:1;overflow:hidden;justify-content:center;max-height:80px}.store-item{display:flex;flex-direction:column;align-items:center;padding:6px 4px;cursor:pointer;transition:all .3s ease;position:relative}.item-visual{height:24px;display:flex;align-items:center;justify-content:center;margin-bottom:4px}.item-image{height:24px;width:auto;filter:brightness(.7) saturate(.8);transition:all .3s ease}.item-image.on{filter:brightness(1.2) saturate(1.6) drop-shadow(0px 0px 4px rgba(255,220,100,.5))}.item-emoji{font-size:18px;opacity:.6;transition:all .3s ease;filter:grayscale(1)}.item-emoji.active{opacity:1;filter:grayscale(0);transform:scale(1.1)}.features-section{width:100%;max-width:1200px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;padding:0 20px}@media screen and (max-width: 768px){.features-grid{grid-template-columns:1fr;gap:20px;padding:0 10px}}.feature-card-wrapper{position:relative}.feature-card{background:var(--color-background-neutral);border:2px solid var(--color-text);padding:20px;position:relative;overflow:visible;transition:none;min-height:150px;box-shadow:inset 1px 1px #ffffff80,inset -1px -1px #0000004d,2px 2px #0003}.feature-card:hover{transform:translate(1px,1px);box-shadow:inset 1px 1px #ffffff80,inset -1px -1px #0000004d,1px 1px #0003}.feature-card.coming-soon{opacity:.8;border:2px dashed var(--color-text-translucent);background:var(--color-background-neutral) repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(0,0,0,.05) 10px,rgba(0,0,0,.05) 20px)}.feature-card.coming-soon .coming-soon-badge{font-size:.7em;background:var(--color-text);color:var(--color-background-neutral);padding:2px 4px;border:1px solid var(--color-text);margin-left:8px}.feature-card:before{content:"";position:absolute;top:0;left:0;right:0;height:20px;background:linear-gradient(to bottom,#f0f0f0,#d0d0d0);border-bottom:1px solid var(--color-text)}@media (prefers-color-scheme: dark){.feature-card:before{background:linear-gradient(to bottom,#404040,#202020)}}.feature-card h3{margin:12px 0 8px;font-size:1.1em;font-weight:700;text-transform:uppercase;letter-spacing:1px}.feature-card p{margin:0 0 16px;font-size:.85em;line-height:1.3}.interactive-elements{min-height:80px}.shared-elements-container{position:relative;width:100%;height:100%}.sync-indicator{position:absolute;bottom:4px;left:2px;padding:2px 6px;font-size:.6em;z-index:10}.portal-window{position:absolute;right:-40px;width:160px;height:120px;border:2px solid var(--color-text, #333);background:var(--color-background-neutral, #f5f5f5);z-index:10;box-shadow:inset 1px 1px #fffc,inset -1px -1px #0000004d,2px 2px 4px #0000004d}.portal-header{display:flex;align-items:center;justify-content:space-between;padding:2px 4px;background:linear-gradient(to bottom,#f0f0f0,#d0d0d0);border-bottom:1px solid var(--color-text, #333);min-height:12px}@media (prefers-color-scheme: dark){.portal-header{background:linear-gradient(to bottom,#404040,#202020)}}.portal-controls{display:flex;gap:2px}.portal-controls .control-dot{width:4px;height:4px;border-radius:50%}.portal-controls .control-dot.red{background:#ff5f57}.portal-controls .control-dot.yellow{background:#ffbd2e}.portal-controls .control-dot.green{background:#28ca42}.portal-url{font-size:.5em;color:var(--color-text, #333);opacity:.8}.portal-content{padding:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;height:calc(100% - 16px);text-align:center}.orb-1{top:-15px;right:20px;z-index:10}.orb-2{top:60px;right:-20px;z-index:10}.orb-3{bottom:20px;right:50px;z-index:10}.fire-hydrant{transition:transform .2s ease-in-out}.fire-hydrant:hover{transform:scale(1.05)}.example-roulette{margin:2rem 0;display:flex;flex-direction:column;gap:0}.example-roulette h2{margin:0 0 .5rem;font-family:Carter One;color:var(--color-text-accent)}.example-roulette .example-slot{position:relative;width:100%;transition:transform .6s ease,opacity .3s ease;max-width:calc(100% - 25px)}.example-roulette .example-slot.spinning{opacity:.6;transform:scale(.98)}.example-roulette .slot-handle{position:absolute;right:-45px;top:40%;transform:translateY(-50%);transform-origin:bottom center;width:50px;height:auto;cursor:pointer;filter:drop-shadow(2px 2px 4px rgba(0,0,0,.3));transition:transform .2s cubic-bezier(.34,1.56,.64,1);z-index:10}.example-roulette .slot-handle:hover{filter:drop-shadow(2px 2px 8px rgba(0,0,0,.5))}.example-roulette .slot-handle.pulling{transform:translateY(-50%) translateY(40px)}.example-roulette .browser-window{background:#fff;border:1px solid var(--color-text-translucent);border-radius:6px;overflow:hidden;box-shadow:0 2px 8px #0000001a,inset 0 0 0 1px #ffffff80}.example-roulette .browser-chrome{background:linear-gradient(to bottom,#e6e6e6,#d2d2d2);border-bottom:1px solid #bbb;padding:8px 12px;display:flex;align-items:center;gap:12px}@media (prefers-color-scheme: dark){.example-roulette .browser-chrome{background:linear-gradient(to bottom,#3c3c3c,#282828);border-bottom:1px solid #555}}.example-roulette .browser-dots{display:flex;gap:6px;flex-shrink:0}.example-roulette .browser-dots .dot{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.2);box-shadow:inset 0 1px 2px #0003}.example-roulette .browser-dots .dot.red{background:linear-gradient(to bottom,#ff6057,#e74c3c)}.example-roulette .browser-dots .dot.yellow{background:linear-gradient(to bottom,#ffbd2e,#f39c12)}.example-roulette .browser-dots .dot.green{background:linear-gradient(to bottom,#28ca41,#27ae60)}.example-roulette .browser-url{flex:1;background:#fff;border:1px solid #ccc;border-radius:4px;padding:4px 12px;font-size:.85em;box-shadow:inset 0 1px 2px #0000000d;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (prefers-color-scheme: dark){.example-roulette .browser-url{background:#323232;border-color:#555;color:#ddd}}.example-roulette .browser-url a{text-decoration:none;color:var(--color-text-link);transition:opacity .2s ease}.example-roulette .browser-url a:hover{opacity:.7}.example-roulette .browser-url a span{font-family:Play,sans-serif}.example-roulette .example-frame{width:100%;height:400px;border:none;background:#fff;display:block}.example-roulette .example-info{display:grid;grid-template-columns:1fr 1fr}.example-roulette .example-info p{margin:.5rem 0;color:var(--color-text);max-width:250px}.example-roulette .example-info p:last-child{text-align:right;margin-left:auto;color:var(--color-text-translucent)}.example-roulette .all-examples{margin-top:1.5rem;width:100%;max-width:700px}.example-roulette .all-examples summary{cursor:pointer;text-align:center;padding:.5rem;color:var(--color-text-link);list-style-position:inside}.example-roulette .all-examples summary:hover{text-decoration:underline}.example-roulette .all-examples ul{margin-top:1rem;padding-left:2rem}.example-roulette .all-examples ul li{margin:.5rem 0}