:root{--font-size:16px;--spacing:15px;--max-width:860px;--bg-color:#ffffff;--text-color:#000000;--link-color:#0088cc;--header-bg:#f0f2f5;--card-bg:#ffffff;--footer-bg:#e9ecef}
body.dark{--bg-color:#1e1e2f;--text-color:#ffffff;--link-color:#5eaee3;--header-bg:#2a2a40;--card-bg:#2a2a40;--footer-bg:#2a2a40}
html,body{margin:0;padding:0;font-family:'Segoe UI',sans-serif;background-color:var(--bg-color);color:var(--text-color);font-size:var(--font-size);line-height:1.6;min-height:100%;scroll-behavior:smooth;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}
a{color:var(--link-color);text-decoration:none}
a:hover{text-decoration:underline}.page{display:flex;flex-direction:column;min-height:100vh}.container{width:100%;max-width:var(--max-width);margin:0 auto;padding:var(--spacing)}.site-header{background-color:var(--header-bg);text-align:center;padding:var(--spacing)0}.site-header h1{font-size:1.8rem;margin:0}.site-header.subtitle{font-size:1.1rem;margin:8px 0 0}.cta-box{margin:32px 0;padding:12px 0;text-align:center}.btn{background-color:var(--link-color);color:white;padding:10px 20px;font-size:1rem;font-weight:bold;border:none;border-radius:6px;cursor:pointer;transition:all 0.3s ease;text-decoration:none}.btn:hover{transform:scale(1.04);box-shadow:0 3px 8px rgba(0,136,204,0.3);filter:brightness(1.1);text-decoration:none}.content{flex:1}.content section{background:var(--card-bg);padding:var(--spacing);border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,0.04)}
ul{padding-left:1.4em;margin-bottom:var(--spacing)}
ul li{margin-bottom:6px}.site-footer{background-color:var(--footer-bg);text-align:center;padding:10px 0;font-size:0.9rem;color:#777}.fade-in{opacity:0;transform:translateY(20px);transition:0.6s ease-out}.fade-in.visible{opacity:1;transform:translateY(0)}.with-shadow{box-shadow:0 2px 10px rgba(0,0,0,0.1);transition:box-shadow 0.3s ease}
body.dark.with-shadow{box-shadow:0 2px 10px rgba(0,0,0,0.4)}
@media(max-width:600px){.site-header h1{font-size:1.4rem}.site-header.subtitle{font-size:1rem}.btn{padding:8px 16px;font-size:0.95rem}}