:root{--panel:#fff;--panel-hover:#eaffdf;--focus:#327f2c;--hover:#3a772a;--dialog-surface:#f4f5f2}
:root[data-theme=dark]{color-scheme:dark;--background:#171b18;--ink:#eff2e9;--muted:#b2bcaf;--accent:#a0fb82;--line:#3b473c;--surface:rgba(31,38,32,.92);--panel:#242d25;--panel-hover:#354831;--focus:#a0fb82;--hover:#b6ff9a;--dialog-surface:#111612}
body{background:var(--background);color:var(--ink)}
.header-tools{display:flex;align-items:center;gap:8px;flex-shrink:0}
.theme-toggle{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);flex-shrink:0}
.theme-toggle:hover{background:var(--panel-hover)}
.theme-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .sun{display:none}[data-theme=dark] .theme-toggle .moon{display:none}[data-theme=dark] .theme-toggle .sun{display:block}
button:focus-visible,a:focus-visible{outline-color:var(--focus)}
nav>a:not(.brand):hover,.contact-email:hover,.contact-phone:hover{color:var(--hover)}
.about-picture:after{background:linear-gradient(transparent,var(--background) 88%)}
.pill{background:var(--panel);border-color:var(--line)}.pill:hover{background:var(--panel-hover)}
dialog{background:var(--panel);color:var(--ink)}.dialog-bar{background:var(--surface)}.project-image-wrap{background:var(--dialog-surface)}.close:hover{background:var(--panel-hover)}
.motion-toggle{background:var(--surface);color:var(--muted);border-color:var(--line)}.motion-toggle:hover{background:var(--panel-hover)}
.character-hint{color:var(--muted)}.skip:focus{background:var(--panel);color:var(--ink)}
[data-theme=dark] .hero-title{filter:url(#dark-title)}
[data-theme=dark] .glow-green{background:radial-gradient(circle at 55% 55%,#84eb5f77 0,#69bb4c33 45%,transparent 72%)}
[data-theme=dark] .glow-peach{background:radial-gradient(circle,#d5916947,#bb677329 48%,transparent 74%)}
[data-theme=dark] .meditate-glow{background:radial-gradient(ellipse,#93d64d20,transparent 65%)}
[data-theme=dark] .marquee{color:#95db7a}
[data-theme=dark] .timeline{border-color:#536a4b}[data-theme=dark] .timeline time{color:#a4b19f}
[data-theme=dark] .project-card{background:#273029;box-shadow:0 2px 12px #0003}
[data-theme=dark] .project-card:hover{box-shadow:0 15px 24px #0005}
[data-theme=dark] .character-reaction{background:#263323f5;border-color:#4f6646;color:#e3f5db}
[data-theme=dark] dialog::backdrop{background:#050a08c9}
@media(max-width:760px){.header-tools{gap:3px}.theme-toggle{width:34px;height:38px;border-radius:12px}.site-header{gap:5px}.language{min-width:27px}.theme-toggle svg{width:17px;height:17px}nav .brand{padding-inline:4px}nav>a{padding-inline:3px}}
@media(max-width:380px){.header-tools{gap:1px}.theme-toggle{width:30px}.brand strong{font-size:18px}nav>a{font-size:10px}}


.work-intro{max-width:660px;margin-bottom:36px}.work-intro h2{margin-bottom:14px}.work-intro p{color:var(--muted)}

/* Native disclosures keep every company/date visible, with keyboard support. */
.experience-timeline{padding-left:26px}
.experience-timeline>li{margin-bottom:16px}
.experience-timeline>li:before{top:26px;left:-30px}
.experience-timeline>li:first-child:before{top:25px;left:-32px}
.experience-timeline details{border:1px solid var(--line);border-radius:16px;background:var(--panel);overflow:hidden}
.experience-timeline summary{position:relative;display:block;list-style:none;padding:20px 48px 20px 20px;cursor:pointer}
.experience-timeline summary::-webkit-details-marker{display:none}
.experience-timeline summary:hover{background:var(--panel-hover)}
.experience-timeline summary:focus-visible{outline:2px solid var(--focus);outline-offset:-4px;border-radius:14px}
.experience-timeline summary h3{margin:7px 0 0}
.experience-timeline summary .company{margin:0 0 8px;font-weight:600}
.experience-meta{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.experience-company{display:block;font:600 17px/1.5 Arial,sans-serif;letter-spacing:.025em}
.current-badge{font:11px/1.4 Arial,sans-serif;background:var(--accent);color:#203319;padding:4px 9px;border-radius:20px}
.experience-timeline .current-role details{border-color:#8abd76;box-shadow:0 5px 24px #82b76d0d}
.experience-disclosure{position:absolute;right:20px;top:22px;font:22px/1 Arial,sans-serif;color:var(--muted);transition:transform .2s}
.experience-timeline details[open] .experience-disclosure{transform:rotate(45deg)}
.experience-description{padding:0 20px 22px}
.experience-description>p{padding-top:16px;border-top:1px solid var(--line)}
.experience-timeline details[open] summary{padding-bottom:15px}
@media(max-width:760px){.experience-timeline{padding-left:20px}.experience-timeline>li:before{left:-24px}.experience-timeline>li:first-child:before{left:-26px}.experience-timeline summary{padding-left:16px}.experience-description{padding-left:16px;padding-right:16px}.experience-company{font-size:16px}}
/* Shared reference gradient, repeated per identical marquee half. */
.marquee .marquee-group{background:linear-gradient(90deg,#00ff43 0%,#eafdbd 100%);background-clip:text;-webkit-background-clip:text;color:transparent}
.experience-timeline{border-left:0;padding-left:38px}
.experience-timeline>li{isolation:isolate}
.experience-timeline>li:after{content:"";position:absolute;left:-27px;top:30px;width:1px;height:calc(100% + 16px);background:var(--line);z-index:-1}
.experience-timeline>li:last-child:after{display:none}
.experience-timeline>li:before{width:8px;height:8px;left:-30.5px;top:26px;z-index:1;background:#adbea7}
.experience-timeline>li:first-child:before{width:26px;height:26px;left:-39.5px;top:17px;border:2px solid #00ed83;background:radial-gradient(circle,#00ed83 0 5.5px,var(--background) 6px);animation:current-role-pulse 2.8s ease-in-out infinite}
.experience-timeline summary,.experience-timeline details[open] summary{padding-bottom:20px;transition:background-color .22s ease}
.experience-timeline details{overflow:hidden;transition:border-color .22s ease,box-shadow .22s ease}
.experience-timeline summary:hover{background:color-mix(in srgb,var(--panel-hover) 45%,var(--panel))}
.experience-timeline details[data-expanded=false] .experience-disclosure{transform:rotate(0)}
.experience-timeline details[data-expanded=true] .experience-disclosure{transform:rotate(45deg)}
@keyframes current-role-pulse{0%,100%{box-shadow:0 0 0 0 #00ed8300;opacity:1}50%{box-shadow:0 0 0 7px #00ed831c;opacity:.78}}
.motion-paused .experience-timeline>li:first-child:before{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.experience-timeline>li:first-child:before{animation:none}.experience-timeline summary,.experience-timeline details{transition:none}}
@media(prefers-reduced-motion:no-preference){body,.site-header nav,.pill,.motion-toggle,.theme-toggle,.dialog-bar{transition:background-color .24s ease,color .24s ease,border-color .24s ease}.theme-toggle:active,.pill:active{transform:translateY(1px)}dialog[open]{animation:dialog-arrive .22s cubic-bezier(.22,1,.36,1)}@keyframes dialog-arrive{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}}
