:root{--font-family: "Inter", system-ui, -apple-system, sans-serif;--font-size-base: 20px;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem;--font-size-2xl: 2rem;--line-height-base: 1.7;--letter-spacing: .01em;--color-bg-light: #ffffff;--color-text-light: #1a1a1a;--color-primary-light: #1e40af;--color-secondary-light: #4b5563;--color-surface-light: #f8f9fa;--color-border-light: #6b7280;--color-error-light: #b91c1c;--color-success-light: #15803d;--color-bg-dark: #0f172a;--color-text-dark: #f1f5f9;--color-primary-dark: #93c5fd;--color-secondary-dark: #cbd5e1;--color-surface-dark: #1e293b;--color-border-dark: #64748b;--color-error-dark: #fca5a5;--color-success-dark: #86efac;--focus-ring-color: #2563eb;--focus-ring-offset: 2px;--focus-ring-width: 3px;--transition-speed: .3s}:root,:root.light{--bg-color: var(--color-bg-light);--text-color: var(--color-text-light);--primary-color: var(--color-primary-light);--secondary-color: var(--color-secondary-light);--surface-color: var(--color-surface-light);--border-color: var(--color-border-light)}:root.dark{--bg-color: var(--color-bg-dark);--text-color: var(--color-text-dark);--primary-color: var(--color-primary-dark);--secondary-color: var(--color-secondary-dark);--surface-color: var(--color-surface-dark);--border-color: var(--color-border-dark)}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-base);letter-spacing:var(--letter-spacing);background-color:var(--bg-color);color:var(--text-color);transition:background-color var(--transition-speed),color var(--transition-speed);margin:0;padding:0;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1{font-size:var(--font-size-2xl);font-weight:700;margin-bottom:1rem}h2{font-size:var(--font-size-xl);font-weight:600;margin-bottom:.75rem}h3{font-size:var(--font-size-lg);font-weight:600;margin-bottom:.5rem}button{font-family:inherit;font-size:1.1rem;font-weight:500;padding:1rem 1.75rem;border-radius:.75rem;border:none;cursor:pointer;transition:all .2s;min-height:48px}button:hover{opacity:.9;transform:translateY(-1px)}button:focus{outline:3px solid var(--primary-color);outline-offset:2px}.primary-btn{background-color:var(--primary-color);color:#fff}.secondary-btn{background-color:var(--surface-color);color:var(--text-color);border:2px solid var(--border-color)}input,textarea,select{font-family:inherit;font-size:1.1rem;padding:1rem;border-radius:.75rem;border:2px solid var(--border-color);background-color:var(--bg-color);color:var(--text-color);width:100%;box-sizing:border-box;margin-bottom:1.25rem;min-height:48px}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #1d4ed833}label{font-size:1.05rem;font-weight:500;margin-bottom:.5rem;display:block}.container{max-width:900px;margin:0 auto;padding:2rem}.card{background-color:var(--surface-color);padding:2.5rem;border-radius:1rem;box-shadow:0 4px 6px -1px #0000001a}.skip-link{position:absolute;top:-40px;left:0;background:var(--primary-color);color:#fff;padding:8px;z-index:100}.skip-link:focus{top:0}@media screen and (max-width: 768px){:root{--font-size-base: 18px}body{font-size:var(--font-size-base)}.container{padding:1rem;max-width:100%}.card{padding:1.5rem;border-radius:.75rem}button{font-size:1rem;padding:.875rem 1.25rem;width:100%}h1{font-size:1.75rem}h2{font-size:1.35rem}h3{font-size:1.15rem}}@media screen and (max-height: 500px) and (orientation: landscape){.container{padding:.75rem;max-width:100%}.card{padding:1rem}h1{font-size:1.5rem;margin-bottom:.5rem}h2{font-size:1.25rem;margin-bottom:.35rem}h3{font-size:1.1rem;margin-bottom:.25rem}button{padding:.625rem 1rem;min-height:40px}input,textarea,select{padding:.625rem;margin-bottom:.75rem;min-height:40px}}@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape){.container{max-width:95%;padding:1.5rem}}@media screen and (min-width: 1024px){.container{max-width:1000px}}@media screen and (min-width: 1400px){.container{max-width:1200px}:root{--font-size-base: 22px}}@media screen and (orientation: landscape){.full-height-landscape{height:100vh;overflow-y:auto}}@media (hover: none) and (pointer: coarse){button,input,textarea,select{min-height:52px}}
