*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0a0f14;--surface: #111a22;--surface-2: #162029;--border: #243040;--text: #e8eef4;--muted: #8b9cb0;--primary: #0d9488;--primary-hover: #14b8a6;--accent: #fbbf24;--radius: 12px;--font: "DM Sans", system-ui, sans-serif;--mono: "JetBrains Mono", monospace}body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh}.app{position:relative;min-height:100vh;max-width:1200px;margin:0 auto;padding:2rem 1.25rem 3rem}.bg-gradient{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(13,148,136,.25),transparent),radial-gradient(ellipse 60% 40% at 100% 50%,rgba(41,128,185,.12),transparent);pointer-events:none;z-index:0}.hero,.main,.footer{position:relative;z-index:1}.top-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem;padding:.75rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-wrap:wrap}.top-bar-logo{font-size:.85rem;font-weight:600;color:var(--muted)}.btn-video-gen{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font);font-size:.9rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#7c3aed,#db2777);border:none;border-radius:8px;padding:.55rem 1.1rem;cursor:pointer;transition:transform .15s,box-shadow .15s}.btn-video-gen:hover{transform:translateY(-1px);box-shadow:0 6px 20px #7c3aed66}.btn-video-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:#fff3;border-radius:50%;font-size:.65rem}.video-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:flex-start;justify-content:center;padding:1rem;overflow-y:auto}.video-modal-wide{max-width:640px}.video-modal{width:100%;max-width:720px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin:auto;max-height:calc(100vh - 2rem);display:flex;flex-direction:column}.video-modal-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;padding:1.25rem 1.5rem;border-bottom:1px solid var(--border);flex-shrink:0}.video-modal-header h2{font-size:1.2rem;margin:.35rem 0 .25rem}.video-modal-header p{font-size:.85rem;color:var(--muted)}.video-modal-badge{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#c4b5fd;background:#7c3aed33;padding:.2rem .5rem;border-radius:4px}.video-modal-close{font-size:1.25rem;line-height:1;background:var(--surface-2);border:1px solid var(--border);color:var(--muted);width:36px;height:36px;border-radius:8px;cursor:pointer;flex-shrink:0}.video-modal-close:hover{color:var(--text);border-color:var(--muted)}.video-modal-body{padding:1.25rem 1.5rem 1.5rem;overflow-y:auto}.video-form .field select{font-family:var(--font);font-size:1rem;width:100%;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:.75rem 1rem}.video-product-preview{font-size:.9rem;color:var(--muted);margin-bottom:1rem;padding:.65rem;background:var(--surface-2);border-radius:6px}.video-results{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border)}.video-results-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.video-results-toolbar h3{font-size:1rem}.video-meta-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}.video-meta-chip{font-size:.7rem;padding:.25rem .5rem;background:#7c3aed26;border:1px solid rgba(124,58,237,.35);border-radius:4px;color:#c4b5fd}.video-block{margin-bottom:1.25rem}.video-script-text{font-size:.9rem;line-height:1.6;white-space:pre-wrap}.video-hashtags{font-size:.8rem;color:var(--primary-hover);margin-top:.5rem}.scene-list{display:flex;flex-direction:column;gap:.65rem}.scene-card{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:.75rem 1rem;font-size:.85rem}.scene-card p{margin:.35rem 0;color:var(--muted)}.scene-card strong{color:var(--text)}.scene-time{font-family:var(--mono);font-size:.75rem;color:#c4b5fd;margin-bottom:.35rem}.scene-tag{display:inline-block;font-size:.65rem;margin-top:.35rem;padding:.15rem .4rem;background:var(--surface);border-radius:4px;color:var(--muted)}.video-tips{font-size:.85rem;color:var(--muted);padding-left:1.2rem}.video-tips li{margin-bottom:.35rem}.video-external h4{font-size:.9rem;margin-bottom:.35rem}.external-links{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.external-links a{font-size:.8rem;padding:.4rem .75rem;background:var(--surface-2);border:1px solid var(--border);border-radius:6px;color:var(--primary-hover);text-decoration:none}.external-links a:hover{border-color:#7c3aed;color:#c4b5fd}.gemini-video-form .btn-inline{margin-top:.35rem;font-size:.8rem}.btn-gemini{background:linear-gradient(135deg,#0d9488,#059669)!important}.free-badge{color:#6ee7b7!important;background:#10b98133!important}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:500px){.field-row{grid-template-columns:1fr}}.status-msg{font-size:.9rem;color:#93c5fd;padding:.5rem .75rem;background:#4285f41a;border-radius:6px;border:1px solid rgba(66,133,244,.25)}.image-dropzone{border:2px dashed var(--border);border-radius:10px;padding:1.5rem;text-align:center;cursor:pointer;transition:border-color .2s,background .2s;min-height:180px;display:flex;align-items:center;justify-content:center}.image-dropzone:hover,.image-dropzone.has-image{border-color:#7c3aed;background:#7c3aed0f}.dropzone-placeholder .dropzone-icon{font-size:2rem;display:block;margin-bottom:.5rem}.image-preview-wrap{position:relative;width:100%}.image-preview-wrap img{max-width:100%;max-height:220px;object-fit:contain;border-radius:8px}.btn-clear-image{margin-top:.75rem;font-family:var(--font);font-size:.8rem;padding:.35rem .75rem;background:var(--surface);border:1px solid var(--border);border-radius:6px;color:var(--muted);cursor:pointer}.btn-clear-image:hover{color:#f87171;border-color:#f87171}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.video-output-section{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border)}.generated-video-player{width:100%;max-height:400px;border-radius:10px;background:#000;margin-top:.75rem}.btn-download-video{font-size:.85rem;font-weight:600;padding:.4rem .9rem;background:var(--primary);color:#fff;border-radius:6px;text-decoration:none}.btn-download-video:hover{background:var(--primary-hover)}.video-tips-box{margin-top:1.5rem;padding:1rem;background:var(--surface-2);border-radius:8px;border:1px solid var(--border)}.video-tips-box h4{font-size:.9rem;margin-bottom:.5rem;color:#93c5fd}.field input[type=password]{font-family:var(--font);font-size:1rem;width:100%;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:.75rem 1rem}.field a{color:var(--primary-hover)}.hero{text-align:center;margin-bottom:2.5rem}.badge{display:inline-block;font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--primary-hover);background:#0d948826;border:1px solid rgba(13,148,136,.35);padding:.35rem .85rem;border-radius:999px;margin-bottom:1rem}.hero h1{font-size:clamp(1.75rem,5vw,2.5rem);font-weight:700;letter-spacing:-.02em;margin-bottom:.75rem}.hero-sub{color:var(--muted);max-width:560px;margin:0 auto;font-size:1.05rem}.input-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;margin-bottom:2rem}.form-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.75rem;margin-bottom:1.25rem}.form-header h2{font-size:1.15rem}.form-actions{display:flex;gap:.5rem}.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}.field span{font-size:.875rem;font-weight:500;color:var(--muted)}.field input,.field textarea{font-family:var(--font);font-size:1rem;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:.75rem 1rem;transition:border-color .2s,box-shadow .2s}.field input:focus,.field textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #0d948833}.field textarea{resize:vertical;min-height:140px}.hint{font-size:.75rem;color:var(--muted)}.error-msg{color:#f87171;font-size:.9rem;margin-bottom:.75rem}.btn-primary{width:100%;padding:.9rem 1.5rem;font-family:var(--font);font-size:1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,var(--primary),#0f766e);border:none;border-radius:8px;cursor:pointer;transition:transform .15s,box-shadow .15s}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 24px #0d948859}.btn-primary:disabled{opacity:.7;cursor:wait}.btn-ghost{font-family:var(--font);font-size:.8rem;padding:.4rem .75rem;background:transparent;border:1px solid var(--border);border-radius:6px;color:var(--muted);cursor:pointer}.btn-ghost:hover{color:var(--text);border-color:var(--muted)}.results-header{margin-bottom:1.5rem}.results-header h2{font-size:1.35rem;margin-bottom:.25rem}.results-header p{color:var(--muted);font-size:.9rem}.keywords-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;margin-bottom:1.5rem}.keywords-panel h3{font-size:.95rem;margin-bottom:.75rem;color:var(--accent)}.platform-grid{display:grid;grid-template-columns:1fr;gap:1.25rem}@media(min-width:900px){.platform-grid{grid-template-columns:repeat(3,1fr)}}.platform-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;border-top:3px solid var(--accent)}.platform-header{display:flex;align-items:center;gap:.6rem;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--border)}.platform-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;background:var(--accent);color:#111;border-radius:8px}.platform-header h3{flex:1;font-size:1rem}.output-block{margin-bottom:1rem}.block-label{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.4rem;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}.char-count{font-family:var(--mono);font-size:.65rem;color:var(--accent);font-weight:500;text-transform:none}.output-text{font-size:.875rem;color:var(--text);line-height:1.55}.title-output{font-weight:600;color:#fff}.title-kw-row{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;margin-bottom:.5rem}.title-kw-label{font-size:.65rem;color:var(--accent);font-weight:600;width:100%}.keyword-tag.title-kw{background:#0d948826;border-color:#0d948873;color:#5eead4;font-weight:600}.keyword-tag.desc-kw{background:#a78bfa1f;border-color:#a78bfa59;color:#c4b5fd}.description-output{white-space:pre-wrap;max-height:320px;overflow-y:auto;font-size:.82rem;line-height:1.65;padding:.65rem;background:var(--surface-2);border-radius:6px;border:1px solid var(--border)}.char-count.ok-len{color:#34d399}.bullet-list{list-style:none;font-size:.8rem}.bullet-list li{padding:.35rem 0;border-bottom:1px solid rgba(36,48,64,.5);color:var(--muted)}.bullet-list li:last-child{border-bottom:none}.keyword-tags{display:flex;flex-wrap:wrap;gap:.35rem}.keyword-tag{font-size:.7rem;padding:.25rem .5rem;background:var(--surface-2);border:1px solid var(--border);border-radius:4px;color:var(--muted)}.keyword-tag.global{background:#fbbf2414;border-color:#fbbf2440;color:#fcd34d}.global-keywords{max-height:160px;overflow-y:auto}.copy-btn{font-family:var(--font);font-size:.65rem;padding:.2rem .5rem;margin-left:auto;background:var(--surface-2);border:1px solid var(--border);border-radius:4px;color:var(--muted);cursor:pointer}.copy-btn:hover{color:var(--text);border-color:var(--primary)}.copy-btn.copied{color:var(--primary-hover);border-color:var(--primary)}.footer{text-align:center;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--border)}.footer p{font-size:.8rem;color:var(--muted)}.platform-title-wrap{flex:1;display:flex;flex-direction:column;gap:.25rem}.policy-badge{font-size:.65rem;font-weight:600;padding:.15rem .45rem;border-radius:4px;width:fit-content}.policy-badge.ok{color:#34d399;background:#34d3991f;border:1px solid rgba(52,211,153,.3)}.policy-badge.warn{color:#fbbf24;background:#fbbf241f;border:1px solid rgba(251,191,36,.3)}.policy-rules{font-size:.75rem;color:var(--muted);margin-bottom:.75rem}.policy-rules summary{cursor:pointer;color:var(--primary-hover)}.policy-rules ul{margin-top:.5rem;padding-left:1.1rem}.policy-rules li{margin-bottom:.25rem}.keyword-hint{font-size:.7rem;color:var(--muted);margin-bottom:.5rem;font-style:italic}.search-terms-box{font-family:var(--mono);font-size:.75rem;background:var(--surface-2);border:1px solid var(--border);border-radius:6px;padding:.65rem;line-height:1.5;word-break:break-word;color:#a7f3d0}.compliance-warnings{margin-top:.75rem;padding:.5rem;background:#f871711a;border-radius:6px;font-size:.75rem;color:#fca5a5}.google-planner .planner-group{margin-bottom:.75rem}.google-planner .planner-group h4{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:.35rem}.keyword-tag.broad{border-color:#4285f466;color:#93c5fd}.keyword-tag.phrase{border-color:#34d39966;color:#6ee7b7}.keyword-tag.exact{border-color:#fbbf2466;color:#fcd34d}.keyword-tag.longtail{border-color:#a78bfa66;color:#c4b5fd}.keyword-tag.reach{border-color:#ec489966;color:#f9a8d4}.google-reach-panel{background:linear-gradient(135deg,#4285f414,#0d948814);border:1px solid rgba(66,133,244,.25);border-radius:var(--radius);padding:1.25rem;margin-bottom:1.5rem}.reach-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}.reach-header h3{font-size:1.1rem;margin-bottom:.25rem;color:#93c5fd}.reach-header p{font-size:.85rem;color:var(--muted)}.reach-grid{display:grid;grid-template-columns:1fr;gap:1rem}@media(min-width:700px){.reach-grid{grid-template-columns:1fr 1fr}}.reach-card{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1rem}.reach-card h4{font-size:.9rem;margin-bottom:.2rem}.reach-desc{font-size:.75rem;color:var(--muted);margin-bottom:.6rem}
