:root{interpolate-size:allow-keywords;--primary-color: #1d4ed8;--success-color: #10b981;--error-color: #ef4444;--warning-color: #f59e0b}*{box-sizing:border-box}body{font-family:system-ui,-apple-system,sans-serif;margin:0;padding:0;background:#f5f5f5;min-height:100vh}.app-header{background:linear-gradient(#237ACB env(safe-area-inset-top),#0A55AC calc(100% - 15px));color:#fff;width:100%;padding:env(safe-area-inset-top) 20px 15px 20px;box-shadow:0 4px 12px #1d4ed826}.app-header.web-padding{padding-top:calc(env(safe-area-inset-top) + 20px)}.header-content{max-width:600px;margin:0 auto;display:flex;align-items:center;gap:16px}.app-icon{width:40px;height:40px}.header-text h1{margin:0;font-size:1.5rem;font-weight:700;color:#fff;text-align:left}.header-text p{margin:4px 0 0;font-size:.875rem;color:#ffffffe6;text-align:left}@media (max-width: 768px){.header-text h1{font-size:1.25rem}.header-text p{font-size:.8rem}}.main-container{max-width:600px;width:100%;padding:20px;margin:0 auto}.container{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 6px -1px #0000001a;border:1px solid #e5e7eb}h1{text-align:center;color:#1f2937;margin-bottom:30px;font-size:2rem;font-weight:700}.input-group{margin-bottom:20px}label{display:block;margin-bottom:8px;font-weight:600;color:#374151}input[type=url]{width:100%;padding:12px 16px;border:2px solid #d1d5db;border-radius:8px;font-size:16px;transition:border-color .2s}input[type=url]:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #3b82f61a}.supported-services{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}.service-label{font-size:.8rem;color:#6b7280;font-weight:500}.service-badge{font-size:.75rem;font-weight:600;padding:4px 10px;border-radius:12px;color:#fff}.service-badge.youtube{background:red}.service-badge.instagram{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888)}.service-badge.bluesky{background:#0085ff}.button-group{display:flex;gap:12px;margin-top:20px}button{flex:1;padding:12px 24px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px}.btn-primary{background-color:var(--primary-color);color:#fff}.btn-primary:hover:not(:disabled){background-color:#1e40af;transform:translateY(-1px);box-shadow:0 4px 8px #3b82f64d}.btn-secondary{background-color:#6b7280;color:#fff}.btn-secondary:hover{background-color:#4b5563}button:disabled{opacity:.6;cursor:not-allowed;transform:none!important;box-shadow:none!important}.status{padding:16px;border-radius:8px;margin:20px 0;font-weight:500}.status.loading{background-color:#dbeafe;color:#1e40af;border:1px solid #93c5fd}.status.success{background-color:#d1fae5;color:#065f46;border:1px solid #6ee7b7}.status.error{background-color:#fee2e2;color:#991b1b;border:1px solid #fca5a5}.media-info{margin-top:20px;padding:20px;background:#f9fafb;border-radius:8px;border:1px solid #e5e7eb}.media-info h3{margin:0 0 16px;color:#1f2937;font-size:1.2rem}.media-preview{margin:16px 0;text-align:center}.media-preview img,.media-preview video{max-width:100%;max-height:300px;border-radius:8px;box-shadow:0 2px 8px #0000001a}.download-link{background-color:var(--success-color);color:#fff;width:100%;margin-top:16px}.download-link:hover{background-color:#059669}.hidden{display:none}@media (max-width: 768px){body{padding:0}.main-container{margin-top:0;padding:20px}.button-group{flex-direction:column}}