:root{--font-system:-apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;--font-mono:ui-monospace, "SF Mono", SFMono-Regular, Menlo, Monaco, "Cascadia Code", monospace;--accent-blue:#007aff;--accent-indigo:#5e5ce6;--accent-green:#34c759;--accent-orange:#ff9f0a;--accent-red:#ff453a;--accent-pink:#ff2d55;--color-primary:#5e5ce6;--color-secondary:#34c759;--color-accent:#ff9f0a;--radius-window:26px;--radius-card:20px;--radius-control:12px;--radius-pill:980px;--ease:cubic-bezier(.32, .72, 0, 1);--ease-out:cubic-bezier(.22, 1, .36, 1);--transition-fast:.2s var(--ease-out);--transition-normal:.34s var(--ease-out);--transition-slow:.5s var(--ease-out);--menubar-height:32px}:root,:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--text-primary:#1c1c1e;--text-secondary:#3c3c43ad;--text-muted:#3c3c436b;--text-on-glass:#1c1c1e;--glass-bg:#ffffff8c;--glass-bg-thick:#ffffffb8;--glass-bg-thin:#ffffff57;--glass-border:#ffffffb3;--glass-hairline:#00000014;--glass-highlight:#ffffffd9;--glass-shadow:#1f264a2e;--glass-inner-shadow:#0000000f;--control-bg:#ffffff80;--control-bg-hover:#ffffffbf;--field-bg:#ffffff80;--field-border:#0000001a;--sky-1:#a9cef0;--sky-2:#cfe1f2;--sky-3:#ecdcc3;--sky-4:#f3c58f;--horizon-glow:#ffcd8299;--sky-tint:#78a0d259;--bridge-color:#b5502a;--bridge-opacity:.22}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--text-primary:#f5f5f7;--text-secondary:#ebebf59e;--text-muted:#ebebf557;--text-on-glass:#f5f5f7;--glass-bg:#282a3780;--glass-bg-thick:#20222eb8;--glass-bg-thin:#32344252;--glass-border:#ffffff24;--glass-hairline:#ffffff14;--glass-highlight:#ffffff59;--glass-shadow:#00000080;--glass-inner-shadow:#00000059;--control-bg:#ffffff14;--control-bg-hover:#ffffff29;--field-bg:#00000038;--field-border:#ffffff1f;--sky-1:#070b23;--sky-2:#16214a;--sky-3:#3b3160;--sky-4:#a24b3f;--horizon-glow:#ff8a4280;--sky-tint:#463c8c66;--bridge-color:#120a12;--bridge-opacity:.5}*{box-sizing:border-box;margin:0;padding:0}html,body{font-family:var(--font-system);color:var(--text-primary);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;scrollbar-gutter:stable;font-size:16px;line-height:1.5;overflow-x:hidden}html{background-color:var(--sky-1);background-image:radial-gradient(140% 90% at 50% 118%, var(--horizon-glow) 0%, transparent 52%), radial-gradient(90% 60% at 82% 12%, var(--sky-tint) 0%, transparent 60%), linear-gradient(180deg, var(--sky-1) 0%, var(--sky-2) 34%, var(--sky-3) 62%, var(--sky-4) 100%);min-height:100%;transition:background-color var(--transition-slow);background-repeat:no-repeat;background-attachment:fixed}body{scroll-behavior:smooth}a{color:inherit;text-decoration:none}button,input,textarea{color:inherit;font-family:inherit}::selection{background:#5e5ce64d}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--text-muted);background-clip:content-box;border:2px solid #0000;border-radius:980px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary);background-clip:content-box}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px)saturate(180%);backdrop-filter:blur(20px)saturate(180%);border:1px solid var(--glass-border);box-shadow:inset 0 1px 0 0 var(--glass-highlight), inset 0 0 0 .5px var(--glass-hairline), 0 12px 40px -8px var(--glass-shadow);position:relative}.window{background:var(--glass-bg);-webkit-backdrop-filter:blur(22px)saturate(180%);backdrop-filter:blur(22px)saturate(180%);border:1px solid var(--glass-border);border-radius:var(--radius-window);box-shadow:inset 0 1px 0 0 var(--glass-highlight), 0 1px 1px 0 var(--glass-inner-shadow), 0 24px 70px -18px var(--glass-shadow);contain:layout paint;position:relative;overflow:hidden}.window-titlebar{border-bottom:1px solid var(--glass-hairline);background:linear-gradient(180deg, var(--glass-highlight) 0%, transparent 120%);align-items:center;gap:10px;height:44px;padding:0 16px;display:flex}.traffic-lights{align-items:center;gap:8px;display:flex}.traffic-light{border:.5px solid #00000024;border-radius:50%;width:12px;height:12px}.traffic-light.red{background:#ff5f57}.traffic-light.yellow{background:#febc2e}.traffic-light.green{background:#28c840}.window-title{text-align:center;color:var(--text-secondary);letter-spacing:-.01em;white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:.8rem;font-weight:600;overflow:hidden}.glass-button{border-radius:var(--radius-control);border:1px solid var(--glass-border);background:var(--control-bg);-webkit-backdrop-filter:blur(12px)saturate(160%);backdrop-filter:blur(12px)saturate(160%);color:var(--text-primary);letter-spacing:-.01em;cursor:pointer;box-shadow:inset 0 1px 0 0 var(--glass-highlight);transition:background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:.92rem;font-weight:590;display:inline-flex}.glass-button:hover{background:var(--control-bg-hover);transform:translateY(-1px)}.glass-button:active{transform:translateY(0)scale(.98)}.glass-button.primary{background:linear-gradient(180deg, #6b8bff 0%, var(--accent-blue) 100%);color:#fff;border-color:#0000001f;box-shadow:inset 0 1px #fff6,0 6px 16px -4px #007aff80}.glass-button.primary:hover{filter:brightness(1.06)}.glass-field{background:var(--field-bg);border:1px solid var(--field-border);border-radius:var(--radius-control);width:100%;color:var(--text-primary);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:11px 14px;font-size:.95rem}.glass-field::placeholder{color:var(--text-muted)}.glass-field:focus{border-color:var(--accent-blue);box-shadow:0 0 0 3.5px #007aff40}.glow-accent{color:var(--accent-blue)}.menu-item{transition:background var(--transition-fast)}.menu-item:hover,.menu-item-open{background:var(--control-bg-hover)!important}.menu-status{color:var(--text-primary);justify-content:center;align-items:center;padding:5px 6px;display:flex}.menu-dropdown{z-index:1200;transform-origin:0 0;min-width:230px;animation:menu-pop .16s var(--ease-out);border-radius:12px;padding:6px;position:absolute;top:calc(100% + 5px);left:0}.menu-dropdown-item{cursor:pointer;width:100%;color:var(--text-primary);white-space:nowrap;transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:none;border-radius:7px;justify-content:space-between;align-items:center;gap:20px;padding:7px 12px;font-size:.85rem;font-weight:500;display:flex}.menu-dropdown-item:hover{background:linear-gradient(180deg, #4a90ff, var(--accent-blue));color:#fff}.menu-shortcut{opacity:.55;font-size:.78rem}.menu-divider{background:var(--glass-hairline);height:1px;margin:5px 8px;display:block}@keyframes menu-pop{0%{opacity:0;transform:scale(.96)translateY(-4px)}to{opacity:1;transform:scale(1)translateY(0)}}@media (width<=640px){.menu-status{display:none!important}}.spotlight-backdrop{z-index:2000;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);animation:fade-in .18s var(--ease-out);background:#00000047;justify-content:center;align-items:flex-start;padding-top:16vh;display:flex;position:fixed;inset:0}.spotlight-panel{width:min(92%,620px);animation:spotlight-in .24s var(--ease-out);border-radius:20px;overflow:hidden}.spotlight-search{align-items:center;gap:14px;padding:16px 20px;display:flex}.spotlight-search input{color:var(--text-primary);background:0 0;border:none;outline:none;flex:1;font-size:1.35rem;font-weight:400}.spotlight-search input::placeholder{color:var(--text-muted)}.spotlight-kbd{font-family:var(--font-system);color:var(--text-secondary);background:var(--control-bg);border:1px solid var(--glass-hairline);border-radius:6px;padding:2px 7px;font-size:.72rem}.spotlight-results{border-top:1px solid var(--glass-hairline);max-height:44vh;padding:8px;overflow-y:auto}.spotlight-result{cursor:pointer;width:100%;color:var(--text-primary);transition:background var(--transition-fast);background:0 0;border:none;border-radius:10px;align-items:center;gap:13px;padding:9px 12px;display:flex}.spotlight-result.active{background:linear-gradient(180deg, #4a90ff, var(--accent-blue));color:#fff}.spotlight-result-icon{background:var(--control-bg);border-radius:9px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.spotlight-result.active .spotlight-result-icon{background:#ffffff38}.spotlight-empty{text-align:center;color:var(--text-muted);border-top:1px solid var(--glass-hairline);padding:26px;font-size:.9rem}.control-center{z-index:1200;width:300px;animation:menu-pop .18s var(--ease-out);border-radius:18px;grid-template-columns:1fr 1fr;gap:10px;padding:12px;display:grid;position:absolute;top:calc(100% + 8px);right:0}.cc-tile{background:var(--glass-bg-thin);border:1px solid var(--glass-hairline);color:var(--text-primary);border-radius:14px;padding:12px}.cc-connectivity{flex-direction:column;grid-column:1/-1;gap:4px;display:flex}.cc-conn-row,.cc-appearance{cursor:pointer;width:100%;color:inherit;text-align:left;transition:background var(--transition-fast);background:0 0;border:none;border-radius:10px;align-items:center;gap:11px;padding:6px 4px;display:flex}.cc-conn-row:hover{background:var(--control-bg)}.cc-conn-icon,.cc-appearance-icon{background:var(--control-bg);width:34px;height:34px;color:var(--text-secondary);transition:background var(--transition-normal), color var(--transition-normal);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.cc-conn-icon.on,.cc-appearance-icon.on{background:linear-gradient(180deg, #4a90ff, var(--accent-blue));color:#fff}.cc-appearance{padding:12px}.cc-appearance-icon{background:linear-gradient(180deg, #ffd66b, var(--accent-orange));color:#fff;border-radius:50%}.cc-appearance-icon.on{background:linear-gradient(180deg, #7a78ff, var(--accent-indigo))}.cc-slider-tile{flex-direction:column;grid-column:1/-1;gap:8px;display:flex}.cc-slider-label{color:var(--text-secondary);font-size:.75rem;font-weight:600}.cc-slider{align-items:center;gap:10px;display:flex}.cc-slider-icon{color:var(--text-secondary)}.cc-slider input[type=range]{appearance:none;background:linear-gradient(90deg, #fff var(--fill), var(--control-bg) var(--fill));border:1px solid var(--glass-hairline);cursor:pointer;border-radius:13px;flex:1;height:26px}.cc-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border-radius:50%;width:22px;height:22px;box-shadow:0 1px 4px #0000004d}.notification-stack{top:calc(var(--menubar-height) + 10px);z-index:1500;pointer-events:none;flex-direction:column;gap:10px;display:flex;position:fixed;right:12px}.notification{pointer-events:auto;cursor:pointer;text-align:left;width:min(340px,86vw);animation:toast-in .4s var(--ease-out);border-radius:18px;align-items:flex-start;gap:12px;padding:14px 16px;display:flex}.notification-icon{background:linear-gradient(160deg, #6b8bff, var(--accent-indigo));color:#fff;border-radius:9px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;font-size:.9rem;display:flex}@keyframes toast-in{0%{opacity:0;transform:translate(24px)scale(.96)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes spotlight-in{0%{opacity:0;transform:translateY(-12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.traffic-light{color:#0000008c;justify-content:center;align-items:center;padding:0;font-size:9px;font-weight:700;line-height:1;display:flex;position:relative}.traffic-light:after{opacity:0;transition:opacity var(--transition-fast)}.window:hover .traffic-lights .traffic-light:after,.traffic-lights:hover .traffic-light:after{opacity:1}.traffic-light.red:after{content:"×"}.traffic-light.yellow:after{content:"−"}.traffic-light.green:after{content:"↗"}:focus-visible{border-radius:8px;outline:none;box-shadow:0 0 0 3.5px #007aff66}.glass-field:focus-visible{box-shadow:0 0 0 3.5px #007aff47}@keyframes dock-launch{0%{transform:translateY(0)}16%{transform:translateY(-22px)}34%{transform:translateY(0)}50%{transform:translateY(-11px)}66%{transform:translateY(0)}82%{transform:translateY(-4px)}to{transform:translateY(0)}}.dock-launching{animation:dock-launch .7s var(--ease-out)}body:before{content:"";z-index:-1;pointer-events:none;opacity:var(--wallpaper-dim,.05);transition:opacity var(--transition-normal);background:#000;position:fixed;inset:0}.container{z-index:10;width:90%;max-width:1180px;margin:0 auto;position:relative}.project-body{grid-template-columns:1fr;gap:40px;display:grid;position:relative}@media (width>=900px){.project-body{grid-template-columns:1fr 1fr}.simulator-container{min-height:480px!important}}.project-window{content-visibility:auto;contain-intrinsic-size:auto 640px}.device-frame{background:#16171d;border:10px solid #2c2d38;position:relative;overflow:hidden;box-shadow:0 20px 50px #00000073}.device-frame.mobile{border-width:12px;border-radius:44px;width:280px;height:570px;margin:0 auto}.device-frame.mobile:before{content:"";z-index:5;background:#000;border-radius:980px;width:96px;height:26px;position:absolute;top:10px;left:50%;transform:translate(-50%)}.device-screen{background:#0f1016;width:100%;height:100%;position:relative;overflow:hidden}.device-frame.browser{border-width:32px 6px 6px;border-radius:14px;width:100%;max-width:680px;height:400px}.device-frame.browser:before{content:"";z-index:5;background:#ff5f57;border-radius:50%;width:8px;height:8px;position:absolute;top:-22px;left:12px;box-shadow:14px 0 #febc2e,28px 0 #28c840}dialog{background:0 0;border:none;outline:none;width:92%;max-width:920px;margin:auto}dialog::backdrop{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background-color:#00000047}dialog[open] .dialog-content{animation:sheet-in var(--transition-slow) var(--ease-out) forwards}@keyframes sheet-in{0%{opacity:0;transform:translateY(18px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.dialog-content{max-height:86vh;overflow-y:auto}@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()) and (animation-range:entry){@keyframes reveal-up{0%{opacity:0;transform:translateY(36px)}to{opacity:1;transform:translateY(0)}}.scroll-reveal{animation:linear forwards reveal-up;animation-timeline:view();animation-range:entry 5% entry 42%}}}.reveal-visible{opacity:1;transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);transform:translateY(0)}.reveal-hidden{opacity:0;transform:translateY(28px)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}.app-container{min-height:100vh;padding-top:var(--menubar-height);flex-direction:column;display:flex}main{flex:1}[id]{scroll-margin-top:48px}footer{border-top:1px solid var(--glass-hairline);background:var(--glass-bg-thin);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);text-align:center;color:var(--text-muted);z-index:10;padding:34px 0;font-size:.85rem;position:relative}
