/* Brand primitives → theme semantics → component roles. Existing layout lives in style.css. */
:root{
 --teal-600:#0B6D72;--teal-700:#09575B;--teal-800:#073F43;--teal-50:#E6F2F2;
 --teal-dark-default:#69C9CD;--teal-dark-hover:#83D7D9;--teal-dark-pressed:#4DB9BF;--mint-contrast:#A6FAF4;
 --surface-page:#FFFFFF;--surface-subtle:#F6F8F8;--surface-muted:#EDF2F2;--text-primary:#1F2526;--text-secondary:#505E60;--border-subtle:#DCE3E3;--border-control:#7B9091;
 --action-primary:var(--teal-600);--action-hover:var(--teal-700);--action-pressed:var(--teal-800);--action-foreground:#FFFFFF;--action-subtle:var(--teal-50);--action-selected:#CFE6E6;--action-secondary:var(--teal-600);--focus-visible:var(--teal-600);
 --button-fill:var(--action-primary);--button-foreground:var(--action-foreground);--link-color:var(--action-secondary);--nav-selected:var(--action-subtle);--control-selected:var(--action-primary);--focus-color:var(--focus-visible);--card-image-surface:var(--surface-muted);
 --disabled-surface:#E7ECEC;--disabled-text:#586869;--dialog-backdrop:rgb(15 30 32 / .45);--overlay-surface:#FFFFFF;--motion-interactive:180ms;--motion-press:90ms;--motion-page:250ms;--motion-card:300ms;
 color-scheme:light;
}
:root[data-theme='dark']{
 --surface-page:#11191B;--surface-subtle:#192326;--surface-muted:#243236;--text-primary:#F4F9F9;--text-secondary:#B8C7C7;--border-subtle:#364547;--border-control:#7E9498;
 --action-primary:var(--teal-dark-default);--action-hover:var(--teal-dark-hover);--action-pressed:var(--teal-dark-pressed);--action-foreground:#11191B;--action-subtle:#173538;--action-selected:#23474A;--action-secondary:var(--teal-dark-default);--focus-visible:var(--teal-dark-default);
 --disabled-surface:#293639;--disabled-text:#A3B1B4;--dialog-backdrop:rgb(0 0 0 / .7);--overlay-surface:#192326;
 color-scheme:dark;
}

