:root{--bg-primary: #0a0a0f;--bg-secondary: #111118;--bg-card: #16161f;--bg-card-hover: #1e1e2a;--accent: #e8e8f0;--accent-dim: #9494a8;--accent-subtle: rgba(232, 232, 240, .07);--text-primary: #f0f0f5;--text-secondary:#9494a8;--text-muted: #5a5a6e;--border: rgba(232, 232, 240, .08);--border-hover: rgba(232, 232, 240, .18);--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--transition: .25s ease;--font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{background-color:var(--bg-primary);color:var(--text-primary);font-family:Inter,Segoe UI,system-ui,sans-serif;line-height:1.6;min-height:100vh;overflow-x:hidden}a{color:var(--accent);text-decoration:none;transition:color var(--transition)}a:hover{color:#fff}img{display:block;max-width:100%}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 48;font-size:1em;line-height:1;vertical-align:middle;display:inline-block;all:unset;font-family:Material Symbols Outlined}h1,h2,h3,h4{font-weight:700;line-height:1.2;color:var(--text-primary)}h1{font-size:clamp(2rem,5vw,3.5rem)}h2{font-size:clamp(1.5rem,3vw,2.25rem)}h3{font-size:1.25rem}p{color:var(--text-secondary)}code,.mono{font-family:var(--font-mono)}.container{width:100%;max-width:1100px;margin-inline:auto;padding-inline:1.5rem}.section{padding-block:5rem;border-bottom:1px solid var(--border)}.section:last-child{border-bottom:none}.section-label{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.5rem}.section-title{font-size:clamp(1.5rem,3vw,2rem);color:var(--text-primary);margin-bottom:2.5rem}.section-title:after{content:"";display:block;width:40px;height:2px;background:var(--accent-dim);margin-top:.75rem}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:1.5rem;transition:border-color var(--transition),background var(--transition)}.card:hover{border-color:var(--border-hover);background:var(--bg-card-hover)}.chip{display:inline-block;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.05em;padding:.2rem .6rem;border-radius:4px;background:var(--accent-subtle);color:var(--accent-dim);border:1px solid var(--border)}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.25rem;border-radius:var(--radius-sm);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--transition);border:1px solid transparent}.btn-primary{background:var(--accent);color:var(--bg-primary)}.btn-primary:hover{background:#fff;color:var(--bg-primary)}.btn-outline{background:transparent;border-color:var(--border-hover);color:var(--text-primary)}.btn-outline:hover{border-color:var(--accent);color:var(--accent)}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{color:var(--text-primary);background:var(--accent-subtle)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:3px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.fade-in-up{animation:fadeInUp .6s ease both}.reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}.reveal.revealed{opacity:1;transform:translateY(0)}.reveal-left{opacity:0;transform:translate(-24px);transition:opacity .6s ease,transform .6s ease}.reveal-left.revealed{opacity:1;transform:translate(0)}.level-advanced{color:#e8e8f0;border-color:#e8e8f04d}.level-intermediate{color:#9494a8;border-color:#9494a84d}.level-basic{color:#5a5a6e;border-color:#5a5a6e4d}.form-group{display:flex;flex-direction:column;gap:.35rem}.form-group label{font-size:.8rem;color:var(--text-secondary)}input,textarea,select{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.9rem;padding:.6rem .875rem;width:100%;transition:border-color var(--transition);outline:none;font-family:inherit}input:focus,textarea:focus,select:focus{border-color:var(--accent-dim)}input::placeholder,textarea::placeholder,select::placeholder{color:var(--text-muted)}textarea{resize:vertical;min-height:100px}
