/* Profile-only content layout; the published .app and its preview are untouched. */
.profile main{display:block;min-height:0;padding:0}
.profile .hero{display:grid;grid-template-columns:1fr 1.1fr;align-items:center;min-height:540px;padding:60px 0 74px}
.profile .profile-intro{max-width:33ch;font-size:19px;line-height:1.65;color:var(--sub);margin:0}
.profile .header-nav{display:flex;align-items:center;gap:28px}
.profile .section-nav{display:flex;gap:24px;font-size:13px}
.profile .section-nav a{display:inline-flex;align-items:center;min-height:44px;color:var(--sub)}
.profile .section-nav a:hover{color:var(--blue)}
.profile .content-section{display:grid;grid-template-columns:1fr 1.6fr;gap:64px;padding:62px 0;border-top:1px solid var(--quiet);scroll-margin-top:28px}
.profile h2{font-size:clamp(27px,3vw,38px);font-weight:580;letter-spacing:-1px;line-height:1.2;margin:0}
.profile .eyebrow{font:11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--blue);letter-spacing:1px;text-transform:uppercase;margin:0 0 12px}
.profile .section-summary{color:var(--sub);font-size:15px;line-height:1.7;max-width:24ch;margin:20px 0 0}
.profile .prose{max-width:64ch;font-size:17px;line-height:1.8;color:var(--sub)}
.profile .prose p{margin:0 0 22px}
.profile .language-fact{margin:30px 0 0}
.profile .language-fact dt{font-size:13px;color:var(--sub);margin-bottom:6px}
.profile .language-fact dd{margin:0;color:var(--fg);font:14px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace}
.profile .project+.project{margin-top:30px;padding-top:30px;border-top:1px solid var(--quiet)}
.profile .project-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.profile h3{font-size:23px;font-weight:560;letter-spacing:-.5px;margin:0;overflow-wrap:anywhere}
.profile h3 a{display:inline-flex;gap:15px;align-items:center;min-height:44px}
.profile h3 a:hover{color:var(--blue)}
.profile h3 svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .18s steps(3)}
.profile h3 a:hover svg,.profile h3 a:focus-visible svg{transform:translate(3px,-3px)}
.profile .project-role{font:11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--blue)}
.profile .project p{max-width:58ch;line-height:1.75;font-size:16px;color:var(--sub);margin:12px 0}
.profile .project .project-tech{font:12px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;margin:18px 0 0}
.profile .contribution-list{margin:0;max-width:64ch}
.profile .contribution-list div+div{margin-top:27px}
.profile .contribution-list dt{font-size:18px;font-weight:550;margin-bottom:10px}
.profile .contribution-list dd{font-size:16px;line-height:1.8;color:var(--sub);margin:0}
@media(max-width:1050px){.profile .header-nav{gap:16px}.profile .section-nav{gap:16px}.profile .hero{min-height:480px;padding:45px 0 55px}.profile .content-section{grid-template-columns:1fr 1.6fr;gap:32px}.profile h3{font-size:21px}}
@media(max-width:720px){.profile header{flex-wrap:wrap;gap:10px}.profile .header-nav{width:100%;justify-content:space-between;gap:8px}.profile .section-nav{gap:18px;font-size:12px}.profile .language-nav a{padding:10px}.profile .hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding:38px 0 35px;gap:20px}.profile .profile-intro{font-size:17px}.profile .content-section{grid-template-columns:1fr;gap:25px;padding:36px 0}.profile .section-summary{max-width:none;margin-top:12px}.profile .eyebrow{margin-bottom:8px}.profile .prose{font-size:16px}.profile .project-heading{gap:2px 14px}.profile .project-role{font-size:10px}.profile .project p{font-size:15px}.profile .project .project-tech{font-size:11px}.profile h3{font-size:22px}}
@media(prefers-reduced-motion:reduce){.profile *{animation:none!important;transition:none!important}}
.profile .section-nav a[aria-current]{color:var(--fg);text-decoration:underline;text-underline-offset:7px}
.profile-home .hero{min-height:calc(100svh - 170px)}
.profile .about-body{border-top:0;padding-top:100px}
.profile .about-body h1{font-size:clamp(38px,4.5vw,64px);margin:0;line-height:1.1}
@media(max-width:720px){.profile-home .hero{min-height:calc(100svh - 210px);justify-content:center}.profile .about-body{padding-top:48px}.profile .about-body h1{font-size:44px}}
/* A long preview must not place its draft marker over readable content. */
.profile .layout{min-height:calc(100svh - 48px);padding-bottom:36px}
.profile .preview-label{position:static;display:table;transform:none;margin:0 auto 20px}

