.overlay{position:fixed;inset:0;width:100vw;height:100vh;background-color:rgba(0,0,0,.5);z-index:1000;display:flex;justify-content:center;align-items:center;backdrop-filter:blur(10px);transition:opacity .2s ease-out}.modal{background:var(--background-color,#fff);color:var(--text-color,#222);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.2);padding:20px;z-index:1001;overflow-y:auto;max-height:85vh;width:100%;max-width:40rem;transition:transform .25s ease-out,opacity .25s ease-out}.modal-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:1rem;border-bottom:1px solid var(--border-color,#e5e5e5)}.about-content{display:flex;flex-direction:column;gap:1.5rem}.about-section{padding:1rem;background:var(--background-light,#f9f9f9);border-radius:8px;transition:background .3s ease-in-out}.closeButton{background:none;border:none;cursor:pointer;color:var(--text-color,#333);transition:color .2s}.closeButton:hover{color:var(--primary-color,#f55)}@media(min-width:1440px){.modal{max-width:50rem}}html.dark .modal{background:var(--background-dark,#1a1a1a);color:var(--text-light,#f1f1f1)}html.dark .modal-header{border-bottom:1px solid var(--border-dark,#333)}html.dark .about-section{background:var(--background-darker,#222)}html.dark .closeButton{color:var(--text-light,#f1f1f1)}