:root{--bg-main: #1e1e1e;--bg-panel: #252526;--bg-input: #000;--border-color: #454545;--text-main: #d4d4d4;--text-muted: #858585;--accent-blue: #0e639c;--accent-blue-hover: #1177bb;--accent-green: #4ec9b0;--accent-orange: #ce9178;--syntax-blue: #569cd6;--syntax-pink: #c586c0;--font-mono: Consolas, "Courier New", monospace}body{background-color:var(--bg-main);color:var(--text-main);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0;padding:0}header{background-color:var(--bg-panel);border-bottom:1px solid var(--border-color);margin-bottom:24px}.page-title{font-family:var(--font-mono);font-size:1.8rem;font-weight:400;margin:0}.page-subtitle{font-family:var(--font-mono);font-size:1.4rem;margin:10px 0 0}.card-title{font-family:var(--font-mono);font-size:1.2rem;font-weight:600}.card-subtitle{font-family:var(--font-mono);font-size:1rem}.text-link{color:var(--syntax-blue);font-size:1rem;text-decoration:none;cursor:pointer;transition:all .2s ease-in-out}.text-link:hover{text-decoration:underline;transform:translateY(-2px)}.text-muted{color:var(--text-muted)}.text--center{text-align:center}.text--right{text-align:right}.layout-container{max-width:900px;margin:0 auto;padding:20px}.layout--half{max-width:450px}.page-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.page-section{display:flex;flex-direction:column;gap:20px}.space{height:24px}.navbar{display:flex;justify-content:space-between;align-items:center}.nav-logo{font-family:var(--font-mono);color:var(--accent-green);font-size:1.5rem;font-weight:700;text-decoration:none}.nav-links{display:flex;gap:20px}.nav-links a,.nav-links button{color:var(--text-main);text-decoration:none;font-size:1rem;border-bottom:2px solid transparent;padding-bottom:4px;transition:all .2s ease-in-out;background:none;border-top:none;border-left:none;border-right:none;padding-inline:0;font-family:inherit;cursor:pointer}.nav-links a:hover,.nav-links button:hover{border-bottom-color:var(--accent-blue);transform:translateY(-2px)}.nav-links a.active{border-bottom-color:var(--accent-blue)}.card{background-color:var(--bg-panel);border:1.5px solid var(--border-color);border-radius:8px;padding:35px 20px}.card--green{background-color:#4ec9b01a;border-left:4px solid var(--accent-green)}.card--code{font-family:var(--font-mono);padding:24px;white-space:pre-wrap;word-break:break-all;line-height:12px;font-size:1rem}.card--hint{background-color:#569cd61a;border:none;border-left:4px solid var(--accent-blue);padding:8px 20px}.card--flex{display:flex;justify-content:space-between;padding:12px 24px}.card-actions{display:flex;justify-content:center;gap:20px;margin-top:20px}.card-actions--col{display:flex;flex-direction:column;gap:10px}.card-actions .btn,.card-actions--col .btn{width:auto;padding:12px 30px}.btn{font-family:var(--font-mono);font-size:1rem;font-weight:600;padding:12px;border-radius:8px;cursor:pointer;border:none;width:100%;text-align:center;margin-bottom:12px;transition:all .2s ease-in-out}.btn:hover{transform:translateY(-2px)}.btn--blue{background-color:var(--accent-blue);color:var(--text-main)}.btn--blue:hover{background-color:var(--accent-blue-hover)}.btn--outline{background-color:transparent;color:var(--accent-blue);border:1.5px solid var(--accent-blue)}.btn--outline:hover{background-color:var(--accent-blue-hover);color:var(--text-main)}.btn--dark{background-color:var(--bg-main);color:#fff}.btn--dark:hover{background-color:var(--bg-panel)}.list-container{display:flex;flex-direction:column;gap:10px;max-height:350px;overflow-y:auto;padding-right:8px}.list-container::-webkit-scrollbar{width:8px}.list-container::-webkit-scrollbar-thumb{background-color:var(--border-color);border-radius:8px}.list-item{display:flex;justify-content:space-between;background-color:var(--bg-panel);border:1.5px solid var(--border-color);padding:15px;border-radius:8px;font-family:var(--font-mono);font-size:1rem}.list-item:hover{background-color:var(--border-color)}.list-item--col{display:flex;flex-direction:column;gap:8px}.typing-char{font-family:var(--font-mono);white-space:pre}.typing-char.correct{color:var(--accent-green)}.typing-char.incorrect{color:var(--accent-orange);background-color:#ce917833;border-radius:2px}.typing-char.untyped{color:var(--text-muted)}.typing-char.cursor{color:var(--text-main);border-bottom:2px solid var(--text-main);animation:blink 1s step-end infinite}@keyframes blink{50%{border-color:transparent}}.input-group{display:flex;flex-direction:column;gap:10px;margin-bottom:18px}.input-field{width:100%;background-color:var(--bg-main);border:1px solid var(--border-color);color:var(--text-main);padding:14px 12px;border-radius:8px;box-sizing:border-box}.textarea-field{font-family:var(--font-mono);font-size:1rem;color:var(--text-main);padding:24px;background-color:var(--bg-input);border:1.5px solid var(--border-color);border-radius:8px;height:80px;resize:none}.input-field:focus-visible,.textarea-field:focus-visible{outline:none;border-color:var(--accent-blue);box-shadow:0 0 0 1px var(--accent-blue),0 0 20px #569cd666}.textarea-field::-webkit-scrollbar{width:4px}.textarea-field::-webkit-scrollbar-thumb{background-color:var(--border-color);border-radius:8px}.progress-container{width:100%;background-color:var(--border-color);height:8px;border-radius:999px}.progress-bar{background-color:var(--accent-green);height:100%;border-radius:999px;transition:width .1s ease-out}.profile-header{display:flex;align-items:flex-start;gap:24px;margin-bottom:12px}.profile-image{width:100%;aspect-ratio:4 / 3;height:auto;border-radius:120px;object-fit:cover}.password-rules{list-style-type:none;padding:0;margin:0 1rem;font-size:.85rem}.rule--valid{color:var(--accent-green);transition:color .3s ease}.rule--invalid{color:var(--accent-orange);transition:color .3s ease}.--accent-blue{color:var(--accent-blue)}.--green{color:var(--accent-green)}.--orange{color:var(--accent-orange)}.--blue{color:var(--syntax-blue)}.--pink{color:var(--syntax-pink)}