:root{--blue:#1769e0;--blue2:#0f5bd7;--navy:#102747;--text:#162033;--muted:#64748b;--border:#dfe6ef;--bg:#f5f8fc;--card:#fff;--soft:#eef5ff;--success:#087f4f;--danger:#c63636;--shadow:0 18px 50px rgba(16,37,63,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);line-height:1.55}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{appearance:none}
header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid #edf1f6}.nav{max-width:1120px;margin:auto;padding:16px 22px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-weight:850;font-size:23px;letter-spacing:-.5px;color:var(--navy)}.brand span{color:var(--blue)}nav{display:flex;gap:18px;flex-wrap:wrap;font-size:14px;color:#536173}nav a:hover{color:var(--blue)}
main{max-width:1120px;margin:0 auto;padding:48px 22px 64px}.hero{text-align:center;max-width:800px;margin:0 auto 26px}.pill{display:inline-flex;padding:7px 12px;border-radius:999px;background:#eaf2ff;color:#1b5fc9;font-weight:700;font-size:13px}.hero h1{margin:16px 0 10px;font-size:clamp(34px,5vw,52px);line-height:1.07;letter-spacing:-1.6px;color:var(--navy)}.hero p{margin:0;color:var(--muted);font-size:17px}
.quick-tools{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:26px 0}.quick-tools a{background:#fff;border:1px solid var(--border);border-radius:14px;padding:13px 12px;display:flex;flex-direction:column;gap:2px;transition:.18s ease;box-shadow:0 2px 8px rgba(16,37,63,.03)}.quick-tools a:hover{transform:translateY(-2px);border-color:#a8c9ff;box-shadow:0 10px 20px rgba(24,105,224,.08)}.quick-tools a.active-tool{border-color:#9fc4ff;background:#f7fbff;box-shadow:0 0 0 2px #eaf2ff}.quick-tools strong{font-size:14px;color:var(--navy)}.quick-tools span{font-size:12px;color:var(--muted)}
.ad{height:76px;border:1px dashed #b8c8dd;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#9aa9bb;font-size:11px;letter-spacing:.6px;margin:18px 0 26px;background:#fff}.tool{background:var(--card);border:1px solid var(--border);border-radius:24px;padding:28px;box-shadow:var(--shadow)}
.drop{border:2px dashed #abc4e4;border-radius:20px;background:#f8fbff;min-height:245px;padding:20px;position:relative;overflow:hidden;transition:.18s ease}.drop:hover,.drop.dragging{border-color:#79a9ea;background:#f4f9ff}.drop.dragging{box-shadow:0 0 0 4px #eaf2ff}.drop input{display:none}.drop-empty{min-height:201px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px}.drop-empty .icon{width:52px;height:52px;border-radius:16px;background:#eaf2ff;color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:27px;font-weight:800}.drop-empty strong{font-size:21px;color:var(--navy)}.drop-empty small{max-width:560px;color:var(--muted);font-size:14px}.choose-btn,.change-btn{border:0;border-radius:11px;background:linear-gradient(180deg,var(--blue),var(--blue2));color:#fff;padding:11px 17px;font-weight:850;cursor:pointer;box-shadow:0 7px 16px rgba(23,105,224,.18);margin-top:4px}.choose-btn:hover,.change-btn:hover{transform:translateY(-1px)}.drop-hint{font-size:12px;color:#7a8798}
.drop.selected{padding:16px}.drop-selected{min-height:211px;display:none;align-items:center;gap:20px;text-align:left}.drop.selected .drop-empty{display:none}.drop.selected .drop-selected{display:flex}.selected-preview{width:150px;height:150px;object-fit:contain;border-radius:16px;border:1px solid var(--border);background:#fff;flex:0 0 150px}.selected-info{min-width:0;display:flex;flex-direction:column;gap:5px}.selected-info h3{margin:0;color:var(--navy);font-size:19px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.selected-info p{margin:0;color:var(--muted);font-size:14px}.selected-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:9px}.change-btn.secondary{background:#eef2f7;color:#334155;box-shadow:none}.change-btn.secondary:hover{background:#e7edf4}.selection-badge{display:inline-flex;width:max-content;padding:5px 9px;border-radius:999px;background:#ecfbf3;color:var(--success);font-weight:800;font-size:12px;margin-bottom:2px}
.panel{margin-top:18px;padding-top:4px}.tabs{display:flex;gap:8px;margin-bottom:20px}.tab{border:1px solid var(--border);background:#fff;color:var(--navy);padding:11px 15px;border-radius:12px;font-weight:700;cursor:pointer}.tab.active{background:#eaf2ff;color:var(--blue);border-color:#9ec3ff}.grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.field>label,.field>span,.field label{display:block;font-size:14px;font-weight:800;color:var(--navy);margin-bottom:8px}.field input,.field select{width:100%;height:52px;border:1px solid #cbd7e6;border-radius:12px;background:#fff;padding:0 15px;color:var(--text);outline:none}.field input:focus,.field select:focus{border-color:#75a9ef;box-shadow:0 0 0 4px #eaf2ff}.check{display:flex;align-items:center;gap:10px;margin-top:15px;color:#536173;font-size:14px}.check input{width:18px;height:18px}.presets{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.preset{border:1px solid var(--border);background:#fff;padding:9px 13px;border-radius:10px;font-weight:800;color:var(--navy);cursor:pointer}.preset:hover,.preset.active{border-color:#8bb7f5;background:#eef5ff;color:var(--blue)}.tool-note,.hint{font-size:13px;color:var(--muted);margin:12px 0 0}.fixed-target{padding:14px 16px;border-radius:14px;background:#f4f8ff;border:1px solid #d9e7fa;display:flex;flex-direction:column;gap:2px}.fixed-target b{color:var(--navy);font-size:16px}.fixed-target span{font-size:13px;color:var(--muted)}.tool-badge{height:52px;border:1px solid #cbd7e6;border-radius:12px;background:#f8fafc;display:flex;align-items:center;padding:0 15px;font-weight:700;color:#536173}.actions{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}.btn{border:0;border-radius:12px;padding:13px 18px;font-weight:850;cursor:pointer}.btn.primary{background:linear-gradient(180deg,var(--blue),var(--blue2));color:#fff;box-shadow:0 8px 18px rgba(23,105,224,.22)}.btn.primary:hover{transform:translateY(-1px)}.btn.primary:disabled{opacity:.55;cursor:not-allowed;transform:none}.btn.secondary{background:#edf2f7;color:#334155}.status{margin-top:14px;min-height:44px;border-radius:12px;padding:12px 14px;font-size:14px;display:none}.status.show{display:block}.status.success{background:#ecfbf3;color:var(--success)}.status.error{background:#fff1f1;color:var(--danger)}.files{margin-top:16px;display:flex;flex-direction:column;gap:8px}.file-row{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:14px 15px;border-top:1px solid #edf1f5}.file-info{min-width:0}.file-name{font-weight:800;color:var(--navy);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-meta{font-size:13px;color:var(--muted)}.file-ready{font-size:13px;font-weight:800;color:var(--success)}
.section{margin-top:40px}.section h2{font-size:28px;letter-spacing:-.6px;color:var(--navy);margin:0 0 10px}.section p{color:var(--muted)}.links{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.links a{background:#fff;border:1px solid var(--border);border-radius:14px;padding:13px 12px;display:flex;flex-direction:column;gap:2px}.links strong{font-size:14px;color:var(--navy)}.links span{font-size:12px;color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.mini,.faq{background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px}.mini{display:flex;flex-direction:column;gap:7px}.mini b,.faq b{color:var(--navy)}.mini span,.faq span{font-size:14px;color:var(--muted)}footer{text-align:center;padding:28px 22px 40px;color:#78879a;font-size:13px}footer a{color:#52647a}footer a:hover{color:var(--blue)}
@media (max-width:900px){.quick-tools{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){.nav{padding:13px 16px}.nav nav{display:none}main{padding:30px 14px 50px}.hero h1{font-size:36px}.hero p{font-size:15px}.quick-tools{grid-template-columns:repeat(2,1fr)}.tool{padding:16px;border-radius:18px}.drop{padding:14px}.drop-selected{min-height:220px;flex-direction:column;justify-content:center;text-align:center;gap:12px}.selected-preview{width:118px;height:118px;flex-basis:118px}.selected-info{align-items:center;width:100%}.selected-info h3{max-width:76vw}.selected-actions{justify-content:center}.grid,.links,.cards{grid-template-columns:1fr}.actions .btn{width:100%}.ad{height:64px}.section{margin-top:30px}}

.section-lead{margin:0 0 14px}
.faq-list{display:flex;flex-direction:column;gap:8px}
.faq-item{background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden}
.faq-item summary{list-style:none;cursor:pointer;padding:18px 20px;color:var(--navy);font-weight:800;position:relative;padding-right:52px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:19px;top:50%;transform:translateY(-50%);width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#eef5ff;color:var(--blue);font-size:18px;font-weight:700}
.faq-item[open] summary::after{content:"−"}
.faq-item summary:hover{background:#fbfdff}
.faq-answer{padding:0 20px 18px;color:var(--muted);font-size:14px;line-height:1.6}

.brand{display:inline-block;text-decoration:none;color:inherit;cursor:pointer}
.brand:hover{text-decoration:none;color:inherit}