.step-card,.info-card,.feature-card,.workflow-card,.example-card,.benefit-card,.format-card,.hosting-card,.template-card,.advanced-card{background:var(--dark-light);border:1px solid var(--border);border-radius:12px;padding:2rem;margin-bottom:2rem}.step-card{display:flex;gap:2rem;align-items:flex-start}.step-number{width:40px;height:40px;background:var(--gradient);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;flex-shrink:0}.step-content h3{margin-bottom:.5rem;font-size:1.25rem}.step-content p{color:var(--text-secondary);margin-bottom:1rem}.note{background:var(--dark);border:1px solid var(--border);border-radius:6px;padding:1rem;margin-top:1rem;color:var(--text-secondary)}.copy-methods ul{color:var(--text-secondary);line-height:1.4;margin:1rem 0}.copy-methods ul li{margin-bottom:.75rem}.copy-methods ul li strong{color:var(--accent)}.feature-card a,.step-card a,.info-card a,.workflow-card a,.example-card a,.benefit-card a,.format-card a,.hosting-card a,.template-card a,.advanced-card a,.tip-card a,.trouble-item a,.help-card a,.selector-card,.quick-link,.feature-card a:hover,.step-card a:hover,.info-card a:hover,.workflow-card a:hover,.example-card a:hover,.benefit-card a:hover,.format-card a:hover,.hosting-card a:hover,.template-card a:hover,.advanced-card a:hover,.tip-card a:hover,.trouble-item a:hover,.help-card a:hover,.selector-card:hover,.quick-link:hover{text-decoration:none}.underlined-link,.underlined-link:hover{text-decoration:underline!important}.tip{background:#f057441a;border:1px solid var(--accent);border-radius:8px;padding:1rem;margin:2rem 0;color:var(--text-secondary)}.example-text{background:var(--dark);border:1px solid var(--border);border-radius:6px;padding:1rem;font-family:monospace;color:var(--text-secondary);margin-top:1rem;white-space:pre-wrap;overflow-wrap:break-word}.trouble-item{margin-bottom:2rem;padding-bottom:2rem;border-bottom:1px solid var(--border)}.trouble-item:last-child{border-bottom:none}.trouble-item h3{color:var(--accent);margin-bottom:1rem}.trouble-item ul{color:var(--text-secondary);line-height:1.6;list-style-type:disc;padding-left:1.5rem;margin-left:0}.trouble-item ul li{margin-bottom:.5rem}.format-rules ul,.practice-card ul,.advanced-card ul,.testing-section ul{color:var(--text-secondary);line-height:1.6;list-style-type:disc;padding-left:1.5rem;margin-left:0}.format-rules ul li,.practice-card ul li,.advanced-card ul li,.testing-section ul li{margin-bottom:.5rem}.help-card{background:var(--dark-light);border:1px solid var(--accent);border-radius:12px;padding:2rem;margin-top:2rem}.help-card h3{color:var(--accent);margin-bottom:1rem}.tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.tip-card{background:var(--dark-light);border:1px solid var(--border);border-radius:12px;padding:2rem;text-align:center;transition:transform .15s ease}.tip-card:hover{transform:translateY(-5px)}.tip-card h3{margin-bottom:1rem;font-size:1.1rem}.tip-card p{color:var(--text-secondary);font-size:.95rem}.benefit-list{color:var(--text-secondary);line-height:1.6}.benefit-list strong{color:var(--accent)}.quick-start{background:#f057441a;border:1px solid var(--accent);border-radius:12px;padding:2rem;margin-top:2rem}.quick-start h3{color:var(--accent);margin-bottom:1rem}.quick-start ol{color:var(--text-secondary);line-height:1.6}.code-example{background:var(--dark);border:1px solid var(--border);border-radius:8px;padding:1.5rem;margin-top:1rem;overflow-x:auto}.code-example pre{margin:0;font-family:Monaco,Menlo,monospace;font-size:.85rem;line-height:1.4;color:var(--text-secondary);white-space:pre-wrap}.format-rules{margin-top:2rem}.format-rules h3{color:var(--accent);margin-bottom:1rem}.format-rules ul{color:var(--text-secondary);line-height:1.6}.format-rules strong{color:var(--text-primary)}.hosting-options{display:grid;gap:2rem;margin-bottom:3rem}.hosting-card h3{color:var(--accent);margin-bottom:1rem}.example-url{background:var(--dark);border:1px solid var(--border);border-radius:6px;padding:1rem;margin:1rem 0;font-family:monospace;font-size:.9rem}.pros{color:var(--text-secondary);font-style:italic;margin-top:1rem}.linking-section{margin-top:3rem}.linking-section h3{color:var(--accent);margin-bottom:1rem}.description-examples{display:grid;gap:2rem;margin-top:2rem}.example-desc{background:var(--dark);border:1px solid var(--border);border-radius:8px;padding:1.5rem}.example-desc h4{color:var(--accent);margin-bottom:1rem}.desc-text{background:var(--dark-lighter);border:1px solid var(--border);border-radius:6px;padding:1rem;font-family:monospace;font-size:.9rem;color:var(--text-secondary)}.practices-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-bottom:3rem}.practice-card{background:var(--dark-light);border:1px solid var(--border);border-radius:12px;padding:2rem}.practice-card h3{color:var(--accent);margin-bottom:1rem}.practice-card ul{color:var(--text-secondary);line-height:1.6}.testing-section{background:#f057441a;border:1px solid var(--accent);border-radius:12px;padding:2rem;margin-top:2rem}.testing-section h3{color:var(--accent);margin-bottom:1rem}.testing-section ol{color:var(--text-secondary);line-height:1.6}.template-card h3{color:var(--accent);margin-bottom:1rem}.language-list{background:var(--dark);border:1px solid var(--border);border-radius:6px;padding:1rem;margin-top:1rem;font-family:monospace;color:var(--text-secondary)}.language-list code{background:var(--dark-lighter);padding:.2rem .4rem;border-radius:3px;margin:0 .2rem;color:var(--accent)}.advanced-card h3{color:var(--accent);margin-bottom:1rem}.advanced-card ul{color:var(--text-secondary);line-height:1.6}.sidebar{position:sticky;top:120px;height:fit-content}.sidebar-card{background:var(--dark-light);border:1px solid var(--border);border-radius:12px;padding:2rem;margin-bottom:2rem}.sidebar-card h3{margin-bottom:1.5rem;color:var(--accent)}.sidebar-btn{display:block;width:100%;padding:.75rem;background:var(--gradient);color:#fff;text-decoration:none;border-radius:8px;text-align:center;font-weight:600;margin-bottom:.75rem;transition:all .15s ease}.sidebar-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #f057444d}.sidebar-btn.secondary{background:var(--dark);border:1px solid var(--border);color:var(--text-primary)}.sidebar-btn.secondary:hover{border-color:var(--accent);background:var(--dark-lighter)}.tutorial-list{color:var(--text-secondary);margin-top:1rem}.checklist{list-style:none;padding:0;margin:0;color:var(--text-secondary);line-height:1.8}.help-link{color:var(--accent);text-decoration:none;font-weight:600;transition:color .15s ease}.help-link:hover{color:var(--text-primary)}@media (max-width: 1024px){.sidebar{position:static;order:-1}.sidebar-card{background:var(--dark)}}@media (max-width: 768px){.step-card{flex-direction:column;text-align:center}.tips-grid,.practices-grid{grid-template-columns:1fr}}@media (max-width: 480px){.sidebar-btn{padding:1rem}.hosting-options{grid-template-columns:1fr}}
