:root{--md-sys-color-primary:#9ECAFF;--md-sys-color-on-primary:#003258;--md-sys-color-primary-container:#004A7D;--md-sys-color-on-primary-container:#CEE5FF;--md-sys-color-secondary:#BBC8DB;--md-sys-color-on-secondary:#253140;--md-sys-color-secondary-container:#3B4858;--md-sys-color-on-secondary-container:#D7E3F7;--md-sys-color-tertiary:#6DD4E0;--md-sys-color-on-tertiary:#003740;--md-sys-color-tertiary-container:#004E59;--md-sys-color-on-tertiary-container:#89F0FD;--md-sys-color-error:#FFB4AB;--md-sys-color-error-container:#93000A;--md-sys-color-background:#0F1418;--md-sys-color-on-background:#DEE3EA;--md-sys-color-surface:#0F1418;--md-sys-color-on-surface:#DEE3EA;--md-sys-color-surface-variant:#40484F;--md-sys-color-on-surface-variant:#C0C8D0;--md-sys-color-surface-container-lowest:#0A0E12;--md-sys-color-surface-container-low:#171D22;--md-sys-color-surface-container:#1B2128;--md-sys-color-surface-container-high:#252C34;--md-sys-color-surface-container-highest:#303740;--md-sys-color-outline:#8A9199;--md-sys-color-outline-variant:#40484F;--md-sys-color-inverse-surface:#DEE3EA;--md-sys-color-inverse-on-surface:#2B3138;--md-sys-color-inverse-primary:#155FA0;--md-sys-state-hover-opacity:0.08;--md-sys-state-pressed-opacity:0.12;--md-sys-state-focused-opacity:0.12;--md-elevation-1:rgba(158,202,255,0.05);--md-elevation-2:rgba(158,202,255,0.08);--md-elevation-3:rgba(158,202,255,0.11);--md-typescale-display-large-size:57px;--md-typescale-display-medium-size:45px;--md-typescale-display-small-size:36px;--md-typescale-headline-large-size:32px;--md-typescale-headline-medium-size:28px;--md-typescale-headline-small-size:24px;--md-typescale-title-large-size:22px;--md-typescale-title-medium-size:16px;--md-typescale-title-small-size:14px;--md-typescale-body-large-size:16px;--md-typescale-body-medium-size:14px;--md-typescale-body-small-size:12px;--md-typescale-label-large-size:14px;--md-typescale-label-medium-size:12px;--md-typescale-label-small-size:11px;--md-sys-shape-corner-none:0px;--md-sys-shape-corner-extra-small:4px;--md-sys-shape-corner-small:8px;--md-sys-shape-corner-medium:12px;--md-sys-shape-corner-large:16px;--md-sys-shape-corner-extra-large:28px;--md-sys-shape-corner-full:9999px;--md-sys-motion-duration-short1:50ms;--md-sys-motion-duration-short2:100ms;--md-sys-motion-duration-short3:150ms;--md-sys-motion-duration-short4:200ms;--md-sys-motion-duration-medium1:250ms;--md-sys-motion-duration-medium2:300ms;--md-sys-motion-duration-medium3:350ms;--md-sys-motion-duration-long1:400ms;--md-sys-motion-duration-long2:450ms;--md-sys-motion-easing-standard:cubic-bezier(0.2,0,0,1);--md-sys-motion-easing-emphasized:cubic-bezier(0.2,0,0,1);--md-sys-motion-easing-decelerate:cubic-bezier(0,0,0,1);--md-sys-motion-easing-accelerate:cubic-bezier(0.3,0,1,1);--layout-max-width:1140px;--nav-height:64px}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-height)+16px)}body{font-family:'Google Sans',system-ui,sans-serif;font-size:var(--md-typescale-body-large-size);background-color:var(--md-sys-color-background);color:var(--md-sys-color-on-background);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}img{display:block;max-width:100%}a{color:var(--md-sys-color-primary);text-decoration:none}a:hover{text-decoration:underline}.top-app-bar{position:fixed;inset:0 0 auto 0;height:var(--nav-height);background:color-mix(in srgb,var(--md-sys-color-surface-container-low) 96%,transparent);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);border-bottom:1px solid var(--md-sys-color-outline-variant);z-index:100;display:flex;align-items:center;padding:0 24px;gap:16px}.top-app-bar .brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}.top-app-bar .brand-icon{width:32px;height:32px;border-radius:var(--md-sys-shape-corner-small);background:var(--md-sys-color-primary-container);display:flex;align-items:center;justify-content:center}.top-app-bar .brand-icon svg{width:18px;height:18px;fill:var(--md-sys-color-on-primary-container)}.top-app-bar .brand-name{font-family:'Google Sans Display',sans-serif;font-size:18px;font-weight:700;color:var(--md-sys-color-on-surface);letter-spacing:-0.3px}.top-app-bar .brand-name span{color:var(--md-sys-color-primary)}.nav-links{display:flex;align-items:center;gap:4px;margin-left:auto;list-style:none}.nav-links a{display:flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--md-sys-shape-corner-full);font-size:var(--md-typescale-label-large-size);font-weight:500;color:var(--md-sys-color-on-surface-variant);text-decoration:none;transition:background var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard),color var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard)}.nav-links a:hover{background:rgba(158,202,255,var(--md-sys-state-hover-opacity));color:var(--md-sys-color-on-surface);text-decoration:none}.nav-links a.active{background:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.nav-links a svg{width:16px;height:16px;flex-shrink:0}.nav-cta{margin-left:8px}.hamburger{display:none;background:none;border:none;color:var(--md-sys-color-on-surface);cursor:pointer;padding:8px;border-radius:var(--md-sys-shape-corner-full);margin-left:auto}.drawer{display:block!important;visibility:hidden;pointer-events:none;position:fixed;inset:0;z-index:200;transition:visibility 0s linear 420ms}.drawer-scrim{position:absolute;inset:0;background:rgba(0,0,0,0.5);backdrop-filter:blur(2px);opacity:0;transition:opacity var(--md-sys-motion-duration-medium2) var(--md-sys-motion-easing-standard)}.drawer-panel{position:absolute;top:0;right:0;width:280px;height:100%;background:var(--md-sys-color-surface-container-low);padding:24px 16px;transform:translateX(100%);transition:transform var(--md-sys-motion-duration-medium3) var(--md-sys-motion-easing-emphasized);display:flex;flex-direction:column;gap:4px}.drawer.open{visibility:visible!important;pointer-events:auto;transition:visibility 0s linear 0s}.drawer.open .drawer-scrim{opacity:1}.drawer.open .drawer-panel{transform:translateX(0)}.drawer-panel a{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--md-sys-shape-corner-large);color:var(--md-sys-color-on-surface);font-size:15px;font-weight:500;text-decoration:none}.drawer-panel a:hover{background:rgba(158,202,255,0.08)}.drawer-panel a svg{width:20px;height:20px;color:var(--md-sys-color-on-surface-variant)}.drawer-close{display:flex;align-self:flex-end;background:none;border:none;color:var(--md-sys-color-on-surface-variant);cursor:pointer;padding:8px;border-radius:var(--md-sys-shape-corner-full);margin-bottom:8px}main{padding-top:var(--nav-height)}.container{max-width:var(--layout-max-width);margin:0 auto;padding:0 24px}section{padding:80px 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 24px;border-radius:var(--md-sys-shape-corner-full);font-family:'Google Sans',sans-serif;font-size:var(--md-typescale-label-large-size);font-weight:500;letter-spacing:0.1px;cursor:pointer;text-decoration:none;border:none;position:relative;overflow:hidden;transition:box-shadow var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard),background var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard)}.btn::before{content:'';position:absolute;inset:0;background:currentColor;opacity:0;transition:opacity var(--md-sys-motion-duration-short3)}.btn:hover::before{opacity:var(--md-sys-state-hover-opacity)}.btn:active::before{opacity:var(--md-sys-state-pressed-opacity)}.btn-filled{background:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary)}.btn-filled:hover{box-shadow:0 1px 3px rgba(0,0,0,.3),0 4px 8px rgba(0,0,0,.15);text-decoration:none;color:var(--md-sys-color-on-primary)}.btn-tonal{background:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.btn-tonal:hover{box-shadow:0 1px 3px rgba(0,0,0,.2);text-decoration:none;color:var(--md-sys-color-on-secondary-container)}.btn-outlined{background:transparent;color:var(--md-sys-color-primary);border:1px solid var(--md-sys-color-outline)}.btn-outlined:hover{background:rgba(158,202,255,0.08);text-decoration:none}.btn-text{background:transparent;color:var(--md-sys-color-primary);padding:10px 12px}.btn svg{width:18px;height:18px;flex-shrink:0}.card{background:var(--md-sys-color-surface-container);border-radius:var(--md-sys-shape-corner-extra-large);position:relative;overflow:hidden}.card-elevated{background:color-mix(in srgb,var(--md-sys-color-surface-container-high) 100%,transparent);box-shadow:0 1px 2px rgba(0,0,0,.3),0 2px 6px rgba(0,0,0,.15)}.card-filled{background:var(--md-sys-color-surface-container-highest)}.card-outlined{background:var(--md-sys-color-surface);border:1px solid var(--md-sys-color-outline-variant)}.hero{padding:96px 0 80px;position:relative;overflow:hidden}.hero-bg{position:absolute;inset:0;pointer-events:none;z-index:0}.hero-blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:0.18}.hero-blob-1{width:600px;height:600px;background:var(--md-sys-color-primary);top:-200px;left:-100px;animation:blob-float 8s ease-in-out infinite}.hero-blob-2{width:500px;height:500px;background:var(--md-sys-color-tertiary);top:-100px;right:-150px;animation:blob-float 10s ease-in-out infinite reverse}.hero-blob-3{width:300px;height:300px;background:var(--md-sys-color-secondary);bottom:-50px;left:30%;animation:blob-float 12s ease-in-out infinite 2s}@keyframes blob-float{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(20px,-15px) scale(1.03)}66%{transform:translate(-15px,10px) scale(0.97)}}.hero-grid{position:absolute;inset:0;background-image:linear-gradient(var(--md-sys-color-outline-variant) 1px,transparent 1px),linear-gradient(90deg,var(--md-sys-color-outline-variant) 1px,transparent 1px);background-size:48px 48px;opacity:0.06;mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,black 30%,transparent 100%)}.hero .container{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}.hero-content{}.hero-badge{display:inline-flex;align-items:center;gap:6px;background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container);padding:6px 14px;border-radius:var(--md-sys-shape-corner-full);font-size:var(--md-typescale-label-medium-size);font-weight:500;letter-spacing:0.5px;text-transform:uppercase;margin-bottom:20px}.hero-badge svg{width:14px;height:14px}.hero-title{font-family:'Google Sans Display',sans-serif;font-size:clamp(36px,5vw,56px);font-weight:700;line-height:1.1;letter-spacing:-1px;color:var(--md-sys-color-on-surface);margin-bottom:20px}.hero-title .accent{color:var(--md-sys-color-primary)}.hero-desc{font-size:var(--md-typescale-body-large-size);color:var(--md-sys-color-on-surface-variant);line-height:1.7;margin-bottom:36px;max-width:480px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-stats{display:flex;gap:32px;margin-top:40px;padding-top:32px;border-top:1px solid var(--md-sys-color-outline-variant)}.hero-stat-value{font-family:'Google Sans Display',sans-serif;font-size:28px;font-weight:700;color:var(--md-sys-color-primary)}.hero-stat-label{font-size:var(--md-typescale-body-small-size);color:var(--md-sys-color-on-surface-variant);margin-top:2px}.hero-visual{display:flex;justify-content:center;align-items:center;position:relative}.phone-mockup{position:relative;width:280px}.phone-frame{background:#0a0c10;border-radius:44px;padding:10px;border:2px solid rgba(255,255,255,0.08);box-shadow:0 0 0 1px rgba(0,0,0,0.5),0 40px 80px rgba(0,0,0,0.6),0 0 60px rgba(158,202,255,0.06);position:relative;z-index:1}.phone-screen{border-radius:36px;overflow:hidden;aspect-ratio:9/19.5;background:#0f1418;position:relative}.phone-screen img{width:100%;height:100%;object-fit:cover}.phone-glow{position:absolute;bottom:-40px;left:50%;transform:translateX(-50%);width:200px;height:200px;background:var(--md-sys-color-primary);filter:blur(60px);opacity:0.15;border-radius:50%;z-index:0}.phone-dot{position:absolute;border-radius:50%;background:var(--md-sys-color-primary);opacity:0.5;animation:ping 2s ease-in-out infinite}.phone-dot-1{width:8px;height:8px;top:20%;right:-20px;animation-delay:0s}.phone-dot-2{width:5px;height:5px;top:55%;right:-35px;animation-delay:0.7s}.phone-dot-3{width:6px;height:6px;bottom:25%;left:-25px;animation-delay:1.4s}@keyframes ping{0%,100%{transform:scale(1);opacity:0.5}50%{transform:scale(1.5);opacity:0.15}}.section-header{margin-bottom:48px}.section-eyebrow{font-size:var(--md-typescale-label-large-size);font-weight:500;letter-spacing:1.5px;text-transform:uppercase;color:var(--md-sys-color-tertiary);margin-bottom:10px;display:flex;align-items:center;gap:8px}.section-eyebrow::before{display:none}.section-title{font-family:'Google Sans Display',sans-serif;font-size:clamp(28px,4vw,40px);font-weight:700;color:var(--md-sys-color-on-surface);letter-spacing:-0.5px;line-height:1.15;margin-bottom:12px}.section-desc{font-size:var(--md-typescale-body-large-size);color:var(--md-sys-color-on-surface-variant);max-width:560px;line-height:1.7}.section-header.center{text-align:center}.section-header.center .section-eyebrow{justify-content:center}.section-header.center .section-eyebrow::before{display:none}.section-header.center .section-desc{margin:0 auto}#features{background:var(--md-sys-color-surface-container-lowest)}.features-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}.feature-card{padding:28px;border-radius:var(--md-sys-shape-corner-extra-large);background:var(--md-sys-color-surface-container);border:1px solid transparent;transition:transform var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-emphasized),border-color var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-standard),box-shadow var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-standard);cursor:default}.feature-card:hover{transform:translateY(-4px);border-color:var(--md-sys-color-primary-container);box-shadow:0 8px 24px rgba(0,0,0,0.3)}.feature-icon-wrap{width:52px;height:52px;border-radius:var(--md-sys-shape-corner-large);display:flex;align-items:center;justify-content:center;margin-bottom:16px}.feature-icon-wrap svg{width:26px;height:26px}.feature-icon-primary{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.feature-icon-secondary{background:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.feature-icon-tertiary{background:var(--md-sys-color-tertiary-container);color:var(--md-sys-color-on-tertiary-container)}.feature-icon-error{background:var(--md-sys-color-error-container);color:var(--md-sys-color-error)}.feature-title{font-size:var(--md-typescale-title-medium-size);font-weight:600;color:var(--md-sys-color-on-surface);margin-bottom:8px;letter-spacing:-0.1px}.feature-desc{font-size:var(--md-typescale-body-medium-size);color:var(--md-sys-color-on-surface-variant);line-height:1.6}#preview{background:var(--md-sys-color-background)}.carousel-wrapper{position:relative;}.carousel-outer{position:relative;overflow:hidden;border-radius:var(--md-sys-shape-corner-extra-large);background:var(--md-sys-color-surface-container-lowest);padding:40px 0 32px}.carousel-viewport{overflow:hidden;cursor:grab;touch-action:pan-y;user-select:none;padding:0 calc(50% - 140px)}.carousel-viewport:active{cursor:grabbing}.carousel-track{display:flex;gap:20px;transition:transform 0.45s cubic-bezier(0.2,0,0,1);will-change:transform}.carousel-slide{flex:0 0 280px;border-radius:var(--md-sys-shape-corner-extra-large);overflow:hidden;position:relative;transition:transform 0.45s cubic-bezier(0.2,0,0,1),filter 0.45s cubic-bezier(0.2,0,0,1),opacity 0.45s cubic-bezier(0.2,0,0,1);transform:scale(0.88);filter:brightness(0.55) saturate(0.6);opacity:0.65}.carousel-slide.is-active{transform:scale(1);filter:brightness(1) saturate(1);opacity:1}.carousel-slide img{width:100%;display:block;border-radius:var(--md-sys-shape-corner-extra-large);pointer-events:none;aspect-ratio:9/19.5;object-fit:cover}.carousel-controls{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:28px;padding:0 24px}.carousel-counter{font-size:var(--md-typescale-label-medium-size);color:var(--md-sys-color-on-surface-variant);font-variant-numeric:tabular-nums;min-width:40px;text-align:right}.carousel-dots{display:flex;gap:6px}.carousel-dot{width:6px;height:6px;border-radius:3px;background:var(--md-sys-color-surface-container-highest);transition:width var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-emphasized),background var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-standard);cursor:pointer;border:none}.carousel-dot.active{width:28px;background:var(--md-sys-color-primary)}.carousel-counter-right{font-size:var(--md-typescale-label-medium-size);color:var(--md-sys-color-on-surface-variant);font-variant-numeric:tabular-nums;min-width:40px}.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:var(--md-sys-shape-corner-full);background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);color:var(--md-sys-color-on-surface);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;transition:background var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard),box-shadow var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard)}.carousel-arrow:hover{background:var(--md-sys-color-surface-container-highest);box-shadow:0 2px 8px rgba(0,0,0,.3)}.carousel-arrow svg{width:20px;height:20px}.carousel-prev{left:16px}.carousel-next{right:16px}.carousel-thumbs{display:flex;gap:8px;justify-content:center;padding:16px 24px 0;flex-wrap:wrap}.carousel-thumb{width:44px;height:44px;border-radius:var(--md-sys-shape-corner-small);overflow:hidden;cursor:pointer;border:2px solid transparent;opacity:0.5;transition:border-color var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-standard),opacity var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-standard),transform var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-emphasized);flex-shrink:0}.carousel-thumb img{width:100%;height:100%;object-fit:cover}.carousel-thumb.active{border-color:var(--md-sys-color-primary);opacity:1;transform:scale(1.1)}#requirements{}.specs-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.spec-card{padding:24px 28px;border-radius:var(--md-sys-shape-corner-extra-large);background:var(--md-sys-color-surface-container);display:flex;align-items:flex-start;gap:16px}.spec-icon{width:48px;height:48px;border-radius:var(--md-sys-shape-corner-medium);background:var(--md-sys-color-primary-container);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--md-sys-color-on-primary-container)}.spec-icon svg{width:24px;height:24px}.spec-label{font-size:var(--md-typescale-label-medium-size);color:var(--md-sys-color-on-surface-variant);text-transform:uppercase;letter-spacing:0.5px;font-weight:500;margin-bottom:4px}.spec-value{font-size:var(--md-typescale-title-medium-size);font-weight:600;color:var(--md-sys-color-on-surface)}#download{background:var(--md-sys-color-surface-container-lowest)}.download-card{background:linear-gradient(135deg,var(--md-sys-color-primary-container) 0%,color-mix(in srgb,var(--md-sys-color-tertiary-container) 50%,var(--md-sys-color-primary-container)) 100% );border-radius:var(--md-sys-shape-corner-extra-large);padding:56px 64px;display:flex;align-items:center;gap:48px;position:relative;overflow:hidden}.download-card::before{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Ccircle cx='20' cy='20' r='1'/%3E%3C/g%3E%3C/svg%3E")}.download-content{flex:1;position:relative;z-index:1}.download-title{font-family:'Google Sans Display',sans-serif;font-size:var(--md-typescale-headline-medium-size);font-weight:700;color:var(--md-sys-color-on-primary-container);margin-bottom:10px;letter-spacing:-0.3px}.download-desc{font-size:var(--md-typescale-body-large-size);color:color-mix(in srgb,var(--md-sys-color-on-primary-container) 75%,transparent);margin-bottom:28px}.download-actions{display:flex;gap:12px;flex-wrap:wrap}.download-visual{position:relative;z-index:1;flex-shrink:0}.download-icon-wrap{width:120px;height:120px;border-radius:32px;background:rgba(255,255,255,0.12);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,0.15)}.download-icon-wrap svg{width:56px;height:56px;color:var(--md-sys-color-on-primary-container)}.bug-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.bug-card{padding:24px;border-radius:var(--md-sys-shape-corner-extra-large);background:var(--md-sys-color-surface-container);border-left:3px solid var(--md-sys-color-outline-variant);transition:border-color var(--md-sys-motion-duration-medium1)}.bug-card:hover{border-left-color:var(--md-sys-color-primary)}.bug-type{font-size:var(--md-typescale-label-large-size);font-weight:600;color:var(--md-sys-color-primary);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:8px;display:flex;align-items:center;gap:6px}.bug-type svg{width:16px;height:16px}.bug-title{font-size:var(--md-typescale-title-small-size);font-weight:600;color:var(--md-sys-color-on-surface);margin-bottom:8px}.bug-desc{font-size:var(--md-typescale-body-small-size);color:var(--md-sys-color-on-surface-variant);line-height:1.6}#contributors{background:var(--md-sys-color-surface-container-lowest)}.contributors-grid{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}.contributor-chip{display:inline-flex;align-items:center;gap:10px;padding:10px 18px 10px 10px;background:var(--md-sys-color-surface-container);border-radius:var(--md-sys-shape-corner-full);text-decoration:none;border:1px solid var(--md-sys-color-outline-variant);transition:background var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard),border-color var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard),transform var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-emphasized)}.contributor-chip:hover{background:var(--md-sys-color-surface-container-high);border-color:var(--md-sys-color-primary-container);transform:translateY(-2px);text-decoration:none}.contributor-avatar{width:36px;height:36px;border-radius:50%;background:var(--md-sys-color-primary-container);display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;color:var(--md-sys-color-on-primary-container);flex-shrink:0;overflow:hidden}.contributor-avatar img{width:100%;height:100%;object-fit:cover}.contributor-name{font-size:var(--md-typescale-label-large-size);font-weight:600;color:var(--md-sys-color-on-surface)}.contributor-role{font-size:var(--md-typescale-label-small-size);color:var(--md-sys-color-on-surface-variant);margin-top:1px}footer{background:var(--md-sys-color-surface-container-lowest);border-top:1px solid var(--md-sys-color-outline-variant);padding:40px 0 32px}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}.footer-brand{display:flex;align-items:center;gap:10px}.footer-brand-icon{width:28px;height:28px;border-radius:var(--md-sys-shape-corner-extra-small);background:var(--md-sys-color-primary-container);display:flex;align-items:center;justify-content:center}.footer-brand-icon svg{width:15px;height:15px;fill:var(--md-sys-color-on-primary-container)}.footer-name{font-weight:700;font-size:15px;color:var(--md-sys-color-on-surface)}.footer-copy{font-size:var(--md-typescale-body-small-size);color:var(--md-sys-color-on-surface-variant)}.footer-links{display:flex;gap:20px;list-style:none}.footer-links a{font-size:var(--md-typescale-label-large-size);color:var(--md-sys-color-on-surface-variant);text-decoration:none;transition:color var(--md-sys-motion-duration-short3)}.footer-links a:hover{color:var(--md-sys-color-primary);text-decoration:none}.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:var(--md-sys-shape-corner-full);font-size:var(--md-typescale-label-medium-size);font-weight:500}.chip-assist{background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface);border:1px solid var(--md-sys-color-outline)}.divider{height:1px;background:var(--md-sys-color-outline-variant);border:none;margin:0}.reveal{opacity:0;transform:translateY(24px);transition:opacity var(--md-sys-motion-duration-long1) var(--md-sys-motion-easing-decelerate),transform var(--md-sys-motion-duration-long1) var(--md-sys-motion-easing-emphasized)}.reveal.visible{opacity:1;transform:none}.reveal-stagger>*{opacity:0;transform:translateY(20px);transition:opacity var(--md-sys-motion-duration-long1) var(--md-sys-motion-easing-decelerate),transform var(--md-sys-motion-duration-long1) var(--md-sys-motion-easing-emphasized)}.reveal-stagger.visible>*:nth-child(1){opacity:1;transform:none;transition-delay:0ms}.reveal-stagger.visible>*:nth-child(2){opacity:1;transform:none;transition-delay:60ms}.reveal-stagger.visible>*:nth-child(3){opacity:1;transform:none;transition-delay:120ms}.reveal-stagger.visible>*:nth-child(4){opacity:1;transform:none;transition-delay:180ms}.reveal-stagger.visible>*:nth-child(5){opacity:1;transform:none;transition-delay:240ms}.reveal-stagger.visible>*:nth-child(6){opacity:1;transform:none;transition-delay:300ms}.reveal-stagger.visible>*:nth-child(7){opacity:1;transform:none;transition-delay:360ms}.reveal-stagger.visible>*:nth-child(8){opacity:1;transform:none;transition-delay:420ms}.appinfo-row{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:16px;margin-bottom:16px}.appinfo-card{background:var(--md-sys-color-surface-container);border:1px solid var(--md-sys-color-outline-variant);border-radius:var(--md-sys-shape-corner-extra-large);padding:28px 28px 32px;display:flex;flex-direction:column;gap:10px;transition:background var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-standard),transform var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-emphasized),box-shadow var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-standard)}.appinfo-card:hover{background:var(--md-sys-color-surface-container-high);transform:translateY(-3px);box-shadow:0 8px 32px rgba(0,0,0,0.3)}.appinfo-card-large{background:linear-gradient(135deg,var(--md-sys-color-primary-container) 0%,rgba(0,74,125,0.6) 100%);border-color:var(--md-sys-color-primary-container)}.appinfo-icon-wrap{width:48px;height:48px;min-width:48px;min-height:48px;max-width:48px;max-height:48px;border-radius:var(--md-sys-shape-corner-large);display:flex;align-items:center;justify-content:center;margin-bottom:4px;overflow:hidden;flex-shrink:0}.appinfo-icon-wrap svg{width:24px;height:24px;flex-shrink:0}.appinfo-icon-primary{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.appinfo-icon-secondary{background:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.appinfo-icon-tertiary{background:var(--md-sys-color-tertiary-container);color:var(--md-sys-color-on-tertiary-container)}.appinfo-label{font-size:var(--md-typescale-label-medium-size);font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--md-sys-color-primary)}.appinfo-card-large .appinfo-label{color:var(--md-sys-color-on-primary-container);opacity:0.8}.appinfo-title{font-size:var(--md-typescale-headline-small-size);font-weight:700;color:var(--md-sys-color-on-surface);margin:0}.appinfo-card-large .appinfo-title{color:var(--md-sys-color-on-primary-container)}.appinfo-desc{font-size:var(--md-typescale-body-medium-size);color:var(--md-sys-color-on-surface-variant);line-height:1.6;margin:0;flex:1}.appinfo-card-large .appinfo-desc{color:var(--md-sys-color-on-primary-container);opacity:0.85}.appinfo-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.appinfo-chip{font-size:var(--md-typescale-label-small-size);font-weight:600;padding:4px 12px;border-radius:var(--md-sys-shape-corner-full);background:rgba(158,202,255,0.15);color:var(--md-sys-color-on-primary-container);border:1px solid rgba(158,202,255,0.25)}.appinfo-details{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}.appinfo-detail-card{background:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);border-radius:var(--md-sys-shape-corner-large);padding:16px 20px;display:flex;align-items:center;gap:14px;transition:background var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard),transform var(--md-sys-motion-duration-medium1) var(--md-sys-motion-easing-emphasized)}.appinfo-detail-card:hover{background:var(--md-sys-color-surface-container);transform:translateY(-2px)}.appinfo-detail-icon{width:40px;height:40px;border-radius:var(--md-sys-shape-corner-medium);display:flex;align-items:center;justify-content:center;flex-shrink:0}.appinfo-detail-icon svg{width:20px;height:20px}.appinfo-detail-label{font-size:var(--md-typescale-label-small-size);color:var(--md-sys-color-on-surface-variant);text-transform:uppercase;letter-spacing:0.06em;font-weight:600}.appinfo-detail-value{font-size:var(--md-typescale-label-large-size);font-weight:600;color:var(--md-sys-color-on-surface);margin-top:2px}.appinfo-privacy{background:linear-gradient(135deg,var(--md-sys-color-surface-container) 0%,rgba(0,74,125,0.15) 100%);border:1px solid var(--md-sys-color-primary-container);border-radius:var(--md-sys-shape-corner-extra-large);padding:28px 32px;display:flex;align-items:flex-start;gap:20px}.appinfo-privacy-icon{width:48px;height:48px;border-radius:var(--md-sys-shape-corner-large);background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container);display:flex;align-items:center;justify-content:center;flex-shrink:0}.appinfo-privacy-icon svg{width:24px;height:24px}.appinfo-privacy-title{font-size:var(--md-typescale-title-large-size);font-weight:700;color:var(--md-sys-color-on-surface);margin-bottom:6px}.appinfo-privacy-desc{font-size:var(--md-typescale-body-medium-size);color:var(--md-sys-color-on-surface-variant);line-height:1.65;margin:0}@media (max-width:900px){.hero .container{grid-template-columns:1fr;text-align:center}.hero-desc{margin:0 auto 36px}.hero-actions{justify-content:center}.hero-stats{justify-content:center}.hero-visual{order:-1}.phone-mockup{width:220px}.specs-grid{grid-template-columns:1fr}.bug-grid{grid-template-columns:1fr}.appinfo-row{grid-template-columns:1fr}.appinfo-details{grid-template-columns:1fr 1fr}.appinfo-privacy{flex-direction:column}.download-card{flex-direction:column;padding:40px 32px;text-align:center}.download-actions{justify-content:center}.footer-inner{flex-direction:column;text-align:center}.footer-links{justify-content:center}.nav-links{display:none}.hamburger{display:flex}}@media (max-width:600px){section{padding:56px 0}.container{padding:0 16px}.hero{padding:72px 0 56px}.carousel-viewport{padding:0 calc(50% - 130px)}.carousel-slide{flex:0 0 260px}.appinfo-details{grid-template-columns:1fr}}code{font-family:'Google Sans Mono','Roboto Mono',monospace;font-size:0.875em;background:var(--md-sys-color-surface-container-high);padding:2px 6px;border-radius:var(--md-sys-shape-corner-extra-small);color:var(--md-sys-color-tertiary)}::selection{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--md-sys-color-outline);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--md-sys-color-on-surface-variant)}
/* ═══════════════════════════════════════════════════════════════
   PATCH: Ripple bulat + Smooth animations + Sidebar glass + Blur
   ═══════════════════════════════════════════════════════════════ */

/* 1. RIPPLE — bulat sempurna (bukan kotak) */
.ripple-host {
  position: relative;
  overflow: hidden;
}
.ripple-wave {
  position: absolute;
  border-radius: 50%;
  background: rgba(158, 202, 255, 0.28);
  transform: scale(0);
  animation: ripple-expand 550ms cubic-bezier(0.2, 0, 0, 1) forwards;
  pointer-events: none;
  will-change: transform, opacity;
}
@keyframes ripple-expand {
  0%   { transform: scale(0); opacity: 1; }
  70%  { transform: scale(1); opacity: 0.5; }
  100% { transform: scale(1.15); opacity: 0; }
}

/* 2. SMOOTH HOVER — semua elemen interaktif */
.btn, .nav-links a, .feature-card, .spec-card,
.appinfo-card, .appinfo-detail-card, .drawer-panel a,
.contributor-chip, .carousel-arrow, .drawer-close,
.hamburger {
  transition:
    transform 280ms cubic-bezier(0.2, 0, 0, 1),
    box-shadow 280ms cubic-bezier(0.2, 0, 0, 1),
    background 180ms ease,
    border-color 180ms ease,
    color 150ms ease,
    opacity 180ms ease !important;
  will-change: transform;
}

/* Tambah scale subtle saat hover tombol/link */
.btn:hover { transform: translateY(-1px) scale(1.01); }
.btn:active { transform: translateY(0) scale(0.98); }
.nav-links a:hover { transform: translateY(-1px); }
.feature-card:hover { transform: translateY(-5px) !important; }
.appinfo-card:hover { transform: translateY(-4px) !important; }
.contributor-chip:hover { transform: translateY(-3px) !important; }

/* 3. SIDEBAR / DRAWER — glass morphism + animasi smooth */
.drawer {
  display: block !important;
  visibility: hidden;
  pointer-events: none;
  transition: visibility 0s linear 400ms;
}
.drawer.open {
  visibility: visible;
  pointer-events: auto;
  transition: visibility 0s linear 0s;
}

/* Scrim dengan blur */
.drawer-scrim {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(6px) saturate(0.8);
  -webkit-backdrop-filter: blur(6px) saturate(0.8);
  opacity: 0;
  transition: opacity 350ms cubic-bezier(0.2, 0, 0, 1);
}
.drawer.open .drawer-scrim { opacity: 1; }

/* Panel — glassmorphism */
.drawer-panel {
  position: absolute;
  top: 0; right: 0;
  width: 280px;
  height: 100%;
  /* Glass effect */
  background: rgba(23, 29, 34, 0.82);
  backdrop-filter: blur(28px) saturate(1.6) brightness(1.1);
  -webkit-backdrop-filter: blur(28px) saturate(1.6) brightness(1.1);
  border-left: 1px solid rgba(158, 202, 255, 0.10);
  box-shadow: -8px 0 40px rgba(0, 0, 0, 0.5), -2px 0 0 rgba(158, 202, 255, 0.05);
  padding: 20px 14px 28px;
  transform: translateX(110%);
  /* Spring-like — ease-out overshoot kecil */
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.drawer.open .drawer-panel {
  transform: translateX(0);
}

/* Item menu stagger masuk */
.drawer-panel > * {
  opacity: 0;
  transform: translateX(24px);
  transition:
    opacity 300ms cubic-bezier(0.2, 0, 0, 1),
    transform 300ms cubic-bezier(0.2, 0, 0, 1),
    background 180ms ease;
}
.drawer.open .drawer-panel > *:nth-child(1)  { opacity:1; transform:none; transition-delay: 60ms; }
.drawer.open .drawer-panel > *:nth-child(2)  { opacity:1; transform:none; transition-delay: 95ms; }
.drawer.open .drawer-panel > *:nth-child(3)  { opacity:1; transform:none; transition-delay:130ms; }
.drawer.open .drawer-panel > *:nth-child(4)  { opacity:1; transform:none; transition-delay:165ms; }
.drawer.open .drawer-panel > *:nth-child(5)  { opacity:1; transform:none; transition-delay:200ms; }
.drawer.open .drawer-panel > *:nth-child(6)  { opacity:1; transform:none; transition-delay:235ms; }
.drawer.open .drawer-panel > *:nth-child(7)  { opacity:1; transform:none; transition-delay:270ms; }
.drawer.open .drawer-panel > *:nth-child(8)  { opacity:1; transform:none; transition-delay:305ms; }

/* Saat close, reset stagger */
.drawer:not(.open) .drawer-panel > * {
  opacity: 0;
  transform: translateX(20px);
  transition-delay: 0ms !important;
}

/* Menu item hover glass */
.drawer-panel a {
  border-radius: 14px;
  transition: background 180ms ease, transform 200ms cubic-bezier(0.2,0,0,1) !important;
}
.drawer-panel a:hover {
  background: rgba(158, 202, 255, 0.10);
  transform: translateX(3px) !important;
}

/* Tombol close — animasi ikon */
.drawer-close {
  align-self: flex-end;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: rgba(158,202,255,0.06);
  border: 1px solid rgba(158,202,255,0.12);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 12px;
  transition: background 200ms ease, transform 250ms cubic-bezier(0.2,0,0,1) !important;
}
.drawer-close:hover {
  background: rgba(158,202,255,0.14);
  transform: rotate(90deg) scale(1.1) !important;
}
.drawer-close svg {
  transition: transform 250ms cubic-bezier(0.16,1,0.3,1);
}

/* Hamburger — animasi ikon ke X */
.hamburger {
  position: relative;
  width: 40px; height: 40px;
  padding: 0;
  display: none;
  align-items: center; justify-content: center;
  border-radius: 50%;
  transition: background 180ms ease !important;
}
.hamburger:hover { background: rgba(158,202,255,0.08); }
.hamburger .icon-menu,
.hamburger .icon-close {
  position: absolute;
  transition: opacity 220ms ease, transform 280ms cubic-bezier(0.16,1,0.3,1);
}
.hamburger .icon-close {
  opacity: 0;
  transform: rotate(-90deg) scale(0.7);
}
.hamburger.is-open .icon-menu {
  opacity: 0;
  transform: rotate(90deg) scale(0.7);
}
.hamburger.is-open .icon-close {
  opacity: 1;
  transform: rotate(0deg) scale(1);
}

/* 4. GLASS BLUR — cards dan header lebih glass */
.feature-card,
.spec-card,
.appinfo-detail-card {
  backdrop-filter: blur(8px) saturate(1.3);
  -webkit-backdrop-filter: blur(8px) saturate(1.3);
  background: rgba(27, 33, 40, 0.75) !important;
  border: 1px solid rgba(158, 202, 255, 0.08) !important;
}
.feature-card:hover,
.spec-card:hover,
.appinfo-detail-card:hover {
  background: rgba(37, 44, 52, 0.88) !important;
  border-color: rgba(158, 202, 255, 0.18) !important;
}

.appinfo-card {
  backdrop-filter: blur(12px) saturate(1.4);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
  background: rgba(27, 33, 40, 0.70) !important;
  border: 1px solid rgba(158, 202, 255, 0.09) !important;
}
.appinfo-card:hover {
  background: rgba(37, 44, 52, 0.85) !important;
  border-color: rgba(158, 202, 255, 0.20) !important;
}

.appinfo-card-large {
  background: linear-gradient(135deg,
    rgba(0, 74, 125, 0.80) 0%,
    rgba(0, 55, 96, 0.65) 100%) !important;
  border-color: rgba(158, 202, 255, 0.18) !important;
}

/* Carousel arrows — glass */
.carousel-arrow {
  background: rgba(27, 33, 40, 0.72) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-color: rgba(158, 202, 255, 0.15) !important;
}
.carousel-arrow:hover {
  background: rgba(37, 44, 52, 0.90) !important;
}

/* Download card glass overlay */
.download-icon-wrap {
  backdrop-filter: blur(16px) saturate(1.5);
  -webkit-backdrop-filter: blur(16px) saturate(1.5);
}

@media (max-width: 900px) {
  .hamburger { display: flex !important; }
}