.profile .contribution-list a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
.profile .contribution-list a:hover{color:var(--blue)}

/* Separate English .dev content pages. */
.dev-content-page .dev-detail{border-top:0;padding-top:100px}
.dev-content-page .dev-detail h1{font-size:clamp(38px,4.5vw,64px);letter-spacing:-2px;line-height:1.1;margin:0;overflow-wrap:normal}
.dev-content-page .project h2{font-size:23px;font-weight:560;letter-spacing:-.5px;margin:0;overflow-wrap:anywhere}
.dev-content-page .project h2 a{display:inline-flex;gap:15px;align-items:center;min-height:44px}
.dev-content-page .project h2 a:hover{color:var(--blue)}
.dev-content-page .project h2 svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .18s steps(3)}
.dev-content-page .project h2 a:hover svg,.dev-content-page .project h2 a:focus-visible svg{transform:translate(3px,-3px)}
@media(max-width:720px){.dev-content-page .dev-detail{padding-top:48px}.dev-content-page .dev-detail h1{font-size:44px}.dev-content-page .project h2{font-size:22px}}

/* Static official Buy Me a Coffee cup. */
.profile .coffee-support{padding-top:4px}
.profile .coffee-button{display:inline-flex;align-items:center;gap:10px;min-height:44px;box-sizing:border-box;padding:7px 14px;color:var(--fg);background:#e8e4d9;border:1px solid var(--quiet);border-radius:6px;font:500 14px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-decoration:none}
.profile .coffee-button img{display:block;width:20px;height:29px;flex:none}
.profile .coffee-button:hover{background:#dedacf;border-color:var(--fg)}
.profile .coffee-button:focus-visible{outline:2px solid var(--blue);outline-offset:4px}

/* Quiet support link below social profiles on the .dev home. */
.dev.profile .intro .coffee-support{margin:24px 0 0;padding:0}
.dev.profile .coffee-button{background:#24384e;border-color:#30404f;color:#dce7f0}
.dev.profile .coffee-button:hover{background:#33495e;border-color:#86baff}

/* Text links remain identifiable without relying on colour. */
.profile :is(.prose,.contribution-list,.project) a:not(.coffee-button){color:var(--blue);text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:.2em;text-decoration-skip-ink:auto}
.profile :is(.prose,.contribution-list,.project) a:not(.coffee-button):hover{color:var(--fg);text-decoration-thickness:2px}
.profile .socials a{border-bottom:0;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em;text-decoration-skip-ink:auto}
.profile .socials a:hover{color:var(--blue);text-decoration-thickness:2px}
.profile a.external-link>svg{display:inline-block;width:.85em;height:.85em;fill:none;stroke:currentColor;stroke-width:1.6;vertical-align:baseline;flex:none}
.profile .coffee-button>svg{width:13px;height:13px}

/* Personal facts before the About paragraphs. */
.about-page .about-facts{margin:0 0 36px}
.about-page .about-facts>div{display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:.55em;align-items:baseline;padding:3px 0}
.about-page .about-facts>div:first-child{padding-top:0}
.about-page .about-facts dt{color:#526b8b;font-size:11px;font-weight:550;line-height:1.8;letter-spacing:.035em;text-transform:uppercase;text-align:right;white-space:nowrap}
.about-page .about-facts dd{margin:0;color:var(--fg);line-height:1.6;overflow-wrap:anywhere}
@media(max-width:480px){.about-page .about-facts>div{grid-template-columns:5.75rem minmax(0,1fr);padding:3px 0}.about-page .about-facts{margin-bottom:30px}}

.about-page .about-facts>div:first-child dd{font-weight:600}

@media(max-width:720px){.dev.profile .section-nav{flex-wrap:wrap;column-gap:16px;row-gap:0}}