:root{--color-bg: #fafafa;--color-surface: #ffffff;--color-text: #1a1a1a;--color-text-secondary: #666666;--color-text-muted: #999999;--color-accent: rgba(34, 193, 195, 1);--color-accent-light: rgba(34, 193, 195, .1);--color-accent-hover: rgba(34, 193, 195, .8);--color-border: rgba(77, 77, 77, .12);--color-border-hover: rgba(77, 77, 77, .25);--color-tag-grey: #777777;--color-tag-blue: #3b82f6;--color-tag-green: #22c55e;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 40px;--space-2xl: 64px;--font-sans: "Inter", sans-serif;--font-body: "Roboto", sans-serif;--max-width: none;--max-width-wide: none;--header-height: 56px;--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--shadow-lg: 0 8px 30px rgba(0, 0, 0, .1);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-full: 9999px}*,*:before,*:after{box-sizing:border-box}body{margin:0;padding-top:var(--header-height);background-color:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}p{color:var(--color-text);font-size:15px;font-family:var(--font-body);font-weight:350;line-height:1.6}h1{color:var(--color-text);font-size:20px;font-family:var(--font-sans);font-weight:450}a{transition:color var(--transition-fast),opacity var(--transition-fast)}.link-styling-remove{color:inherit;text-decoration:none;cursor:pointer}.link-styling-remove:hover{color:var(--color-accent)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.divider{height:2px;background:var(--color-border);width:100%}header{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:center;height:var(--header-height);background:#fafafad9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border)}nav{display:flex;align-items:center;gap:var(--space-lg);width:100%;max-width:var(--max-width-wide);padding:0 var(--space-lg)}.header-title{color:var(--color-text);text-decoration:none;font-family:var(--font-sans);font-weight:600;font-size:16px;margin-right:auto;transition:color var(--transition-fast)}.header-title:hover{color:var(--color-accent)}.header-content{color:var(--color-text-secondary);text-decoration:none;font-family:var(--font-sans);font-size:14px;font-weight:450;padding:6px 0;position:relative;transition:color var(--transition-fast)}.header-content:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--color-accent);transition:width var(--transition-base)}.header-content:hover{color:var(--color-text)}.header-content:hover:after{width:100%}.header-content.active{color:var(--color-text)}.header-content.active:after{width:100%}@media(max-width:768px){nav{gap:var(--space-md);padding:0 var(--space-md)}.header-content{font-size:13px}}.home{padding:var(--space-xl) var(--space-xl);display:flex;flex-direction:column;max-width:var(--max-width);margin:0 auto;animation:fadeIn var(--transition-slow) ease}.home-header{padding:var(--space-xl) 0;border-bottom:1px solid var(--color-border)}.home-title{font-family:var(--font-sans);font-weight:700;font-size:clamp(28px,6vw,48px);margin-bottom:var(--space-sm);letter-spacing:-.02em}.home-subtitle{font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,18px);color:var(--color-text-secondary)}.home-section{padding:var(--space-lg) 0;border-bottom:1px solid var(--color-border);animation:fadeInUp var(--transition-slow) ease both;animation-delay:.1s}.home-section-title{font-family:var(--font-sans);font-weight:600;font-size:clamp(18px,4vw,28px);margin-bottom:var(--space-md)}.home-section-text{font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,17px);line-height:1.7;margin-bottom:var(--space-md);color:var(--color-text-secondary)}.home-section-text:last-child{margin-bottom:0}@media(max-width:768px){.home{padding:var(--space-lg) var(--space-md)}}.projects{display:flex;flex-direction:row;max-width:var(--max-width-wide);margin:0 auto;min-height:calc(100vh - var(--header-height));animation:fadeIn var(--transition-slow) ease}.projects-sidebar{width:260px;min-width:260px;border-right:1px solid var(--color-border);padding:var(--space-lg) 0;display:flex;flex-direction:column;gap:var(--space-xs);position:sticky;top:var(--header-height);height:calc(100vh - var(--header-height));overflow-y:auto}.projects-sidebar-title{font-family:var(--font-sans);font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);padding:0 var(--space-lg) var(--space-md)}.projects-sidebar-group{padding-bottom:var(--space-sm);margin-bottom:var(--space-sm);border-bottom:1px solid var(--color-border)}.projects-sidebar-group:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.projects-sidebar-status{font-family:var(--font-sans);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);padding:var(--space-sm) var(--space-lg) var(--space-xs)}.project-sidebar-item{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast);border-left:3px solid transparent;-webkit-user-select:none;user-select:none}.project-sidebar-item:hover{background:var(--color-accent-light)}.project-sidebar-item.active{background:var(--color-accent-light);border-left-color:var(--color-accent)}.project-sidebar-icon{width:36px;height:36px;border-radius:var(--radius-sm);object-fit:contain}.project-sidebar-icon-placeholder{width:36px;height:36px;border-radius:var(--radius-sm);background:var(--color-accent);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-sans);font-weight:700;font-size:16px;flex-shrink:0}.project-sidebar-info{display:flex;flex-direction:column;gap:2px;min-width:0}.project-sidebar-name{font-family:var(--font-sans);font-weight:600;font-size:15px;color:var(--color-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-sidebar-tagline{font-family:var(--font-sans);font-weight:400;font-size:12px;color:var(--color-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.projects-main{flex:1;padding:var(--space-xl) var(--space-xl);overflow-y:auto;animation:fadeIn var(--transition-base) ease}.project-detail{animation:fadeInUp var(--transition-base) ease}.project-detail-header{display:flex;align-items:flex-start;gap:var(--space-lg);margin-bottom:var(--space-lg)}.project-detail-icon{width:64px;height:64px;border-radius:var(--radius-md);object-fit:contain;flex-shrink:0}.project-detail-icon-placeholder{width:64px;height:64px;border-radius:var(--radius-md);background:var(--color-accent);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-sans);font-weight:700;font-size:28px;flex-shrink:0}.project-detail-title-area{display:flex;flex-direction:column;gap:var(--space-xs)}.project-detail-title{font-family:var(--font-sans);font-weight:700;font-size:clamp(24px,4vw,36px);letter-spacing:-.02em}.project-detail-subtitle{font-family:var(--font-sans);font-weight:400;font-size:clamp(14px,2.5vw,18px);color:var(--color-text-secondary)}.project-detail-tags{display:flex;flex-wrap:wrap;gap:var(--space-sm);margin-bottom:var(--space-lg)}.project-tag{font-family:var(--font-sans);font-weight:500;font-size:12px;padding:5px 14px;border-radius:var(--radius-full);white-space:nowrap;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.project-tag:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.project-tag--outline{color:var(--color-text);border:1.5px solid var(--color-text)}.project-tag--outline a{color:inherit;text-decoration:none}.project-tag--outline:hover{border-color:var(--color-accent);color:var(--color-accent)}.project-tag--outline:hover a{color:var(--color-accent)}.project-tag--grey{color:#fff;background:var(--color-tag-grey)}.project-tag--blue{color:#fff;background:var(--color-tag-blue)}.project-tag--green{color:#fff;background:var(--color-tag-green)}.project-detail-section{margin-bottom:var(--space-lg)}.project-detail-section-title{font-family:var(--font-sans);font-weight:600;font-size:14px;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted);margin-bottom:var(--space-sm)}.project-detail-text{font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,16px);line-height:1.7;color:var(--color-text-secondary)}.project-detail-oneliners{font-family:var(--font-sans);font-weight:400;font-size:clamp(14px,2.5vw,16px);line-height:1.6;color:var(--color-text-secondary)}.project-screenshots{margin-top:var(--space-xl);padding:var(--space-xl);background:var(--color-accent);border-radius:var(--radius-lg);display:flex;flex-direction:column;align-items:center;gap:var(--space-lg)}.project-screenshot-main{max-width:100%;width:100%;height:auto;border-radius:var(--radius-md);box-shadow:var(--shadow-lg);transition:transform var(--transition-base)}.project-screenshot-main:hover{transform:scale(1.01)}.project-screenshots-row{display:flex;gap:var(--space-md);width:100%;justify-content:center}.project-screenshot-thumb{max-width:200px;width:100%;height:auto;border-radius:var(--radius-md);box-shadow:var(--shadow-md);transition:transform var(--transition-base)}.project-screenshot-thumb:hover{transform:scale(1.03)}.project-visit-link{display:inline-flex;align-items:center;gap:var(--space-sm);font-family:var(--font-sans);font-weight:500;font-size:15px;color:var(--color-accent);text-decoration:none;padding:var(--space-sm) 0;transition:gap var(--transition-fast);margin-bottom:var(--space-lg)}.project-visit-link:hover{gap:var(--space-md)}.project-visit-link:after{content:"→"}@media(max-width:768px){.projects{flex-direction:column}.projects-sidebar{width:100%;min-width:unset;position:relative;top:unset;height:auto;border-right:none;border-bottom:1px solid var(--color-border);flex-direction:row;overflow-x:auto;padding:var(--space-md) 0;gap:0}.projects-sidebar-title{display:none}.project-sidebar-item{flex-direction:column;padding:var(--space-sm) var(--space-md);border-left:none;border-bottom:3px solid transparent;min-width:fit-content}.project-sidebar-item.active{border-left-color:transparent;border-bottom-color:var(--color-accent)}.project-sidebar-tagline{display:none}.projects-main{padding:var(--space-lg) var(--space-md)}.project-screenshots-row{flex-direction:column;align-items:center}.project-screenshot-thumb{max-width:100%}}.blog{padding:var(--space-xl) var(--space-xl);display:flex;flex-direction:column;max-width:var(--max-width);margin:0 auto;animation:fadeIn var(--transition-slow) ease}.blog-header{padding:var(--space-xl) 0;border-bottom:1px solid var(--color-border)}.blog-title{font-family:var(--font-sans);font-weight:700;font-size:clamp(28px,6vw,48px);margin-bottom:var(--space-sm);letter-spacing:-.02em}.blog-subtitle{font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,18px);color:var(--color-text-secondary)}.blog-list{display:flex;flex-direction:column}.blog-loading,.blog-empty{font-family:var(--font-sans);font-weight:300;font-size:16px;color:var(--color-text-muted);padding:var(--space-xl) 0}.blog-post{padding:var(--space-lg) 0;border-bottom:1px solid var(--color-border);transition:background var(--transition-fast)}.blog-post-header{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;cursor:pointer;gap:var(--space-md)}.blog-post-header-left{display:flex;flex-direction:column;gap:var(--space-xs)}.blog-post-toggle{font-family:var(--font-sans);font-size:12px;color:var(--color-text-muted);-webkit-user-select:none;user-select:none;flex-shrink:0;margin-top:4px}.blog-post-title{font-family:var(--font-sans);font-weight:700;font-size:clamp(18px,3.5vw,26px);letter-spacing:-.01em;transition:color var(--transition-fast)}.blog-post-header:hover .blog-post-title{color:var(--color-accent)}.blog-post-subtitle{font-family:var(--font-sans);font-weight:400;font-size:clamp(13px,2.5vw,16px);color:var(--color-text-secondary)}.blog-post-date{font-family:var(--font-sans);font-weight:400;font-size:clamp(12px,2vw,14px);color:var(--color-text-muted);white-space:nowrap}.blog-post-content{margin-top:var(--space-lg);padding-left:var(--space-lg);animation:fadeInUp var(--transition-base) ease}.blog-post-section-header{font-family:var(--font-sans);font-weight:600;font-size:clamp(16px,3vw,22px);margin:var(--space-lg) 0 var(--space-md) 0;color:var(--color-text)}.blog-post-section-subheader{font-family:var(--font-sans);font-weight:500;font-size:clamp(14px,2.5vw,18px);margin:var(--space-md) 0 var(--space-sm) 0;color:var(--color-text)}.blog-post-text{font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,17px);line-height:1.7;color:var(--color-text-secondary)}.blog-post-text p{margin:0 0 var(--space-md) 0;font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,17px);color:var(--color-text-secondary)}.blog-post-text p:empty{display:none}.blog-post-html{font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,17px);line-height:1.7;color:var(--color-text-secondary);margin-bottom:var(--space-md)}@media(max-width:768px){.blog{padding:var(--space-lg) var(--space-md)}}.content-page{padding:var(--space-xl) var(--space-xl);display:flex;flex-direction:column;max-width:var(--max-width);margin:0 auto;animation:fadeIn var(--transition-slow) ease}.content-page-header{padding:var(--space-xl) 0;border-bottom:1px solid var(--color-border)}.content-page-title{font-family:var(--font-sans);font-weight:700;font-size:clamp(28px,6vw,48px);margin-bottom:var(--space-sm);letter-spacing:-.02em}.content-page-subtitle{font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,18px);color:var(--color-text-secondary)}.content-list{display:flex;flex-direction:column}.content-loading,.content-empty{font-family:var(--font-sans);font-weight:300;font-size:16px;color:var(--color-text-muted);padding:var(--space-xl) 0}.content-item{padding:var(--space-lg) 0;border-bottom:1px solid var(--color-border)}.content-item-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;cursor:pointer;gap:var(--space-md);transition:color var(--transition-fast)}.content-item-header:hover .content-item-title{color:var(--color-accent)}.content-item-header-left{display:flex;flex-direction:row;align-items:center;gap:var(--space-md)}.content-item-toggle{font-family:var(--font-sans);font-size:12px;color:var(--color-text-muted);-webkit-user-select:none;user-select:none;transition:transform var(--transition-fast)}.content-item-toggle.expanded{transform:rotate(90deg)}.content-item-title{font-family:var(--font-sans);font-weight:600;font-size:clamp(16px,3.5vw,22px);transition:color var(--transition-fast)}.content-item-date{font-family:var(--font-sans);font-weight:400;font-size:clamp(12px,2vw,14px);color:var(--color-text-muted);white-space:nowrap}.content-item-tags{display:flex;flex-wrap:wrap;gap:var(--space-sm);margin-top:var(--space-sm)}.content-item-tag{font-family:var(--font-sans);font-weight:400;font-size:12px;color:var(--color-text-muted)}.content-item-body{margin-top:var(--space-lg);padding-left:var(--space-lg);animation:fadeInUp var(--transition-base) ease}.content-item-text{font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,17px);line-height:1.7;color:var(--color-text-secondary)}.content-item-text p{margin:0 0 var(--space-md) 0;font-family:var(--font-sans);font-weight:300;font-size:clamp(14px,2.5vw,17px);color:var(--color-text-secondary)}.content-item-text p:empty{display:none}.content-item-section-header{font-family:var(--font-sans);font-weight:600;font-size:clamp(16px,3vw,22px);margin:var(--space-lg) 0 var(--space-md) 0;color:var(--color-text)}.content-item-section-subheader{font-family:var(--font-sans);font-weight:500;font-size:clamp(14px,2.5vw,18px);margin:var(--space-md) 0 var(--space-sm) 0;color:var(--color-text)}.content-item-image-block{margin:var(--space-lg) 0;display:flex;flex-direction:column;align-items:flex-start}.content-item-image{max-width:100%;height:auto;border-radius:var(--radius-md);border:1px solid var(--color-border);transition:box-shadow var(--transition-base)}.content-item-image:hover{box-shadow:var(--shadow-md)}.content-item-image-caption{font-family:var(--font-sans);font-weight:400;font-size:14px;color:var(--color-text-muted);margin-top:var(--space-sm);font-style:italic}@media(max-width:768px){.content-page{padding:var(--space-lg) var(--space-md)}}.spacecannon-map-wrapper{display:flex;justify-content:center;align-items:center}.spacecannon-map{position:relative}.spacecannon-aim{position:fixed;width:50px;height:50px;border-style:solid;border-color:#000;border-width:2px;pointer-events:none;transform:translate(-50%,-50%);z-index:9998}.spacecannon-aim-north{position:fixed;width:0px;height:100vh;border-style:solid;border-color:#000;border-width:0 2px 0 0;pointer-events:none;transform:translateY(calc(-100% - 25px));z-index:9998}.spacecannon-aim-south{position:fixed;width:0px;height:100vh;border-style:solid;border-color:#000;border-width:0 2px 0 0;pointer-events:none;transform:translateY(25px);z-index:9998}.spacecannon-aim-east{position:fixed;width:100vw;height:0px;border-style:solid;border-color:#000;border-width:2px 0 0 0;pointer-events:none;transform:translate(25px);z-index:9998}.spacecannon-aim-west{position:fixed;width:100vw;height:0px;border-style:solid;border-color:#000;border-width:2px 0 0 0;pointer-events:none;transform:translate(calc(-100% - 25px));z-index:9998}