body #viral-remix { padding:36px 40px!important; background:transparent!important; border:0!important; }
#viral-remix .v3-meta { display:flex!important; margin-bottom:24px; color:#638675; }
#viral-remix .skill-shell { display:grid!important; grid-template-columns:minmax(340px,420px) minmax(0,1fr)!important; gap:24px!important; align-items:start; }
#viral-remix .skill-form-col,#viral-remix .skill-output-col { padding:30px!important; border:1px solid #ffffff!important; border-radius:24px!important; background:linear-gradient(135deg,#ffffffed,#eff9f2cc)!important; box-shadow:0 14px 40px #29543d09!important; min-width:0; }
#viral-remix h1 { font-family:inherit!important; font-size:30px!important; line-height:1.35; color:#244b39; margin:16px 0; }
#viral-remix p { font-size:14px; line-height:1.8; color:#678373; }
#viral-remix .skill-form { padding:0!important; margin-top:24px; border:0!important; background:transparent!important; box-shadow:none!important; }
#viral-remix .form-section { border:0; padding:0; }
#viral-remix .head { margin-bottom:18px; }
#viral-remix .viral-upload { display:flex!important; position:relative; flex-direction:column!important; justify-content:center; align-items:center; gap:10px; min-height:200px; padding:24px; border:1.5px dashed #9ac8ae; border-radius:18px; background:#eaf6ee88; color:#285b42; text-align:center; box-sizing:border-box; }
#viral-remix .viral-upload strong { font-size:16px; } #viral-remix .viral-upload small { font-size:12px; color:#789284; }
#viral-remix .viral-upload-icon { display:grid; place-items:center; width:46px;height:46px; border:1px solid #b2d7c0; border-radius:14px; font-size:28px; background:#fff; color:#287c55; }
#viral-remix .field-wide { display:flex; flex-direction:column; gap:10px; margin-top:24px; font-size:13px; color:#476e59; }
#viral-remix textarea { padding:14px; min-height:100px; border:1px solid #cce0d2!important; border-radius:12px!important; background:#ffffffbb!important; font-size:14px!important; line-height:1.6; }
#viral-remix .skill-primary { margin-top:24px; width:100%; min-height:48px; border-radius:12px!important; background:linear-gradient(110deg,#24875e,#125333)!important; color:white; font-size:15px!important; }
#viral-remix .viral-empty { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:22px; min-height:500px; padding:20px!important; text-align:left!important; background:transparent!important; }
#viral-remix .viral-empty h2 { font-size:28px!important; line-height:1.5; color:#244b39; margin:0; }
#viral-remix .tie-steps { display:grid!important; grid-template-columns:repeat(2,1fr); list-style:none; padding:0; gap:14px; width:100%; margin:12px 0; }
#viral-remix .tie-steps li { display:flex; align-items:center; gap:12px; padding:18px; border:1px solid #d9e9de; border-radius:14px; background:#ffffff99; font-size:14px; color:#527460; }
#viral-remix .tie-steps b { color:#2c8a5d; font-size:13px; }
#viral-remix .tag { font-size:12px; color:#518268; letter-spacing:.04em; }
#viral-remix .viral-preview[hidden],#viral-remix .viral-result[hidden],#viral-remix .viral-empty[hidden] { display:none!important; }
#viral-remix .viral-ideas { grid-template-columns:1fr; } #viral-remix .viral-idea { border:1px solid #d6e7dc; background:#ffffffb3; }
.viral-file{display:flex;align-items:center;gap:10px;padding:8px;min-width:0}.viral-file img{width:50px;height:65px;object-fit:cover}.viral-file span{overflow:hidden;text-overflow:ellipsis;font-size:12px}.viral-file button{margin-left:auto}.viral-delivery{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;padding:20px;background:#eef7f0;border-radius:14px}#viral-remix-preview{display:flex;flex-direction:column;align-items:stretch}#viral-remix-result select{display:block;width:100%;padding:12px;margin:8px 0 16px;border:1px solid #cce0d2;border-radius:10px;background:white}
@media(max-width:1100px){body #viral-remix{padding:24px!important}#viral-remix .skill-shell{grid-template-columns:1fr!important}#viral-remix .viral-empty{min-height:300px}}
#viral-remix #viral-remix-preview{display:flex!important;flex-direction:column!important;width:100%;box-sizing:border-box}#viral-remix .viral-file{display:grid!important;grid-template-columns:50px minmax(0,1fr) 48px;gap:10px;width:100%;box-sizing:border-box}#viral-remix .viral-file span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}#viral-remix .viral-file button{padding:6px;border:1px solid #cce0d2;border-radius:6px;background:white;color:#37684b}#viral-remix #viral-remix-preview[hidden]{display:none!important}
#viral-remix .remix-panel[hidden]{display:none!important}
#viral-remix .skill-output-col{padding:24px!important;max-height:none!important}
#viral-remix .remix-result-tabs{display:flex;gap:6px;padding:6px;background:#e8f2eb;border:1px solid #d5e5da;border-radius:14px;margin-bottom:24px}
#viral-remix .remix-result-tabs button{flex:1;padding:13px 8px;border:0;border-radius:10px;color:#597461;background:transparent;font-size:14px;font-weight:600;cursor:pointer}
#viral-remix .remix-result-tabs button[aria-selected=true]{background:white;color:#176641;box-shadow:0 2px 8px #23472e0a}
#viral-remix .viral-result-card{padding:24px;border:0;background:transparent;box-shadow:none}
#viral-remix .viral-result-card h2{font-family:inherit!important;font-size:24px!important;line-height:1.55;max-width:36em;margin:14px 0 22px;color:#244b39}
#viral-remix .viral-analysis{border:0;background:transparent;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
#viral-remix .viral-analysis>div{border:1px solid #dbe9df;border-radius:12px;padding:18px;background:#ffffffa6;gap:10px}
#viral-remix .viral-analysis span{font-size:14px;line-height:1.8;color:#425c4c;max-width:42em}
#viral-remix .viral-analysis b{font-size:12px;color:#28774d}
#viral-remix .remix-page-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}
#viral-remix .remix-page-list article{padding:18px;border:1px solid #dbe9df;border-radius:12px;background:#ffffffb3}
#viral-remix .remix-page-list h4{font-size:16px;margin:10px 0}
#viral-remix .remix-page-list p{margin:8px 0;line-height:1.75}
#viral-remix .viral-ideas{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px;margin:0}
#viral-remix .remix-choices{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px;padding:20px;border:1px solid #dbe9df;border-radius:14px;background:#ffffff8c}
#viral-remix .remix-choices h3,#viral-remix .remix-choices>p{grid-column:1/-1;margin:0 0 14px}
#viral-remix .viral-idea{display:flex;flex-direction:column;padding:22px;min-width:0;border-radius:16px}
#viral-remix .viral-idea>p{min-height:0;font-size:14px;line-height:1.8;color:#425c4c}
#viral-remix .viral-idea dl{flex:1;gap:18px;margin:18px 0 24px}
#viral-remix .viral-idea dd{font-size:13px;line-height:1.8;color:#597263}
#viral-remix .viral-generate,#viral-remix .remix-next{display:inline-flex!important;justify-content:center;align-items:center;gap:9px;min-height:46px;padding:12px 16px!important;border:0!important;border-radius:10px!important;background:#21744c!important;color:white!important;font-size:14px!important;line-height:1.5;white-space:normal;cursor:pointer;box-shadow:none!important}
#viral-remix .viral-generate:disabled{background:#e0eee5!important;color:#38664c!important;cursor:wait}
#viral-remix .button-spinner{display:inline-block!important;position:static!important;width:15px!important;height:15px!important;flex:0 0 15px;border:2px solid #91b39f;border-top-color:#38664c;border-radius:50%;animation:remix-spin .9s linear infinite}
#viral-remix .remix-output-placeholder{padding:60px 24px;text-align:center;color:#678373}
#viral-remix .remix-output-wait{padding:26px 28px 24px;border:1px solid #d6e7dc;border-radius:16px;background:#f7fcf8;text-align:left}
#viral-remix .remix-wait-head{display:flex;align-items:flex-start;gap:11px}
#viral-remix .remix-wait-pulse{flex:none;width:9px;height:9px;margin-top:8px;border-radius:50%;background:#2c8a5d;box-shadow:0 0 0 0 rgba(44,138,93,.5);animation:remix-wait-pulse 1.8s ease-out infinite}
#viral-remix .remix-wait-copy{min-width:0;flex:1}
#viral-remix .remix-output-wait h3{font-size:16.5px;font-weight:600;color:#1f4433;margin:0;line-height:1.55}
#viral-remix .remix-wait-plan{margin:3px 0 0;font-size:12.5px;color:#6d8a7b}
#viral-remix .remix-wait-track{margin:16px 0 0 20px;height:6px;border-radius:999px;background:#e2efe7;overflow:hidden}
#viral-remix .remix-wait-track i{display:block;height:100%;width:10%;border-radius:999px;background:linear-gradient(90deg,#2c8a5d,#54b184);transition:width .5s ease}
#viral-remix .remix-wait-progress{margin:14px 0 0 20px;font-size:13.5px;font-weight:600;color:#1f5c40}
#viral-remix .remix-output-wait .wait-elapsed{margin:4px 0 0 20px;font-size:12.5px;color:#5d8271;font-variant-numeric:tabular-nums}
#viral-remix .remix-output-wait .remix-wait-hint{margin:10px 0 0 20px;font-size:12.5px;line-height:1.7;color:#789284}
@keyframes remix-wait-pulse{0%{box-shadow:0 0 0 0 rgba(44,138,93,.5)}70%{box-shadow:0 0 0 9px rgba(44,138,93,0)}100%{box-shadow:0 0 0 0 rgba(44,138,93,0)}}
@media(prefers-reduced-motion:reduce){#viral-remix .remix-wait-pulse{animation:none}}
#viral-remix .remix-output-pending{margin:0 0 16px;padding:14px 16px;border:1px solid #f2ddb5;border-radius:12px;background:#fdf7ea;color:#8a6420;font-size:13px}
#viral-remix .viral-delivery{max-width:100%;font-size:14px;line-height:1.8}
@keyframes remix-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#viral-remix .button-spinner{animation:none}}
@media(max-width:1400px){#viral-remix .viral-ideas{grid-template-columns:1fr!important}}
@media(max-width:700px){#viral-remix .remix-choices,#viral-remix .viral-analysis,#viral-remix .remix-page-list{grid-template-columns:1fr}}
@media(max-width:560px){#viral-remix .skill-form-col,#viral-remix .skill-output-col{padding:22px!important}#viral-remix .tie-steps{grid-template-columns:1fr}#viral-remix h1{font-size:26px!important}}

#viral-remix .remix-history-open,#viral-remix .remix-save-button{display:inline-flex!important;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:10px 15px;border:1px solid #abd4b9;border-radius:11px;background:#e8f8ee;color:#1f6e49;font-size:14px;font-weight:650;cursor:pointer}#viral-remix .remix-history-open{width:100%;margin-top:12px}#viral-remix .remix-save-button{background:#21744c;color:white;border-color:#21744c;white-space:nowrap}#viral-remix .viral-generated .remix-generated-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 16px}.remix-history-dialog,.remix-save-dialog{box-sizing:border-box;position:fixed;inset:0;margin:auto;width:min(760px,calc(100% - 28px));max-width:none;max-height:90dvh;overflow:auto;padding:24px;border:1px solid #d9eee0;border-radius:22px;background:#f6fff9;color:#244b39;box-shadow:0 20px 80px #153c3033}.remix-history-dialog::backdrop,.remix-save-dialog::backdrop{background:#153c3055;backdrop-filter:blur(3px)}.remix-history-header,.remix-save-header{display:flex;justify-content:space-between;align-items:start;gap:12px}.remix-history-header h2,.remix-save-header h2{margin:0;font-size:22px}.remix-history-header p,.remix-save-dialog p{font-size:13px;line-height:1.6;color:#678373}.remix-history-header button,.remix-save-header button{border:0;border-radius:50%;width:36px;height:36px;background:#e5f4e9;color:#286c4c;font-size:24px;cursor:pointer}.remix-history-job{padding:16px 0;border-top:1px solid #dcebe0}.remix-history-job h3{font-size:14px;margin:0 0 12px;color:#345e47}.remix-history-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px}.remix-history-card{min-width:0}.remix-history-card img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:12px;background:#e5f1e8}.remix-history-card button,.remix-save-dialog #remix-save-action,.remix-history-dialog #remix-history-more{width:100%;margin-top:8px;min-height:42px;border:0;border-radius:10px;background:#21744c;color:white;font-size:14px;font-weight:600;cursor:pointer}.remix-save-dialog{width:min(500px,calc(100% - 28px));text-align:center}.remix-save-dialog img{display:block;max-width:100%;max-height:56dvh;margin:14px auto;object-fit:contain;border-radius:12px;-webkit-touch-callout:default}.remix-save-dialog button:disabled{opacity:.5}.remix-history-dialog [hidden]{display:none!important}
#viral-remix .remix-publication,.remix-history-dialog .remix-publication{padding:24px;margin:18px 0;border:1px solid #d8ebe0;border-radius:20px;background:#fbfffc;box-shadow:0 12px 36px #1f6a4110;color:#244b39}.remix-publication h3{margin:0 0 6px;font-size:21px}.remix-publication p{font-size:13px;line-height:1.6;color:#668373}.remix-publication strong,.remix-publication label{display:block;margin:16px 0 8px;font-weight:650;font-size:14px}.remix-publication input,.remix-publication textarea{box-sizing:border-box;width:100%;border:1px solid #d6e8dc;border-radius:10px;background:#fff;color:#244b39;padding:12px;font:inherit}.remix-publication label input,.remix-publication label textarea{display:block;margin-top:8px}.remix-copy-row{display:flex;gap:8px;margin:8px 0}.remix-copy-row input{min-width:0}.remix-publication button{border:1px solid #b8d8c4;border-radius:10px;padding:10px 14px;background:#f1faf4;color:#206742;font-weight:600;cursor:pointer;white-space:nowrap}.remix-copy-actions{display:flex;flex-wrap:wrap;gap:8px}.remix-copy-actions button:first-child{background:#21744c;border-color:#21744c;color:#fff}.remix-publication button:disabled{opacity:.6;cursor:wait}@media(max-width:600px){#viral-remix .remix-publication,.remix-history-dialog .remix-publication{padding:16px}.remix-copy-actions button{flex:1}}
.remix-delivery-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:20px;align-items:start}.remix-delivery-layout .remix-publication{margin:0!important}.remix-delivery-gallery{min-width:0}.remix-delivery-gallery .viral-generated{margin:0 0 14px}@media(max-width:900px){.remix-delivery-layout{grid-template-columns:1fr}}
.creation-actions{display:flex;gap:8px;margin:12px 0}.creation-actions button,.creation-history-item{border:1px solid #bfddc9;border-radius:10px;background:#f4fcf7;color:#245c40;padding:10px 14px;font-weight:600;cursor:pointer}.creation-history-item{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px;margin:8px 0;text-align:left}.creation-history-item small{color:#698777;font-weight:400}.creation-history-item:hover{background:#e7f7ec}