/* Palette comparison belongs to this design study, not the final portfolio. */
:root{--pink:#eeeee7;--wine:#20327e;--violet:#2851ca;--paper:#fafbf6;--yellow:#eee298;--line:#a3afc4;--highlight-ink:#20327e;--on-accent:#ffffff;--footer-bg:#20327e;--footer-ink:#f3f4e8;--footer-line:#7383b0;--palette-shadow:#17202c33}
.masthead>.mono{visibility:hidden}
.nav-capsule button{color:var(--on-accent)}
.bubble,.badge-note{color:var(--highlight-ink)}
.practice-badge:hover,.practice-badge[aria-expanded=true]{color:var(--highlight-ink)}
.contact-section{background:var(--footer-bg);color:var(--footer-ink);border-color:var(--footer-bg)}
.contact-foot{border-color:var(--footer-line)}
.contact-section a:focus-visible{outline-color:var(--footer-ink)}
.intro-plane{box-shadow:0 20px 30px -20px var(--palette-shadow)}
.gallery-plane{box-shadow:0 30px 35px -26px var(--palette-shadow)}
.nav-capsule{box-shadow:0 7px 20px var(--palette-shadow)}
.nav-panel{box-shadow:0 15px 40px var(--palette-shadow)}
dialog::backdrop{background:#080d17a8}
.palette-lab{position:fixed;top:43px;left:50%;transform:translateX(-50%);z-index:60;color:var(--wine);font-family:Manrope,sans-serif}
.palette-lab summary{display:flex;align-items:center;gap:12px;list-style:none;cursor:pointer;background:var(--paper);border:1px solid var(--line);border-radius:28px;padding:12px 16px;min-height:44px;min-width:250px;box-shadow:0 5px 18px var(--palette-shadow);font-size:11px;font-weight:700}
.palette-lab summary::-webkit-details-marker{display:none}
.palette-lab summary:focus-visible{outline:3px solid var(--violet);outline-offset:5px}
#palette-current{margin-right:auto}
.palette-mobile-label{display:none}
.palette-chevron{font-size:16px;font-weight:500;transition:transform 200ms var(--ease)}
.palette-lab[open] .palette-chevron{transform:rotate(180deg)}
.palette-lab[open]{z-index:62}
.palette-dots{display:flex;gap:3px;flex-shrink:0}
.palette-dots i{display:block;width:10px;height:10px;border:1px solid var(--line);border-radius:50%}
.palette-panel{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);width:300px;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 15px 40px var(--palette-shadow)}
.palette-panel>label{display:block;font:400 10px/1.5 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.palette-panel select{display:block;width:100%;min-height:44px;padding:9px 10px;font:600 13px Manrope,sans-serif;background:var(--pink);color:var(--wine);border:1px solid var(--line);border-radius:5px}
.palette-panel select:focus-visible{outline:3px solid var(--violet);outline-offset:3px}
.palette-panel{max-height:calc(100svh - 120px);overflow:auto}
.palette-mode{display:flex;gap:6px;min-width:0;border:0;padding:0;margin:14px 0 0}
.palette-mode legend{padding:0;margin-bottom:8px;font:400 10px/1.5 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.04em}
.palette-mode button{flex:1;min-height:40px;border:1px solid var(--line);border-radius:5px;background:transparent;font:600 11px Manrope,sans-serif}
.palette-mode button[aria-pressed=true]{background:var(--wine);color:var(--paper);border-color:var(--wine)}
.palette-mode button:hover{border-color:var(--wine)}
.palette-mode button:focus-visible{outline:3px solid var(--violet);outline-offset:3px}
#palette-description{font-size:11px;line-height:1.6;margin-top:14px;min-height:53px}
.palette-chips{display:flex;gap:10px;margin:16px 0 20px}
.palette-chips>span{flex:1;min-width:0}
.palette-chips i{display:block;height:27px;border:1px solid var(--line);border-radius:3px}
.palette-chips small{display:block;font:400 9px/1.4 'IBM Plex Mono',monospace;margin-top:5px}
.palette-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--line);padding-top:12px}
.palette-actions button{border:0;background:transparent;min-height:36px;padding:4px 0;font-size:11px;font-weight:600}
.palette-actions button:hover{color:var(--violet)}
#palette-count{font:400 10px/1.5 'IBM Plex Mono',monospace}
@media(max-width:700px){.palette-lab{top:auto;left:auto;right:28px;bottom:26px;transform:none}.palette-lab summary{min-width:0;width:70px;min-height:50px;padding:10px 12px;justify-content:center;gap:0;border-color:var(--wine)}.palette-mobile-label{display:inline}#palette-current,.palette-dots,.palette-chevron{display:none}.palette-panel{left:auto;right:0;top:auto;bottom:calc(100% + 10px);transform:none;width:min(280px,calc(100vw - 55px))}.palette-panel select{font-size:16px}.palette-actions button{min-height:44px}}
@media(prefers-reduced-motion:reduce){.palette-chevron{transition:none}}
@media(max-width:700px){.palette-panel{max-height:calc(100svh - 105px)}.palette-mode button{min-height:44px}}
