:root{--vt-c-white: #ffffff;--vt-c-white-soft: #f8f8f8;--vt-c-white-mute: #f2f2f2;--vt-c-black: #181818;--vt-c-black-soft: #222222;--vt-c-black-mute: #282828;--vt-c-indigo: #2c3e50;--vt-c-divider-light-1: rgba(60, 60, 60, .29);--vt-c-divider-light-2: rgba(60, 60, 60, .12);--vt-c-text-light-1: var(--vt-c-indigo);--vt-c-text-light-2: rgba(60, 60, 60, .66)}:root{color-scheme:light;--color-background: var(--vt-c-white);--color-background-soft: var(--vt-c-white-soft);--color-background-mute: var(--vt-c-white-mute);--color-border: var(--vt-c-divider-light-2);--color-border-hover: var(--vt-c-divider-light-1);--color-heading: var(--vt-c-text-light-1);--color-text: var(--vt-c-text-light-1);--section-gap: 160px}*,*:before,*:after{box-sizing:border-box;margin:0;font-weight:400}body{min-height:100vh;color:var(--color-text);background:var(--color-background);transition:color .5s,background-color .5s;line-height:1.6;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:15px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{min-height:100vh}.app-layout{min-height:100vh;display:grid;grid-template-columns:220px 1fr;background:#fff}.sidebar{border-right:1px solid #ececec;padding:2.25rem 1.25rem;background:#fff}.sidebar-nav{display:flex;flex-direction:column;gap:.65rem}.nav-link{color:#7a7a7a;text-decoration:none;font-size:.95rem;font-weight:500;letter-spacing:.01em;transition:color .2s ease}.nav-link:hover{color:#222}.nav-link.router-link-active{color:#111;font-weight:600}.page-content{padding:3rem 3.25rem;background:#fff}.app-button{margin-top:.95rem;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:.56rem .92rem;border:1px solid #d2d2d7;border-radius:999px;color:#1d1d1f;text-decoration:none;font-size:.88rem;font-weight:500;letter-spacing:-.005em;line-height:1;background:#fffffff2;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease}.app-button:hover{background:#f8f8f9;border-color:#c8c8cd;box-shadow:0 1px 2px #0000000f}.app-button:focus-visible{outline:2px solid #8f8f94;outline-offset:2px}.project-page{max-width:1040px;color:#1f1f1f}.project-meta-row{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}.project-type{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:#8a8a8a}.project-date{font-size:.8rem;color:#8a8a8a;text-align:right;white-space:nowrap}.project-title{margin-top:.45rem;font-size:clamp(2rem,4vw,3.3rem);line-height:1.05;letter-spacing:-.02em;font-weight:600}.project-intro{margin-top:1rem;max-width:none;color:#5f5f5f}.project-divider{margin:2rem 0;border-top:1px solid #ececec}.content-block{margin-top:2rem}.content-block h2{font-size:1.05rem;font-weight:560;color:#1f1f1f}.content-block p{margin-top:.6rem;color:#666;max-width:none}.architecture-block{position:relative;margin-top:2.2rem;padding:1.35rem 1.15rem 1.15rem;border:1px solid #e5e5ea;border-radius:14px;background:#fbfbfd;box-shadow:0 1px 2px #0000000a,0 10px 28px #00000009}.architecture-block-legend{position:absolute;top:0;left:1rem;margin:0;transform:translateY(-50%);padding:0 .34rem;background:#fff}.architecture-block p{color:#63636b}.architecture-visual{margin-top:.75rem}.app-embed{margin-top:.9rem;border:1px solid #ebebeb;border-radius:8px;overflow:hidden;background:#fff}.app-embed iframe{width:100%;display:block;border:0}.app-embed--video iframe{aspect-ratio:16 / 9}.app-embed--linkedin iframe{min-height:620px}.app-embed-caption{margin:0;padding:.85rem 1rem 1rem;color:#666;display:flex;align-items:flex-start;gap:.6rem}.app-embed-caption-icon{width:1.1rem;height:1.1rem;border:1px solid #d7d7d7;border-radius:999px;color:#888;font-size:.78rem;font-weight:600;line-height:1;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;margin-top:.1rem}@media(max-width:768px){.app-layout{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid #ececec;padding:1.25rem}.sidebar-nav{flex-direction:row;gap:1.2rem}.page-content{padding:1.5rem 1.25rem 2rem}.app-embed--linkedin iframe{min-height:520px}}