span[data-copy]{display:contents}html:not([data-language='tr']) [data-copy='tr'],html[data-language='tr'] [data-copy='en']{display:none!important}
/* Only the copy changes; both language variants occupy the same original text role. */
[lang='tr']{font-family:Inter,sans-serif}.wordmark{color:var(--text-primary)}.wordmark>span{color:var(--text-secondary)}
.button-primary{background:var(--button-fill);color:var(--button-foreground);border-color:var(--button-fill)}.button-primary:hover{background:var(--action-hover);border-color:var(--action-hover)}.button-primary:active{background:var(--action-pressed);border-color:var(--action-pressed);transform:scale(.985);transition-duration:var(--motion-press)}
.button-secondary{color:var(--action-secondary);border-color:var(--border-control);background:var(--surface-page)}.button-secondary:hover{color:var(--action-hover);border-color:var(--action-hover);background:var(--action-subtle)}.button-secondary:active{color:var(--action-pressed);background:var(--action-selected);transform:none;transition-duration:var(--motion-press)}
.button,.text-link,.project-action,.site-footer a,.next-project strong,.image-arrow,.icon-button,.guide-trigger{transition:color var(--motion-interactive) ease-out,background-color var(--motion-interactive) ease-out,border-color var(--motion-interactive) ease-out,transform var(--motion-interactive) ease-out}
.text-link,.project-action,.site-footer a,.next-project strong,.image-arrow,.guide-trigger{color:var(--link-color)}.text-link:hover,.project-link:hover .project-action,.site-footer a:hover,.next-project:hover strong,.guide-trigger:hover{color:var(--action-hover)}.text-link:active,.site-footer a:active,.next-project:active strong,.guide-trigger:active{color:var(--action-pressed)}
.navigation>a:hover{background:var(--action-subtle)}.navigation>a[aria-current]{color:var(--action-secondary);background:var(--nav-selected);border-left-color:var(--action-primary);font-weight:600}.navigation>a:active{background:var(--action-selected)}.nav-resume>[data-arrow]{color:var(--action-secondary)}
.icon-button{color:var(--action-secondary);min-width:44px;min-height:44px}.icon-button:hover{background:var(--action-subtle);color:var(--action-hover)}.icon-button:active{background:var(--action-selected);color:var(--action-pressed);transform:scale(.985);transition-duration:var(--motion-press)}
.button:disabled,.icon-button:disabled,button[aria-disabled='true']{background:var(--disabled-surface);border-color:var(--border-control);color:var(--disabled-text);cursor:not-allowed;transform:none}.button:disabled [data-arrow],.icon-button:disabled [data-arrow]{transform:none!important}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--focus-visible);outline-offset:4px}.content-highlight{outline-color:var(--focus-visible)!important}.show-codes [data-content-id]{outline-color:var(--focus-visible)}.code-switch input{accent-color:var(--action-primary)}
[data-arrow]{display:inline-block;--arrow-x:1;--arrow-y:-1;transition:transform var(--motion-interactive) ease-out}[data-arrow='left']{--arrow-x:-1;--arrow-y:0}[data-arrow='down']{--arrow-x:0;--arrow-y:1}[data-arrow='up']{--arrow-x:0;--arrow-y:-1}
.button-primary:hover [data-arrow]{transform:translate(calc(var(--arrow-x) * 3px),calc(var(--arrow-y) * 3px))}.button-secondary:hover [data-arrow],.text-link:hover [data-arrow],.next-project:hover [data-arrow],.site-footer a:hover [data-arrow]{transform:translate(calc(var(--arrow-x) * 2px),calc(var(--arrow-y) * 2px))}
.project-link .media-image{transition:transform var(--motion-card) ease-out}.project-link:hover .media-image{transform:scale(1.012)}.project-link:active .project-visual{outline:2px solid var(--action-primary);outline-offset:-2px}.project-link:active .image-arrow{background:var(--action-subtle);color:var(--action-pressed)}.image-index,.image-arrow{background:var(--overlay-surface)}.image-index{color:var(--text-primary)}.image-arrow{border:1px solid var(--border-subtle)}.portrait .media-frame{background:var(--surface-muted)}
.guide-dialog::backdrop{background:var(--dialog-backdrop)}.guide-header,.guide-dialog,.guide-body{background:var(--surface-page)}.content-entry:hover strong{color:var(--action-secondary)}.toast{background:var(--text-primary);color:var(--surface-page)}.search-field input{border-color:var(--border-control)}
/* Compact utilities use native keyboard interactions and separate language/theme state. */
.utility-panel{border-top:1px solid var(--border-subtle);padding-top:1rem;margin-bottom:1rem;display:grid;gap:.875rem}.language-control{border:0;margin:0;padding:0;min-width:0}.language-control legend,.theme-field label{font-size:.8125rem;line-height:1.5;color:var(--text-secondary);margin-bottom:.375rem}.language-segments{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--border-control);border-radius:var(--radius-small);overflow:visible;min-width:0}.language-segment{position:relative;min-height:44px;display:grid;place-items:center;font-size:.8125rem;line-height:1.4;cursor:pointer;color:var(--action-secondary)}.language-segment+label{border-left:1px solid var(--border-control)}.language-segment:has(input:checked){background:var(--action-subtle);font-weight:600;box-shadow:inset 0 -3px var(--control-selected)}.language-segment:hover{background:var(--action-subtle);color:var(--action-hover)}.language-segment:active{background:var(--action-selected);color:var(--action-pressed)}.language-segment:has(input:focus-visible){outline:3px solid var(--focus-visible);outline-offset:4px;z-index:1}.language-segment input:focus-visible{outline:0}.theme-field label{display:block}.theme-field select{font:inherit;font-size:.8125rem;line-height:1.5;min-height:44px;padding:.625rem 2rem .625rem .625rem;border:1px solid var(--border-control);border-radius:var(--radius-small);color:var(--text-primary);background:var(--surface-page);width:100%;max-width:100%;cursor:pointer}.theme-field select:hover{border-color:var(--action-secondary)}.theme-field select:active{border-color:var(--action-pressed)}.utilities-mobile{display:none}.sidebar-bottom{padding-top:1.5rem}.sidebar-bottom .guide-trigger{margin-top:.5rem}.sidebar-bottom>p{font-size:.8125rem}
@media(max-width:900px){.utilities-desktop{display:none}.utilities-mobile{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:1rem;border-top:0;border-bottom:1px solid var(--border-subtle);padding:0 0 1rem;margin:0 0 .5rem}.utility-panel .theme-field{min-width:0}.navigation{box-shadow:0 12px 20px rgb(0 0 0 / .06)}.language-segment{min-height:44px}.theme-field select{font-size:.8125rem}.menu-toggle{color:var(--action-secondary)}}
@media(max-width:400px){.utilities-mobile{grid-template-columns:minmax(0,1fr)}.language-segments{max-width:100%}.utility-panel{gap:.75rem}.theme-field select{font-size:.875rem}}
/* Entry motion affects page content only; shared navigation stays fixed. */
@keyframes portfolio-enter{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}.page-enter{animation:portfolio-enter var(--motion-page) ease-out both}.section-enter{animation:portfolio-enter var(--motion-page) ease-out both}
html.theme-changing body,html.theme-changing .sidebar,html.theme-changing .navigation,html.theme-changing .section,html.theme-changing .button,html.theme-changing .status-tag,html.theme-changing .guide-dialog,html.theme-changing .theme-field select,html.theme-changing .language-segment{transition:background-color 180ms ease-out,color 180ms ease-out,border-color 180ms ease-out}
@media(hover:none){.project-link:hover .media-image{transform:none}.button:hover [data-arrow],.text-link:hover [data-arrow],.next-project:hover [data-arrow],.site-footer a:hover [data-arrow]{transform:none}}
@media(prefers-reduced-motion:reduce){.page-enter,.section-enter{animation:none!important}.project-link:hover .media-image,[data-arrow],.button:active,.icon-button:active{transform:none!important}html{scroll-behavior:auto!important}html.theme-changing *{transition:none!important}}
@media(forced-colors:active){.button,.status-tag,.language-segments,.theme-field select{border:1px solid ButtonText}.language-segment:has(input:checked),.navigation>a[aria-current]{outline:2px solid Highlight;outline-offset:-2px}.project-link:focus-visible{outline:3px solid Highlight}}
@media print{html[data-theme] body{background:#fff;color:#000}.utility-panel{display:none!important}[data-copy]{color:inherit}.resume-notice,.status-tag,.resume-header .text-secondary,.resume-section .text-secondary,.experience-summary,.experience-period,.experience-company,.contact-details dd,.section-note{color:#333!important;background:#fff!important}.resume-section,.contact-details>div{border-color:#888!important}.page-enter{animation:none!important}}


html.theme-instant *,html.theme-instant *:before,html.theme-instant *:after{transition:none!important}
/* Locale text must inherit the original menu-label scale; only the symbol has icon sizing. */
.menu-toggle>span[data-copy]{font-size:inherit}
.button-primary:not(:active),.icon-button:not(:active){transition:color 180ms ease-out,background-color 180ms ease-out,border-color 180ms ease-out,transform 0ms}

/* Compact paired utilities; retain generous touch targets on small screens. */
.utility-panel{padding-top:.75rem;margin-bottom:.75rem;gap:.625rem;max-width:10rem}
.language-control legend{font-size:.75rem;margin-bottom:.25rem}
.language-segment{min-height:32px;font-size:.75rem;padding:.25rem .625rem}
.language-segment:has(input:checked){box-shadow:inset 0 -2px var(--control-selected)}
.hero-actions{align-items:flex-end}
@media(max-width:900px){.utilities-mobile{max-width:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.75rem}.language-segment{min-height:44px}}
@media(max-width:600px){.hero-actions{align-items:center}.contact-details .text-link{overflow-wrap:anywhere;min-width:0}}
@media(max-width:400px){.utilities-mobile{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

.contact-details .text-link{overflow-wrap:anywhere;min-width:0;max-width:100%}.contact-details .text-link>[data-content-id]{min-width:0}.contact-details [data-arrow]{flex-shrink:0}

/* Minimal top utilities, directly above the wordmark on every screen size. */
.compact-utilities{display:flex;align-items:center;align-self:flex-start;gap:.25rem;margin:0 0 .5rem;font-size:.75rem;line-height:1.5;font-weight:400;color:var(--text-secondary)}
.utility-text{font:inherit;font-weight:400;color:var(--text-secondary);background:none;border:0;padding:.25rem 0;min-height:26px;min-width:24px;text-align:left;cursor:pointer}
.utility-text:hover{color:var(--action-hover);text-decoration:underline;text-underline-offset:3px}.utility-text:active{color:var(--action-pressed)}
.utility-divider{margin-inline:.125rem;color:var(--border-control)}
@media(max-width:900px){.sidebar{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 44px;height:auto;min-height:0;row-gap:0;padding-block:.5rem}.compact-utilities{grid-column:1;grid-row:1;margin:0;justify-self:start}.wordmark{grid-column:1;grid-row:2}.menu-toggle{grid-column:2;grid-row:2}.navigation{top:100%;max-height:calc(100dvh - 90px)}html{scroll-padding-top:7.5rem}}

/* Requested refinements: a larger wordmark and a two-line portrait credit. */
.wordmark{font-size:3.125rem}
.portrait-name{display:block;font-size:1.25em;font-weight:700;color:var(--text-primary)}
.portrait-role{display:block;margin-top:.25rem;font-size:1em;font-weight:400}
.site-footer a.button-secondary{text-decoration:none;gap:var(--space-3);border-color:var(--border-control);color:var(--action-secondary)}
.site-footer a.button-secondary:hover{border-color:var(--action-hover);color:var(--action-hover)}
@media(max-width:900px){.wordmark{font-size:2.5rem}}
@media(max-width:600px){.wordmark{font-size:2.1875rem}}
@media(max-width:400px){.wordmark{font-size:1.875rem}}

/* Keep the sidebar focused, with preferences anchored at the bottom. */
.sidebar>.compact-utilities{margin-top:auto;margin-bottom:0;padding-top:1rem}
.text-link{position:relative;text-decoration:none}
.text-link::after{content:"";position:absolute;left:0;right:0;bottom:.35em;border-bottom:1px solid currentColor;pointer-events:none}
@media(max-width:900px){.sidebar{grid-template-rows:44px}.wordmark,.menu-toggle{grid-row:1}.sidebar>.compact-utilities{display:none}.navigation>.compact-utilities{display:flex;margin:1rem 0 0;justify-self:start;grid-column:auto;grid-row:auto}.navigation{max-height:calc(100dvh - 60px)}html{scroll-padding-top:6.5rem}}