@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#080d0d;--surface:#111818;--surface-2:#182020;--surface-3:#202929;--border:#2e3a38;--text:#eef2e8;--muted:#87968f;--accent:#c6f15d;--accent-low:rgba(198,241,93,.13);--warm:#f79c6b;--shadow:rgba(0,0,0,.5);--radius:16px;--mono:'IBM Plex Mono',ui-monospace,monospace;--display:'Space Grotesk',Arial,sans-serif;--body:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}body{padding:0;margin:0;background:var(--bg);color:var(--text);font-family:var(--body);height:100dvh;overflow:hidden}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}::selection{background:var(--accent);color:#101410}.hidden{display:none!important}.eyebrow,.tiny-label{font:600 10px/1.5 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.grain{position:fixed;z-index:20;inset:0;pointer-events:none;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.2' filter='url(%23n)'/%3E%3C/svg%3E")}.backdrop{position:absolute;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 55% 52%,#15201d 0%,#080d0d 62%)}.backdrop:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(180deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(180deg,transparent 5%,black 45%,black 100%)}.glow{position:absolute;border-radius:50%;filter:blur(110px);opacity:.24}.glow-one{height:490px;width:640px;top:8%;right:6%;background:#76a259}.glow-two{height:380px;width:280px;right:40%;bottom:-150px;background:#497d70;opacity:.17}.horizon{position:absolute;bottom:-20%;width:130%;height:65%;left:-15%;transform:perspective(440px) rotateX(65deg);background:linear-gradient(90deg,rgba(156,197,104,.08) 1px,transparent 1px),linear-gradient(0deg,rgba(156,197,104,.07) 1px,transparent 1px);background-size:92px 92px;mask-image:linear-gradient(0deg,black,transparent 87%)}body[data-wallpaper="solid"] .backdrop{background:#0a1010}body[data-wallpaper="solid"] .backdrop:after,body[data-wallpaper="solid"] .horizon{display:none}body[data-wallpaper="aurora"] .backdrop{background:radial-gradient(ellipse at 73% 65%,#1a3636 0%,#101b22 36%,#080d0d 74%)}body[data-theme="amber"]{--accent:#ffbc74;--accent-low:rgba(255,188,116,.15)}body[data-theme="ice"]{--accent:#86dfec;--accent-low:rgba(134,223,236,.15)}.menubar{height:48px;position:relative;z-index:40;border-bottom:1px solid rgba(220,255,232,.10);display:flex;align-items:center;padding:0 24px;gap:20px;background:rgba(7,13,13,.8);backdrop-filter:blur(22px)}.menubar-brand{border:0;background:none;color:var(--text);display:flex;align-items:center;gap:8px;letter-spacing:.06em;font:600 12px var(--mono);padding:10px 0}.menubar-brand b{font-weight:700}.brand-symbol{color:var(--accent);font:26px var(--display);line-height:1}.brand-slash{color:#546159}.chevron{color:#84938a;margin-left:6px}.menubar-separator{height:15px;border-left:1px solid #39443e}.menubar-project{font:9px var(--mono);letter-spacing:.13em;color:#75847d}.menubar-right{display:flex;gap:22px;align-items:center;margin-left:auto}.status-signal{font:9px var(--mono);letter-spacing:.1em;color:#aebdb3;display:flex;align-items:center;gap:8px}.status-signal i{height:6px;width:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}.clock{font:11px var(--mono);min-width:76px;text-align:right}.icon-menu-btn{border:0;background:none;color:#dbe6dd;display:flex;align-items:center;padding:5px}.icon-menu-btn svg{width:16px;height:16px}.desktop{position:relative;height:calc(100dvh - 48px);overflow:hidden}.wallpaper-copy{position:absolute;left:clamp(100px,13vw,218px);top:clamp(65px,11vh,180px);color:#d7e4d7}.wallpaper-eyebrow{font:10px var(--mono);letter-spacing:.16em;color:var(--accent);display:flex;align-items:center;gap:10px;margin-bottom:18px}.crosshair{font-size:22px}.wallpaper-title{font:700 clamp(82px,11.2vw,185px)/.82 var(--display);letter-spacing:-.11em;opacity:.075;white-space:nowrap}.wallpaper-title em{font-style:normal;color:var(--accent)}.wallpaper-caption{margin-top:30px;font:11px/1.9 var(--mono);letter-spacing:.1em;color:#789087}.wallpaper-coordinate{position:absolute;left:0;top:min(60vh,640px);font:9px/1.9 var(--mono);letter-spacing:.09em;color:#6b8177}.desktop-icons{position:absolute;z-index:2;top:50px;left:25px;width:100px;display:grid;gap:9px}.desktop-icon{background:none;color:var(--text);border:1px solid transparent;padding:7px 5px;display:flex;flex-direction:column;align-items:center;gap:6px;border-radius:12px;transition:background .2s,border .2s;min-height:90px}.desktop-icon:hover,.desktop-icon:focus-visible{background:#ffffff0f;border-color:#ffffff14}.desktop-icon-visual{width:53px;height:53px;border:1px solid rgba(255,255,255,.13);border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#303938,#121c1b);box-shadow:0 9px 22px rgba(0,0,0,.25),inset 0 1px 1px #ffffff20;color:var(--accent)}.desktop-icon-visual svg{width:27px;height:27px;stroke-width:1.65}.desktop-icon-name{font:10px var(--mono);text-shadow:0 2px 4px black}.side-meta{position:absolute;right:28px;bottom:118px;display:grid;gap:8px;text-align:right;font:9px var(--mono);color:#718c7c;letter-spacing:.13em}.windows-layer{position:absolute;inset:0;pointer-events:none;z-index:10}.app-window{position:absolute;pointer-events:auto;display:flex;flex-direction:column;min-width:340px;min-height:250px;border:1px solid #43504a;border-radius:17px;overflow:hidden;background:rgba(14,21,20,.97);box-shadow:0 36px 85px rgba(0,0,0,.58),0 5px 16px #0008,0 0 0 1px #ffffff08;backdrop-filter:blur(34px);transition:box-shadow .15s,opacity .15s,transform .2s;resize:both}.app-window.inactive{border-color:#2a3531;box-shadow:0 12px 48px rgba(0,0,0,.45)}.app-window.is-maximized{left:10px!important;top:10px!important;width:calc(100% - 20px)!important;height:calc(100% - 103px)!important;resize:none}.app-window.is-minimized{display:none}.window-header{height:49px;min-height:49px;display:flex;align-items:center;padding:0 16px;gap:14px;border-bottom:1px solid #2d3934;background:linear-gradient(180deg,#1d2825,#16201e);cursor:grab;user-select:none}.window-header:active{cursor:grabbing}.traffic{display:flex;gap:8px;align-items:center}.traffic button{width:11px;height:11px;border-radius:50%;border:0;padding:0;background:#ff6157;position:relative}.traffic button:nth-child(2){background:#fbbb49}.traffic button:nth-child(3){background:#32c86a}.traffic button:hover:after{position:absolute;inset:0;display:grid;place-items:center;color:#0009;font:bold 9px sans-serif}.traffic button:first-child:hover:after{content:'×'}.traffic button:nth-child(2):hover:after{content:'−'}.traffic button:nth-child(3):hover:after{content:'+'}.window-title{display:flex;align-items:center;gap:9px;font:11px var(--mono);font-weight:600;letter-spacing:.04em}.window-title svg{width:16px;height:16px;color:var(--accent)}.window-subtitle{margin-left:auto;font:9px var(--mono);color:#75897d;letter-spacing:.09em}.window-body{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#3a4740 transparent}.window-body::-webkit-scrollbar{width:6px}.window-body::-webkit-scrollbar-thumb{background:#35423d;border-radius:8px}.dock{position:absolute;z-index:50;bottom:25px;left:50%;transform:translateX(-50%);height:69px;padding:8px 10px;display:flex;align-items:center;gap:9px;background:rgba(21,30,27,.88);border:1px solid rgba(233,255,237,.18);border-radius:21px;box-shadow:0 20px 65px #000b,inset 0 1px 1px #ffffff17;backdrop-filter:blur(22px)}.dock-launcher,.dock-utility{height:47px;width:47px;display:grid;place-items:center;background:transparent;border:0;color:var(--accent);font-size:33px;border-radius:13px}.dock-launcher:hover,.dock-utility:hover{background:#ffffff14}.dock-divider{height:29px;width:1px;background:#49534e;margin:0 2px}.dock-apps{display:flex;gap:7px;align-items:center}.dock-app{position:relative;width:47px;height:47px;padding:0;display:grid;place-items:center;border:1px solid transparent;border-radius:13px;background:none;color:#becdc1;transition:transform .16s,background .16s}.dock-app svg{width:22px;height:22px}.dock-app:hover{transform:translateY(-6px);background:#ffffff15;color:var(--accent)}.dock-app.active{background:var(--accent-low);border-color:#ffffff12;color:var(--accent)}.dock-app.running:after{position:absolute;content:'';width:4px;height:4px;bottom:-6px;border-radius:50%;background:var(--accent)}.dock-utility{font-size:29px;color:#dae4da}.dock-tooltip{display:none;position:absolute;bottom:80px;white-space:nowrap;padding:7px 11px;background:#212d28;border:1px solid #405047;border-radius:7px;font:10px var(--mono)}.desktop-footer{position:absolute;bottom:8px;width:100%;display:flex;justify-content:space-between;padding:0 26px;font:9px var(--mono);color:#667d6b;letter-spacing:.1em;pointer-events:none}.start-panel{position:absolute;z-index:55;left:calc(50% - 270px);bottom:106px;width:440px;padding:20px;background:#131c19f5;border:1px solid #3a4a42;border-radius:18px;box-shadow:0 35px 80px #000b;backdrop-filter:blur(35px)}.start-title{display:flex;align-items:center;justify-content:space-between}.start-title button{color:#a8b5aa;border:0;background:transparent;font:24px var(--display)}.start-intro{font:700 32px var(--display);letter-spacing:-.06em;margin:10px 0 17px}.start-app-list{display:grid;grid-template-columns:1fr 1fr;gap:9px}.start-app-item{padding:12px;display:flex;align-items:center;gap:10px;text-align:left;color:var(--text);background:#ffffff07;border:1px solid #ffffff10;border-radius:11px}.start-app-item:hover{border-color:var(--accent);background:var(--accent-low)}.start-app-item svg{width:20px;color:var(--accent)}.start-app-item span{font:11px var(--mono)}.start-bottom{border-top:1px solid #ffffff13;display:flex;align-items:center;gap:7px;margin-top:16px;padding-top:13px;font:10px var(--mono)}.start-bottom>span:first-child{color:var(--accent);font-size:18px}.start-bottom .tag{margin-left:auto}.tag,.chip{font:9px var(--mono);border:1px solid #435048;color:#b0bcb2;padding:5px 9px;border-radius:99px;white-space:nowrap}.search-modal{z-index:100;position:fixed;inset:0;background:#050a0acb;display:flex;align-items:flex-start;justify-content:center;padding-top:17vh;backdrop-filter:blur(9px)}.search-card{background:#18221e;border:1px solid #43564a;border-radius:16px;width:min(550px,calc(100vw - 30px));overflow:hidden;box-shadow:0 35px 100px #000}.search-row{display:flex;align-items:center;padding:18px;gap:13px;border-bottom:1px solid #304037}.search-row>span{font-size:27px;color:var(--accent)}.search-row input{flex:1;width:0;background:none;border:0;color:var(--text);outline:none;font:15px var(--body)}.search-row kbd{font:9px var(--mono);color:#9fac9e;border:1px solid #435448;padding:4px 6px;border-radius:5px}.search-results{max-height:360px;overflow:auto;padding:9px}.search-item{display:flex;align-items:center;gap:13px;border:1px solid transparent;border-radius:9px;padding:10px;text-align:left;width:100%;background:none;color:var(--text)}.search-item.selected,.search-item:hover{background:var(--accent-low);border-color:#ffffff19}.search-item svg{width:22px;color:var(--accent)}.search-item strong{font-size:13px}.search-item small{display:block;font:10px var(--mono);color:var(--muted);margin-top:4px}.search-tip{padding:10px 17px;display:flex;justify-content:space-between;border-top:1px solid #304037;color:#809187;font:9px var(--mono)}.toast-container{position:fixed;z-index:110;top:60px;right:20px;display:grid;gap:8px;pointer-events:none}.toast{padding:12px 15px;border:1px solid #476044;border-radius:10px;background:#18271c;color:#e9f3e4;font:11px var(--mono);box-shadow:0 10px 30px #0008;animation:toast-in .3s both}@keyframes toast-in{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.mobile-launcher{display:none}
/* windows common */
.page-pad{padding:28px}.app-eyebrow{font:10px var(--mono);letter-spacing:.16em;color:var(--accent)}.page-heading{font:700 clamp(30px,3vw,54px)/.99 var(--display);letter-spacing:-.075em;margin:12px 0 13px}.page-heading em{color:var(--accent);font-style:normal}.page-copy{font:13px/1.7 var(--body);color:#aabbb1;max-width:540px}.kicker-line{display:flex;align-items:center;gap:11px;font:10px var(--mono);letter-spacing:.06em;color:#b9c6b9}.kicker-line:before{content:'';height:7px;width:7px;border:1px solid var(--accent);transform:rotate(45deg)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:37px;padding:9px 15px;border-radius:7px;border:1px solid #435248;background:#24302b;color:var(--text);font:11px var(--mono);text-decoration:none;transition:background .15s,border .15s}.btn:hover{background:#34443a;border-color:#718570}.btn.primary{background:var(--accent);border-color:var(--accent);color:#141c12;font-weight:700}.btn.primary:hover{filter:brightness(1.09)}.btn.ghost{background:transparent}.btn.small{padding:7px 10px;min-height:30px;font-size:10px}.btn:focus-visible{outline-offset:2px}.actions{display:flex;gap:10px;flex-wrap:wrap}.divider{height:1px;background:#30403a;margin:20px 0}.card{background:#1a2420;border:1px solid #33443a;border-radius:13px;padding:18px}.card:hover{border-color:#526652}.card-eyebrow{color:var(--accent);letter-spacing:.08em;font:9px var(--mono)}.card h3{font:700 19px/1.2 var(--display);letter-spacing:-.03em;margin:11px 0 6px}.card p{font:12px/1.6 var(--body);color:#a0b1a4;margin:0}.line-label{font:10px var(--mono);color:#8b9f91;letter-spacing:.08em}.welcome{height:100%;display:flex;flex-direction:column}.welcome-top{display:grid;grid-template-columns:1.13fr .87fr;min-height:415px}.welcome-copy{padding:36px 32px}.welcome-copy h1{font:700 clamp(38px,4.5vw,73px)/.97 var(--display);letter-spacing:-.085em;margin:22px 0 16px}.welcome-copy h1 i{font-style:normal;color:var(--accent)}.welcome-copy p{font:13px/1.7 var(--body);color:#b0c0b1;max-width:340px}.welcome-copy .actions{margin-top:27px}.welcome-art{position:relative;overflow:hidden;background:radial-gradient(ellipse at 48% 56%,#344b28 0%,#18271e 45%,#121d19 80%);border-left:1px solid #304139;min-height:300px}.welcome-art:before{content:'';position:absolute;width:310px;height:310px;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid #90bb5c55;border-radius:50%;box-shadow:0 0 0 24px #ffffff04,0 0 0 54px #ffffff04,0 0 0 100px #ffffff03}.orbital{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);font:700 190px var(--display);letter-spacing:-.1em;color:var(--accent);text-shadow:0 0 70px #b4ea5d5c;line-height:1}.orbit-tag{position:absolute;bottom:22px;left:23px;font:10px/1.8 var(--mono);color:#afc5a8}.orbit-corner{position:absolute;top:19px;right:20px;font:9px var(--mono);color:#acc5a1}.welcome-bottom{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid #354338;flex:1}.welcome-feature{background:transparent;color:var(--text);text-align:left;border:0;border-right:1px solid #354338;padding:22px 26px;display:flex;flex-direction:column;gap:10px}.welcome-feature:last-child{border-right:0}.welcome-feature:hover{background:#bfff6a0b}.welcome-feature .feat-no{font:9px var(--mono);color:var(--accent)}.welcome-feature strong{font:700 20px var(--display);letter-spacing:-.035em}.welcome-feature small{font:11px/1.5 var(--body);color:#9ab09c}.welcome-feature .arrow{margin-top:auto;align-self:flex-end;font:23px var(--display);color:var(--accent)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:21px}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.project-card{position:relative;overflow:hidden;min-height:185px;background:linear-gradient(140deg,#1d2922,#131c19);border:1px solid #354739;border-radius:12px;padding:20px;display:flex;flex-direction:column}.project-card:hover{border-color:#7d985d}.project-card .art{position:absolute;right:-16px;top:-13px;font:700 108px var(--display);line-height:1;color:var(--accent);opacity:.09;transform:rotate(-10deg);pointer-events:none}.project-card h3{font:700 24px var(--display);letter-spacing:-.055em;margin:11px 0 5px;position:relative}.project-card p{font:12px/1.6 var(--body);color:#abb8ac;margin:0;max-width:300px;position:relative}.project-card .project-foot{display:flex;align-items:center;gap:7px;margin-top:auto;padding-top:18px}.project-foot a,.project-foot button{font:10px var(--mono);background:none;border:0;color:var(--accent);text-decoration:none;padding:0;cursor:pointer}.project-foot a:hover,.project-foot button:hover{text-decoration:underline}.project-foot .chip{margin-left:auto}.link-card{display:flex;align-items:center;gap:15px;padding:16px;border:1px solid #34473c;border-radius:11px;background:#17211c;text-decoration:none}.link-card:hover{border-color:var(--accent)}.link-card .link-icon{height:38px;width:38px;display:grid;place-items:center;border-radius:10px;background:var(--accent-low);color:var(--accent)}.link-card strong{display:block;font:700 14px var(--display)}.link-card small{display:block;color:#91a394;font:11px var(--mono);margin-top:4px}.link-card .link-end{margin-left:auto;color:var(--accent)}.tool-list{display:grid;gap:9px}.terminal-body{height:100%;background:#0a1110;padding:17px;font:12px/1.7 var(--mono);color:#c9e0bb;overflow:auto;cursor:text}.terminal-line{white-space:pre-wrap;overflow-wrap:anywhere}.terminal-line.dim{color:#84988d}.terminal-line.error{color:#ff9f83}.terminal-form{display:flex;gap:10px;align-items:center}.terminal-form span{color:var(--accent)}.terminal-form input{flex:1;min-width:0;background:none;color:#e1efce;border:0;outline:0;font:12px var(--mono)}.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:15px}.about-avatar{min-height:220px;background:radial-gradient(ellipse at 50% 60%,#344a30,#17231d 72%);display:grid;place-items:center;border:1px solid #3a4c3e;border-radius:13px;position:relative;overflow:hidden}.about-avatar .bigstar{font:250px var(--display);color:var(--accent);line-height:1;text-shadow:0 0 80px #b5ed6b57}.about-avatar span{position:absolute;left:18px;bottom:17px;font:10px var(--mono);color:#c5d2bf}.about-quicklinks{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.notes-textarea{resize:vertical;width:100%;min-height:150px;background:#0f1713;border:1px solid #36483d;border-radius:10px;color:var(--text);padding:16px;line-height:1.6}.settings-grid{display:grid;gap:16px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid #35453a;background:#17221c;padding:16px;border-radius:10px}.setting-row strong{font-size:13px}.setting-row p{font-size:11px;color:#9baa9a;margin:6px 0 0}.swatches,.choice-row{display:flex;gap:7px;flex-wrap:wrap}.swatch{width:29px;height:29px;border-radius:50%;border:3px solid #101910;outline:1px solid #556252}.swatch.selected{outline:2px solid white}.choice-btn{padding:7px 9px;background:#25332a;border:1px solid #405546;border-radius:7px;color:#d9e4d9;font:10px var(--mono)}.choice-btn.selected{border-color:var(--accent);color:var(--accent)}
/* playground */
.playground-shell{height:100%;min-height:0;display:flex}.playground-sidebar{width:205px;flex:none;background:#121b17;border-right:1px solid #304038;padding:23px 12px;overflow:auto}.playground-sidebar h3{font:700 22px var(--display);letter-spacing:-.07em;margin:7px 10px 25px}.playground-sidebar .tiny-label{margin-left:10px}.experiment-tab{width:100%;display:flex;align-items:center;gap:11px;text-align:left;border:1px solid transparent;background:transparent;color:#a3b2a5;border-radius:9px;padding:12px 10px;margin:4px 0;font:11px var(--mono)}.experiment-tab:hover{background:#ffffff08;color:var(--text)}.experiment-tab.selected{background:var(--accent-low);border-color:#79994f56;color:var(--accent)}.experiment-tab svg{width:18px;height:18px;flex:none}.pg-sidebar-foot{margin:30px 10px 0;border-top:1px solid #354239;padding-top:16px;color:#819488;font:10px/1.65 var(--mono)}.experiment-view{flex:1;min-width:0;overflow:auto;padding:25px}.experiment-header{display:flex;justify-content:space-between;gap:15px;align-items:start;margin-bottom:21px}.experiment-header h2{font:700 34px var(--display);letter-spacing:-.07em;line-height:1;margin:8px 0 7px}.experiment-header p{font-size:12px;line-height:1.5;color:#a6b8aa;max-width:380px;margin:0}.experiment-id{font:10px var(--mono);color:#93a592;border:1px solid #435748;padding:6px 10px;border-radius:6px}.experiment-workbench{background:#0d1512;border:1px solid #354438;border-radius:12px;overflow:hidden;position:relative}.experiment-workbench canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.workbench-label{position:absolute;top:12px;left:14px;color:#a8b8a6;font:10px var(--mono);pointer-events:none;background:#152018b8;padding:5px 8px;border-radius:4px}.controls-panel{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:15px}.control-field{display:flex;align-items:center;gap:10px;font:10px var(--mono);color:#a8baaa}.control-field input[type=range]{accent-color:var(--accent);width:95px}.control-field input[type=color]{width:34px;height:26px;padding:0;border:0;background:none;cursor:pointer}.control-field select,.control-field input[type=text],.control-field input[type=number]{background:#1c2a20;color:#e8eee2;border:1px solid #3b5240;padding:7px;border-radius:6px;min-width:55px}.controls-panel .end{margin-left:auto}.pixel-layout{display:grid;grid-template-columns:minmax(0,1fr) 155px;gap:15px}.pixel-drawing-frame{background:#202824;border:1px solid #405143;border-radius:11px;padding:12px;display:flex;align-items:center;justify-content:center;min-height:340px}.pixel-drawing-frame canvas{max-width:100%;max-height:370px;aspect-ratio:1;image-rendering:pixelated;cursor:crosshair;touch-action:none;display:block;border:1px solid #607363}.pixel-tools{display:flex;flex-direction:column;gap:12px}.pixel-palette{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.pixel-color{border:2px solid transparent;height:27px;border-radius:5px;cursor:pointer}.pixel-color.selected{outline:2px solid white;outline-offset:2px}.pixel-toolbtn{width:100%;text-align:left}.pixel-toolbtn.active{border-color:var(--accent);color:var(--accent)}.gradient-preview{min-height:295px;display:grid;place-items:center;text-align:center;position:relative}.gradient-preview strong{color:white;text-shadow:0 5px 40px #0004;font:700 clamp(34px,5vw,80px)/.95 var(--display);letter-spacing:-.085em}.gradient-preview small{position:absolute;right:12px;bottom:10px;font:10px var(--mono);color:#fff9;background:#0003;padding:5px 8px}.gradient-css{padding:13px 15px;background:#0b1510;border:1px solid #3c5040;border-radius:7px;font:10px var(--mono);color:#d0e8c8;word-break:break-all}.beat-layout{display:grid;gap:11px;background:#0c1510;border:1px solid #3c5040;border-radius:12px;padding:17px;overflow-x:auto}.beat-row{display:grid;grid-template-columns:58px repeat(8,minmax(32px,1fr));gap:7px;align-items:center;min-width:380px}.beat-label{font:10px var(--mono);color:#b2c6b1}.beat-step{aspect-ratio:1.1;border:1px solid #39503f;border-radius:6px;background:#19271c;min-height:32px;color:transparent}.beat-step.on{background:var(--accent);box-shadow:inset 0 0 0 4px #ffffff23;border-color:var(--accent)}.beat-step.playing{outline:2px solid var(--warm);outline-offset:2px}.beat-step:hover{border-color:white}.type-stage{background:radial-gradient(ellipse at 50% 50%,#26362b,#0a140f);min-height:250px;border:1px solid #3c5041;border-radius:12px;display:grid;place-items:center;overflow:hidden;padding:15px}.type-stage div{font:700 clamp(34px,6vw,82px)/1 var(--display);text-align:center;letter-spacing:-.085em;overflow-wrap:anywhere;color:var(--accent);text-shadow:2px 1px 0px #ef8469, -2px -1px 0px #50c6c7}.type-controls{display:grid;gap:12px;margin:15px 0}.type-controls input[type=text]{width:100%;min-height:40px;padding:10px 13px;background:#0d1710;border:1px solid #435947;border-radius:7px;color:var(--text)}
/* arcade */
.arcade-feature{border-radius:12px;border:1px solid #42503b;background:radial-gradient(ellipse at 80% 30%,#36502a,#18271a 50%,#132017);padding:25px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.arcade-feature h2{font:700 39px var(--display);letter-spacing:-.08em;margin:10px 0}.arcade-feature p{font:12px/1.6 var(--body);color:#b4c6b0;max-width:330px}.arcade-glyph{font:700 120px var(--display);color:var(--accent);line-height:1;opacity:.75}.arcade-board{height:210px;background:repeating-linear-gradient(0deg,#121d19,#121d19 20px,#182720 21px),#101810;border:1px solid #43563e;border-radius:11px;position:relative;overflow:hidden}.arcade-board canvas{width:100%;height:100%;display:block;image-rendering:pixelated}.arcade-board-overlay{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}.arcade-board-overlay strong{font:700 27px var(--display);letter-spacing:-.055em}.arcade-board-overlay p{font:11px var(--mono);color:#a8b8a8}.arcade-help{font:10px var(--mono);color:#9fb09f;display:flex;gap:14px;align-items:center;margin:10px 0}.arcade-help button{margin-left:auto}
@media(max-width:940px){.wallpaper-copy{left:135px}.desktop-icons{left:12px}.menubar-project{display:none}.window-subtitle{display:none}.app-window{max-width:calc(100vw - 125px)}}
@media(max-width:700px){body{height:100dvh}.menubar{height:46px;padding:0 14px}.menubar-brand{font-size:11px}.menubar-right{gap:14px}.status-signal{display:none}.clock{font-size:10px}.desktop{height:calc(100dvh - 46px)}.desktop-icons,.wallpaper-copy,.side-meta,.desktop-footer{display:none}.desktop:before{content:'';position:absolute;top:15%;left:50%;transform:translateX(-50%);height:250px;width:250px;border-radius:50%;background:var(--accent);opacity:.08;filter:blur(75px)}.mobile-launcher{display:block;position:absolute;inset:0;padding:39px 24px 135px;overflow:auto}.mobile-launcher-heading .eyebrow{color:var(--accent)}.mobile-launcher h1{font:700 clamp(69px,20vw,115px)/.78 var(--display);letter-spacing:-.11em;margin:19px 0 25px}.mobile-launcher h1 i{font-style:normal;color:var(--accent)}.mobile-launcher p{font:12px/1.65 var(--mono);color:#a0b5a5;max-width:300px}.mobile-app-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px 10px;margin-top:40px}.mobile-app{display:flex;align-items:center;flex-direction:column;gap:10px;border:0;background:none;color:var(--text);font:11px var(--mono)}.mobile-app .desktop-icon-visual{width:67px;height:67px;border-radius:18px}.mobile-app .desktop-icon-visual svg{width:29px;height:29px}.mobile-footnote{display:block;font:9px var(--mono);color:#768e7a;letter-spacing:.07em;margin-top:35px}.dock{bottom:14px;width:calc(100% - 26px);height:65px;padding:8px 10px;justify-content:center;gap:5px;border-radius:20px}.dock-apps{gap:2px;flex:1;justify-content:space-around}.dock-app{width:39px;height:43px}.dock-app svg{width:19px;height:19px}.dock-launcher,.dock-utility{width:36px;height:42px;font-size:24px}.dock-divider{margin:0}.app-window{position:absolute!important;left:0!important;top:0!important;width:100vw!important;height:calc(100dvh - 46px - 0px)!important;min-height:0;min-width:0;max-width:none;border:0;border-radius:0;resize:none;box-shadow:none}.app-window.is-maximized{width:100vw!important;height:calc(100dvh - 46px)!important;left:0!important;top:0!important}.window-header{height:46px;min-height:46px}.page-pad{padding:20px}.page-heading{font-size:36px}.welcome-top{display:flex;flex-direction:column}.welcome-copy{padding:26px}.welcome-copy h1{font-size:52px}.welcome-art{min-height:140px;border-left:0;border-top:1px solid #304139}.orbital{font-size:135px}.welcome-bottom{grid-template-columns:1fr}.welcome-feature{padding:15px 22px;border-right:0;border-bottom:1px solid #354338;display:grid;grid-template-columns:25px 1fr 23px;gap:4px 10px}.welcome-feature small{grid-column:2}.welcome-feature .arrow{grid-column:3;grid-row:1/3;align-self:center}.about-layout,.project-grid{grid-template-columns:1fr}.arcade-feature{grid-template-columns:1fr}.arcade-glyph{display:none}.playground-shell{flex-direction:column}.playground-sidebar{width:100%;padding:10px 12px;border-right:0;border-bottom:1px solid #304038;display:flex;align-items:center;gap:7px;flex-wrap:nowrap;overflow:auto;flex:none}.playground-sidebar h3,.playground-sidebar .tiny-label,.pg-sidebar-foot{display:none}.experiment-tab{width:auto;flex:none;margin:0;padding:9px 12px}.experiment-tab svg{width:16px;height:16px}.experiment-view{padding:17px 16px 115px}.experiment-header h2{font-size:29px}.experiment-id{display:none}.pixel-layout{grid-template-columns:1fr}.pixel-tools{display:grid;grid-template-columns:1fr 1fr}.pixel-tools .pixel-palette{grid-column:1/-1}.pixel-drawing-frame{min-height:270px}.pixel-drawing-frame canvas{max-height:270px}.start-panel{left:13px;bottom:89px;width:calc(100% - 26px)}.start-app-list{grid-template-columns:1fr 1fr}.setting-row{flex-direction:column;align-items:flex-start}}
@media(max-height:660px) and (min-width:701px){.desktop-icons{top:15px;grid-template-columns:repeat(2,80px);width:auto}.desktop-icon{min-height:70px}.desktop-icon-visual{width:43px;height:43px}.dock{bottom:14px}.wallpaper-copy{top:40px}.wallpaper-title{font-size:90px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}body.reduce-motion *,body.reduce-motion *:before,body.reduce-motion *:after{animation:none!important;transition:none!important}

@media(max-width:700px){.welcome-top{min-height:0}.welcome-copy h1{margin-bottom:12px}.welcome-copy .actions{margin-top:15px}}