.pg-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-end;justify-content:center;pointer-events:none;visibility:hidden;transition:visibility .4s ease}.pg-modal.is-open{pointer-events:auto;visibility:visible}.pg-backdrop{position:absolute;inset:0;background:#000000bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;transition:opacity .4s cubic-bezier(.16,1,.3,1)}.pg-modal.is-open .pg-backdrop{opacity:1}.pg-sheet{position:relative;width:100vw;height:88vh;max-height:calc(100vh - 32px);min-height:560px;background:var(--card-bg);border-top:1px solid var(--card-border);border-left:none;border-right:none;border-bottom:none;border-radius:0;box-shadow:0 -12px 48px #00000073;display:flex;flex-direction:column;overflow:hidden;transform:translateY(100%);transition:transform .45s cubic-bezier(.16,1,.3,1)}.pg-modal.is-open .pg-sheet{transform:translateY(0)}.pg-close-btn{position:absolute;right:clamp(16px,2.5vw,32px);top:18px;width:36px;height:36px;border-radius:50%;border:1px solid var(--card-border);background:var(--card-bg);color:var(--text-primary);display:grid;place-items:center;cursor:pointer;padding:0;z-index:40;transition:background-color .2s ease,transform .2s ease,border-color .2s ease}.pg-close-btn:hover{background:var(--card-border);transform:scale(1.06)}.pg-close-btn:active{transform:scale(.95)}.pg-close-btn svg{stroke:currentColor;display:block}.pg-body{display:flex;align-items:stretch;height:100%;width:100%;padding:0;overflow:hidden}.pg-media-panel{height:100%;aspect-ratio:1600 / 1200;flex-shrink:0;background:#141416;border-radius:0;border:none;border-right:1px solid var(--card-border);overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center}.pg-media-view{width:100%;height:100%;aspect-ratio:1600 / 1200;border-radius:0;position:relative;display:flex;align-items:center;justify-content:center;background:#141416}.pg-video-wrapper video{width:100%;height:100%;aspect-ratio:1600 / 1200;border-radius:0;object-fit:cover;display:block}.pg-video-toggle{position:absolute;bottom:20px;right:20px;width:36px;height:36px;border-radius:50%;background:#000000a6;border:1px solid rgba(255,255,255,.15);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(8px);opacity:0;z-index:10;transition:opacity .2s ease,transform .2s ease}.pg-video-wrapper:hover .pg-video-toggle{opacity:1}.pg-video-toggle:hover{transform:scale(1.08)}.pg-video-toggle .icon-play{display:none}.pg-video-toggle .icon-pause,.pg-video-toggle.is-paused .icon-play{display:block}.pg-video-toggle.is-paused .icon-pause{display:none}.pg-image-wrapper img{width:100%;height:100%;aspect-ratio:1600 / 1200;border-radius:0;object-fit:cover;display:block}.pg-glb-wrapper{position:relative;width:100%;height:100%;background:#141416}.pg-glb-target{width:100%;height:100%;position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.pg-glb-target model-viewer,.pg-glb-target canvas{width:100%!important;height:100%!important;border:none;outline:none;display:block;background:#141416}.pg-3d-wrapper{position:relative;width:100%;height:100%;background:#141416}.pg-3d-wrapper iframe{width:100%;height:100%;border:none;outline:none;display:block}.pg-details-panel{flex:1;min-width:300px;display:flex;flex-direction:column;gap:18px;padding:clamp(24px,3.5vw,48px) clamp(24px,4vw,56px);overflow-y:auto}.pg-meta-top{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}.pg-category-tag{color:var(--text-primary)}.pg-dot{color:var(--card-border)}.pg-title{font-size:clamp(20px,2.2vw,26px);font-weight:600;line-height:1.25;letter-spacing:-.015em;color:var(--text-primary)}.pg-desc{font-size:14px;line-height:1.6;color:var(--text-secondary)}.pg-info-section{display:flex;flex-direction:column;gap:6px;margin-top:4px}.pg-section-label{font-size:10px;font-weight:600;letter-spacing:.08em;color:var(--text-muted);text-transform:uppercase}.pg-role-val{font-size:13px;color:var(--text-primary);font-weight:500}.pg-tools-list{display:flex;flex-wrap:wrap;gap:6px}.pg-tool-pill{font-size:11px;font-weight:500;padding:4px 9px;border-radius:6px;background:var(--bg-color);border:1px solid var(--card-border);color:var(--text-secondary)}@media (max-width: 860px){.pg-sheet{width:100vw;height:85vh;border-radius:0}.pg-body{flex-direction:column;overflow-y:auto}.pg-media-panel{width:100%;height:auto;aspect-ratio:1600 / 1200;border-right:none;border-bottom:1px solid var(--card-border);border-radius:0}.pg-details-panel{padding:24px 20px 36px;overflow-y:visible}}:root{--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--bg-color: #ffffff;--text-primary: #111111;--text-secondary: #555555;--text-muted: #888888;--card-bg: #f4f4f6;--card-border: #e9e9ed;--accent-green: #10b981;--accent-red: #ef4444;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 24px;--sp-6: 32px;--sp-7: 48px;--sp-8: 64px;--sp-9: 96px}[data-theme=dark]{--bg-color: #0e0e10;--text-primary: #f5f5f7;--text-secondary: #b8b8bf;--text-muted: #86868f;--card-bg: #1a1a1d;--card-border: #26262b}html,body{transition:background-color .4s ease,color .4s ease}*{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}img{max-width:100%;height:auto;display:block}.site-wrapper{max-width:780px;margin:0 auto;padding:var(--sp-9) var(--sp-5) var(--sp-9)}.profile-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-7)}.profile-card{display:flex;align-items:center;gap:14px;width:fit-content}.theme-toggle{width:38px;height:38px;border:1px solid var(--card-border);background:var(--card-bg);border-radius:50%;cursor:pointer;color:var(--text-primary);display:grid;place-items:center;padding:0;transition:background-color .3s ease,border-color .3s ease,color .3s ease}.theme-toggle:hover{background:var(--card-border)}.theme-toggle:focus-visible{outline:2px solid var(--text-primary);outline-offset:2px}.theme-toggle>.theme-icon{grid-area:1 / 1;display:inline-flex;align-items:center;justify-content:center;line-height:0;color:currentColor;pointer-events:none;transition:opacity .3s ease,transform .4s cubic-bezier(.34,1.56,.64,1)}.theme-toggle>.theme-icon>svg{stroke:currentColor;width:15px;height:15px;display:block}.icon-sun{opacity:0;transform:rotate(-90deg) scale(.4)}.icon-moon,[data-theme=dark] .icon-sun{opacity:1;transform:rotate(0) scale(1)}[data-theme=dark] .icon-moon{opacity:0;transform:rotate(90deg) scale(.4)}.profile-avatar{width:52px;height:52px;border-radius:50%;flex-shrink:0;background-image:url(/assets/dp.jpg);background-size:cover;background-position:center}.profile-text{display:flex;flex-direction:column;gap:2px}.profile-name{color:var(--text-primary);font-size:15px;font-weight:600;letter-spacing:-.01em;line-height:1.2}.profile-tagline{color:var(--text-muted);font-size:12px;font-weight:400;line-height:1.3;letter-spacing:.005em}.hero-section{margin-bottom:var(--sp-9)}.hero-title{font-size:clamp(32px,5vw,44px);font-weight:600;letter-spacing:-.025em;line-height:1.15;color:var(--text-primary);margin-bottom:var(--sp-5);max-width:650px}.about-block{display:flex;flex-direction:column;gap:var(--sp-5);max-width:500px}.section-label{font-size:10px;font-weight:600;letter-spacing:.08em;color:var(--text-muted);text-transform:uppercase}.about-text{font-size:13px;line-height:1.6;color:var(--text-secondary);display:flex;flex-direction:column;gap:var(--sp-4)}.section-title{font-size:22px;font-weight:600;letter-spacing:-.015em;color:var(--text-primary);margin-bottom:var(--sp-6)}.experiments{margin-bottom:var(--sp-9)}.cta-row{display:flex;flex-wrap:wrap;gap:var(--sp-2)}.cta{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;background:var(--card-bg);color:var(--text-primary);font-family:inherit;font-size:13px;font-weight:500;border:none;cursor:pointer;text-decoration:none;position:relative;transition:background-color .2s ease,transform .2s ease,color .2s ease}.cta:hover{background:var(--card-border);transform:translateY(-1px)}.cta:active{transform:translateY(0)}.cta-icon-only{width:38px;height:38px;padding:0;justify-content:center;background:transparent}.cta-icon-only:hover{background:var(--card-bg)}.cta-icon-only .cta-icon{color:var(--text-primary)}.cta-icon,.cta-copied{display:inline-flex;line-height:0;color:var(--text-secondary)}.cta-icon svg,.cta-copied svg{stroke:currentColor}.cta-copied{position:absolute;left:14px;opacity:0;transform:scale(.6);color:var(--accent-green);transition:opacity .2s ease,transform .25s cubic-bezier(.34,1.56,.64,1)}.cta.copied .cta-icon{opacity:0}.cta.copied .cta-copied{opacity:1;transform:scale(1)}.cta.copied .cta-label{color:var(--accent-green)}.experiment-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-7) var(--sp-6)}.experiment-card{display:flex;flex-direction:column;gap:var(--sp-4);text-decoration:none;color:inherit}.experiment-thumb{background-color:var(--card-bg);border-radius:12px;overflow:hidden;aspect-ratio:2 / 1;transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s ease}.experiment-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.16,1,.3,1)}.preview-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative}.lock-badge{position:absolute;top:var(--sp-4);right:var(--sp-4);width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--bg-color);color:var(--text-primary);border:1px solid var(--card-border)}.lock-badge svg{stroke:currentColor;display:block}.preview-badge{position:absolute;top:var(--sp-4);right:var(--sp-4);font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);padding:4px 10px;border-radius:999px;background:var(--bg-color)}.experiment-card:hover .experiment-thumb{transform:translateY(-4px);box-shadow:0 12px 28px #0000000f}.experiment-card:hover .experiment-thumb img{transform:scale(1.02)}.experiment-body{display:flex;flex-direction:column;gap:var(--sp-2)}.experiment-title{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--text-primary);letter-spacing:-.005em;line-height:1.4}.experiment-arrow{display:inline-flex;line-height:0;color:var(--text-muted);opacity:0;transform:translate(-6px,4px);transition:opacity .3s ease,transform .3s cubic-bezier(.16,1,.3,1),color .2s ease}.experiment-arrow svg{stroke:currentColor}.experiment-card:hover .experiment-arrow{opacity:1;transform:translate(0);color:var(--text-primary)}.experiment-desc{font-size:13px;color:var(--text-secondary);line-height:1.55}.experiment-updated{font-size:11px;font-weight:500;color:var(--text-muted);letter-spacing:.03em;text-transform:uppercase}.playground-section,.projects-section{margin-bottom:var(--sp-9)}.playground-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.playground-col{display:flex;flex-direction:column;gap:20px}.playground-col-right{padding-top:48px}.playground-card{display:flex;flex-direction:column;text-decoration:none;color:inherit;cursor:pointer}.playground-preview{background-color:var(--card-bg);border-radius:16px;aspect-ratio:1600 / 1200;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease}.playground-preview video,.playground-preview img,.playground-preview model-viewer,.playground-preview .pg-three-preview,.playground-preview .pg-three-preview canvas{width:100%;height:100%;aspect-ratio:1600 / 1200;object-fit:cover;display:block;pointer-events:none}.playground-preview iframe.pg-iframe-preview{position:absolute;top:0;left:0;width:200%;height:200%;transform:scale(.5);transform-origin:0 0;border:none;display:block;pointer-events:none}.playground-card[data-pg-id=wallet-demo] .playground-preview video{transform:scale(1.4);transform-origin:center center}.playground-card:hover .playground-preview{transform:translateY(-4px);box-shadow:0 12px 28px #0000000f}.portfolio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-5) var(--sp-6)}.portfolio-grid>.work-card:nth-child(2n){margin-top:var(--sp-6)}.work-card{display:flex;flex-direction:column;gap:var(--sp-4);cursor:pointer;text-decoration:none;color:inherit}.card-preview{background-color:var(--card-bg);border-radius:16px;height:290px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease}.card-preview>img{width:100%;height:100%;object-fit:cover;display:block}.card-preview>.preview-placeholder{padding:20px}.work-card:hover .card-preview{transform:translateY(-4px);box-shadow:0 12px 28px #0000000f}.card-info{display:flex;flex-direction:column;gap:var(--sp-2)}.card-title{font-size:14px;font-weight:500;line-height:1.4;color:var(--text-primary)}.card-meta{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:600;letter-spacing:.05em;color:var(--text-muted)}.meta-sep{color:#ccc}.ui-mockup{width:100%;max-width:min(280px,100%);background:#fff;border-radius:10px;box-shadow:0 4px 16px #0000000a;border:1px solid rgba(0,0,0,.05);padding:14px;font-size:10px}.dashboard-mockup{display:flex;flex-direction:column;gap:12px}.mockup-header{display:flex;justify-content:space-between;align-items:center}.mockup-title{font-size:9px;font-weight:600;color:#888;letter-spacing:.04em}.mockup-tabs{display:flex;gap:4px;font-size:8px;color:#999}.mockup-tabs .active{color:#6366f1;font-weight:600}.chart-container{position:relative;height:80px;width:100%}.line-chart{width:100%;height:100%;overflow:visible}.chart-area{fill:#6366f114}.chart-line{fill:none;stroke:#6366f1;stroke-width:2}.chart-dot{fill:#6366f1;stroke:#fff;stroke-width:2}.chart-tooltip{position:absolute;top:0;right:10px;background:#fff;border:1px solid #eee;padding:2px 6px;border-radius:4px;display:flex;align-items:center;gap:4px;box-shadow:0 2px 6px #0000000d}.tooltip-badge{font-weight:600;color:#111}.tooltip-label{color:#888;font-size:8px}.data-table-mockup{padding:10px}.table-header-row{display:grid;grid-template-columns:2.2fr 1fr 1.2fr;padding-bottom:6px;border-bottom:1px solid #f0f0f0;color:#999;font-size:8px;font-weight:500}.table-rows{display:flex;flex-direction:column;gap:5px;margin-top:6px}.table-row{display:grid;grid-template-columns:2.2fr 1fr 1.2fr;align-items:center;font-size:8px}.table-row .time{color:#777;font-family:monospace}.badge{display:inline-block;font-weight:600;font-size:7px;border-radius:2px}.badge.buy{color:var(--accent-green)}.badge.sell{color:var(--accent-red)}.price.green{color:var(--accent-green);font-weight:500}.price.red{color:var(--accent-red);font-weight:500}.mobile-payment-mockup{max-width:190px;padding:12px;border-radius:16px}.phone-frame{display:flex;flex-direction:column;gap:10px}.phone-header{display:flex;align-items:center;gap:6px;color:#111;font-weight:600;font-size:9px}.payment-card{background:#f9f9fb;padding:8px;border-radius:8px}.avatar-row{display:flex;align-items:center;gap:8px}.avatar{width:22px;height:22px;border-radius:50%;background:#3b82f6}.user-info{display:flex;flex-direction:column}.user-info .name{font-weight:600;font-size:9px;color:#111}.user-info .subtext{font-size:7px;color:#888}.payment-method{display:flex;flex-direction:column;gap:4px}.method-label{font-size:7px;color:#888;text-transform:uppercase}.method-box{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid #ee4d2d;padding:6px;border-radius:6px}.shopee-logo{background:#ee4d2d;color:#fff;font-weight:700;font-size:8px;width:14px;height:14px;display:flex;align-items:center;justify-content:center;border-radius:3px}.method-name{font-size:8px;font-weight:500}.amount{font-size:8px;font-weight:600}.voucher-box{display:flex;flex-direction:column;gap:3px}.v-label{font-size:7px;color:#888}.v-tags{display:flex;gap:4px}.v-tag{font-size:6px;color:#ee4d2d;border:1px stroke #ffddd6;background:#fff5f3;padding:2px 4px;border-radius:3px}.redeem-btn{background:#ee4d2d;color:#fff;border:none;padding:6px;border-radius:12px;font-size:8px;font-weight:600;cursor:pointer;margin-top:4px}.terminal-mockup{max-width:210px;padding:10px}.terminal-header{font-weight:600;font-size:9px;margin-bottom:6px;color:#111}.terminal-nav{display:flex;gap:8px;font-size:7px;border-bottom:1px solid #f0f0f0;padding-bottom:4px;margin-bottom:6px}.t-nav{color:#888}.t-nav.active{color:#111;font-weight:600}.terminal-list{display:flex;flex-direction:column;gap:4px}.t-item{display:flex;justify-content:space-between;font-size:8px}.t-pair{font-weight:500;color:#333}.t-val.green{color:var(--accent-green);font-weight:500}.t-val.red{color:var(--accent-red);font-weight:500}.finance-list-mockup{max-width:200px;padding:10px}.fin-search{display:flex;align-items:center;gap:4px;background:#f4f4f6;padding:4px 8px;border-radius:6px;color:#888;font-size:8px;margin-bottom:8px}.fin-tabs{display:flex;gap:6px;font-size:7px;margin-bottom:8px;color:#888}.f-tab.active{color:#111;font-weight:600}.coin-list{display:flex;flex-direction:column;gap:6px}.coin-item{display:flex;justify-content:space-between;align-items:center;font-size:8px}.c-info{display:flex;align-items:center;gap:4px}.c-icon{width:10px;height:10px;border-radius:50%}.c-icon.btc{background:#f7931a}.c-icon.eth{background:#627eea}.c-icon.sol{background:#14f195}.c-icon.ada{background:#0033ad}.c-icon.neo{background:#58bf00}.c-symbol{font-weight:600;color:#111}.c-apr{color:var(--accent-green);font-weight:500}.modal-mockup{max-width:220px;padding:16px;text-align:center}.dialog-title{font-size:10px;font-weight:600;margin-bottom:6px;color:#111}.dialog-desc{font-size:7px;color:#666;line-height:1.4;margin-bottom:12px}.btn-primary{width:100%;background:#00b14f;color:#fff;border:none;padding:6px;border-radius:12px;font-size:8px;font-weight:600;cursor:pointer;margin-bottom:6px}.btn-secondary{width:100%;background:#f0fdf4;color:#00b14f;border:1px solid #bbf7d0;padding:6px;border-radius:12px;font-size:8px;font-weight:500;cursor:pointer}@media (max-width: 900px){:root{--sp-9: 80px;--sp-8: 56px;--sp-7: 40px}.site-wrapper{padding:var(--sp-9) var(--sp-5) var(--sp-9)}.card-preview{height:260px}.playground-grid,.playground-col{gap:16px}.playground-col-right{padding-top:36px}.experiment-grid,.portfolio-grid{gap:var(--sp-7) var(--sp-5)}}@media (max-width: 640px){:root{--sp-9: 64px;--sp-8: 48px;--sp-7: 32px}.site-wrapper{padding:var(--sp-8) var(--sp-4) var(--sp-8)}.hero-title{font-size:28px}.playground-grid{grid-template-columns:1fr;gap:16px}.playground-col{gap:16px}.playground-col-right{padding-top:0}.portfolio-grid{grid-template-columns:1fr}.portfolio-grid>.work-card:nth-child(2n){margin-top:0}.experiment-grid{grid-template-columns:1fr}.experiment-arrow{opacity:1;transform:none}.card-preview{height:240px}.profile-avatar{width:44px;height:44px}.profile-name{font-size:14px}.profile-tagline{font-size:11px}.section-title{font-size:20px}}@media (max-width: 380px){.site-wrapper{padding:var(--sp-7) var(--sp-3) var(--sp-7)}.hero-title{font-size:26px}.cta-row{gap:6px}}