@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --ink:#0b1739; --paper:#f4f8ff; --surface:#ffffff; --surface-blue:#e7f0ff; --muted:#53627e; --line:#c8d5ea; --accent:#1d5bd8; --accent-fill:#1d5bd8; --accent-deep:#1546aa; --accent-bright:#61a5ff; --on-accent:#fff; --navy:#07112d; --shell:min(1120px,calc(100% - 40px)); }
:root[data-accent="cyan"] { --accent:#00758c; --accent-fill:#00758c; --accent-deep:#00586c; --accent-bright:#30bfd5; --surface-blue:#dff6fa; }
:root[data-accent="violet"] { --accent:#7047c8; --accent-fill:#7047c8; --accent-deep:#50309b; --accent-bright:#a88af0; --surface-blue:#eee8ff; }
:root[data-accent="coral"] { --accent:#ae3f42; --accent-fill:#ae3f42; --accent-deep:#842c32; --accent-bright:#ee8580; --surface-blue:#ffebea; }
@media (prefers-color-scheme:dark) {
  :root:not([data-theme="light"]) { --ink:#eaf1ff; --paper:#071022; --surface:#101d36; --surface-blue:#13284b; --muted:#a7b7d3; --line:#60769e; --accent:#79b4ff; --accent-fill:#1d5bd8; --accent-deep:#1546aa; --accent-bright:#79b4ff; --navy:#030817; color-scheme:dark; }
  :root[data-accent="cyan"]:not([data-theme="light"]) { --accent:#54d6e9; --accent-fill:#00758c; --accent-deep:#00586c; --accent-bright:#54d6e9; --surface-blue:#10313e; }
  :root[data-accent="violet"]:not([data-theme="light"]) { --accent:#bba4ff; --accent-fill:#7047c8; --accent-deep:#50309b; --accent-bright:#bba4ff; --surface-blue:#282044; }
  :root[data-accent="coral"]:not([data-theme="light"]) { --accent:#ff9c95; --accent-fill:#ae3f42; --accent-deep:#842c32; --accent-bright:#ff9c95; --surface-blue:#3b2027; }
}
:root[data-theme="dark"] { --ink:#eaf1ff; --paper:#071022; --surface:#101d36; --surface-blue:#13284b; --muted:#a7b7d3; --line:#60769e; --accent:#79b4ff; --accent-fill:#1d5bd8; --accent-deep:#1546aa; --accent-bright:#79b4ff; --navy:#030817; color-scheme:dark; }
:root[data-theme="dark"][data-accent="cyan"] { --accent:#54d6e9; --accent-fill:#00758c; --accent-deep:#00586c; --accent-bright:#54d6e9; --surface-blue:#10313e; }
:root[data-theme="dark"][data-accent="violet"] { --accent:#bba4ff; --accent-fill:#7047c8; --accent-deep:#50309b; --accent-bright:#bba4ff; --surface-blue:#282044; }
:root[data-theme="dark"][data-accent="coral"] { --accent:#ff9c95; --accent-fill:#ae3f42; --accent-deep:#842c32; --accent-bright:#ff9c95; --surface-blue:#3b2027; }
:root[data-theme="light"] { color-scheme:light; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 82% 8%,color-mix(in srgb,var(--accent) 14%,transparent) 0,transparent 28%),var(--paper); font:400 1rem/1.7 Manrope,system-ui,sans-serif; transition:background-color .25s,color .25s; }
a { color:inherit; }
main a:not(.button),.site-footer a { color:var(--accent); text-decoration-color:color-mix(in srgb,var(--accent) 72%,transparent); text-decoration-thickness:.1em; text-underline-offset:.22em; transition:color .2s,text-decoration-color .2s; }
main a:not(.button):hover,.site-footer a:hover { color:color-mix(in srgb,var(--accent) 78%,var(--ink)); text-decoration-color:currentColor; }
.shell { width:var(--shell); margin-inline:auto; }
.skip-link { position:fixed; top:8px; left:8px; z-index:99; padding:10px 16px; background:var(--ink); color:white; transform:translateY(-150%); }
.skip-link:focus { transform:none; }
.site-header { position:sticky; top:0; z-index:20; background:color-mix(in srgb,var(--paper) 88%,transparent); backdrop-filter:blur(14px); border-bottom:1px solid transparent; }
.header-inner { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.wordmark { font:500 1.05rem DM Mono,monospace; text-decoration:none; }
.wordmark span { color:var(--accent); }
.primary-nav { display:flex; align-items:center; gap:28px; font-size:.9rem; }
.primary-nav a { text-decoration:none; }
.primary-nav a:not(.nav-cta):hover,.primary-nav a:not(.nav-cta):focus-visible { color:var(--accent); text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:5px; }
.nav-cta,.button { display:inline-flex; align-items:center; padding:11px 18px; background:linear-gradient(135deg,var(--accent-fill),var(--accent-deep)); color:var(--on-accent); text-decoration:none; border:1px solid var(--accent-fill); border-radius:8px; box-shadow:0 9px 24px color-mix(in srgb,var(--accent-fill) 26%,transparent); transition:transform .2s,box-shadow .2s; }
.nav-cta:hover,.button:hover { transform:translateY(-2px); box-shadow:0 13px 30px color-mix(in srgb,var(--accent-fill) 38%,transparent); }
.nav-toggle { display:none; border:1px solid var(--accent); border-radius:999px; background:color-mix(in srgb,var(--accent-fill) 12%,transparent); color:var(--accent); min-height:42px; padding:8px 15px; font:600 .85rem/1 DM Mono,monospace; cursor:pointer; }
.nav-toggle:hover { background:color-mix(in srgb,var(--accent-fill) 22%,transparent); box-shadow:0 7px 20px color-mix(in srgb,var(--accent-fill) 20%,transparent); }
.theme-toggle { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-width:82px; padding:8px 11px; color:var(--ink); background:color-mix(in srgb,var(--surface) 76%,transparent); border:1px solid var(--line); border-radius:99px; font:500 .72rem DM Mono,monospace; cursor:pointer; }
.theme-toggle:hover { border-color:var(--accent); background:var(--surface-blue); }
.theme-toggle__icon { color:var(--accent); font-size:1rem; }
.accent-picker { position:relative; min-width:156px; color:var(--ink); }
.accent-picker__button { width:100%; min-height:42px; display:flex; align-items:center; gap:10px; padding:8px 13px; color:var(--ink); background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 5px 18px rgba(7,17,45,.1); font:600 .82rem/1.3 Manrope,system-ui,sans-serif; letter-spacing:.01em; cursor:pointer; }
.accent-picker__button:hover { border-color:var(--accent); }
.accent-picker__button:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.accent-picker__button[aria-expanded="true"] { border-color:var(--accent); border-bottom-color:var(--line); border-radius:12px 12px 0 0; box-shadow:none; }
.accent-picker__dot { width:11px; height:11px; flex:0 0 auto; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 16%,transparent); }
.accent-picker__chevron { width:8px; height:8px; margin-left:auto; border-right:2px solid var(--muted); border-bottom:2px solid var(--muted); transform:translateY(-2px) rotate(45deg); transition:transform .2s; }
.accent-picker__button[aria-expanded="true"] .accent-picker__chevron { transform:translateY(2px) rotate(225deg); }
.accent-picker__menu { position:absolute; z-index:40; top:calc(100% - 1px); right:0; width:100%; padding:7px; background:var(--surface); border:1px solid var(--accent); border-top:0; border-radius:0 0 12px 12px; box-shadow:0 18px 44px rgba(0,0,0,.28); }
.accent-picker__menu[hidden] { display:none; }
.accent-picker__menu [role="option"] { width:100%; min-height:42px; display:flex; align-items:center; gap:10px; padding:9px 10px; color:var(--ink); background:transparent; border:0; border-radius:8px; font:600 .82rem/1.3 Manrope,system-ui,sans-serif; text-align:left; cursor:pointer; }
.accent-picker__menu [role="option"]:hover,.accent-picker__menu [role="option"]:focus-visible { color:var(--ink); background:var(--surface-blue); outline:2px solid var(--accent); outline-offset:-2px; }
.accent-picker__menu [role="option"][aria-selected="true"] { color:var(--on-accent); background:var(--accent-fill); }
.accent-picker__menu [role="option"][aria-selected="true"] .accent-swatch { box-shadow:0 0 0 2px var(--on-accent),0 0 0 4px color-mix(in srgb,var(--navy) 38%,transparent); }
.accent-swatch { width:10px; height:10px; flex:0 0 auto; border-radius:50%; }
.accent-swatch--blue { background:#1d5bd8; }
.accent-swatch--cyan { background:#00a9c4; }
.accent-swatch--violet { background:#8b61df; }
.accent-swatch--coral { background:#d55b5f; }
.hero { min-height:calc(100vh - 76px); display:grid; align-content:center; padding-block:70px; position:relative; isolation:isolate; overflow:hidden; }
.hero > * { position:relative; z-index:1; }
.hero::after { content:'{ }'; position:absolute; right:2%; top:14%; color:color-mix(in srgb,var(--accent-bright) 38%,transparent); font:500 clamp(6rem,16vw,13rem)/1 DM Mono,monospace; letter-spacing:-.12em; text-shadow:0 0 48px color-mix(in srgb,var(--accent-fill) 32%,transparent); opacity:.72; pointer-events:none; z-index:0; transform:rotate(-3deg); }
.eyebrow { color:var(--accent); font:500 .82rem DM Mono,monospace; text-transform:uppercase; letter-spacing:.08em; }
h1,h2,h3,p { margin-top:0; }
h1 { max-width:900px; margin-bottom:25px; font-size:clamp(3.4rem,9vw,7.6rem); line-height:.91; letter-spacing:-.07em; }
h1 em { font-style:normal; position:relative; white-space:nowrap; }
h1 em::after { content:''; position:absolute; height:.18em; left:0; right:0; bottom:.04em; background:var(--accent-bright); opacity:.52; z-index:-1; transform:rotate(-1deg); border-radius:99px; }
.lede { max-width:620px; color:var(--muted); font-size:clamp(1.05rem,2vw,1.3rem); }
.hero-actions { display:flex; flex-wrap:wrap; gap:20px; margin-top:34px; }
.text-link { font:500 .88rem DM Mono,monospace; text-underline-offset:6px; }
.icon-link,.icon-button,.nav-cta,.theme-toggle{display:inline-flex;align-items:center;gap:.55em}.icon-link i,.icon-button i,.nav-cta i,.nav-toggle i{color:currentColor}.theme-toggle__icon{width:1em;text-align:center}.field-label,.icon-meta{display:inline-flex;align-items:center;gap:.55em}.field-label i,.icon-meta i{color:var(--accent)}
.section { padding-block:100px; border-top:1px solid var(--line); scroll-margin-top:76px; }
.section-label { margin-bottom:40px; color:var(--accent); font:500 .78rem DM Mono,monospace; text-transform:uppercase; letter-spacing:.1em; }
.section-grid { grid-template-columns:minmax(150px,1fr) 3fr; gap:60px; }
.section-grid .resume-block__content { display:grid; grid-template-columns:minmax(140px,1fr) 3fr; gap:60px; }
.section h2 { font-size:clamp(2rem,5vw,4rem); line-height:1; letter-spacing:-.05em; }
.timeline { display:grid; gap:0; }
.role { display:grid; grid-template-columns:1fr 2fr; gap:40px; padding:32px 0; border-top:1px solid var(--line); }
.role:first-child { border-top:0; }
.meta { color:var(--muted); font:400 .8rem DM Mono,monospace; }
.role .meta { display:flex; flex-direction:column; gap:9px; margin:0; line-height:1.35; }
.role-date { width:max-content; padding:4px 8px; color:var(--accent); background:color-mix(in srgb,var(--accent) 10%,transparent); border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line)); border-radius:6px; font:600 .76rem/1.2 DM Mono,monospace; letter-spacing:.035em; }
.role-company { max-width:230px; color:var(--ink); font:700 1rem/1.4 Manrope,system-ui,sans-serif; letter-spacing:-.015em; }
.role h3,.project-card h3 { margin-bottom:8px; font-size:1.25rem; }
.role p { color:var(--muted); }
.project-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.project-card { min-height:280px; padding:30px; border:1px solid var(--line); border-radius:16px; background:color-mix(in srgb,var(--surface) 78%,transparent); box-shadow:0 10px 35px rgba(11,23,57,.06); backdrop-filter:blur(10px); display:flex; flex-direction:column; justify-content:space-between; transition:transform .2s,box-shadow .2s,border-color .2s; }
.project-card .icon-link { display:inline-flex; margin-top:10px; font-size:.9rem; }
.project-attribution { max-width:78ch; margin-top:24px; color:var(--muted); font-size:.88rem; }
.project-card:hover { transform:translateY(-6px); border-color:var(--accent-bright); box-shadow:0 20px 45px color-mix(in srgb,var(--accent-fill) 18%,transparent); }
.tags { display:flex; flex-wrap:wrap; gap:8px; padding:0; list-style:none; }
.tags li { padding:4px 9px; color:var(--accent); background:color-mix(in srgb,var(--accent) 9%,transparent); border:1px solid color-mix(in srgb,var(--accent) 72%,var(--line)); border-radius:99px; font:500 .72rem DM Mono,monospace; }
.skills-list { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.skills-list h3 { padding-bottom:12px; border-bottom:2px solid var(--ink); font:500 .85rem DM Mono,monospace; text-transform:uppercase; }
.skills-list p { color:var(--muted); }
.contact-panel { border:0; border-radius:22px; margin-top:60px; padding:clamp(35px,8vw,90px); background:linear-gradient(135deg,var(--navy),color-mix(in srgb,var(--accent-fill) 58%,var(--navy)) 62%,var(--accent-fill)); color:white; box-shadow:0 24px 65px color-mix(in srgb,var(--accent-fill) 22%,rgba(7,17,45,.28)); transition:background .25s,box-shadow .25s; }
.contact-panel h2 { max-width:700px; }
.contact-panel .section-label { color:var(--accent-bright); }
.contact-panel a:not(.button) { color:var(--accent-bright); text-decoration-color:color-mix(in srgb,var(--accent-bright) 72%,transparent); }
.contact-panel a:not(.button):hover { color:white; text-decoration-color:white; }
.portfolio-contact-form { margin-top:42px; padding-top:36px; border-top:1px solid color-mix(in srgb,var(--accent-bright) 48%,white); }
.professional-links { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:22px; }
.professional-links a { display:inline-flex; align-items:center; gap:8px; min-height:42px; padding:9px 14px; border:1px solid color-mix(in srgb,var(--accent-bright) 62%,white); border-radius:999px; color:white; text-decoration:none; }
.professional-links a:hover { border-color:white; background:color-mix(in srgb,var(--accent-bright) 24%,transparent); }
.professional-links a:focus-visible { outline:3px solid white; outline-offset:3px; }
.contact-form__intro { max-width:620px; color:color-mix(in srgb,var(--accent-text) 34%,var(--contact-ink)); }
.standard-page { min-height:60vh; }
.standard-page form { max-width:680px; }
.path-user .standard-page { min-height:calc(100vh - 190px);display:grid;align-items:center;padding-block:clamp(52px,8vw,96px); }
.path-user .standard-page>div { width:100%; }
.path-user .standard-page ul { display:flex;flex-wrap:wrap;gap:10px 18px;margin:0 auto 18px;padding:0;max-width:560px;list-style:none;font-size:.88rem; }
.account-card { width:min(100%,560px);margin-inline:auto;padding:clamp(26px,5vw,44px);border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line));border-radius:20px;background:color-mix(in srgb,var(--surface) 88%,transparent);box-shadow:0 24px 70px rgba(3,10,28,.22);backdrop-filter:blur(14px); }
.account-card__header { margin-bottom:30px; }
.account-card__header h1 { margin:.35rem 0 .75rem;font-size:clamp(2.35rem,7vw,4.25rem);line-height:.96; }
.account-card__header>p:last-child,.account-card__form .description { color:var(--muted); }
.account-card__form { display:grid;gap:20px; }
.account-card__form .form-item { display:grid;gap:8px;margin:0; }
.account-card__form label { color:var(--ink);font:600 .82rem DM Mono,monospace; }
.account-card__form input[type="text"],.account-card__form input[type="email"],.account-card__form input[type="password"] { width:100%;min-height:50px;padding:12px 14px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:10px;font:500 1rem Manrope,system-ui,sans-serif; }
.account-card__form input:focus { border-color:var(--accent);outline:3px solid color-mix(in srgb,var(--accent) 26%,transparent);outline-offset:2px; }
.account-card__form .form-actions { margin:4px 0 0; }
.account-card__form .button { width:100%;min-height:50px; }
.account-card__form .form-item--error-message { color:var(--danger,#ff8e9b);font-weight:650; }
.system-messages { position:relative; z-index:2; }
.contact-form__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.portfolio-contact-form .form-item { margin-bottom:20px; }
.portfolio-contact-form label { display:block; margin-bottom:7px; color:white; font:600 .82rem Manrope,system-ui,sans-serif; }
.portfolio-contact-form input[type="text"],.portfolio-contact-form input[type="email"],.portfolio-contact-form textarea { width:100%; padding:13px 14px; color:#07112d; background:#fff; border:2px solid transparent; border-radius:9px; font:500 1rem/1.45 Manrope,system-ui,sans-serif; }
.portfolio-contact-form input:focus,.portfolio-contact-form textarea:focus { border-color:var(--accent-bright); outline:3px solid #fff; outline-offset:2px; }
.portfolio-contact-form .form-type-checkbox { display:flex; align-items:center; gap:10px; max-width:720px; }
.portfolio-contact-form .form-type-checkbox input { appearance:none; width:20px; height:20px; flex:0 0 auto; margin:0; display:grid; place-content:center; background:#fff; border:2px solid #fff; border-radius:4px; box-shadow:0 0 0 1px rgba(7,17,45,.34); cursor:pointer; }
.portfolio-contact-form .form-type-checkbox input::after { content:''; width:5px; height:9px; border-right:2px solid #fff; border-bottom:2px solid #fff; opacity:0; transform:translateY(-1px) rotate(45deg); }
.portfolio-contact-form .form-type-checkbox input:checked { background:var(--accent-fill); border-color:#fff; }
.portfolio-contact-form .form-type-checkbox input:checked::after { opacity:1; }
.portfolio-contact-form .form-type-checkbox input:focus-visible { outline:3px solid #fff; outline-offset:3px; box-shadow:0 0 0 6px var(--accent-bright); }
.portfolio-contact-form .form-type-checkbox label { margin:0; font-weight:500; line-height:1.45; }
.portfolio-contact-form .form-actions { margin-top:28px; }
.portfolio-contact-form .form-submit { min-height:48px; padding-inline:24px; cursor:pointer; font:700 .9rem Manrope,system-ui,sans-serif; }
.contact-form__website { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; overflow:hidden!important; }
.site-footer { padding-block:36px; display:flex; justify-content:space-between; color:var(--muted); font:400 .76rem DM Mono,monospace; }
.footer-links { display:flex; flex-wrap:wrap; gap:18px; }
.footer-links a { display:inline-flex; align-items:center; gap:7px; color:var(--accent-link); text-decoration-thickness:1px; text-underline-offset:4px; }
.footer-links a:hover { color:var(--accent-bright); }
:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
@media (max-width:760px) {
  :root { --shell:min(100% - 28px,1120px); }
  .nav-toggle { display:inline-flex; align-items:center; gap:.55em; margin-left:auto; }
  .theme-toggle { min-width:42px; }
  .theme-toggle [data-theme-label] { display:none; }
  .accent-picker { min-width:48px; width:48px; }
  .accent-picker__button { width:48px; padding:8px 10px; }
  .accent-picker__button [data-accent-label] { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .accent-picker__chevron { width:7px; height:7px; }
  .accent-picker__menu { width:164px; }
  .primary-nav { display:none; position:absolute; top:68px; left:14px; right:14px; padding:22px; flex-direction:column; align-items:stretch; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 18px 45px rgba(11,23,57,.16); }
  .primary-nav.is-open { display:flex; }
  .section { padding-block:70px; }
  .section-grid .resume-block__content,.role { grid-template-columns:1fr; gap:14px; }
  .project-grid,.skills-list { grid-template-columns:1fr; }
  .contact-form__grid { grid-template-columns:1fr; gap:0; }
  .project-card { min-height:240px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; } }