.wrapper{display:flex;flex-flow:row wrap}.wrapper>*{flex:1 100%}.header{height:180px;display:flex;justify-content:space-between;align-items:center}.header__left{display:flex;align-items:center}.header__right{display:flex;align-items:center;gap:15px}.header__buttons{position:fixed;top:10px;right:10px;display:flex;gap:5px}.footer{height:80px;display:flex;justify-content:space-between;align-items:center}.footer__right{display:flex;align-items:center;gap:15px}.main{flex:1;padding:2rem;max-width:none}.aside-1{padding:100px;display:flex;flex-direction:column;justify-content:flex-end}.content-wrapper{display:flex;flex:1;min-height:calc(100vh - 180px - 80px)}.article{overflow:hidden}.toggle-btn{border:1px solid var(--border-color);border-radius:2px;cursor:pointer;height:20px;width:20px;color:var(--text-primary);background:var(--bg-primary);opacity:.8;position:relative;transition:all .2s ease;display:flex;align-items:center;justify-content:center;font-size:12px}.toggle-btn:hover{opacity:1;background:rgba(255,255,255,.4);transform:translateY(-1px)}.toggle-btn:active{transform:translateY(1px);background:rgba(255,255,255,.2)}.toggle-btn:focus{outline:none;box-shadow:0 0 0 2px rgba(255,255,255,.3)}.btn{padding:12px 24px;border-radius:8px;border:none;font-weight:500;cursor:pointer;transition:all .3s ease;text-decoration:none;display:inline-block}.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0)}.btn:focus{outline:none;box-shadow:0 0 0 3px rgba(255,255,255,.3)}.btn--primary{background:#fff;color:var(--bg-primary)}.btn--primary:hover{background:#f0f0f0}.btn--primary:focus{box-shadow:0 0 0 3px rgba(255,255,255,.5)}.btn--secondary{background:0 0;color:#fff;border:1px solid rgba(255,255,255,.3)}.btn--secondary:hover{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.1)}.btn--secondary:focus{box-shadow:0 0 0 3px rgba(255,255,255,.2)}.main-nav{margin-left:2rem}.header-left{display:flex;align-items:center}.nav-tabs{display:flex;list-style:none;margin:0;padding:0;background:rgba(20,20,20,.8);border-radius:4px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 10px #0069af42}.nav-item{position:relative}.nav-item a{padding:8px 16px;display:block;color:var(--text-secondary);text-decoration:none;transition:all .2s ease;position:relative;display:flex;align-items:center}.nav-item:last-child a{border-right:none}.nav-item:first-child a{border-radius:4px 0 0 4px}.nav-item:last-child a{border-radius:0 4px 4px 0}.nav-item a:hover{color:var(--text-primary);background:rgba(255,255,255,5%);text-decoration:underline;cursor:pointer}.nav-item a:focus{outline:2px solid #fff;outline-offset:2px;color:var(--text-primary)}.nav-item.active a{color:var(--text-primary);background:var(--bg-tertiary);border-bottom:2px solid var(--accent-blue)}.mobile-nav-toggle{display:none;flex-direction:column;background:0 0;border:none;cursor:pointer;padding:8px;gap:3px}.hamburger-line{width:20px;height:2px;background:var(--text-primary);transition:all .3s ease}.mobile-nav{display:none;position:absolute;top:100%;right:0;width:200px;background:rgba(20,20,20,.95);border:1px solid var(--border-color);border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 16px rgba(0,0,0,.3);list-style:none;margin:8px 0 0;padding:0;z-index:1000}.mobile-nav.active{display:block;animation:slideDown .3s ease-out}.mobile-nav .nav-item a{padding:12px 16px;border-right:none;border-bottom:1px solid var(--border-color);border-radius:0;min-height:44px}.mobile-nav .nav-item:last-child a{border-bottom:none;border-radius:0 0 8px 8px}.mobile-nav .nav-item:first-child a{border-radius:8px 8px 0 0}@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}:root{--bg-primary:#0a0a0a;--bg-secondary:#141414;--bg-tertiary:#1e1e1e;--border-color:#2d2d2d;--text-primary:#fff;--text-secondary:#999;--text-muted:#555;--accent-blue:#3b82f6;--sidebar-width:240px}*{box-sizing:border-box}body{color:var(--text-primary);margin:0;background:#000;font-family:inter,system-ui,sans-serif;position:relative;height:100vh}h1{white-space:pre-wrap;text-transform:uppercase;font-size:3.5rem;font-weight:900;margin:0 0 1rem}.text-appear{opacity:0;transform:translateY(20px);animation:appear 2s cubic-bezier(.25,.46,.45,.94)forwards}@keyframes appear{to{opacity:1;transform:translateY(0)}}.text-appear-slow{opacity:0;transform:translateY(10px);animation:appear 4s ease-in forwards;animation-delay:.5s}.text-appear-slowest{opacity:0;transform:translateY(10px);animation:appear 4s ease-in forwards;animation-delay:2.5s}#logo img{filter:grayscale(100%);transition:filter 4s ease}#logo.is-animated img{filter:grayscale(0%)}.hero{position:fixed;top:50%;left:200px;transform:translateY(-50%);z-index:100}.hero-content{color:#fff;max-width:600px}.hero-title{white-space:pre-wrap;text-transform:uppercase;font-size:3.5rem;font-weight:900;margin:0 0 1rem;background:linear-gradient(135deg,#fff 0%,rgba(255,255,255,.7) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.1}.hero-subtitle{font-size:1.2rem;margin:0 0 2rem;line-height:1.4}.hero-actions{display:flex;gap:1rem}.header{padding-left:100px;padding-right:100px;padding-top:50px}.footer{padding-left:100px;padding-bottom:25px;padding-right:100px;padding-top:25px}.valign-middle{vertical-align:middle}.page-article{padding:100px;max-width:780px}body.show-grid .header{background:rgba(255,99,71,.3);outline:2px solid rgba(255,99,71,.8)}body.show-grid .footer{background:rgba(144,238,144,.3);outline:2px solid rgba(144,238,144,.8)}body.show-grid .main{background:rgba(0,191,255,.3);outline:2px solid rgba(0,191,255,.8)}body.show-grid .aside-1{background:rgba(255,215,0,.3);outline:2px solid rgba(255,215,0,.8)}body.show-grid .aside-2{background:rgba(255,105,180,.3);outline:2px solid rgba(255,105,180,.8)}body.show-grid::after{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background-image:linear-gradient(rgba(255,255,255,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.1) 1px,transparent 1px);background-size:20px 20px;pointer-events:none;z-index:1000;mix-blend-mode:overlay}:root{--t3d-duration:2s;--t3d-scene-distance:-200px;--t3d-scene-tilt:47deg;--t3d-scene-rotation:31deg;--t3d-scene-skew:324deg;--t3d-layer-base:20px;--t3d-layer-increment:80px}.t3d-viewport{perspective:4000px;perspective-origin:100% 0}.t3d-scene{position:relative}.t3d-layer{transition:transform var(--t3d-duration)ease-out,margin var(--t3d-duration)ease-out;transform:translate3d(0,0,30px);animation-delay:1.5s;position:absolute}.is-3d .t3d-scene{transform-style:preserve-3d;transform:translate3d(0,0,var(--t3d-scene-distance))scale(1.2)rotateX(var(--t3d-scene-tilt))rotateY(var(--t3d-scene-rotation))rotateZ(var(--t3d-scene-skew))}.is-animated .t3d-layer[data-index="1"]{transform:translateZ(var(--t3d-layer-base))}.is-animated .t3d-layer[data-index="2"]{transform:translateZ(calc(var(--t3d-layer-base) + var(--t3d-layer-increment)))}.is-animated .t3d-layer[data-index="3"]{transform:translateZ(calc(var(--t3d-layer-base) + 2 * var(--t3d-layer-increment)))}.is-animated .t3d-layer[data-index="4"]{transform:translateZ(calc(var(--t3d-layer-base) + 3 * var(--t3d-layer-increment)))}@media(prefers-reduced-motion:reduce){.t3d-scene{transition:none}}.gui-email-client{padding:20px;color:#555;background:rgba(200,200,200,.95);border-radius:10px;height:900px;overflow:hidden;width:100%;box-shadow:0 0 400px #0069af42}.gui-notepad{padding:20px;color:#555;background:rgba(200,200,200,.9);border-radius:10px;height:900px;overflow:hidden;width:100%;box-shadow:0 0 400px #0069af42}.gui-code-editor{opacity:.95;border-radius:10px;border:1px solid var(--border-color);background:var(--bg-primary);width:1600px;height:900px;box-shadow:0 0 400px #0069af42}.editor-header{height:30px;background:var(--bg-tertiary);border-radius:10px 10px 0 0;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;padding:0 12px}.traffic-lights{display:flex;gap:8px}.traffic-light{width:12px;height:12px;border-radius:50%}.traffic-light.red{background:#ff5f57}.traffic-light.yellow{background:#ffbd2e}.traffic-light.green{background:#28ca42}.window-title{color:var(--text-secondary);font-size:13px;font-weight:500}.header-actions{color:var(--text-secondary);font-size:13px}.action-btn{cursor:pointer;padding:4px 8px;border-radius:4px}.action-btn:hover{background:rgba(255,255,255,.1)}.tab-bar{height:36px;background:#181818;border-bottom:1px solid var(--border-color);display:flex;align-items:center}.tab{height:100%;padding:0 12px;display:flex;align-items:center;gap:6px;border-right:1px solid var(--border-color);cursor:pointer;color:var(--text-secondary);font-size:13px;background:var(--bg-secondary)}.tab.active{background:var(--bg-tertiary);color:var(--text-primary)}.tab-icon{font-size:11px}.editor-layout{display:flex;opacity:.9;height:calc(100% - 88px)}.sidebar{width:var(--sidebar-width);background:var(--bg-secondary);border-right:1px solid var(--border-color);display:flex;flex-direction:column}.sidebar-header{padding:8px 12px;border-bottom:1px solid var(--border-color);color:var(--text-secondary);font-size:12px;font-weight:500}.file-tree{flex:1;padding:8px 0}.file-item{padding:4px 12px;color:var(--text-secondary);font-size:13px;cursor:pointer;display:flex;align-items:center;gap:6px}.file-item:hover{background:rgba(255,255,255,5%)}.file-item.active{background:rgba(59,130,246,.2);color:var(--accent-blue)}.code-editor{flex:1;background:var(--bg-tertiary);display:flex;overflow:hidden}.editor-content{flex:1;display:flex}.line-numbers{width:50px;background:#181818;border-right:1px solid var(--border-color);padding:12px 8px;color:var(--text-muted);font-family:monaco,menlo,monospace;font-size:13px;line-height:1.5}.code-content{flex:1;padding:12px 16px;font-family:monaco,menlo,monospace;font-size:13px;line-height:1.5;color:#e8e8e8}.code-line{min-height:19.5px}.comment{color:#6a9955}.keyword{color:#569cd6}.string{color:#ce9178}.identifier{color:#9cdcfe}.function{color:#dcdcaa}.number{color:#b5cea8}.right-sidebar{width:300px;background:var(--bg-secondary);border-left:1px solid var(--border-color);display:flex;flex-direction:column}.todo-content{flex:1;padding:12px;color:var(--text-secondary);font-size:12px;line-height:1.4}.todo-item{margin-bottom:8px;padding-left:8px}.status-bar{height:22px;background:#007acc;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-radius:0 0 10px 10px;color:#fff;font-size:12px}.status-left,.status-right{display:flex;gap:16px}.status-item{font-size:12px}#gui-desktop{z-index:-1;position:fixed;top:0;left:0;right:0;bottom:0}#gui-desktop .t3d-viewport{box-shadow:0 0 400px #0069af42}#gui-desktop .t3d-scene{border-radius:10px;border:1px solid var(--border-color);background:var(--bg-primary);margin:280px auto auto;width:1600px;height:900px}#gui-mvp{--color:#0a7dcb;--secondary-color:blue;--border-color:#0a7dcb;--border-color-hover:#fe4967;--text:#b9c0c5;z-index:-1;position:fixed;top:0;left:0;right:0;bottom:0;color:var(--text);perspective:1200px;display:flex;font-weight:400;align-items:center;justify-content:center}#gui-mvp *{margin:0;padding:0;box-sizing:border-box}#gui-mvp [class*=level-]{transform-style:preserve-3d;border:1px solid var(--border-color);background:0 0;position:relative;margin:2px;padding:8px;font-size:12px;transition:all .3s ease}#gui-mvp .level-0{transform:translateZ(0)}#gui-mvp .level-1{transform:translateZ(12px)}#gui-mvp .level-2{transform:translateZ(24px)}#gui-mvp .level-3{transform:translateZ(36px)}#gui-mvp .level-4{transform:translateZ(48px)}#gui-mvp .level-5{transform:translateZ(90px)}#gui-mvp .app{width:1024px;display:flex;flex-direction:column;border-width:2px;transform:rotateY(-15deg)rotateX(5deg)}#gui-mvp .header{height:60px;display:flex;align-items:center;justify-content:space-between;border-color:var(--border-color)}#gui-mvp .logo{font-weight:700;border-color:var(--border-color)}#gui-mvp .nav{display:flex;gap:4px;border-color:var(--border-color)}#gui-mvp .nav-item{padding:4px 8px;border-color:var(--border-color)}#gui-mvp .main{flex:1;display:flex;border-color:var(--border-color)}#gui-mvp .sidebar{width:200px;border-color:var(--border-color);padding:4px}#gui-mvp .sidebar-item{margin-bottom:4px;border-color:var(--border-color)}#gui-mvp .sidebar-item .item{margin-left:8px;margin-top:2px;border-color:var(--border-color)}#gui-mvp .content{flex:1;border-color:var(--border-color);padding:12px}#gui-mvp .content h2{margin-bottom:8px;border-color:var(--border-color)}#gui-mvp .content h3{margin-bottom:4px;border-color:var(--border-color)}#gui-mvp .section{margin-bottom:12px;border-color:var(--border-color)}#gui-mvp .content .item{margin-bottom:2px;border-color:var(--border-color)}#gui-mvp .footer{height:40px;display:flex;border-color:var(--border-color)}#gui-mvp [class*=level-]:hover{border-color:var(--border-color-hover)}#gui-mvp [class*=level-]::after{content:"*";position:absolute;top:-1px;right:-1px;color:var(--border-color);font-size:8px;padding:1px 3px;border-radius:2px;opacity:.7}#gui-mvp [class*=level-]::before{content:"*";position:absolute;top:-1px;left:-1px;color:var(--border-color);font-size:8px;padding:1px 3px;border-radius:2px;opacity:.7}@keyframes rotate{0%{transform:rotateY(-15deg)rotateX(5deg)}50%{transform:rotateY(15deg)rotateX(-5deg)}100%{transform:rotateY(-15deg)rotateX(5deg)}}#gui-mvp .app.is-animated{animation:rotate 30s ease-in-out infinite}.layout-container{display:flex;flex-direction:column;min-height:100vh}@media(max-width:640px){.main{order:1}.aside-1{order:2}.aside-2{order:3}.footer{order:4}.nav-tabs{display:none}.mobile-nav-toggle{display:flex}.main-nav{position:relative;margin-left:1rem}.header{padding-left:20px;padding-right:20px}.footer{flex-direction:column;height:auto;padding:20px;gap:10px}.footer-left,.footer-right{width:100%}.footer-left{order:2}.footer-right{order:1;font-weight:600}}@media(min-width:641px) and (max-width:799px){.aside-1{order:1}.main{order:2}.aside-2{order:3}.footer{order:4}.nav-item a{padding:6px 12px;font-size:12px}.main-nav{margin-left:1.5rem}.header{padding-left:50px;padding-right:50px}.footer{height:60px;padding:15px 20px}}@media(min-width:800px) and (max-width:1023px){.layout-container{flex-direction:row;flex-wrap:wrap}.content-wrapper{display:flex;width:100%;order:1}.aside-1{order:1}.main{flex:1;order:2}.aside-2{order:3}.footer{width:100%;order:2}.nav-item a{padding:6px 12px;font-size:12px}.main-nav{margin-left:1.5rem}.header{padding-left:50px;padding-right:50px}}@media(min-width:1024px){.layout-container{flex-direction:row;flex-wrap:wrap}.content-wrapper{display:flex;width:100%;order:1}.aside-1{order:1}.main{flex:1;order:2}.aside-2{order:3}.footer{width:100%;order:2}}