:root{--bg-page: #F8F6F2;--bg-card: #FFFFFF;--bg-input: #FEFCF9;--primary: #1C39BB;--primary-hover: #1531A1;--primary-light: #E8EBF7;--gradient-start: #0A2463;--gradient-end: #1C39BB;--text-primary: #1A1A2E;--text-secondary: #6B7280;--text-hint: #9CA3AF;--border: #E5E2DC;--border-hover: #D1CEC7;--success: #10B981;--success-light: #D1FAE5;--success-dark: #065F46;--danger: #E24B4A;--danger-light: #FCEBEB;--warning: #F59E0B;--warning-light: #FEF3C7;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-pill: 50px;--shadow-sm: 0 1px 3px rgba(0,0,0,.06);--shadow-md: 0 4px 12px rgba(0,0,0,.08);--shadow-lg: 0 8px 24px rgba(0,0,0,.1);--max-width: 1140px;--transition: .2s ease;--result-font-size: 16px}[data-theme=dark]{--bg-page: #121218;--bg-card: #1E1E2A;--bg-input: #252535;--text-primary: #E8E6E0;--text-secondary: #9CA3AF;--text-hint: #6B7280;--border: #2D2D3D;--border-hover: #3D3D50;--primary-light: #1E2A4A;--shadow-sm: 0 1px 3px rgba(0,0,0,.2);--shadow-md: 0 4px 12px rgba(0,0,0,.3);--shadow-lg: 0 8px 24px rgba(0,0,0,.4)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:DM Sans,sans-serif;background:var(--bg-page);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;transition:background var(--transition),color var(--transition)}.navbar{display:flex;align-items:center;justify-content:space-between;width:100%;padding:14px 40px;border-bottom:.5px solid var(--border);background:var(--bg-page);position:relative;position:sticky;top:0;z-index:100;transition:background var(--transition)}.nav-logo{display:flex;align-items:center;text-decoration:none;overflow:visible}.nav-logo svg{height:22px;width:auto;display:block;overflow:visible;transform:translateY(3px)}.nav-right{display:flex;align-items:center;gap:20px;flex-shrink:0}.nav-links{display:flex;gap:16px}.nav-links a{font-size:14px;color:var(--text-secondary);text-decoration:none;transition:color var(--transition)}.nav-links a:hover{color:var(--primary)}.nav-divider{width:1px;height:18px;background:var(--border);align-self:center;margin:0 4px;flex-shrink:0}.dark-toggle{display:flex;align-items:center;gap:6px;cursor:pointer;-webkit-user-select:none;user-select:none;flex-shrink:0}.dark-toggle-label{font-size:14px;color:var(--text-secondary)}.dark-toggle-track{width:36px;height:20px;background:var(--border);border-radius:10px;position:relative;transition:background var(--transition)}.dark-toggle-track.active{background:var(--primary)}.dark-toggle-thumb{width:16px;height:16px;background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;transition:transform var(--transition)}.dark-toggle-track.active .dark-toggle-thumb{transform:translate(16px)}.hero{text-align:center;max-width:var(--max-width);margin:0 auto;padding:40px 24px 20px}.hero h1{font-size:28px;font-weight:700;letter-spacing:-.8px;line-height:1.25;margin-bottom:10px}.hero h1 span{background:linear-gradient(135deg,var(--gradient-start),var(--gradient-end));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero p{font-size:14.5px;color:var(--text-secondary);max-width:600px;margin:0 auto;line-height:1.6}.tool-wrapper{max-width:800px;margin:0 auto 32px;padding:0 24px}.tool-card{background:var(--bg-card);border-radius:var(--radius-xl);padding:24px;box-shadow:var(--shadow-md);transition:background var(--transition),box-shadow var(--transition)}.tool-label{font-size:12px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.lang-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}.lang-pill{padding:5px 14px;border-radius:var(--radius-pill);font-size:13px;font-weight:400;border:.5px solid var(--border);color:var(--text-secondary);background:var(--bg-input);cursor:pointer;transition:all var(--transition)}.lang-pill:hover{border-color:var(--primary);color:var(--primary)}.lang-pill.active{background:var(--primary-light);color:var(--primary);border-color:var(--primary);font-weight:500}.input-row{display:flex;gap:8px;margin-bottom:10px}.input-field{flex:1;padding:12px 16px;font-size:15px;font-family:DM Sans,sans-serif;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-input);color:var(--text-primary);transition:all var(--transition);outline:none}.input-field::placeholder{color:var(--text-hint)}.input-field:focus{border-color:var(--primary);box-shadow:0 0 0 3px #1c39bb1a}.generate-btn{padding:12px 24px;font-size:14px;font-weight:600;font-family:DM Sans,sans-serif;color:#fff;background:linear-gradient(135deg,var(--gradient-start),var(--gradient-end));border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition);white-space:nowrap}.generate-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #1c39bb4d}.generate-btn:active{transform:translateY(0)}.generate-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.counter-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;font-size:12px;color:var(--text-hint)}.game-warn{font-size:11px;font-weight:500;padding:2px 8px;border-radius:var(--radius-pill)}.game-warn.ok{background:var(--success-light);color:var(--success-dark)}.game-warn.over{background:var(--danger-light);color:var(--danger)}.tool-options-row{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:16px}.tool-options-section{display:flex;flex-direction:column;gap:8px}.options-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:0;align-items:center}.option-pill{display:flex;align-items:center;gap:6px;padding:5px 12px;border-radius:var(--radius-pill);font-size:12px;border:.5px solid var(--border);color:var(--text-secondary);background:var(--bg-input);cursor:pointer;transition:all var(--transition);-webkit-user-select:none;user-select:none}.option-pill:hover{border-color:var(--primary)}.option-pill.active{border-color:var(--primary);color:var(--primary);background:var(--primary-light)}.mini-switch{width:24px;height:14px;border-radius:7px;background:var(--border);position:relative;transition:background var(--transition);flex-shrink:0}.mini-switch.on{background:var(--success)}.mini-switch-dot{width:10px;height:10px;border-radius:50%;background:#fff;position:absolute;top:2px;left:2px;transition:transform var(--transition)}.mini-switch.on .mini-switch-dot{transform:translate(10px)}.new-badge{font-size:9px;font-weight:600;padding:1px 6px;border-radius:var(--radius-pill);background:var(--success-light);color:var(--success-dark);text-transform:uppercase;letter-spacing:.3px}.size-adjuster-row{display:flex;align-items:center;gap:10px;margin-bottom:0}.size-btn{width:30px;height:30px;border-radius:50%;border:1px solid var(--border);background:var(--bg-input);color:var(--text-secondary);font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition);font-family:DM Sans,sans-serif}.size-btn:hover{border-color:var(--primary);color:var(--primary)}.size-label{font-size:12px;color:var(--text-hint);min-width:30px;text-align:center}.color-row{display:flex;align-items:center;gap:8px;margin-bottom:0;flex-wrap:wrap}.color-dot{width:24px;height:24px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:all var(--transition)}.color-dot:hover{transform:scale(1.15)}.color-dot.active{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.custom-color-picker-wrapper{position:relative}.color-picker-trigger{width:28px;height:28px;border-radius:50%;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red);cursor:pointer;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 0 0 1px #00000026;transition:transform var(--transition);flex-shrink:0}.color-picker-trigger:hover{transform:scale(1.1)}.color-picker-plus{color:#fff;font-size:17px;font-weight:700;line-height:1;text-shadow:0 1px 3px rgba(0,0,0,.5)}.color-picker-popover{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);background:var(--card-bg);border:1px solid var(--border);border-radius:12px;padding:12px;width:220px;box-shadow:0 8px 24px #00000026;z-index:200;display:flex;flex-direction:column;gap:10px}.color-gradient-area{width:100%;height:140px;border-radius:8px;position:relative;cursor:crosshair;overflow:hidden;-webkit-user-select:none;user-select:none}.gradient-dark-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,transparent,#000);border-radius:8px}.color-picker-dot{position:absolute;width:13px;height:13px;border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 1px 4px #0006}.hue-range{width:100%;height:14px;border-radius:7px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);outline:none;border:none;cursor:pointer}.hue-range::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid rgba(0,0,0,.2);box-shadow:0 1px 3px #0000004d;cursor:pointer}.hex-input-row{display:flex;align-items:center;gap:6px}.hex-preview-swatch{width:26px;height:26px;border-radius:6px;border:1px solid var(--border);flex-shrink:0}.hex-hash{font-size:13px;color:var(--text-hint);font-weight:600}.hex-text-input{flex:1;min-width:0;border:1px solid var(--border);border-radius:6px;padding:4px 8px;font-size:13px;font-family:monospace;background:var(--input-bg);color:var(--text);text-transform:uppercase;outline:none;box-sizing:border-box}.hex-text-input:focus{border-color:var(--primary)}.tabs-wrapper{margin-bottom:16px;position:relative}.tabs-scroll-container{position:relative;overflow:hidden}.tabs-scroll-container:before,.tabs-scroll-container:after{content:"";position:absolute;top:0;bottom:0;width:40px;z-index:2;pointer-events:none;transition:opacity .2s}.tabs-scroll-container:before{left:0;background:linear-gradient(to right,var(--bg-card),transparent);opacity:0}.tabs-scroll-container.scrolled-start:before{opacity:1}.tabs-scroll-container:after{right:0;background:linear-gradient(to left,var(--bg-card),transparent);opacity:1}.tabs-scroll-container.scrolled-end:after{opacity:0}.tabs-scroll{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-behavior:smooth}.tabs-scroll::-webkit-scrollbar{display:none}.tabs-nav-btn{position:absolute;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;border:.5px solid var(--border);background:var(--bg-card);color:var(--text-secondary);font-size:14px;cursor:pointer;z-index:3;display:flex;align-items:center;justify-content:center;transition:all var(--transition);box-shadow:var(--shadow-sm)}.tabs-nav-btn:hover{border-color:var(--primary);color:var(--primary)}.tabs-nav-btn.left{left:-4px}.tabs-nav-btn.right{right:-4px}.tab-btn{padding:6px 14px;border-radius:var(--radius-pill);font-size:13px;font-family:DM Sans,sans-serif;font-weight:400;border:.5px solid var(--border);color:var(--text-secondary);background:var(--bg-input);cursor:pointer;transition:all var(--transition);white-space:nowrap;flex-shrink:0}.tab-btn:hover{border-color:var(--primary);color:var(--primary)}.tab-btn.active{background:var(--primary);color:#fff;border-color:var(--primary);font-weight:500}.results-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:16px}@media (max-width: 600px){.results-grid{grid-template-columns:1fr}}.results-grid.single-col{grid-template-columns:1fr}.result-card{background:var(--bg-input);border:.5px solid var(--border);border-radius:var(--radius-lg);padding:12px;transition:all var(--transition);min-width:0}.result-card:hover{border-color:var(--primary);box-shadow:var(--shadow-sm)}.result-card.just-copied{border-color:var(--success);background:#f0fdf4}[data-theme=dark] .result-card.just-copied{background:#0a2e1a}.result-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;gap:8px}.result-text{font-size:var(--result-font-size);color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.copy-btn{padding:4px 12px;font-size:12px;font-weight:500;font-family:DM Sans,sans-serif;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition);background:var(--primary-light);color:var(--primary);white-space:nowrap;flex-shrink:0}.copy-btn:hover{background:var(--primary);color:#fff}.copy-btn.copied{background:var(--success-light);color:var(--success-dark)}.compat-row{display:flex;gap:8px;flex-wrap:wrap}.compat-item{display:flex;align-items:center;gap:3px;font-size:11px;color:var(--text-hint)}.compat-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.compat-dot.green{background:var(--success)}.compat-dot.red{background:var(--danger)}.load-more-btn{display:block;margin:0 auto 20px;padding:8px 28px;font-size:13px;font-weight:500;font-family:DM Sans,sans-serif;background:transparent;color:var(--primary);border:1px solid var(--primary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition)}.load-more-btn:hover{background:var(--primary-light)}.flourish-section,.recently-section,.ai-section,.copied-section{padding-top:16px;margin-top:16px;border-top:.5px solid var(--border)}.section-title-row{display:flex;align-items:center;gap:6px;margin-bottom:8px}.section-title-row .title{font-size:13px;font-weight:600;color:var(--text-secondary)}.flourish-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}.flourish-chip{padding:4px 10px;border-radius:var(--radius-sm);font-size:14px;border:.5px solid var(--border);background:var(--bg-input);color:var(--text-primary);cursor:pointer;transition:all var(--transition)}.flourish-chip:hover{border-color:var(--primary)}.flourish-chip.active{border-color:var(--primary);background:var(--primary-light)}.flourish-preview{padding:8px 12px;background:var(--primary-light);border-radius:var(--radius-md);text-align:center;font-size:16px;color:var(--primary);font-weight:500}.recent-chips,.copied-chips{display:flex;gap:6px;flex-wrap:wrap}.recent-chip,.copied-chip{padding:4px 10px;border-radius:var(--radius-sm);font-size:13px;border:.5px solid var(--border);background:var(--bg-input);color:var(--text-primary);cursor:pointer;transition:all var(--transition);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recent-chip:hover{border-color:var(--primary)}.copied-chip{border-color:var(--success)}.copied-chip:hover{border-color:var(--success-dark)}.clear-copied-btn{padding:3px 10px;font-size:11px;font-family:DM Sans,sans-serif;background:transparent;color:var(--danger);border:1px solid var(--danger-light);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition)}.clear-copied-btn:hover{background:var(--danger-light)}.ai-chips{display:flex;gap:6px;flex-wrap:wrap}.ai-chip{padding:4px 10px;border-radius:var(--radius-sm);font-size:12px;border:.5px solid #C7C4F7;background:#f0f0ff;color:var(--primary);cursor:pointer;transition:all var(--transition)}[data-theme=dark] .ai-chip{background:#1e2a4a;border-color:#2d3a5a}.ai-chip:hover{background:var(--primary-light)}.ai-badge{font-size:9px;font-weight:600;padding:2px 6px;border-radius:var(--radius-pill);background:linear-gradient(135deg,var(--gradient-start),var(--gradient-end));color:#fff;letter-spacing:.3px}.empty-state{text-align:center;padding:40px 20px;color:var(--text-hint)}.empty-state p{font-size:14px}.content-wrapper{max-width:var(--max-width);margin:0 auto;padding:0 24px}.section-block{margin-bottom:40px}.section-block h2{font-size:22px;font-weight:700;letter-spacing:-.5px;margin-bottom:16px;color:var(--text-primary)}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}@media (max-width: 600px){.steps-grid{grid-template-columns:1fr}}.step-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:20px;text-align:center;border:.5px solid var(--border);transition:background var(--transition),border var(--transition)}.step-num{width:36px;height:36px;border-radius:50%;background:var(--primary-light);color:var(--primary);font-size:16px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;margin-bottom:10px}.step-card .step-title{font-size:15px;font-weight:600;margin-bottom:4px}.step-card .step-desc{font-size:13px;color:var(--text-secondary)}.platform-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}@media (max-width: 600px){.platform-grid{grid-template-columns:repeat(2,1fr)}}.plat-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:16px;text-align:center;border:.5px solid var(--border);transition:all var(--transition)}.plat-card:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.plat-icon{margin-bottom:6px;color:var(--primary);display:flex;justify-content:center}.plat-name{font-size:13px;font-weight:500}.benefits-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}@media (max-width: 600px){.benefits-grid{grid-template-columns:1fr}}.benefit-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:20px;border:.5px solid var(--border);transition:background var(--transition),border var(--transition)}.benefit-card .ben-title{font-size:15px;font-weight:600;margin-bottom:6px}.benefit-card .ben-desc{font-size:13px;color:var(--text-secondary);line-height:1.5}.faq-list{display:flex;flex-direction:column;gap:8px}.faq-item{background:var(--bg-card);border:.5px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:background var(--transition),border var(--transition)}.faq-question{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;cursor:pointer;font-size:14px;font-weight:500;color:var(--text-primary);-webkit-user-select:none;user-select:none}.faq-question:hover{color:var(--primary)}.faq-icon{font-size:18px;color:var(--text-hint);transition:transform var(--transition)}.faq-item.open .faq-icon{transform:rotate(45deg)}.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease;padding:0 18px;font-size:13px;color:var(--text-secondary);line-height:1.7}.faq-item.open .faq-answer{max-height:300px;padding:0 18px 14px}.footer{background:var(--text-primary);padding:24px;text-align:center;margin-top:48px}[data-theme=dark] .footer{background:#0a0a10}.footer p{font-size:13px;color:#6b7280;margin:4px 0}.footer .footer-brand{color:#9ca3af;font-weight:500}.footer a{color:#4a90d9;text-decoration:none}.footer a:hover{text-decoration:underline}.footer-social{display:flex;justify-content:center;gap:16px;margin:12px 0}.footer-social a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:#ffffff14;color:#9ca3af;transition:all var(--transition);text-decoration:none}.footer-social a:hover{background:#ffffff26;color:#fff;transform:translateY(-2px)}.htu-content{max-width:780px;margin:0 auto;padding:40px 40px 60px}.htu-section{padding-bottom:40px;margin-bottom:40px;border-bottom:.5px solid var(--border)}.htu-section--last{border-bottom:none;margin-bottom:0}.htu-h2{font-size:17px;font-weight:600;color:var(--text-primary);margin-bottom:16px}.htu-body{font-size:14px;color:var(--text-secondary);line-height:1.8;text-align:justify}.htu-steps-card{background:var(--bg-card);border:.5px solid var(--border);border-radius:12px;display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:16px;overflow:hidden}.htu-step{padding:20px 16px;text-align:center;border-right:.5px solid var(--border)}.htu-step:last-child{border-right:none}.htu-step-badge{width:32px;height:32px;border-radius:50%;background:#e8ebf7;color:#1c39bb;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 10px}.htu-step-title{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.htu-step-desc{font-size:11px;color:#6b7280;line-height:1.5}.htu-feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.htu-feature-card{background:var(--bg-card);border:.5px solid var(--border);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:8px}.htu-icon-box{width:32px;height:32px;background:#e8ebf7;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.htu-card-title{font-size:13px;font-weight:600;color:var(--text-primary)}.htu-card-desc{font-size:12px;color:#6b7280;line-height:1.6}.htu-color-dots-row{display:flex;gap:5px;flex-wrap:wrap;margin-top:2px}.htu-color-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0}.htu-size-icon{display:flex;flex-direction:column;align-items:center;gap:4px}.htu-size-icon span{font-size:13px;font-weight:700;color:#1c39bb;line-height:1;opacity:1}.htu-slider-bar{width:20px;height:3px;background:#c5c8d6;border-radius:2px;position:relative}.htu-slider-thumb{width:7px;height:7px;background:#1c39bb;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:1}.htu-compat-visual{background:var(--bg-card);border:.5px solid var(--border);border-radius:12px;padding:20px}.htu-compat-label{font-size:12px;font-weight:600;color:#6b7280;letter-spacing:.5px;text-transform:uppercase;margin-bottom:12px}.htu-name-demo{background:var(--bg-input);border:.5px solid var(--border);border-radius:10px;padding:12px 14px}.htu-name-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.htu-name-text{font-size:15px;color:var(--text-primary)}.htu-copy-btn{background:#e8ebf7;color:#1c39bb;font-size:11px;padding:3px 10px;border-radius:4px;font-weight:500;cursor:default}.htu-dots-row{display:flex;gap:10px;flex-wrap:wrap}.htu-dot-item{display:flex;align-items:center;gap:4px;font-size:11px;color:#6b7280}.htu-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.htu-dot-green{background:#10b981}.htu-dot-red{background:#e24b4a}.htu-legend-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:14px}.htu-legend-item{background:var(--bg-input);padding:8px 12px;border-radius:8px;display:flex;align-items:center;gap:8px;font-size:12px;color:#4b5563}.htu-tips-list{display:flex;flex-direction:column;gap:10px}.htu-tip-card{background:var(--bg-card);border:.5px solid var(--border);border-radius:10px;padding:14px 16px;display:flex;gap:12px;align-items:flex-start}.htu-tip-badge{width:22px;height:22px;min-width:22px;border-radius:50%;background:#e8ebf7;color:#1c39bb;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}.htu-tip-content{display:flex;flex-direction:column;gap:3px}.htu-tip-title{font-size:13px;font-weight:600;color:#1a1a2e}.htu-tip-desc{font-size:12px;color:#6b7280;line-height:1.6}@media (max-width: 600px){.htu-content{padding:0 16px 40px}.htu-steps-card{grid-template-columns:repeat(2,1fr)}.htu-step:nth-child(2){border-right:none}.htu-step:nth-child(1),.htu-step:nth-child(2){border-bottom:.5px solid var(--border)}.htu-feature-grid,.htu-legend-grid{grid-template-columns:1fr}}.about-page{background:var(--bg-page);min-height:calc(100vh - 60px)}.about-content{max-width:680px;margin:0 auto;padding:40px;text-align:left}.about-hero{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}.about-accent-line{width:3px;border-radius:2px;background:#1c39bb;align-self:stretch;flex-shrink:0}.about-hero-text{display:flex;flex-direction:column;gap:4px}.about-h1{font-size:26px;font-weight:600;color:var(--text-primary);line-height:1.2}.about-subtitle{font-size:13px;color:var(--text-secondary)}.about-desc{font-size:15px;color:var(--text-secondary);line-height:1.75;margin-bottom:36px;padding-bottom:36px;border-bottom:.5px solid var(--border)}.about-section{padding-bottom:36px;margin-bottom:36px;border-bottom:.5px solid var(--border)}.about-section--last{border-bottom:none;margin-bottom:0}.about-h2{font-size:15px;font-weight:600;color:var(--text-primary);margin-bottom:12px}.about-body{font-size:14px;color:var(--text-secondary);line-height:1.8;text-align:justify}.about-feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.about-feature-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:16px;border:1px solid var(--primary)}.about-card-title{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:6px}.about-card-desc{font-size:12px;color:var(--text-secondary);line-height:1.6}@media (max-width: 600px){.about-feature-grid{grid-template-columns:1fr}.about-content{padding:24px 16px}}.contact-page{background:var(--bg-page);min-height:calc(100vh - 60px)}.contact-content{max-width:680px;margin:0 auto;padding:40px 40px 60px}.contact-desc{font-size:15px;color:var(--text-secondary);line-height:1.75;margin-bottom:32px;text-align:justify}.contact-form-heading{font-size:18px;font-weight:600;color:var(--text-primary);margin-top:32px;margin-bottom:16px}.contact-card{background:var(--bg-card);border:.5px solid var(--border);border-radius:16px;padding:32px;box-shadow:var(--shadow-md)}.contact-form{display:flex;flex-direction:column;gap:20px}.contact-field{display:flex;flex-direction:column;gap:6px}.contact-label{font-size:13px;font-weight:600;color:var(--text-primary)}.contact-input{width:100%;background:var(--bg-input);border:.5px solid var(--border);border-radius:8px;padding:10px 14px;font-size:14px;font-family:DM Sans,sans-serif;color:var(--text-primary);outline:none;transition:border-color var(--transition),background var(--transition);-moz-appearance:none;appearance:none;-webkit-appearance:none}.contact-input:focus{border-color:#1c39bb;background:var(--bg-card)}.contact-textarea{min-height:120px;resize:vertical}.contact-select{cursor:pointer}.contact-submit{width:100%;margin-top:4px}.contact-note{font-size:12px;color:#9ca3af;text-align:center;margin-top:12px}@media (max-width: 600px){.contact-content{padding:0 16px 40px}.contact-card{padding:20px}}.hamburger-btn{display:none;background:none;border:none;cursor:pointer;color:var(--text-secondary);padding:4px;line-height:0;flex-shrink:0}.mobile-menu{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg-page);z-index:199;flex-direction:column;border-bottom:.5px solid var(--border)}.mobile-menu-link{display:block;padding:14px 16px;font-size:14px;color:var(--text-secondary);text-decoration:none;border-bottom:.5px solid var(--border);transition:color var(--transition)}.mobile-menu-link:last-child{border-bottom:none}.mobile-menu-link.active{color:#1c39bb;font-weight:500}.mobile-menu-link:hover{color:var(--primary)}@media (max-width: 768px){.hero h1{font-size:24px}.hero p{font-size:14px}.input-row{flex-direction:column}.generate-btn{width:100%}.tool-card{padding:16px}.navbar{padding:13px 16px}.nav-links,.nav-divider{display:none}.nav-right{gap:12px}.hamburger-btn{display:flex;margin-left:0}.mobile-menu{display:flex}.tool-options-row{flex-direction:column;gap:16px}}.cs-article{max-width:var(--max-width);margin:0 auto;padding:0 24px 64px}.cs-ad-wrap{margin:24px 0}.cs-ad{width:100%;padding:20px;text-align:center;border:1.5px dashed #CBD5E1;border-radius:var(--radius-lg);background:#f1f5f9;color:var(--text-hint);font-size:13px;letter-spacing:.05em}[data-theme=dark] .cs-ad{background:#1a1a28;border-color:#2d2d3d}.cs-section{margin-bottom:48px;padding-bottom:48px;border-bottom:1px solid var(--border)}.cs-section:last-child,.cs-section-last{border-bottom:none;margin-bottom:0;padding-bottom:0}.cs-compact{margin-bottom:32px;padding-bottom:32px}.cs-h2{font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:12px;line-height:1.3}.cs-h3{font-size:17px;font-weight:600;color:var(--text-primary);margin:20px 0 8px}.cs-p{font-size:15px;line-height:1.75;color:var(--text-secondary);margin-bottom:12px}.cs-p:last-child{margin-bottom:0}.cs-link{color:var(--primary);text-decoration:none;font-weight:500}.cs-link:hover{text-decoration:underline}.cs-bullet-list{list-style:none;display:flex;flex-direction:column;gap:8px;margin:12px 0}.cs-bullet-item{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--text-secondary);line-height:1.6}.cs-bullet-dot{width:7px;height:7px;border-radius:50%;background:var(--primary);flex-shrink:0;margin-top:6px}.cs-table-wrap{overflow-x:auto;margin:16px 0;border-radius:12px;border:1px solid var(--border)}.cs-table{width:100%;border-collapse:collapse;font-size:13.5px}.cs-table th{background:#0a2463;color:#fff;font-weight:600;padding:10px 14px;text-align:left;white-space:nowrap;border-bottom:1px solid var(--border)}.cs-table td{padding:9px 14px;border-bottom:1px solid var(--border);color:var(--text-secondary);vertical-align:top}.cs-table tr:last-child td{border-bottom:none}.cs-table tbody tr td{background:var(--bg-page)}.cs-table tbody tr:hover td{background:#eef2ff}.cs-steps-row{display:flex;align-items:stretch;gap:8px;margin:16px 0}.cs-step-card{flex:1;align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:16px;text-align:center;gap:6px;background:var(--bg-card);border:.5px solid var(--border);border-radius:12px}.cs-step-badge{width:32px;height:32px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}.cs-step-title{font-size:13px;font-weight:600;color:var(--text-primary)}.cs-step-desc{font-size:12px;color:var(--text-secondary);line-height:1.4}.cs-step-arrow{font-size:18px;font-weight:700;color:var(--primary);padding:0 6px;flex-shrink:0;align-self:center}.cs-steps-text{display:flex;flex-direction:column;gap:8px;margin:16px 0}.cs-step-row{font-size:14px;color:var(--text-secondary);line-height:1.6}.cs-step-row-block{display:flex;flex-direction:column;gap:4px}.cs-step-label{font-weight:700;color:var(--primary)}.cs-sub-list{list-style:none;padding-left:20px;display:flex;flex-direction:column;gap:2px;margin-top:4px}.cs-sub-list li{font-size:13.5px;color:var(--text-secondary)}.cs-custom-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin:16px 0}.cs-custom-label{font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--text-hint);text-align:center;margin-bottom:16px}.cs-custom-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.cs-custom-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;background:var(--bg-input);border:.5px solid var(--border);border-radius:8px;padding:12px}.cs-cell-colors{display:flex;gap:4px;justify-content:center}.cs-cell-dot{width:14px;height:14px;border-radius:50%}.cs-cell-label{font-size:12px;font-weight:600;color:var(--text-primary)}.cs-cell-desc{font-size:11px;color:var(--text-hint);line-height:1.4}.cs-size-preview{display:flex;flex-direction:column;align-items:center;gap:4px}.cs-size-aa{font-size:22px;font-weight:700;color:var(--primary);line-height:1}.cs-slider-bar{width:36px;height:4px;background:#c5c8d6;border-radius:2px;position:relative}.cs-slider-thumb{width:10px;height:10px;border-radius:50%;background:var(--primary);position:absolute;top:50%;left:60%;transform:translate(-50%,-50%)}.cs-check-icon{width:32px;height:32px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700}.cs-flourish-text{font-size:18px;color:var(--primary);letter-spacing:2px;line-height:1.6}.cs-compat-visual{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin:16px 0;display:flex;flex-direction:column;gap:12px}.cs-compat-demo{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px;background:var(--bg-input);border-radius:var(--radius-md);border:1px solid var(--border)}.cs-compat-name{font-size:20px;color:var(--text-primary)}.cs-compat-dots{display:flex;gap:12px}.cs-compat-dot-item{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;color:var(--text-secondary)}.cs-compat-dot{width:10px;height:10px;border-radius:50%}.cs-dot-green{background:#10b981}.cs-dot-red{background:#e24b4a}.cs-compat-legend{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}.cs-compat-legend-item{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-secondary)}.cs-platform-logos{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:12px;opacity:.7}.cs-why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:16px}.cs-why-card{background:var(--bg-card);border:1px solid var(--primary);border-radius:var(--radius-lg);padding:16px 18px}.cs-why-title{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.cs-why-desc{font-size:13px;color:var(--text-secondary);line-height:1.5}.cs-trend-list{display:flex;flex-direction:column;gap:10px;margin-top:12px}.cs-trend-card{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md)}.cs-trend-dot{width:8px;height:8px;border-radius:50%;background:var(--primary);flex-shrink:0;margin-top:5px}.cs-trend-text{font-size:14px;color:var(--text-secondary);line-height:1.6}.cs-show-faq-btn{display:block;margin:0 auto 16px;padding:12px 24px;background:linear-gradient(135deg,var(--gradient-start),var(--gradient-end));color:#fff;border:none;border-radius:var(--radius-md);font-size:14px;font-weight:600;font-family:DM Sans,sans-serif;cursor:pointer;transition:all .2s ease}.cs-show-faq-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #1c39bb4d}.cs-show-faq-btn:active{transform:translateY(0)}.cs-faq-list{display:none;flex-direction:column;gap:0;margin-top:16px;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}.cs-faq-list.cs-visible{display:flex}.cs-faq-item{border-bottom:1px solid var(--border)}.cs-faq-item:last-child{border-bottom:none}.cs-faq-q{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;cursor:pointer;gap:12px;font-size:14px;font-weight:500;color:var(--text-primary);background:var(--bg-card);transition:background var(--transition)}.cs-faq-q:hover{background:var(--primary-light)}.cs-faq-icon{font-size:20px;line-height:1;color:var(--primary);flex-shrink:0;transition:transform var(--transition)}.cs-faq-icon.open{transform:rotate(45deg)}.cs-faq-a{display:none;padding:0 16px;font-size:13.5px;color:var(--text-secondary);line-height:1.65;background:var(--bg-input)}.cs-faq-a.open{display:block;padding:12px 16px}.cs-guides-label{font-size:14px;font-weight:600;color:var(--text-primary);margin:20px 0 10px}.cs-guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.cs-guide-link{display:block;padding:10px 12px;background:var(--bg-card);border:.5px solid var(--border);border-radius:8px;font-size:12px;color:var(--primary);text-decoration:none;font-weight:400;transition:border-color .2s,color .2s,font-weight .2s;line-height:1.4}.cs-guide-link:hover{border-color:var(--primary);color:#0a2463;font-weight:600}[data-theme=dark] .nav-logo g path{fill:#f8f6f2}[data-theme=dark] .cs-platform-logos-row img{filter:brightness(0) invert(1) sepia(0) saturate(0) opacity(.95)!important}[data-theme=dark] .cs-platform-logos-row svg{fill:#f8f6f2}@media (max-width: 768px){.cs-article{padding:0 16px 48px}.cs-h2{font-size:19px}.cs-steps-row{flex-direction:column}.cs-step-arrow{transform:rotate(90deg);align-self:center;padding:0}.cs-custom-grid{grid-template-columns:repeat(2,1fr)}.cs-why-grid{grid-template-columns:1fr}.cs-guide-grid{grid-template-columns:repeat(2,1fr)}.htu-content,.contact-content{padding-top:24px}.cs-platform-logos-row{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:16px;width:100%;padding:0 16px;box-sizing:border-box}.cs-platform-logos-row img,[data-theme=dark] .cs-platform-logos-row img{width:28px!important;height:28px!important;filter:brightness(0) saturate(100%) invert(18%) sepia(89%) saturate(1200%) hue-rotate(213deg) brightness(90%)!important}.cs-platform-logos-row img[alt="Bigo Live"],[data-theme=dark] .cs-platform-logos-row img[alt="Bigo Live"]{width:36px!important;height:36px!important}}@media (max-width: 480px){.cs-guide-grid{grid-template-columns:1fr}.cs-compat-dots{gap:8px}}.art-page{background:var(--bg-page);min-height:calc(100vh - 60px)}.art-content{max-width:780px;margin:0 auto;padding:36px 32px 64px}.art-breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-secondary);margin-bottom:28px}.art-breadcrumb-link{color:var(--primary);text-decoration:none}.art-breadcrumb-link:hover{text-decoration:underline}.art-breadcrumb-sep{color:var(--text-hint)}.art-header{display:flex;gap:16px;margin-bottom:24px}.art-accent-line{width:3px;background:var(--primary);border-radius:2px;flex-shrink:0}.art-header-body{flex:1}.art-meta-tags{display:flex;gap:8px;margin-bottom:12px}.art-tag{display:inline-block;padding:3px 12px;background:var(--primary-light);color:var(--primary);border-radius:var(--radius-pill);font-size:12px;font-weight:600}.art-h1{font-size:26px;font-weight:700;color:var(--text-primary);line-height:1.3;margin-bottom:8px}.art-subtitle{font-size:14px;color:var(--text-secondary);line-height:1.5}.art-intro-box{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px 22px;margin-bottom:24px}.art-toc{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px 22px;margin-bottom:36px}.art-toc-label{font-size:11px;font-weight:700;color:var(--text-hint);text-transform:uppercase;letter-spacing:.07em;margin-bottom:12px}.art-toc-list{list-style:none;display:flex;flex-direction:column;gap:9px}.art-toc-item{color:var(--primary);text-decoration:none;font-size:14px;line-height:1.4}.art-toc-item:hover{text-decoration:underline}.art-section{margin-bottom:40px}.art-h2{font-size:20px;font-weight:700;color:var(--text-primary);margin-bottom:14px;line-height:1.35}.art-p{font-size:14.5px;color:var(--text-secondary);line-height:1.72;margin-bottom:14px}.art-mini-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.art-mini-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px 18px}.art-mini-card-green{border-left:3px solid var(--success)}.art-mini-card-red{border-left:3px solid var(--danger)}.art-card-icon{font-size:18px;margin-bottom:8px}.art-mini-card-green .art-card-icon{color:var(--success)}.art-mini-card-red .art-card-icon{color:var(--danger)}.art-card-title{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:6px}.art-card-text{font-size:13px;color:var(--text-secondary);line-height:1.6}.art-tip-box{border-left:3px solid var(--primary);background:var(--primary-light);padding:14px 16px;border-radius:0 var(--radius-md) var(--radius-md) 0;margin-top:16px}.art-tip-label{font-size:11px;font-weight:700;color:var(--primary);text-transform:uppercase;letter-spacing:.07em;margin-bottom:6px}.art-table-wrap{overflow-x:auto;border-radius:var(--radius-lg);margin:16px 0;border:1px solid var(--border)}.art-table{width:100%;border-collapse:collapse;font-size:14px}.art-table thead tr{background:#0a2463;color:#fff}.art-table th{padding:12px 16px;text-align:left;font-weight:600;font-size:13px}.art-table td{padding:11px 16px;border-bottom:1px solid var(--border);color:var(--text-primary)}.art-table tbody tr{background:var(--bg-page)}.art-table tbody tr:last-child td{border-bottom:none}.art-table tbody tr:hover{background:#eef2ff}[data-theme=dark] .art-table tbody tr:hover{background:var(--primary-light)}.art-steps{display:flex;flex-direction:column;gap:12px;margin-top:16px}.art-step{display:flex;gap:14px;align-items:flex-start;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px 18px}.art-step-num{width:32px;height:32px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}.art-step-body{font-size:14px;color:var(--text-secondary);line-height:1.65;padding-top:5px}.art-divider{border:none;border-top:1px solid var(--border);margin:36px 0}.art-cta{background:var(--primary);border-radius:var(--radius-xl);padding:36px 28px;text-align:center;margin-bottom:24px}.art-cta-title{font-size:20px;font-weight:700;color:#fff;margin-bottom:8px}.art-cta-sub{font-size:14px;color:#ffffffd9;margin-bottom:20px}.art-cta-btn{display:inline-block;padding:12px 30px;background:#fff;color:var(--primary);border-radius:var(--radius-pill);font-size:15px;font-weight:600;text-decoration:none;transition:opacity .2s}.art-cta-btn:hover{opacity:.88}.art-conclusion{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px 24px}.art-conclusion-title{font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:12px}.art-urdu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:16px}.art-urdu-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px 12px;text-align:center}.art-urdu-name{font-size:18px;color:var(--text-primary);line-height:1.5;margin-bottom:6px;direction:rtl}.art-urdu-meaning{font-size:12px;color:var(--text-hint)}.art-font-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:16px}.art-colour-list{display:flex;flex-direction:column;gap:10px;margin-top:16px}.art-psych-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:16px}.art-swatch-list{display:flex;flex-direction:column;gap:10px;margin-top:16px}.art-swatch-card{display:flex;align-items:center;gap:20px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px 20px}.art-swatch-name{font-size:22px;min-width:56px;flex-shrink:0}.art-swatch-meta{flex:1}.art-swatch-hex{font-family:monospace;font-size:12px;background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:2px 8px;color:var(--text-secondary);display:inline-block;margin-bottom:4px}.art-swatch-label{font-size:13px;color:var(--text-primary);font-weight:500;margin-bottom:2px}.art-swatch-rec{font-size:12px;color:var(--text-hint)}@media (max-width: 768px){.art-font-grid,.art-psych-grid{grid-template-columns:1fr}.art-swatch-card{flex-direction:column;align-items:flex-start;gap:10px}}.art-policy-box{border-left:3px solid #10B981;background:#d1fae5;padding:16px 18px;border-radius:0 var(--radius-md) var(--radius-md) 0}.art-policy-title{font-size:14px;font-weight:700;color:#065f46;margin-bottom:10px}[data-theme=dark] .art-policy-box{background:#052e16;border-left-color:#10b981}[data-theme=dark] .art-policy-title{color:#6ee7b7}.art-wa-names{display:flex;flex-direction:column;gap:6px;margin-top:8px}.art-wa-name-item{font-size:14px;color:var(--text-secondary);padding:6px 0;border-bottom:1px solid var(--border)}.art-wa-name-item:last-child{border-bottom:none;padding-bottom:0}.art-about-card{display:flex;align-items:center;justify-content:space-between;gap:12px}.art-about-text{font-size:15px;color:var(--text-primary);flex:1}.art-about-badge{font-size:11px;font-weight:600;color:var(--primary);background:var(--primary-light);padding:3px 10px;border-radius:var(--radius-pill);white-space:nowrap;flex-shrink:0}.art-couple-grid{display:flex;flex-direction:column;gap:10px;margin-top:16px}.art-couple-card{display:flex;align-items:center;justify-content:center;gap:16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px 20px}.art-couple-name{font-size:16px;color:var(--text-primary)}.art-couple-sep{font-size:18px;color:var(--text-hint);font-weight:300}@media (max-width: 768px){.art-content{padding:20px 16px 48px}.art-h1{font-size:21px}.art-mini-cards,.art-urdu-grid{grid-template-columns:1fr}.art-couple-card{flex-direction:column;gap:8px}.art-couple-sep{transform:rotate(90deg)}}