:root{--color-primary:#000000;--color-secondary:#666666;--color-background:#ffffff;--color-surface:#f8f9fa;--color-text:#000000;--color-textSecondary:#666666;--color-border:#e0e0e0;--color-accent:#007bff;--color-headerBg:#ffffff;--color-headerText:#000000;--color-buttonBg:#000000;--color-buttonText:#ffffff;--color-buttonHover:#333333;--shadow-small:0 1px 3px rgba(0,0,0,0.12);--shadow-medium:0 4px 6px rgba(0,0,0,0.15);--shadow-large:0 10px 25px rgba(0,0,0,0.2);--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:monospace;background-color:var(--color-background);color:var(--color-text);line-height:1.6;transition:background-color .3s ease,color .3s ease;overflow-x:hidden}main,section{min-height:100vh}section{padding:clamp(16px,6vw,var(--spacing-xl)) clamp(12px,4vw,var(--spacing-lg));scroll-margin-top:var(--header-height,72px)}a{color:var(--color-accent);text-decoration:none;transition:color .2s ease}a:hover{color:var(--color-primary)}button{font-family:monospace;cursor:pointer;border:none;background:none;transition:all .2s ease}button:hover{font-weight:700;color:inherit}button:focus{font-weight:700;outline:none}input,select,textarea{font-family:monospace;font-size:14px;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:6px;background-color:var(--color-surface);color:var(--color-text);transition:border-color .2s ease,box-shadow .2s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent)20}.container{width:min(96vw,1200px);margin:0 auto;padding:0 clamp(12px,3.2vw,var(--spacing-lg))}.text-center{text-align:center}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}@media (max-width:768px){main{padding-top:64px}section{padding:var(--spacing-lg) var(--spacing-md);scroll-margin-top:64px}.container{padding:0 var(--spacing-md)}}@media (max-width:480px){main{padding-top:60px}section{padding:var(--spacing-md);scroll-margin-top:60px}.container{padding:0 var(--spacing-sm)}}.theme-dark,.theme-light{transition:all .3s ease}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-surface)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-textSecondary)}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.header,.logo,button{-webkit-user-select:none;-moz-user-select:none;user-select:none}.main-header .desktop-only{visibility:visible!important;opacity:1!important}.main-header .mobile-only{visibility:hidden!important;opacity:0!important}.main-header{justify-content:space-between;width:100%;min-height:56px;box-sizing:border-box}.main-header,.main-header .desktop-nav{display:flex;flex-direction:row;align-items:center}.main-header .desktop-nav{gap:var(--spacing-md)}.main-header .dropdown-container{position:relative;display:flex;align-items:center}.main-header .logo{display:flex;flex-direction:column;line-height:1}@media (max-width:768px){.main-header{min-height:48px;padding-left:var(--spacing-md);padding-right:var(--spacing-md)}.main-header .desktop-nav{display:none!important}}@media (min-width:769px){.main-header .desktop-nav{display:flex!important}}@media (max-width:768px){.main-header .desktop-only{visibility:hidden!important;opacity:0!important;pointer-events:none!important}.main-header .mobile-only{visibility:visible!important;opacity:1!important;pointer-events:auto!important}}@media (min-width:769px){.main-header .desktop-only{visibility:visible!important;opacity:1!important;pointer-events:auto!important}.main-header .mobile-only{visibility:hidden!important;opacity:0!important;pointer-events:none!important}}