:root{--retro-gray:#ccc;--retro-gray-dim:#888;--retro-green:#3f3;--retro-green-dim:#1ec21e;--retro-amber:#fc0;--retro-bg:#000;--retro-border:#333;--panel-bg:#14141480;--font-primary:"Space Grotesk", sans-serif;--font-mono:"Courier New", Courier, monospace;--font-content-header:"Permanent Marker", sans-serif;--font-content:"Space Grotesk", sans-serif}@font-face{font-family:AppleII;src:url(/emulator/assets/PrintChar21.woff2)format("woff2")}body{background-color:var(--retro-bg);color:var(--retro-gray);font-family:var(--font-primary);min-height:100vh;margin:0;padding:0;overflow-x:hidden}h1{font-size:1.5em}h2{font-size:1.1em}#root{min-height:100vh;position:relative}.crt-overlay{pointer-events:none;z-index:1000;background:linear-gradient(#12101000 50%,#0000001a 50%) 0 0/100% 2px,linear-gradient(90deg,#ff000008,#00ff0003,#0000ff08) 0 0/3px 100%;width:100%;height:100%;position:fixed;top:0;left:0}.crt-flicker{animation:.15s infinite flicker}@keyframes flicker{0%{opacity:.98}5%{opacity:.97}10%{opacity:.95}15%{opacity:.97}20%{opacity:.99}to{opacity:1}}.background{aspect-ratio:1280/1363;opacity:.4;-webkit-mask-composite:source-in;z-index:-1;background-image:url(/assets/Grid-JEKPd4xh.jpg);background-repeat:no-repeat;background-size:contain;width:800px;position:absolute;top:300px;left:50%;transform:translate(-50%);-webkit-mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000),linear-gradient(#0000,#000 5% 80%,#0000);mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000),linear-gradient(#0000,#000 5% 80%,#0000);-webkit-mask-composite:source-in;mask-composite:intersect}.app-container{box-sizing:border-box;flex-direction:column;gap:2rem;width:640px;min-height:100vh;margin:0 auto;padding:2rem;display:flex;position:relative}.sidebar{flex-direction:column;gap:1rem;display:flex}.logo-container{position:relative}.logo-container img{filter:drop-shadow(0 0 15px #33ff334d);width:280px;height:auto}.retro-nav{flex-direction:column;gap:.25rem;display:flex}.nav-button{color:var(--retro-gray);cursor:pointer;text-align:left;text-transform:capitalize;background:0 0;border:none;border-left:3px solid #0000;padding:.4rem 0 .4rem 1rem;font-size:1.2rem;transition:all .2s}.nav-button:hover{color:var(--retro-green);border-left-color:var(--retro-green-dim)}.nav-button.active{color:var(--retro-green);border-left-color:var(--retro-green);background:linear-gradient(90deg,#33ff331a,#0000)}.github-link{color:var(--retro-gray);align-items:center;padding-top:.4rem;padding-left:calc(1rem + 3px);text-decoration:none;transition:color .2s;display:flex}.github-link:hover{color:#fff}.github-icon{fill:currentColor;width:1.8rem;height:1.8rem}.emulator-section{flex-direction:column;align-items:flex-start;display:flex;position:relative}.emulator-screen{aspect-ratio:720/494;z-index:20;width:100%;max-width:720px;height:auto;position:relative;overflow:hidden;box-shadow:0 0 30px #00000080}.emulator-screen iframe{border:none;width:100%;height:100%}.extended-bars{z-index:10;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAA9KBAMAAAB+7FP8AAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAAwUExURf///yMfICMfIHIgI8EgJntQJNOAKJCEEP3pAFpSGDpDKX+wQlFoMQqa1xZdfP///5tjKu8AAAACdFJOUwCAmytOGAAAAAFiS0dEAIgFHUgAAAAJcEhZcwABGJMAARiTARnp7AoAAAAHdElNRQfqAx0BFSnqHXOZAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDI2LTAzLTI4VDIyOjIyOjI1KzAwOjAwt6KFkwAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyNi0wMy0yOFQyMjoyMjoyNSswMDowMMb/PS8AAAAodEVYdGRhdGU6dGltZXN0YW1wADIwMjYtMDMtMjlUMDE6MjE6NDErMDA6MDC6MbOVAAAAEGNhTnYAABAAAAAPSgAADawAAAAAhnqonQAAAGNJREFUWMPt10EVQEAUhtEXYSKIIIIIIogggggiiCCCCCKIYmHlDLsZNvd+Ff7zznkRAC9SNMVqo5Oyyi3sqT4GKavu6q7GmKRbc+XNLbFKWdsH926Xso6CC0t/P0QAAACUcgJLJ+E/QjlgUAAAAABJRU5ErkJggg==);background-repeat:repeat-x;background-size:1px 100%;width:200vw;height:268px;position:absolute;top:0;left:270px}.emulator-controls{justify-content:space-between;align-items:center;width:90%;max-width:720px;margin-top:1rem;margin-left:5%;display:flex}.hardware-buttons{gap:1rem;display:flex}.retro-button{text-transform:uppercase;letter-spacing:.1em;color:#b8b8b8;cursor:pointer;background:#333;border:2px solid #555;border-left-width:3px;padding:.5rem 1.5rem;font-family:sans-serif;font-size:.8rem;font-weight:700}.retro-button:hover{filter:brightness(1.2)}.retro-button:active{transform:translate(2px,2px);box-shadow:1px 1px #000}.retro-button.power{border-left-color:red}.retro-button.reset{border-left-color:#ff0}.retro-button.samples-trigger{border-left-color:#08f}.content-area-panel{background:var(--panel-bg);-webkit-backdrop-filter:blur(12px);border-radius:4px;flex:1;max-width:100%;padding:1rem 3rem}.content-area-panel h1{color:var(--retro-amber);font-family:var(--font-content-header);margin-top:1rem;font-size:2rem}.content-area-panel h2,.content-area-panel h3{color:var(--retro-green)}.page-content{font-size:1rem;line-height:1.6}.page-content code{font-family:var(--font-mono);background-color:var(--retro-gray);color:#000;border-radius:2px;padding:0 .3rem}.page-content a{color:var(--retro-green);text-decoration:none}.page-content .note{border-left:4px solid var(--retro-amber);background:#ffcc001a;margin:1rem 0;padding:1rem}.page-content .code{border-left:4px solid var(--retro-green);font-family:var(--font-mono);background:#8080801a;margin:1rem 0;padding:1rem}.main-content{flex-direction:column;flex:1;display:flex}.modal-overlay{z-index:2000;background:#000c;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.sample-browser{border:2px solid var(--retro-amber);background:#111;flex-direction:column;width:500px;max-height:600px;display:flex}.sample-browser-header{border-bottom:1px solid #333;justify-content:space-between;align-items:center;padding:1rem;display:flex}.sample-browser-header h1{color:var(--retro-amber);margin:0}.close-button{color:#888;cursor:pointer;background:0 0;border:none;font-size:1.5rem}.sample-list{flex:1;overflow-y:auto}.sample-item{cursor:pointer;border-bottom:1px solid #222;padding:1rem;transition:background .2s}.sample-item:hover{background:#333}.sample-item h2{color:var(--retro-green);margin:0}.sample-item p{color:var(--retro-gray);margin:.5rem 0 0;font-size:.9rem}footer{color:var(--retro-gray-dim);text-align:center;margin-top:auto;padding-top:2rem;font-size:.9rem}footer p{margin:.2rem 0}.attribution{color:var(--retro-gray-dim);text-align:center;width:100%;max-width:720px;margin-top:1.5rem;font-size:.9rem}.attribution a{color:var(--retro-gray);text-decoration:none}.attribution a:hover{text-decoration:underline}@media (width>=768px){.app-container{grid-template-rows:auto 1fr auto;grid-template-columns:repeat(3,1fr);width:768px;display:grid}.background{width:960px;top:200px}.sidebar{grid-area:1/1;padding-right:2rem}.emulator-section{grid-area:1/2/auto/span 2}.emulator-screen{margin-top:20px}.main-content{grid-area:2/1/auto/span 3}.app-footer{grid-area:3/1/auto/span 3}footer{margin-top:2rem}}@media (width>=1024px){.app-container{width:1024px}.background{width:1280px;top:100px}}