.utm-page{max-width:900px;margin:0 auto;padding:40px 20px 80px}.utm-header{text-align:center;margin-bottom:40px}.utm-header h1{color:var(--color-text-primary);margin-bottom:12px;font-size:2.5rem;font-weight:800}.utm-header p{color:var(--color-text-secondary);font-size:1.1rem}.utm-tool-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:32px;box-shadow:0 4px 6px -1px #0000000d}.utm-field-group{margin-bottom:24px}.utm-label{color:#334155;margin-bottom:8px;font-size:.95rem;font-weight:600;display:block}.utm-label span{color:#ef4444;margin-left:2px}.utm-input{color:#0f172a;border:1px solid #cbd5e1;border-radius:8px;width:100%;padding:12px 16px;font-size:1rem;transition:all .2s}.utm-input:focus{border-color:#1f8df4;outline:none;box-shadow:0 0 0 3px #1f8df41a}.utm-helper{color:#94a3b8;margin-top:6px;font-size:.85rem;display:block}.presets-container{border-bottom:1px solid #e2e8f0;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:24px;padding-bottom:24px;display:grid}.preset-radio-input{display:none}.preset-card{cursor:pointer;color:#64748b;background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;justify-content:center;align-items:center;padding:10px 16px;font-size:.9rem;font-weight:500;transition:all .2s;display:flex}.preset-card:hover{color:#1f8df4;border-color:#1f8df4}.preset-radio-input:checked+.preset-card{color:#1f8df4;background-color:#eff6ff;border-color:#1f8df4;font-weight:600;box-shadow:0 2px 4px #1f8df41a}.utm-result-box{background-color:#f1f5f9;border:1px solid #cbd5e1;border-radius:12px;margin-top:32px;padding:20px}.result-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.result-label{color:#334155;font-weight:700}.result-textarea{resize:vertical;color:#0f172a;word-break:break-all;background-color:#fff;border:1px solid #e2e8f0;border-radius:8px;width:100%;min-height:80px;padding:12px;font-family:monospace;font-size:.95rem}.copy-btn-large{color:#fff;cursor:pointer;background-color:#28a745;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-weight:600;transition:all .2s;display:flex}.copy-btn-large:hover{background-color:#218838}.copy-btn-large.copied{background-color:#1e293b}.utm-article-placeholder{color:#94a3b8;text-align:center;border:2px dashed #e2e8f0;border-radius:16px;margin-top:60px;padding:40px}.input-wrapper{width:100%;position:relative}.dynamic-param-btn{cursor:pointer;color:#94a3b8;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.dynamic-param-btn:hover{color:#1f8df4;background-color:#f1f5f9}.dynamic-param-btn.active{color:#1f8df4;background-color:#eff6ff}.params-dropdown{z-index:50;background:#fff;border:1px solid #e2e8f0;border-radius:8px;width:240px;max-height:280px;margin-top:4px;padding:4px;position:absolute;top:100%;right:0;overflow-y:auto;box-shadow:0 10px 15px -3px #0000001a}.param-item{text-align:left;color:#334155;cursor:pointer;background:0 0;border:none;border-radius:4px;width:100%;padding:8px 12px;font-family:monospace;font-size:.9rem;transition:background .1s;display:block}.param-item:hover{color:#1f8df4;background-color:#f8fafc}.utm-input.has-dynamic-btn{padding-right:40px}.utm-article-content{color:#334155;max-width:800px;margin:60px auto 0;font-size:1.1rem;line-height:1.7}.utm-article-content h1{color:#0f172a;margin-top:0;margin-bottom:24px;font-size:2.2rem;font-weight:800}.utm-article-content h2{color:#0f172a;margin-top:48px;margin-bottom:20px;font-size:1.75rem;font-weight:700}.utm-article-content h3{color:#1e293b;margin-top:32px;margin-bottom:16px;font-size:1.4rem;font-weight:600}.utm-article-content h4{color:#334155;margin-top:24px;margin-bottom:12px;font-size:1.15rem;font-weight:600}.utm-article-content p{margin-bottom:20px}.utm-article-content ul{margin-bottom:24px;padding-left:24px}.utm-article-content li{margin-bottom:10px}.utm-article-content code{color:#1f8df4;background-color:#f1f5f9;border-radius:4px;padding:2px 6px;font-family:monospace;font-size:.9em;font-weight:600}.seo-divider{border:0;border-top:1px solid #e2e8f0;margin:40px 0}.cta-button{color:#fff;background-color:#1f8df4;border-radius:12px;padding:14px 28px;font-weight:700;text-decoration:none;transition:all .2s;display:inline-block;box-shadow:0 4px 12px #1f8df44d}.cta-button:hover{background-color:#1a7ecf;transform:translateY(-2px);box-shadow:0 6px 16px #1f8df466}