/* Editorial humour for variant 9 only. */
@font-face{font-family:Inter;src:url("../../../fonts/inter/Inter-variable.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Portfolio Marker";src:url("../../../fonts/caveat/Caveat-variable.ttf") format("truetype");font-style:normal;font-weight:400 700;font-display:swap}
#top.hero{padding-top:64px;padding-bottom:50px}
#top.hero .hero-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,.7fr);gap:36px;align-items:center}
#top.hero .hero-grid>div{min-width:0}
#top.hero .eyebrow{font-size:13px;line-height:1.5;max-width:38em;margin-bottom:22px}
#top.hero h1{font-size:clamp(39px,4.8vw,73px);line-height:1.03;letter-spacing:-.05em;max-width:14ch;text-wrap:balance}
#top.hero h1 span{color:#b2c8ff}
#top.hero .lead{font-size:clamp(17px,1.6vw,20px);max-width:35em;line-height:1.55;margin-top:24px}
#top.hero .hero-actions{margin-top:24px}
.meme-scene{position:relative;margin:0;min-width:0}
.meme-scene img{display:block;height:auto;object-fit:contain}
.meme-scene figcaption,.voice-note{font-family:"Portfolio Marker",cursive;font-weight:700;font-style:normal;line-height:1.05;letter-spacing:-.015em}
.meme-scene figcaption{color:#ff813b;font-size:clamp(23px,2.5vw,36px)}
.meme-scene--cat{display:flex;align-items:center;gap:22px;width:fit-content;margin-top:30px;margin-left:12px}
.meme-scene--cat img{width:clamp(125px,12vw,180px);transform:rotate(-7deg)}
.meme-scene--cat figcaption{transform:rotate(5deg);max-width:190px}
.meme-scene--cat svg{display:block;width:110px;height:38px;margin-top:6px;fill:none;stroke:currentColor;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.serious-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.7fr);align-items:center;gap:30px;margin-bottom:52px;padding-bottom:38px;border-bottom:1px solid var(--line)}
.editorial-kicker{margin:0 0 14px;font-size:11px;line-height:1.4;font-weight:750;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.serious-intro h2{font-size:clamp(35px,4.4vw,64px);line-height:1.05;letter-spacing:-.05em;margin:0 0 20px}
.serious-intro h2 span{color:var(--violet-dark)}
.serious-intro>div>p:last-child{color:var(--muted);font-size:17px;line-height:1.6;margin:0}
.meme-scene--dog{display:grid;grid-template-columns:minmax(0,230px) minmax(85px,1fr);gap:14px;align-items:center}
.meme-scene--dog img{width:100%;transform:rotate(-5deg)}
.meme-scene--dog figcaption{font-size:clamp(23px,2.2vw,32px);transform:rotate(5deg)}
#about .voice-note{color:var(--violet-dark);font-size:clamp(21px,2vw,29px);margin-top:25px}
#skills .skills-head--meme{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,.75fr);align-items:center;gap:36px;margin-bottom:36px}
#skills .skills-head--meme h2{margin-bottom:18px}
#skills .skills-head--meme>div>p:last-child{font-size:18px;line-height:1.6;max-width:34em}
.meme-scene--raccoon{padding-right:90px}
.meme-scene--raccoon img{width:260px;max-width:100%;transform:rotate(-4deg)}
.meme-scene--raccoon figcaption{position:absolute;right:0;bottom:20px;transform:rotate(6deg);font-size:clamp(24px,2.5vw,35px)}
:root[data-theme=dark] .serious-intro h2 span,:root[data-theme=dark] #about .voice-note{color:#b2c8ff}
@media(max-width:850px){
  .serious-intro{grid-template-columns:1fr;gap:24px}
  .meme-scene--dog{grid-template-columns:200px 1fr;max-width:380px;justify-self:end}
  #skills .skills-head--meme{grid-template-columns:1fr;gap:24px}
  .meme-scene--raccoon{width:min(100%,350px);justify-self:end}
}

/* Step 4: chronological reading order and a clear ending to the resume. */
#experience .experience-masonry{--experience-columns:3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:22px}
.resume-next{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;margin-top:48px;padding-top:34px;border-top:1px solid var(--line)}
.resume-next h3{max-width:25ch;font-size:clamp(27px,3vw,42px);font-weight:700;line-height:1.12;letter-spacing:-.035em;margin:0;text-wrap:balance}
.resume-next .button{gap:14px;flex:none;background:var(--lime);color:#24202a}
.resume-next .button:hover{background:#d3d3d3;color:#24202a}
@media(max-width:1000px){#experience .experience-masonry{--experience-columns:2;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media(max-width:600px){#experience .experience-masonry{--experience-columns:1;grid-template-columns:1fr;gap:16px}.resume-next{margin-top:34px;padding-top:26px;align-items:flex-start;flex-direction:column}}
@media(max-width:600px){
  #top.hero{padding-top:36px;padding-bottom:36px}
  #top.hero .hero-grid{grid-template-columns:1fr;gap:30px}
  #top.hero h1{font-size:clamp(36px,10.2vw,58px);max-width:15ch}
  #top.hero .eyebrow{font-size:12px;margin-bottom:18px}
  #top.hero .lead{font-size:17px}
  .meme-scene--cat{gap:16px;margin-top:24px;margin-left:8px}
  .meme-scene--cat img{width:130px}
  .meme-scene--cat figcaption{font-size:26px}
  .serious-intro{margin-bottom:30px;padding-bottom:26px}
  .meme-scene--dog{grid-template-columns:minmax(0,180px) minmax(80px,1fr);gap:12px;width:100%}
  .meme-scene--dog figcaption{font-size:27px}
  #skills .skills-head--meme>div>p:last-child{font-size:16px}
  .meme-scene--raccoon{padding-right:70px;max-width:310px}
  .meme-scene--raccoon figcaption{font-size:27px;bottom:15px}
}

/* A warm introduction and readable, locally hosted marker captions. */
#top.hero .hero-greeting{display:block;color:#fff;font-size:18px;font-weight:650;letter-spacing:0;margin-bottom:7px}
#top.hero .hero-profession{display:block;margin-top:12px;color:var(--lime);font-size:clamp(19px,2.1vw,28px);font-weight:700;line-height:1.25;letter-spacing:-.025em;text-wrap:balance}
body[data-page-view="portfolio"] .resume-ticker{display:none}
.meme-scene figcaption{font-size:clamp(32px,3.3vw,46px);-webkit-text-stroke:.2px currentColor}
.meme-scene--cat figcaption{max-width:200px}
.meme-scene--cat svg{color:#315fcd;width:125px}
.meme-scene--dog figcaption,.meme-scene--raccoon figcaption{font-size:clamp(31px,3vw,43px)}
.meme-scene--dog figcaption::after,.meme-scene--raccoon figcaption::after{content:"";display:block;width:85%;height:8px;border-bottom:4px solid var(--ink);border-radius:0 0 55% 35%;transform:rotate(-7deg);margin-top:4px}
#about .about-copy-main{display:grid;grid-template-columns:minmax(160px,.65fr) minmax(0,1.35fr);align-items:start;gap:30px}
#about .about-aside{font-size:clamp(22px,2.2vw,31px);line-height:1.3;padding:24px;border-radius:20px;background:var(--lilac);color:var(--ink);margin:0;border-color:transparent;}
#about .about-aside-label{display:block;color:var(--violet-dark);font-size:10px;font-weight:750;letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px}
#about .about-aside-answer{display:block;margin-top:22px;color:var(--violet-dark);font-size:17px;font-weight:700;line-height:1.4}
#about .about-text p:first-child{font-size:20px;line-height:1.55}
#about .voice-note{font-size:clamp(27px,2.6vw,37px);line-height:1.1;color:#ba440a}
#skills .skills-head--meme>div>p{font-size:18px;line-height:1.55;color:var(--muted);margin:12px 0 0;max-width:33em}
#skills .skills-head--meme .editorial-kicker{font-size:11px;margin:0 0 14px}
#skills .skills-head--meme .skills-joke{color:var(--ink);font-weight:650}
#skills .skills-head--meme .skills-intro-note{font-size:15px;margin-top:18px;max-width:32em}
:root[data-theme=dark] #about .voice-note{color:#ff9a5f}
@media(max-width:1000px){#about .about-copy-main{grid-template-columns:1fr;gap:24px}#about .about-aside{max-width:440px}}
@media(max-width:600px){
  #top.hero .hero-greeting{font-size:17px}
  #about .about-aside{padding:22px;font-size:26px}
  #about .about-text p:first-child{font-size:18px}
  #skills .skills-head--meme>div>p{font-size:16px}
  .meme-scene--cat figcaption,.meme-scene--dog figcaption,.meme-scene--raccoon figcaption{font-size:34px}
}

/* Resume composition: shared axes, controlled sticker space, no header dropdown. */
.topbar{background:#1d1c20;backdrop-filter:none}
body[data-page-view="home"] main>section>.wrap{width:min(1780px,calc(100% - 48px));margin-inline:auto}
body[data-page-view="home"] main>section:not(.hero){padding-top:68px;padding-bottom:68px}
body[data-page-view="home"] .section-head{text-align:left;margin-inline:0;max-width:none}
#top.hero .hero-grid{align-items:start}
#top.hero .portrait-card{align-self:start;margin-top:50px}
.hero-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:22px 28px;margin-top:26px}
#top.hero .hero-bottom .hero-actions{margin-top:0;flex:none}
#top.hero .hero-bottom .meme-scene--cat{margin:0;gap:14px}
#top.hero .hero-bottom .meme-scene--cat img{width:118px}
#top.hero .hero-bottom .meme-scene--cat figcaption{font-size:34px}
#about .about-copy{grid-template-columns:1fr;gap:20px;margin-bottom:0}
#about .about-copy-main{grid-template-columns:minmax(200px,.65fr) minmax(0,1.35fr);gap:38px}
#about .about-text{max-width:65ch}
#about .profile-visual{min-height:0;width:190px;max-width:100%;justify-self:end;align-self:end;margin:0}
#about .profile-keyboard{width:100%;max-width:190px}
#about .profile-keyboard img{width:100%;max-height:none}
.serious-intro{grid-template-columns:minmax(0,1fr) minmax(250px,.65fr);gap:24px;margin-bottom:32px;padding-bottom:26px}
.serious-intro h2{font-size:clamp(32px,3.5vw,48px);margin-bottom:14px}
.meme-scene--dog{grid-template-columns:minmax(0,170px) minmax(85px,1fr)}
#experience>.experience-wrap{width:min(1780px,calc(100% - 48px));margin-inline:auto}
#experience .experience-intro{text-align:left;margin-inline:0;transform:none}
#approach .journey{margin-top:0}
#approach .journey-note{margin-top:24px;margin-bottom:0}
#skills .skills-head--meme{text-align:left;grid-template-columns:minmax(0,1fr) minmax(260px,.7fr);gap:32px}
.meme-scene--raccoon{display:grid;grid-template-columns:minmax(0,210px) minmax(80px,1fr);align-items:center;gap:12px;padding-right:0}
.meme-scene--raccoon figcaption{position:static;font-size:34px}
@media(max-width:850px){
  #about .about-copy-main{grid-template-columns:minmax(170px,.65fr) minmax(0,1.35fr);gap:24px}
  .serious-intro{grid-template-columns:1fr minmax(230px,.75fr)}
  .meme-scene--dog{max-width:none;grid-template-columns:minmax(0,145px) minmax(80px,1fr)}
  #skills .skills-head--meme{grid-template-columns:1fr}
  .meme-scene--raccoon{justify-self:start;width:min(100%,350px)}
}
@media(max-width:600px){
  body[data-page-view="home"] main>section>.wrap,#experience>.experience-wrap{width:calc(100% - 30px)}
  body[data-page-view="home"] main>section:not(.hero){padding-block:44px}
  #top.hero .portrait-card{margin-top:0;justify-self:center}
  .hero-bottom{gap:22px}
  #about .about-copy-main{grid-template-columns:1fr;gap:24px}
  #about .profile-visual{width:150px}
  .serious-intro{grid-template-columns:1fr;gap:22px;margin-bottom:28px}
  .meme-scene--dog{justify-self:start;width:min(100%,330px);grid-template-columns:minmax(0,160px) minmax(80px,1fr)}
}

/* Each card reserves only its own height, so shorter columns keep flowing. */
#experience .experience-masonry.experience-packed{grid-auto-rows:1px;row-gap:0}

/* Heading and supporting text share one left edge. Reset inherited centering. */
body[data-page-view="home"] .section-head p{margin-left:0;margin-right:0;text-align:left}
#experience .experience-intro{max-width:none;padding:0}
#experience .experience-intro>p{margin:18px 0 0;text-align:left;max-width:65ch}
#experience .experience-intro h2{font-size:clamp(36px,5.2vw,68px);line-height:1.08;letter-spacing:-.045em;text-wrap:balance}
#approach .section-head h2{font-size:clamp(34px,4.5vw,58px);line-height:1.1;letter-spacing:-.04em;text-wrap:balance}

/* Shared spacing anchors: title -> explanation -> first card. */
:root{--resume-title-gap:18px;--resume-content-gap:32px}
#experience .experience-intro,#approach .section-head{display:flex;flex-direction:column;align-items:flex-start;gap:var(--resume-title-gap);margin:0 0 var(--resume-content-gap);padding:0;transform:none}
#approach .section-head>div{display:flex;flex-direction:column;align-items:flex-start;gap:var(--resume-title-gap);min-width:0}
#experience .experience-intro h2,#experience .experience-intro>p,#approach .section-head h2,#approach .section-head p{margin:0}
#experience .experience-masonry,#approach .journey{margin-top:0;padding-top:0}
@media(max-width:600px){:root{--resume-title-gap:14px;--resume-content-gap:24px}}

/* Section boundaries use one compact rhythm; no extra masonry tail. */
:root{--resume-section-pad:40px}
body[data-page-view="home"] main>section:not(.hero){padding-block:var(--resume-section-pad);margin-block:0}
#education .education-block,#experience .experience-masonry{margin-bottom:0}
#education .education-list>.education-item:last-child{margin-bottom:0}
@media(max-width:600px){:root{--resume-section-pad:28px}}

/* Attach the keyboard to the questions column rather than a separate full row. */
#about .about-side{display:flex;flex-direction:column;align-items:stretch;min-width:0;gap:12px}
#about .about-side .profile-visual{position:relative;inset:auto;display:block;align-self:flex-end;justify-self:auto;width:clamp(140px,14vw,180px);max-width:100%;height:auto;min-height:0;margin:0;padding:0;overflow:visible;transform:none}
#about .about-side .profile-keyboard{position:static;display:block;width:100%;height:auto;max-width:none;min-height:0;margin:0;padding:0;overflow:visible;transform:none}
#about .about-side .profile-keyboard img{position:static;display:block;width:100%;height:auto;max-width:100%;max-height:none;margin:0;object-fit:contain;transform:none;border:0;border-radius:0;box-shadow:none}
@media(max-width:600px){#about .about-side{gap:8px}#about .about-side .profile-visual{width:130px}}

#experience .experience-card{min-width:0;max-width:100%;overflow-wrap:break-word}
@media(max-width:600px){
 #experience .experience-masonry.experience-packed{grid-auto-rows:auto;row-gap:16px}
 #experience .experience-masonry>.experience-card{grid-column:1!important;grid-row:auto!important}
}

/* One handwriting family, matching the sticker captions; readable prose sizes. */
.site-nav .brand-lockup span,#education .education-tag,.zoom-hint{font-family:"Portfolio Marker",cursive;font-style:normal;font-weight:700}
.site-nav .brand-lockup span{font-size:clamp(21px,1.8vw,28px);letter-spacing:0}
#education .education-tag{font-size:32px;line-height:1.1}
#experience .experience-card li,#experience .experience-context,#experience .experience-card>p:not(.experience-meta):not(.experience-role):not(.experience-result),#skills .skill-card p,#approach .journey-step p{font-size:15px;line-height:1.55}
body[data-page-view="home"] main h2,body[data-page-view="home"] main h3{hyphens:none;word-break:normal;overflow-wrap:normal}
#experience .experience-role{word-break:normal;overflow-wrap:normal;hyphens:none;text-wrap:pretty}
@media(max-width:600px){.site-nav .brand-lockup span{font-size:20px}#education .education-tag{font-size:30px}}

/* Light resume: warm neutral surfaces, readable text and deliberate accents. */
:root:not([data-theme="dark"]){--paper:#faf9f6;--ink:#25222b;--muted:#625c69;--line:#d9d3e0;--lilac:#ededed;--violet:#315fcd;--violet-dark:#315fcd}
:root:not([data-theme="dark"]) body{background:var(--paper);color:var(--ink)}
:root:not([data-theme="dark"]) #about,:root:not([data-theme="dark"]) #education{background:#faf9f6;color:#25222b}
:root:not([data-theme="dark"]) #about .section-head h2,:root:not([data-theme="dark"]) #education h2,:root:not([data-theme="dark"]) #education h3,:root:not([data-theme="dark"]) #education h4,:root:not([data-theme="dark"]) #skills .section-head h2{color:#25222b}
:root:not([data-theme="dark"]) #about .about-text p{color:#4e4758}
:root:not([data-theme="dark"]) #about .about-aside{background:#ededed;color:#315fcd;border-color:transparent}
:root:not([data-theme="dark"]) #about .about-aside-label,:root:not([data-theme="dark"]) #about .about-aside-answer{color:#315fcd}
:root:not([data-theme="dark"]) .meme-scene figcaption,:root:not([data-theme="dark"]) #about .voice-note{color:#a83b00}
:root:not([data-theme="dark"]) #top.hero .meme-scene figcaption{color:#ff9a5f}
:root:not([data-theme="dark"]) #education .education-tag{color:#627600}
:root:not([data-theme="dark"]) #education .education-copy p,:root:not([data-theme="dark"]) #education .education-intro>p{color:#625c69}
:root:not([data-theme="dark"]) #education .education-year{color:#315fcd}
:root:not([data-theme="dark"]) #skills{background:#f0f0f0;color:#25222b}
:root:not([data-theme="dark"]) #skills .skill-card{background:#fff;border-color:transparent;box-shadow:0 5px 18px rgba(31,41,67,.04)}
:root:not([data-theme="dark"]) #skills .skill-card h3{color:#25222b}
:root:not([data-theme="dark"]) #skills .skill-card p{color:#554e60}
:root:not([data-theme="dark"]) #skills .editorial-kicker,:root:not([data-theme="dark"]) #skills .skills-head--meme>div>p{color:#625c69}
:root:not([data-theme="dark"]) #skills .skills-head--meme .skills-joke{color:#25222b}
:root:not([data-theme="dark"]) .tools .tool:nth-child(n){background:#fff;border-color:transparent;color:#4c4358;box-shadow:none}
:root:not([data-theme="dark"]) .tools .tool.tool--accent{background:#fff0e6;border-color:transparent;color:#a3390a}
:root[data-theme="dark"] .tools .tool:nth-child(n){background:#302e34;border-color:transparent;color:#315fcd;box-shadow:none}
:root[data-theme="dark"] .tools .tool.tool--accent{background:#3b2a25;border-color:transparent;color:#ff9a70}
:root:not([data-theme="dark"]) .meme-scene--cat svg{color:#f1f3f7}
:root:not([data-theme="dark"]) .serious-intro h2 span{color:#315fcd}
:root:not([data-theme="dark"]) .resume-next h3{color:#25222b}
:root:not([data-theme="dark"]) #experience.experience,:root:not([data-theme="dark"]) #approach.process{background:linear-gradient(115deg,#315fcd 0%,#315fcd 58%,#315fcd 100%);color:#fff}
:root[data-theme="dark"] #experience.experience,:root[data-theme="dark"] #approach.process{background:linear-gradient(115deg,#315fcd 0%,#315fcd 58%,#315fcd 100%);color:#fff}

/* Explicit snake placement for each layout; measured SVG follows these cards. */
#approach .journey{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:auto;gap:26px 18px}
#approach .journey-step{background:#333333;backdrop-filter:none;border-color:transparent;}
#approach .journey-step:nth-of-type(1){grid-area:1/1}
#approach .journey-step:nth-of-type(2){grid-area:1/2}
#approach .journey-step:nth-of-type(3){grid-area:1/3}
#approach .journey-step:nth-of-type(4){grid-area:2/3}
#approach .journey-step:nth-of-type(5){grid-area:2/2}
#approach .journey-step:nth-of-type(6){grid-area:2/1}
#approach .journey-step:nth-of-type(7){grid-area:3/1}
#approach .journey-step:nth-of-type(8){grid-area:3/2}
#approach .journey-road{overflow:visible;opacity:1}
#approach .journey-direction{fill:none;stroke:var(--lime);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.journey-condition{display:block;margin-top:12px;color:var(--lime);font-size:11px;font-weight:650;line-height:1.4}
@media(max-width:850px) and (min-width:601px){
 #approach .journey{grid-template-columns:repeat(2,minmax(0,1fr))}
 #approach .journey-step:nth-of-type(1){grid-area:1/1}
 #approach .journey-step:nth-of-type(2){grid-area:1/2}
 #approach .journey-step:nth-of-type(3){grid-area:2/2}
 #approach .journey-step:nth-of-type(4){grid-area:2/1}
 #approach .journey-step:nth-of-type(5){grid-area:3/1}
 #approach .journey-step:nth-of-type(6){grid-area:3/2}
 #approach .journey-step:nth-of-type(7){grid-area:4/2}
 #approach .journey-step:nth-of-type(8){grid-area:4/1}
}
@media(max-width:600px){
 #approach .journey{grid-template-columns:1fr;gap:14px}
 #approach .journey-step:nth-of-type(n){grid-area:auto;min-height:0}
 #approach .journey-road{display:none}
}
:root .resume-ticker{height:auto;padding-block:11px;min-height:0}
:root .resume-ticker .portfolio-ticker-group{padding-block:0;font-size:13px;line-height:1.35}
#education .education-provider{display:block;margin-top:4px}
.skill-card .skill-case-link{display:inline-block;margin-top:18px;font-size:14px;font-weight:700;line-height:1.45;color:inherit;text-decoration:underline;text-underline-offset:4px}
.skill-card .skill-case-link:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:2px}

/* Shared preview geometry: retain the complete image and align captions by row. */
#portfolio :is(#portfolio-panel-products,#portfolio-panel-ai) .portfolio-project-image--aligned{aspect-ratio:4 / 5;min-width:0;padding:clamp(12px,2vw,24px);display:grid;place-items:center}
#portfolio :is(#portfolio-panel-products,#portfolio-panel-ai) .portfolio-project-image--aligned img{width:100%;height:100%;min-height:0;object-fit:contain}
#portfolio :is(#portfolio-panel-products,#portfolio-panel-ai) .portfolio-project-copy h3{margin-top:0}
#portfolio :is(#portfolio-panel-products,#portfolio-panel-ai) .portfolio-project-copy p{overflow-wrap:break-word}
#portfolio-panel-rich .rich-zoom-button{display:block;width:100%;padding:0;border:0;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer}
#portfolio-panel-rich .rich-zoom-button:focus-visible{outline:3px solid var(--lime);outline-offset:4px;border-radius:4px}
#portfolio-panel-rich .rich-zoom-button img{display:block;max-width:100%}
#portfolio-panel-rich .rich-zoom-label{display:inline-block;margin-top:12px;font-size:14px;font-weight:700;text-decoration:underline;text-underline-offset:4px}

/* Resume audit, 1 November: explicit section rhythm beats legacy ID selectors. */
#about .about-side .profile-visual{aspect-ratio:1122 / 1402}

#experience .experience-card .experience-evidence{margin:8px 0 0;color:#d7d2dc;font-size:13px;line-height:1.5}
#education .education-specialty{display:block;margin-top:4px}
#skills .skills-head--meme{padding-bottom:0;border-bottom:0;margin-bottom:var(--resume-content-gap)}
#skills .skills-head--meme>div>p{max-width:36em}
.header-resume-menu a[aria-current="location"]{background:#f2f2f2;font-weight:700!important}
/* A programmatic focus target must remain visible and clearly identified. */
#portfolio-title:focus-visible,#top h1:focus-visible{outline:2px solid currentColor;outline-offset:8px}
/* Компактные инструменты только в резюме. */
#skills .tool-group .tools.resume-tools{flex-wrap:nowrap;gap:6px;margin-top:12px;width:max-content;max-width:none;transform-origin:left top}
#skills .tool-group .resume-tools .tool{flex:none;min-height:34px;padding:3px 7px 3px 3px;gap:5px;border-radius:9px;font-size:12px;white-space:nowrap}
#skills .tool-group .resume-tools .tool>span:last-child{white-space:nowrap}
#skills .resume-tool-icon{zoom:.75}
@media(max-width:700px){#skills .tool-group .tools.resume-tools{width:auto;max-width:100%;flex-wrap:wrap;zoom:1!important}}