@font-face{font-family:Maple;src:url('./maple-regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Maple;src:url('./maple-bold.woff2') format('woff2');font-weight:700;font-display:swap}
:root{--paper:#faf4f2;--ink:#2c292d;--muted:#686166;--pink:#b52d57;--line:rgba(44,41,45,.14);--card:#fcfcfa;--yellow:rgba(255,216,102,.45);--green:rgba(169,220,118,.4);--cyan:rgba(100,210,220,.3);--mono:Maple,'Yuanti SC','PingFang SC',monospace;--reading:'PingFang SC','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}
body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.75 var(--reading);-webkit-font-smoothing:antialiased}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
button,a,input{touch-action:manipulation}
button{border:0;background:none}
a{color:inherit;text-decoration:none}
a:hover{color:var(--pink)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--pink);outline-offset:5px}
[hidden]{display:none!important}
::selection{background:var(--yellow)}
h1,h2,h3,p,figure{margin:0}
h1,h2,h3{font-family:var(--mono);text-wrap:balance;font-weight:400}
p{text-wrap:pretty}
img{display:block;max-width:100%}
.skip{position:fixed;top:-100px;left:20px;background:var(--card);padding:12px;z-index:30}
.skip:focus{top:10px}
.site-header{border-bottom:1px solid var(--line);background:var(--paper)}
.header-inner{max-width:1260px;padding:14px 30px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:78px}
.wordmark{font:700 23px/1.5 var(--mono);letter-spacing:-1px;white-space:nowrap;display:flex;align-items:center;min-height:44px}
.wordmark span{color:var(--pink)}
nav{display:flex;gap:25px;align-items:center;font:14px/1.5 var(--mono)}
nav a{display:flex;min-height:44px;align-items:center;position:relative}
nav a[aria-current=page]{color:var(--pink)}
nav a[aria-current=page]:after{content:'';position:absolute;height:2px;background:var(--pink);bottom:3px;left:0;right:0;opacity:.6;transform:rotate(-2deg)}
.menu-toggle{display:none;width:44px;height:44px}
.menu-toggle span{display:block;width:21px;height:1.5px;background:var(--ink);margin:6px auto}
.site-layout{max-width:1260px;margin:0 auto;padding:56px 30px 80px;display:grid;grid-template-columns:220px minmax(0,1fr);gap:74px;min-height:calc(100vh - 160px)}
.profile{padding-top:4px;align-self:start}
.portrait{width:132px;height:132px;object-fit:cover;border-radius:50%;box-shadow:0 3px 12px #2c292d16}
.portrait-link{display:block;width:132px;margin:0 auto 20px}
.profile-name{font:700 20px/1.6 var(--mono);text-align:center}
.profile-name span{display:block;font-size:14px;font-weight:400;color:var(--muted);margin-top:2px}
.profile-intro{margin-top:15px;text-align:center;color:var(--muted);font-size:14px}
.socials{display:flex;justify-content:center;gap:18px;margin:18px 0 26px}
.socials a{font:12px/44px var(--mono);min-height:44px;text-decoration:underline;text-decoration-color:#a29a9e;text-underline-offset:5px}
.sidebar-notes section{border-top:1px solid var(--line);padding:19px 0}
.sidebar-notes h2{font-size:14px;font-weight:700;margin-bottom:12px}
.sidebar-notes p,.dot-list{font-size:13px;color:var(--muted);line-height:1.9}
.dot-list{list-style:none;padding:0;margin:0}
.dot-list li{padding-left:16px;position:relative;margin:4px 0}
.dot-list li:before{content:'';position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:45% 60% 40% 55%;background:#ddb849}
.dot-list li:nth-child(2):before{background:#a987c7}
.dot-list li:nth-child(3):before{background:#7d9e7b}
.quiet-link{font-size:13px;display:inline-flex;min-height:44px;align-items:center;text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--line)}
.sidebar-signoff{font:12px/1.8 var(--mono);color:var(--muted);margin-top:10px}
main{min-width:0}
main:focus{outline:none}
.name-line{display:flex;align-items:center;gap:22px;margin:4px 0 30px;flex-wrap:wrap}
.name-line h1{font-size:38px;line-height:1.6;position:relative;padding:2px 14px}
.name-line h1:before{content:'';position:absolute;inset:0 -1px;border:2px solid #6c666b;border-radius:49% 53% 47% 52%/52% 47% 54% 46%;transform:rotate(-4deg);opacity:.75}
.name-line svg{width:58px;height:26px;color:#8f868c;flex-shrink:0}
.name-en{font:23px/1.6 var(--mono);transform:rotate(-2deg)}
.intro-copy{max-width:760px;font-size:17px;line-height:1.95}
.intro-copy p+p{margin-top:15px}
.wavy{text-decoration:underline;text-decoration-style:wavy;text-decoration-color:#d68d6c;text-decoration-thickness:1.3px;text-underline-offset:5px}
.inline-highlight{background:linear-gradient(transparent 62%,var(--cyan) 62%,var(--cyan) 91%,transparent 91%);padding:0 1px}
.hand-note{font:14px/1.8 var(--mono);color:var(--muted)}
.hello-note{margin-top:22px;display:flex;gap:10px;align-items:center}
.hello-note:before{content:'';display:block;width:23px;height:1px;background:var(--muted)}
.section-heading{display:flex;gap:20px;align-items:baseline;justify-content:space-between;margin:45px 0 19px}
.section-heading h2{font-size:25px;line-height:1.5}
.section-heading a{font:12px/44px var(--mono);white-space:nowrap;color:var(--muted);text-decoration:underline;text-underline-offset:4px}
.marker{position:relative;isolation:isolate;display:inline-block}
.marker:before{content:'';position:absolute;z-index:-1;background:var(--yellow);height:34%;bottom:3px;left:-5px;right:-5px;border-radius:3px 5px 2px 4px;transform:rotate(-1deg)}
.marker.green:before{background:var(--green);transform:rotate(.5deg)}
.resource-list{border-top:1px solid var(--line)}
.resource-row{display:grid;grid-template-columns:150px minmax(0,1fr);gap:25px;align-items:center;padding:23px 0;border-bottom:1px solid var(--line)}
.resource-row h3{font-size:19px;font-weight:700;margin-bottom:7px;line-height:1.5}
.resource-row p{font-size:14px;color:var(--muted);line-height:1.7}
.resource-row:hover h3{color:var(--pink)}
.thumb{aspect-ratio:1.5;overflow:hidden;border-radius:4px;background:#f0ebe4;display:grid;place-items:center;position:relative}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb-ppt{background:#e9ece5;padding:16px;transform:rotate(-1deg)}
.mini-slide{width:100%;height:100%;background:var(--card);padding:12px;box-shadow:0 2px 5px #2c292d15;display:flex;flex-direction:column;justify-content:center;gap:7px}
.mini-slide strong{font:700 13px/1.3 var(--mono)}
.mini-slide span{font:12px/1.3 var(--mono);color:var(--muted)}
.mini-slide i{height:3px;background:#b8ccb1;width:62%;display:block}
.thumb-writing{background:#eee5e0;padding:15px}
.mini-note{width:95%;background:#fffdf8;transform:rotate(3deg);padding:12px;font:12px/1.8 var(--mono);box-shadow:0 2px 7px #2c292d0c}
.mini-note span{display:block;width:90%;height:1px;background:#d9d4ce;margin:8px 0}
.pills{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.pill{display:inline-block;border:1px solid #d2d5ce;background:#eff1e8;border-radius:4px;padding:1px 8px;color:#4b5943;font:12px/1.8 var(--mono)}
.pill.pink{background:#f5e7ec;border-color:#e6cbd5;color:#8f3150}
.pill.blue{background:#e8f1f1;border-color:#c7dddd;color:#385d61}
.pill.neutral{background:transparent;border-color:var(--line);color:var(--muted)}
.preview-note{font-size:14px;color:var(--muted);margin-top:15px}
.home-bottom{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.mini-entry{border-top:1px solid var(--line);padding:20px 0;display:block}
.mini-entry h3{font-size:17px;margin-bottom:10px;font-weight:700}
.mini-entry p{font-size:14px;color:var(--muted)}
.mini-app-icon{font:25px var(--mono);display:inline-grid;place-items:center;border:1px solid #abb9a5;width:48px;height:48px;border-radius:10px;background:#e3eadb;margin-bottom:16px}
.page-intro{margin:5px 0 32px;max-width:730px}
.page-intro h1{font-size:36px;line-height:1.4;margin-bottom:14px}
.page-intro p{color:var(--muted);font-size:16px;line-height:1.85}
.page-intro .subtitle{font:14px/1.6 var(--mono);color:var(--pink);margin-bottom:10px}
.flow-list .resource-row{grid-template-columns:190px minmax(0,1fr);padding:27px 0}
.flow-list .resource-row h3{font-size:22px}
.flow-quote{font:20px/1.7 var(--mono);margin-top:35px;padding:22px 0;color:var(--muted)}
.back{display:inline-flex;min-height:44px;align-items:center;font:13px/1.6 var(--mono);color:var(--muted);margin-bottom:23px;text-decoration:underline;text-underline-offset:4px}
.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:38px}
.steps{list-style:none;padding:0;margin:0}
.steps li{position:relative;padding:0 0 30px 42px}
.steps li:before{position:absolute;content:'';left:12px;top:29px;width:1px;background:var(--line);height:calc(100% - 21px)}
.steps li:last-child:before{display:none}
.step-number{position:absolute;left:0;top:1px;border:1px solid #bdb7b2;border-radius:50%;width:25px;height:25px;text-align:center;font:12px/24px var(--mono);background:var(--paper)}
.steps h2{font-size:20px;font-weight:700;margin-bottom:10px}
.steps p{font-size:15px;color:var(--muted)}
.related{border-top:2px solid var(--line);padding-top:18px;align-self:start}
.related h2{font-size:16px;margin-bottom:15px;font-weight:700}
.related a{display:block;min-height:44px;padding:10px 0;font-size:14px;border-bottom:1px solid var(--line)}
.related small{display:block;color:var(--muted);font:12px/1.8 var(--mono);margin-top:15px}
.tools-note{margin-top:28px;border-top:1px solid var(--line);padding-top:18px;font-size:14px;color:var(--muted)}
.catalog-controls{display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:23px}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.filters button{min-height:44px;padding:7px 14px;border:1px solid transparent;border-radius:4px;font:13px/1.6 var(--mono)}
.filters button:hover{background:#f0e8e6}
.filters button[aria-pressed=true]{border-color:#d5bec6;background:#f4e7ec;color:var(--pink)}
.search{width:210px;position:relative}
.search input{padding:10px 12px;width:100%;background:transparent;border:1px solid #b6aeb3;border-radius:4px;font:13px/1.7 var(--mono);min-height:44px}
.skill-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:36px}
.skill-card{padding:24px 0 28px;border-top:1px solid var(--line);display:flex;flex-direction:column}
.skill-card .skill-meta{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font:12px/1.8 var(--mono);margin-bottom:15px}
.skill-card h2{font-size:21px;font-weight:700;margin-bottom:10px}
.skill-card p{font-size:14px;color:var(--muted);margin-bottom:14px}
.skill-card .pills{margin-top:auto}
.result-status{font-size:12px;color:var(--muted);min-height:24px}
.empty{padding:40px 0;color:var(--muted);grid-column:1/-1}
.skill-body h2{font-size:23px;margin:26px 0 13px}
.skill-body ul{padding-left:21px;color:var(--muted)}
.skill-body details{margin-top:26px;border:1px solid var(--line);border-radius:4px;padding:16px 20px;background:#fffaf7}
summary{cursor:pointer;min-height:44px;align-content:center;font-family:var(--mono)}
.skill-prompt{white-space:pre-wrap;overflow-wrap:anywhere;font:14px/1.85 var(--reading);padding-top:16px;border-top:1px solid var(--line);margin-top:10px;color:var(--muted)}
.app-feature{padding:35px 35px 28px;background:#e9eee3;border:1px solid #d9dfd1;border-radius:7px;margin-top:26px}
.app-heading{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:30px}
.app-heading h1,.app-heading h2{font:700 23px/1.5 var(--mono)}
.app-heading p{font:14px/1.8 var(--mono);color:#53604b}
.app-feature h3{font-size:30px;line-height:1.55;margin-bottom:17px;max-width:640px}
.app-feature>.app-description{font-size:15px;max-width:610px;color:#53604b;margin-bottom:23px}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 19px;border:1px solid var(--ink);border-radius:4px;font:13px/1.6 var(--mono);background:var(--ink);color:var(--card)}
.button:hover{background:#444044;color:white}
.button.secondary{color:var(--ink);background:transparent;border-color:#b0b7a9}
.button.secondary:hover{background:#dde4d5}
.button-group{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}
.app-caption{font-size:14px;color:#53604b;margin-top:14px}
.app-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin:35px 0}
.app-benefits h2{font-size:18px;margin-bottom:10px}
.app-benefits p{font-size:14px;color:var(--muted)}
.article-row{display:grid;grid-template-columns:100px minmax(0,1fr);column-gap:24px;padding:26px 0;border-top:1px solid var(--line)}
.article-row .article-category{color:var(--muted);font:12px/1.7 var(--mono);padding-top:4px}
.article-row h2{font-size:22px;line-height:1.55;margin-bottom:9px;font-weight:700}
.article-row p{font-size:14px;color:var(--muted)}
.article-row .article-note{font:12px/1.7 var(--mono);color:var(--muted);margin-top:12px}
.reading{max-width:660px}
.reading h2{font-size:23px;margin:34px 0 15px}
.reading p{font-size:17px;line-height:1.95;margin-bottom:20px}
.reading blockquote{margin:28px 0;padding:17px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font:21px/1.7 var(--mono)}
.map-panel{position:relative;min-height:430px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:27px;background-image:radial-gradient(#c5bfc34d .8px,transparent .8px);background-size:24px 24px;overflow:hidden}
.map-panel svg{position:absolute;width:100%;height:100%;inset:0;color:#beb8b4;pointer-events:none}
.map-node{position:absolute;transform:translate(-50%,-50%);min-height:44px;min-width:44px;background:var(--paper);border:1px solid transparent;border-radius:5px;padding:9px 12px;font:14px/1.5 var(--mono);white-space:nowrap;display:flex;align-items:center;gap:7px}
.map-node:before{content:'';width:7px;height:7px;border-radius:50%;background:#91848f}
.map-node[aria-pressed=true]{background:#edf1e4;border-color:#a6b493;color:#3d5335}
.map-node[aria-pressed=true]:before{background:#70875a}
.map-caption{position:absolute;bottom:15px;left:15px;font:12px/1.7 var(--mono);color:var(--muted)}
.node-description{display:grid;grid-template-columns:160px minmax(0,1fr);gap:25px;margin-top:27px;min-height:130px}
.node-description h2{font-size:22px}
.node-description p{font-size:15px;color:var(--muted)}
.node-description a{display:inline-flex;min-height:44px;align-items:center;font-size:13px;text-decoration:underline;text-underline-offset:5px;color:var(--pink)}
.photo-intro{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}
.photo-intro .page-intro{margin-bottom:0}
.photo-gallery{display:flex;flex-direction:column;gap:18px}
.photo-row{display:flex;gap:18px;align-items:start}
.photo-row figure{min-width:0;flex-basis:0!important}
.photo-item{display:block;width:100%;text-align:left;padding:0;position:relative}
.photo-item img{width:100%;height:100%;object-fit:contain;transition:opacity .2s}
.photo-item:hover img{opacity:.9}
.site-footer{max-width:1200px;padding:24px 0;margin:0 auto;border-top:1px solid var(--line);display:flex;align-items:center;gap:26px;font:12px/1.8 var(--mono);color:var(--muted)}
.prototype-note{margin-left:auto;min-height:44px;font:12px/1.8 var(--mono);padding:0}
.prototype-note:hover{text-decoration:underline}
dialog{color:var(--ink);border:1px solid #bfb7bc;border-radius:6px;background:var(--paper);width:min(1000px,calc(100% - 40px));max-height:90vh;padding:24px}
dialog::backdrop{background:#29232ad9}
.dialog-top{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:20px}
.dialog-top h2{font-size:20px}
.close{min-width:60px;min-height:44px;font-size:13px}
.close span{font-size:24px;margin-left:6px}
.lightbox-img{max-height:65vh;width:100%;object-fit:contain}
.lightbox-controls{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px;font-size:12px;color:var(--muted)}
.lightbox-controls button{min-height:44px;padding:5px 12px;border:1px solid var(--line);font-size:13px}
.dialog-copy{max-width:640px;font-size:15px;line-height:1.9}
.dialog-copy p+p{margin-top:15px}
@media(min-width:1000px){main{animation:arrive .3s ease-out}}
@keyframes arrive{from{opacity:.5;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:1150px){.site-layout{gap:42px;grid-template-columns:190px minmax(0,1fr)}nav{gap:18px}.detail-grid{grid-template-columns:minmax(0,1fr) 190px;gap:25px}.site-footer{margin-left:30px;margin-right:30px}.resource-row{grid-template-columns:130px minmax(0,1fr)}}
@media(max-width:900px){.site-layout{grid-template-columns:165px minmax(0,1fr);gap:32px;padding-top:40px}.header-inner{padding-left:24px;padding-right:24px;gap:20px}nav{gap:16px;font-size:12px}.wordmark{font-size:20px}.profile-intro,.sidebar-notes p,.dot-list{font-size:12px}.socials{gap:12px}.resource-row,.flow-list .resource-row{grid-template-columns:120px minmax(0,1fr);gap:20px}.detail-grid{grid-template-columns:1fr}.related{margin-top:10px}.home-bottom{grid-template-columns:1fr;gap:0}.skill-grid{column-gap:24px}.skill-card h2{font-size:19px}.app-feature{padding:25px}.material-grid{grid-template-columns:1fr 1fr}.workspace{grid-template-columns:95px 1fr}.workspace-main{padding:16px}.article-row{grid-template-columns:1fr;gap:7px}}
@media(max-width:700px){.header-inner{padding:9px 20px;min-height:67px;position:relative;flex-wrap:wrap}.wordmark{font-size:23px}.menu-toggle{display:block;margin-left:auto}nav{display:none;width:100%;padding:8px 0 14px;gap:5px 25px;flex-wrap:wrap;font-size:14px}nav.open{display:flex}nav a{min-width:60px}.site-layout{display:flex;flex-direction:column;gap:0;padding:30px 22px 55px}.profile{display:grid;grid-template-columns:70px 1fr;gap:0 18px;padding:0 0 25px;border-bottom:1px solid var(--line);margin-bottom:31px}.portrait-link{grid-column:1;grid-row:1/4;margin:0;width:70px;align-self:center}.portrait{width:70px;height:70px}.profile-name{text-align:left;font-size:18px;display:flex;align-items:baseline;gap:10px}.profile-name span{font-size:12px;margin:0}.profile-intro{text-align:left;margin-top:4px;font-size:13px}.profile-intro br{display:none}.socials{grid-column:2;justify-content:flex-start;margin:0;gap:18px}.socials a{min-height:44px;line-height:44px}.sidebar-notes{display:none}.name-line{gap:12px;margin:0 0 25px}.name-line h1{font-size:30px;padding:2px 10px}.name-line svg{width:36px}.name-en{font-size:18px}.intro-copy{font-size:16px;line-height:1.95}.hello-note{font-size:12px;align-items:start}.section-heading{margin-top:35px;gap:10px}.section-heading h2{font-size:23px}.resource-row,.flow-list .resource-row{grid-template-columns:95px minmax(0,1fr);gap:17px;padding:22px 0}.resource-row h3,.flow-list .resource-row h3{font-size:17px}.resource-row p{font-size:14px}.resource-row .pills{gap:5px}.pill{font-size:12px;padding:0 6px}.thumb{aspect-ratio:1.15}.thumb-ppt,.thumb-writing{padding:8px}.mini-slide,.mini-note{padding:8px}.mini-slide strong{font-size:12px}.mini-slide span,.mini-note{font-size:12px}.mini-note{line-height:1.4}.home-bottom{grid-template-columns:1fr}.page-intro h1{font-size:29px}.page-intro p{font-size:16px}.page-intro .subtitle{font-size:12px}.skill-grid{grid-template-columns:1fr}.skill-card h2{font-size:21px}.skill-card p{font-size:16px}.search{width:100%}.search input{font-size:16px}.catalog-controls{gap:14px}.filters{gap:3px}.filters button{font-size:12px;padding:7px 10px}.steps h2{font-size:20px}.steps p{font-size:16px}.steps li{padding-left:38px}.app-feature{padding:20px 17px}.app-feature h3{font-size:24px}.app-heading{gap:10px;flex-wrap:wrap}.app-heading h2{font-size:20px}.app-description{font-size:16px!important}.workspace{grid-template-columns:1fr}.workspace-nav{display:flex;gap:5px;border-right:0;border-bottom:1px solid #e2e3dc;padding:7px}.workspace-nav button{width:auto;min-height:44px;white-space:nowrap}.workspace-main{padding:16px}.material-grid{gap:9px}.material p{font-size:14px}.app-benefits{grid-template-columns:1fr;gap:24px}.app-benefits p{font-size:16px}.article-row h2{font-size:21px}.article-row p{font-size:16px}.reading p{font-size:16px}.map-panel{min-height:355px;background-size:21px 21px}.map-node{font-size:12px;padding:9px 7px;gap:5px}.map-node:before{width:5px;height:5px}.node-description{grid-template-columns:1fr;gap:10px}.node-description p{font-size:16px}.photo-gallery{gap:18px}.photo-row{gap:18px}.photo-item img{height:100%}.photo-intro{display:block}.site-footer{margin:0 22px;padding:20px 0;gap:5px 15px;flex-wrap:wrap}.prototype-note{margin-left:0}.site-footer>span:nth-child(2){display:none}dialog{padding:17px;width:calc(100% - 24px)}.dialog-top{margin-bottom:12px}.dialog-top h2{font-size:18px}.lightbox-controls{flex-wrap:wrap}.dialog-copy{font-size:16px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.marker.lavender:before{background:#d9c2ed88;transform:rotate(-.5deg)}
.home-app-icon{width:56px;height:56px;object-fit:contain;margin-bottom:16px}
.thumb-notebook{background:#e9eee3}
.thumb-notebook img{width:64px;height:64px;object-fit:contain}
.mini-entry time{display:block;margin-top:12px;color:var(--muted);font:12px/1.6 var(--mono)}
.workflow-reading section+section{margin-top:32px}
.workflow-reading h2{font-size:22px;margin-bottom:12px}
.workflow-reading p{font-size:16px;line-height:1.95;color:var(--muted)}
.product-brand{display:flex;align-items:center;gap:16px}
.product-brand img{width:60px;height:60px}
.app-heading .pills{margin:0}
.app-tabs{display:flex;gap:10px;border-bottom:1px solid #c8d1bf;margin-bottom:25px}
.app-tabs button{padding:10px 20px;min-height:44px;font:14px/1.7 var(--mono);border-bottom:2px solid transparent}
.app-tabs button[aria-selected=true]{border-color:#526346;color:#35472b}
.app-panel-copy h3{font-size:27px}
.product-screenshot{width:100%;height:auto;margin-top:25px;border:1px solid #cbd0c5;border-radius:5px}
.install-command{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 15px;border:1px solid #b9c4ae;border-radius:4px;margin-top:24px}
.install-command code{font:13px/1.8 var(--mono);overflow-wrap:anywhere}
.install-command button{font-size:13px;min-height:44px;white-space:nowrap}
.app-related{margin-top:35px}
.photo-intro{display:block;margin-bottom:35px}
.photo-intro blockquote{margin:22px 0 0}
.photo-intro blockquote p{font:23px/1.7 var(--mono)}
.photo-intro cite{display:block;margin-top:8px;color:var(--muted);font:13px/1.8 var(--mono)}
.photo-intro cite a{text-decoration:underline;text-underline-offset:4px;display:inline-flex;min-height:44px;align-items:center}
.site-colophon{margin-left:auto}
.post-body{max-width:100%;overflow-wrap:anywhere}
.post-body h1{font-size:28px;margin:30px 0 18px}
.post-body h2{font-size:24px;margin:32px 0 18px}
.post-body h3{font-size:20px;margin:27px 0 16px}
.post-body p,.post-body li{font-size:16px;line-height:1.95}
.post-body ul,.post-body ol{padding-left:24px;margin:18px 0}
.post-body a{color:var(--pink);text-decoration:underline;text-underline-offset:3px}
.post-body img{max-width:100%;height:auto;margin:20px auto}
.post-body code{font:14px/1.75 var(--mono);background:#eee6e4;padding:2px 4px;border-radius:3px}
.post-body pre{max-width:100%;overflow-x:auto;padding:18px;background:#f0e9e6;border:1px solid var(--line);border-radius:4px;margin:22px 0;white-space:pre}
.post-body pre code{background:none;padding:0}
.post-body .highlight{background:none}
.post-body table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;margin:24px 0;font-size:14px}
.post-body th,.post-body td{border:1px solid var(--line);padding:8px 12px}
.post-body blockquote{font:inherit;padding:15px 20px;background:#f4ece8}
.post-body hr{border:0;border-top:1px solid var(--line);margin:32px 0}
.post-body mjx-container{display:inline-block;max-width:100%;overflow-x:auto;overflow-y:hidden}
.post-body mjx-container[display=true]{display:block;padding-bottom:6px}
.post-pagination{display:flex;justify-content:space-between;gap:24px;border-top:1px solid var(--line);margin-top:40px;padding-top:20px;font:14px/1.8 var(--reading)}
.post-pagination a{max-width:48%;min-height:44px}
.post-comments{border-top:1px solid var(--line);margin-top:30px;padding-top:15px}
@media(max-width:700px){.product-brand{gap:10px}.product-brand img{width:45px;height:45px}.app-panel-copy h3{font-size:23px}.app-tabs button{padding:10px 16px}.resource-row p,.mini-entry p,.app-benefits p{font-size:16px}.install-command{align-items:start;flex-wrap:wrap}.product-screenshot{margin-top:20px}.workflow-reading h2{font-size:21px}.photo-intro blockquote p{font-size:21px}.socials{gap:14px}}