/* AUTO360 Studio · panel y editor */
:root{--paper:#f6f3ec;--card:#fffdf8;--ink:#0a1628;--muted:#5d6676;--line:#e3dccb;--soft:#f1ead9;--accent:#e3b45a;--olive:#8a6219;--dark:#0a1628;--danger:#b4412f;--warn:#9a6a12;--radius:10px}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;font-size:15px}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid #b8862f;outline-offset:2px}
[hidden]{display:none!important}
.muted{color:var(--muted)}
.small{font-size:12.5px}
.center{text-align:center}
.warn{color:var(--warn)}
.danger{color:var(--danger)!important}
.row{display:flex;gap:8px;align-items:center}
.row.wrap{flex-wrap:wrap}
.row input{flex:1;min-width:0}
.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px;color:var(--olive);margin:0 0 10px}

/* Marca y barra superior */
.brand{font-size:23px;letter-spacing:-1.3px;font-weight:900;text-decoration:none;line-height:1;white-space:nowrap}
.brand span{font-weight:400}
.brand small{display:block;font-size:8px;letter-spacing:2.6px;margin-top:6px;color:var(--olive)}
.brand--light{color:#fff}
/* Logo de Bahía Motion junto a "AUTO360 STUDIO" */
.brand--bm{display:inline-flex;align-items:center;gap:10px}
.brand--bm .bt{display:block;font-weight:900}
.brand--bm .bt span{font-weight:400}
.brand-mark{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 12px rgba(227,180,90,.35)}
.brand--light small{color:var(--accent)}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:28px;padding:14px 28px;background:rgba(246,243,236,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
.topnav{display:flex;gap:6px;flex:1}
.topnav a{text-decoration:none;font-size:14px;padding:9px 13px;border-radius:7px;white-space:nowrap}
.topnav a:hover{background:var(--soft)}
.topnav a.is-active{background:var(--ink);color:#fff}
/* INMO360: m² y medidas por espacio en el editor */
.scene-dims{display:flex;gap:6px;margin-top:6px;width:100%}
.scene-dims input{min-width:0;width:auto;flex:1 1 0;font-size:12px;padding:6px 8px}
.scene-dims input:first-child{width:64px;flex:0 0 64px}
/* Selector de plataforma AUTO360 / INMO360 */
.platform-switch{display:flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:999px;flex:none}
.platform-switch a{text-decoration:none;font-size:12px;font-weight:700;letter-spacing:.5px;padding:7px 12px;border-radius:999px;white-space:nowrap;color:inherit;opacity:.7}
.platform-switch a:hover{opacity:1;background:var(--soft)}
.platform-switch a[aria-current="page"]{background:var(--ink);color:#fff;opacity:1}
.platform-switch small{font-size:9px;font-weight:600;text-transform:uppercase;opacity:.75;margin-left:2px}
.pill{font-size:11px;font-weight:700;letter-spacing:.5px;padding:7px 11px;border-radius:30px;background:#ece5d3;color:#6d5a26;white-space:nowrap}
.pill--ok{background:var(--accent);color:#1a1408}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:8px;border:1px solid var(--ink);background:var(--ink);color:#fff;font-weight:700;font-size:14px;text-decoration:none;cursor:pointer;transition:transform .15s,background .15s;white-space:nowrap}
.btn:hover{background:#1a2f4d}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.55;cursor:default}
.btn--small{padding:9px 13px;font-size:13px}
.btn--big{padding:17px 22px;font-size:16px}
.btn--block{width:100%}
.btn--outline{background:transparent;color:var(--ink);border-color:#a3ae92}
.btn--outline:hover{background:var(--soft)}
.btn--ghost{background:transparent;color:var(--ink);border-color:transparent}
.btn--ghost:hover{background:var(--soft)}
.btn--danger{background:var(--danger);border-color:var(--danger)}
.btn--danger:hover{background:#933322}
.btn--wa{background:#1f9d55;border-color:#1f9d55}
.btn--wa:hover{background:#178246}
.btn--add{background:var(--accent);color:var(--dark);border-color:#e3c27a;font-size:15px;padding:15px}
.btn--add:hover{background:#e8c983}
.btn--file{position:relative}
.icon-btn{border:0;background:transparent;width:36px;height:36px;border-radius:8px;cursor:pointer;font-size:16px;flex-shrink:0}
.icon-btn:hover{background:var(--soft)}
.link-btn{border:0;background:none;padding:0;color:var(--olive);text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-size:13px}
.link-btn.back{text-decoration:none;font-weight:700;margin-bottom:12px;display:inline-block}

/* Formularios */
.field{display:flex;flex-direction:column;gap:6px;margin:0 0 14px}
.field>span{font-size:13px;font-weight:700}
.field em,h2 em{font-weight:400;font-style:normal;color:var(--muted);font-size:12px}
.field small{color:var(--muted);font-size:11.5px}
input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=file]),select,textarea{width:100%;padding:12px 13px;border:1px solid #c9cfbf;border-radius:8px;background:#fff;font-size:15px}
textarea{resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(100,123,55,.18)}
.field--inline{flex-direction:row;align-items:center;justify-content:space-between}
input[type=color]{width:54px;height:38px;border:1px solid #c9cfbf;border-radius:8px;padding:3px;background:#fff;cursor:pointer}
.check{display:flex;gap:10px;align-items:center;font-size:14px;margin-top:14px;cursor:pointer}
.check input{width:18px;height:18px;accent-color:var(--olive)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.form-error{background:#f9e3de;color:var(--danger);padding:10px 12px;border-radius:8px;font-size:13.5px}

/* Pantallas generales */
.view{min-height:calc(100vh - 70px)}
.loading-screen{display:grid;place-items:center;min-height:60vh}
.spinner{width:34px;height:34px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--olive);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.page{max-width:1180px;margin:0 auto;padding:36px 28px 60px}
.page--narrow{max-width:760px}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:24px}
.page-head h1{font-size:clamp(30px,4vw,42px);letter-spacing:-1.8px;font-weight:600;margin:0}
.page-head p.muted{margin:10px 0 0;max-width:560px;line-height:1.6}
.banner{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:15px 18px;border-radius:var(--radius);background:#f3ead2;border:1px solid #e6d7ac;margin-bottom:26px;font-size:14px;line-height:1.5}
.banner span{flex:1;min-width:220px}
.banner--ok{background:var(--soft);border-color:#e6d6ad}
.banner--warn{background:#f9e3de;border-color:#efc4b9}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin-bottom:18px}
.card h2{font-size:18px;margin:0 0 12px}
.card .big{font-size:20px;font-weight:700;margin:0 0 6px}
.card .row{margin-top:16px;flex-wrap:wrap}

/* Entrar / registro */
.auth{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh}
.auth-side{background:var(--dark);color:#f1f2ec;padding:48px clamp(28px,5vw,72px);display:flex;flex-direction:column;justify-content:center;gap:26px}
.auth-side .brand{position:absolute;top:36px}
.auth-side h1{font-size:clamp(32px,3.6vw,50px);letter-spacing:-2px;line-height:1.06;font-weight:600;margin:0}
.auth-side h1 span{display:block;color:var(--accent)}
.auth-points{list-style:none;padding:0;margin:0;display:grid;gap:12px;font-size:15px;color:#cfd4c8}
.auth-points li:before{content:'✓';color:var(--accent);margin-right:10px;font-weight:700}
.auth-note{font-size:13px;color:#9fa697;border-top:1px solid #1f3352;padding-top:20px;margin:0}
.auth-form{align-self:center;justify-self:center;width:min(420px,100% - 40px);padding:40px 0}
.auth-form h2{font-size:28px;letter-spacing:-1px;margin:0 0 6px}
.auth-form>p.muted{margin:0 0 26px}
.auth-form a{color:var(--olive);font-weight:700}

.auth-forgot{text-align:center;margin:16px 0 0;font-size:14px}
.auth-forgot a{color:var(--olive);font-weight:700}
.auth-form a.btn{color:#fff}
.check-legal{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.5;color:var(--muted);margin:4px 0 14px;cursor:pointer}
.check-legal input{width:18px;height:18px;margin:1px 0 0;flex:none;accent-color:var(--olive)}
.auth--single{grid-template-columns:1fr;place-items:center}
.auth--single .auth-form{display:flex;flex-direction:column;gap:14px}
.auth--single .brand{margin-bottom:12px}
.auth--single h2{margin:0;font-size:26px;letter-spacing:-.8px}
.auth--single .muted{margin:0;line-height:1.6}

/* Mis tours */
.tour-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px}
.tour-card{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s}
.tour-card:hover{box-shadow:0 8px 28px rgba(32,35,33,.09)}
.tour-cover{position:relative;aspect-ratio:16/10;background:#1a2f4d;display:grid;place-items:center;color:#9fa697;font-size:13px;text-decoration:none}
.tour-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.status{position:absolute;left:12px;top:12px;font-size:11px;font-weight:700;padding:5px 9px;border-radius:20px;background:rgba(255,255,255,.92);color:#5d5f58}
.status--pub{background:var(--accent);color:#1a1408}
.tour-body{padding:16px 16px 14px;display:flex;flex-direction:column;gap:4px;flex:1}
.tour-body h3{margin:0;font-size:17px;letter-spacing:-.3px}
.tour-body h3 a{text-decoration:none}
.tour-body p{margin:0}
.views{color:var(--olive);font-weight:700}
.tour-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:auto;padding-top:12px}
.tour-actions .icon-btn:first-of-type{margin-left:auto}
.empty-state{text-align:center;background:var(--card);border:1px dashed #bfc6b5;border-radius:14px;padding:56px 24px}
.empty-state h2{font-size:24px;letter-spacing:-.8px;margin:16px 0 8px}
.empty-state p{color:var(--muted);max-width:420px;margin:0 auto 22px;line-height:1.6}
.empty-icon{display:inline-grid;place-items:center;width:88px;height:88px;border-radius:50%;background:var(--accent);font-size:24px;font-weight:900;letter-spacing:-1px}

.status--wait{background:#f3ead2;color:#6d5a26}
.status--bad{background:#f9e3de;color:var(--danger)}
.reject-note{color:var(--danger)}
.review-wait{background:#f3ead2;border:1px solid #e6d7ac;border-radius:10px;padding:16px;font-size:14px;line-height:1.55}
.review-wait p{margin:6px 0 12px;color:#5f5232}
.review-rejected{background:#f9e3de;border:1px solid #efc4b9;border-radius:10px;padding:14px 16px;margin-bottom:14px;font-size:14px;line-height:1.55;color:#7a2c1f}
.review-rejected p{margin:6px 0 0}
.nav-badge{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:var(--danger);color:#fff;font-size:11px;font-weight:700;margin-left:4px}

/* Administrador */
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:22px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:4px}
.stat strong{font-size:26px;letter-spacing:-.8px}
.stat span{font-size:12.5px;color:var(--muted)}
.stat--alert{border-color:#e6b9ad;background:#fdf1ee}
.stat--alert strong{color:var(--danger)}
.admin-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:20px;overflow-x:auto}
.admin-tabs button{border:0;background:none;padding:11px 14px;font-weight:700;font-size:14px;color:var(--muted);border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap}
.admin-tabs button.is-active{color:var(--ink);border-bottom-color:var(--ink)}
.review-list{display:flex;flex-direction:column;gap:14px}
.review{display:grid;grid-template-columns:220px 1fr;gap:18px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px}
.review-cover{aspect-ratio:16/10;border-radius:8px;overflow:hidden;background:#1a2f4d;display:grid;place-items:center;color:#9fa697;font-size:12px}
.review-cover img{width:100%;height:100%;object-fit:cover}
.review-body h3{margin:0 0 6px;font-size:18px}
.review-body p{margin:0 0 6px}
.review-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px}
.review-actions .check{margin:0}
.tag{display:inline-block;font-size:11.5px;font-weight:700;padding:4px 8px;border-radius:20px;background:#ecebe4;color:#5d5f58}
.tag--ok{background:var(--accent);color:#1a1408}
.tag--warn{background:#f9e3de;color:var(--danger)}
.table-wrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:12px}
.table{width:100%;border-collapse:collapse;font-size:14px}
.table th{text-align:left;font-size:12px;color:var(--muted);font-weight:700;padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.table td{padding:12px 14px;border-bottom:1px solid #eceee6;vertical-align:top}
.table tr:last-child td{border-bottom:0}
.table a{color:var(--olive)}
.nowrap{white-space:nowrap}
.switch{position:relative;display:inline-block;width:42px;height:24px}
.switch input{opacity:0;width:0;height:0}
.switch span{position:absolute;inset:0;border-radius:20px;background:#cfd3c7;cursor:pointer;transition:.2s}
.switch span:before{content:'';position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s}
.switch input:checked+span{background:var(--olive)}
.switch input:checked+span:before{transform:translateX(18px)}
.mode-list{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.mode{display:flex;gap:12px;align-items:flex-start;border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;cursor:pointer}
.mode input{flex:none;width:18px;height:18px;margin-top:3px;accent-color:var(--olive)}
.mode span{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.mode small{color:var(--muted);font-size:13px;line-height:1.45}
.mode.is-active{border-color:var(--olive);background:#fbf6ea}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}.review{grid-template-columns:1fr}}

/* Planes */
.plan-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.plan{position:relative;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:24px;display:flex;flex-direction:column}
.plan--featured{border:2px solid #b8862f;background:#f5f7ef}
.plan--wanted{box-shadow:0 0 0 3px var(--accent)}
.plan-badge{position:absolute;top:-12px;left:20px;background:var(--ink);color:#fff;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px}
.plan-tag{font-size:12px;color:var(--olive);font-weight:700;margin:0 0 4px}
.plan h2{font-size:24px;margin:0 0 12px;letter-spacing:-.6px}
.plan-price{font-size:34px;letter-spacing:-1.3px;font-weight:600;margin:0 0 16px}
.plan-price span{display:block;font-size:11px;letter-spacing:.8px;color:var(--muted);font-weight:500;margin-top:4px}
.plan ul{list-style:none;padding:0;margin:0 0 22px;flex:1}
.plan li{font-size:13.5px;line-height:1.5;padding:8px 0 8px 22px;border-bottom:1px solid #e8ebe1;position:relative}
.plan li:before{content:'✓';position:absolute;left:0;color:#8a6219;font-weight:700}
.pay-info{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
.pay-info div{display:flex;flex-direction:column;gap:6px;font-size:13.5px;line-height:1.55;color:var(--muted);border-top:1px solid var(--line);padding-top:16px}
.pay-info strong{color:var(--ink);font-size:14px}
.pay-info a{color:var(--olive)}

/* Avisos y diálogos */
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--dark);color:#fff;padding:13px 18px;border-radius:10px;font-size:14px;z-index:100;box-shadow:0 10px 30px rgba(0,0,0,.25);max-width:calc(100% - 32px);animation:up .2s}
.toast--error{background:var(--danger)}
@keyframes up{from{opacity:0;transform:translate(-50%,8px)}}
.dialog{position:fixed;inset:0;background:rgba(23,25,24,.5);display:grid;place-items:center;z-index:90;padding:16px}
.dialog-card{background:var(--card);border-radius:14px;padding:26px;width:min(440px,100%);box-shadow:0 24px 60px rgba(0,0,0,.25)}
.dialog-card h2{margin:0 0 8px;font-size:21px;letter-spacing:-.5px}
.dialog-card p{color:var(--muted);line-height:1.55;margin:0 0 16px}
.dialog-card .field{margin-top:12px}
.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}

/* ---------- Editor ---------- */
body.is-editor{overflow:hidden}
body.is-editor .view{min-height:0}
.ed{display:flex;flex-direction:column;height:100vh;height:100dvh}
.ed-top{display:flex;align-items:center;gap:16px;padding:10px 18px;background:var(--card);border-bottom:1px solid var(--line)}
.ed-back{text-decoration:none;font-weight:700;font-size:14px;padding:8px 10px;border-radius:7px}
.ed-back:hover{background:var(--soft)}
.ed-title{flex:1;min-width:0;display:flex;align-items:baseline;gap:12px}
.ed-title strong{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.save-state{font-size:12px;color:var(--muted);white-space:nowrap}
.save-state--ok{color:var(--olive)}
.save-state--error{color:var(--danger)}
.ed-top-actions{display:flex;gap:8px}
.ed-steps{display:flex;gap:4px;padding:8px 14px;background:var(--card);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.ed-steps::-webkit-scrollbar{display:none}
.ed-step{display:flex;align-items:center;gap:9px;border:0;background:none;padding:8px 12px;border-radius:8px;cursor:pointer;white-space:nowrap;font-size:13.5px;color:var(--muted)}
.ed-step:hover{background:var(--soft)}
.ed-step-n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;border:1.5px solid #bcc3b1}
.ed-step-l em{font-style:normal;font-size:10.5px;color:#959b8d;margin-left:6px}
.ed-step.is-done .ed-step-n{background:var(--accent);border-color:#e3c27a;color:#1a1408}
.ed-step.is-active{background:var(--ink);color:#fff}
.ed-step.is-active .ed-step-n{border-color:#fff}
.ed-step.is-active.is-done .ed-step-n{border-color:var(--accent)}
.ed-step.is-active .ed-step-l em{color:#b5bbad}
.ed-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(340px,410px) 1fr}
.ed-panel{overflow-y:auto;background:var(--paper);border-right:1px solid var(--line);padding:6px 22px 24px}
.ed-section{padding:18px 0;border-bottom:1px solid var(--line)}
.ed-section:last-of-type{border-bottom:0}
.ed-section h2{font-size:21px;letter-spacing:-.6px;margin:0 0 6px}
.ed-section h3{font-size:15px;margin:0 0 12px}
.ed-section>p.muted{margin:0 0 16px;line-height:1.55;font-size:14px}
.section-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.ed-nav{position:sticky;bottom:-24px;display:flex;justify-content:space-between;gap:10px;padding:14px 0 6px;background:linear-gradient(to bottom,rgba(244,242,236,0),var(--paper) 30%)}
.ed-preview{display:flex;flex-direction:column;min-width:0;min-height:0;background:#060d1a;padding:12px}
.ed-help{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:8px 14px;border-radius:9px;background:#10213a;color:#cfd4c8;font-size:13.5px;margin-bottom:10px}
.ed-help--placing{background:var(--accent);color:var(--dark);animation:glow 1.6s ease-in-out infinite}
.ed-help-strong{font-weight:700;font-size:14.5px}
.ed-help .btn--ghost{color:var(--dark)}
@keyframes glow{50%{box-shadow:0 0 0 4px rgba(212,228,166,.35)}}
.ed-stage{flex:1;min-height:0;position:relative}
.ed-stage>.a3v{height:100%}
.ed-stage .a3v-stage{border-radius:10px}
.ed-under{display:flex;justify-content:space-between;gap:10px;color:#a3a99d;font-size:12px;padding:8px 4px 0;min-height:26px}

.tips{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:0 14px;margin-bottom:14px;font-size:13.5px}
.tips summary{cursor:pointer;padding:12px 0;font-weight:700;color:var(--olive)}
.tips ol,.tips ul{margin:0 0 14px;padding-left:20px;line-height:1.6;color:var(--muted)}
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;border:2px dashed #b4bea3;border-radius:12px;background:var(--card);padding:30px 18px;cursor:pointer;transition:.15s}
.drop:hover,.drop.is-over{border-color:var(--olive);background:#fbf6ea}
.drop strong{font-size:16px}
.drop span{font-size:13px;color:var(--muted)}
.drop--small{padding:18px;margin-top:12px}
.or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;margin:14px 0}
.or:before,.or:after{content:'';flex:1;height:1px;background:var(--line)}
.video-frames{display:flex;flex-direction:column;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px}
.video-frames>div:first-child{display:flex;flex-direction:column;gap:3px}
.video-frames select{width:auto;padding:8px 10px;font-size:13px}
.progress{position:relative;margin-top:14px;height:34px;border-radius:8px;background:var(--soft);overflow:hidden}
.progress i{position:absolute;inset:0 auto 0 0;width:0;background:var(--accent);transition:width .2s}
.progress--error{background:#f9e3de;height:auto;min-height:34px}
.progress.progress--error span{color:var(--danger);padding:8px 12px;line-height:1.4}
.progress span{position:relative;display:flex;align-items:center;height:100%;padding:0 12px;font-size:12.5px;font-weight:700}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px;margin:14px 0 4px;max-height:300px;overflow-y:auto;padding:2px}
.thumb{position:relative;aspect-ratio:4/3;border-radius:6px;overflow:hidden;background:#ddd;cursor:pointer;outline:2px solid transparent}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb>span{position:absolute;left:3px;bottom:3px;font-size:10px;font-weight:700;background:rgba(0,0,0,.6);color:#fff;padding:1px 5px;border-radius:4px}
.thumb.is-current{outline-color:var(--olive)}
.thumb.is-start:after{content:'★';position:absolute;right:4px;bottom:2px;color:#f4d35e;font-size:13px;text-shadow:0 1px 2px #000}
.thumb-x{position:absolute;right:2px;top:2px;width:20px;height:20px;border-radius:50%;border:0;background:rgba(0,0,0,.65);color:#fff;font-size:13px;line-height:1;cursor:pointer;opacity:0}
.thumb:hover .thumb-x,.thumb:focus-within .thumb-x{opacity:1}
@media(hover:none){.thumb-x{opacity:1}}
.scenes{display:flex;flex-direction:column;gap:8px}
.scene{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:9px;padding:8px}
.scene img{width:72px;height:40px;object-fit:cover;border-radius:5px}
.scene input{padding:8px 10px!important;font-size:14px!important}
.scene-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.scene-info small{font-size:11px;color:var(--muted);padding-left:2px}
.add-title{margin:18px 0 10px!important}
.kinds{display:grid;gap:8px}
.kind{position:relative;display:grid;grid-template-columns:34px 1fr auto;grid-template-rows:auto auto;column-gap:10px;row-gap:2px;align-items:center;background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;cursor:pointer;transition:border-color .15s,transform .15s}
.kind:hover{border-color:var(--olive);transform:translateY(-1px)}
.kind-ic{grid-row:1/3;font-size:22px;text-align:center}
.kind strong{font-size:14.5px}
.kind span:not(.kind-ic){grid-column:2/4;font-size:12.5px;line-height:1.45;color:var(--muted)}
.kind em{grid-column:3;grid-row:1;font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.3px;padding:3px 8px;border-radius:20px;background:var(--soft);color:var(--olive)}
.check.small{font-size:12.5px;color:var(--muted);margin-top:10px}
.notice{background:#fff7e0;border:1px solid #ecd9a0;border-radius:9px;padding:10px 12px;color:#5c4d1d;line-height:1.5}
.notice ul{margin:6px 0 0;padding-left:18px}
.notice li{margin:3px 0}
.tips p{margin:12px 0 6px}
.ed-size{display:none}
.social-out{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.social-out video{width:100%;max-width:260px;aspect-ratio:9/16;border-radius:10px;background:#000;align-self:center}
.shot-guide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.shot{display:flex;align-items:center;gap:10px;background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:10px;cursor:pointer;transition:border-color .15s}
.shot:hover{border-color:var(--olive)}
.shot svg{width:34px;height:34px;flex:none;fill:none;stroke:var(--olive);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.shot span{min-width:0;display:flex;flex-direction:column}
.shot strong{font-size:13px}
.shot small{font-size:11px;color:var(--muted);line-height:1.3}
.shot.is-done{background:#fbf3e1;border-color:#ecd39c;cursor:default}
.shot.is-done small{color:var(--olive);font-weight:700}
.guided{display:flex;flex-direction:column;gap:10px;background:#fbf3e1;border:1.5px solid #ecd39c;border-radius:10px;padding:14px}
.guided strong{display:block;margin-bottom:3px}
.guided select{width:auto;padding:8px 10px}
.file-row{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin-bottom:12px;font-size:14px}
.file-row span{flex:1}
.file-row a{color:var(--olive);font-size:13px}
.choice{display:grid;gap:12px}
.choice-card{display:flex;flex-direction:column;align-items:flex-start;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px}
.choice-card .row{width:100%}
.seg{display:flex;background:var(--soft);border-radius:9px;padding:4px;margin-bottom:14px}
.seg button{flex:1;border:0;background:none;padding:10px;border-radius:7px;font-weight:700;font-size:14px;cursor:pointer}
.seg button.is-active{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.seg button:disabled{opacity:.4;cursor:default}
.btn--add-inline{background:var(--accent);color:var(--dark);border-color:var(--accent);flex-shrink:0}
.btn--add-inline:hover{background:#e8c983}
.hs-head-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.hs-head-row .back{margin:0}
.hs-head-row .btn--add{font-size:13px;padding:9px 12px}
.size-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.size-row input[type=range]{flex:1;accent-color:var(--olive)}
.size-row output{min-width:44px;text-align:right;font-weight:700;font-size:13px}
.size-dot{border-radius:50%;background:var(--accent);border:1px solid #e3c27a;flex-shrink:0}
.size-dot--sm{width:12px;height:12px}
.size-dot--lg{width:24px;height:24px}
.anchor-ok{background:#fbf3e1;border:1px solid #ecd39c;border-radius:8px;padding:10px 12px;font-size:13.5px;line-height:1.5;margin:0 0 12px}
.anchor-off{background:#fbf5e4;border:1px solid #e6d7ac;border-radius:8px;padding:10px 12px;margin:0 0 14px;font-size:13.5px}
.anchor-off p{margin:0 0 10px}
.design-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.design-card{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--card);border:1.5px solid var(--line);border-radius:9px;padding:8px 4px 7px;cursor:pointer}
.design-card small{font-size:11.5px;font-weight:700}
.design-card.is-active{border-color:var(--olive);background:#fbf6ea}
.design-prev{position:relative;display:block;width:100%;height:64px;border-radius:7px;background:radial-gradient(ellipse at 50% 70%,#1f3352,#10213a);overflow:hidden;pointer-events:none}
.design-prev .a3v-hs{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%) scale(.85)}
.design-prev .a3v-hs-label{opacity:1;transform:none;font-size:10px;padding:3px 6px}
.dir-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.dir-pad{position:relative;width:132px;height:132px;flex-shrink:0}
.dir-btn{position:absolute;width:34px;height:34px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);font-size:16px;cursor:pointer;display:grid;place-items:center;translate:-50% -50%}
.dir-btn.is-active{background:var(--ink);color:#fff;border-color:var(--ink)}
.dir-btn:nth-child(1){left:50%;top:13%}.dir-btn:nth-child(2){left:83%;top:22%}.dir-btn:nth-child(3){left:87%;top:50%}.dir-btn:nth-child(4){left:83%;top:78%}
.dir-btn:nth-child(5){left:50%;top:87%}.dir-btn:nth-child(6){left:17%;top:78%}.dir-btn:nth-child(7){left:13%;top:50%}.dir-btn:nth-child(8){left:17%;top:22%}
.dir-center{position:absolute;left:50%;top:50%;width:62px;height:62px;translate:-50% -50%}
.dir-center .design-prev{height:62px;border-radius:50%}
.dir-fine{flex:1;min-width:140px;display:flex;flex-direction:column;gap:4px}
.dir-fine input{accent-color:var(--olive)}
.dir-fine output{font-weight:700;font-size:13px}
.goto-angle{background:#fbf3e1;border:1px solid #ecd39c;border-radius:8px;padding:10px 12px;margin:0 0 10px;font-size:13.5px;line-height:1.5}
.goto-angle p{margin:0 0 8px}
.tip-move{background:var(--soft);border-radius:8px;padding:10px 12px;font-size:13.5px;margin:0 0 14px;line-height:1.5}
.how{margin:14px 0 0;padding-left:20px;font-size:13px;color:var(--muted);line-height:1.7}
.hs-list{display:flex;flex-direction:column;gap:6px}
.hs-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:9px;padding:10px 12px;cursor:pointer}
.hs-item:hover{border-color:#a3ae92}
.hs-item>span:nth-child(2){flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.hs-item strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hs-item small{font-size:12px;color:var(--muted)}
.hs-ico{width:32px;height:32px;border-radius:50%;background:var(--accent);display:grid;place-items:center;flex-shrink:0}
.hs-ico svg{width:18px;height:18px;fill:none;stroke:var(--dark)}
.type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.type-card{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;background:var(--card);border:1.5px solid var(--line);border-radius:9px;padding:10px 6px;cursor:pointer}
.type-card strong{font-size:13px}
.type-card small{font-size:10.5px;color:var(--muted);line-height:1.3}
.type-card .hs-ico{width:30px;height:30px;background:var(--soft)}
.type-card.is-active{border-color:var(--olive);background:#fbf6ea}
.type-card.is-active .hs-ico{background:var(--accent)}
.mini-thumbs{display:flex;flex-wrap:wrap;gap:6px}
.mini{position:relative;width:72px;height:56px;border-radius:7px;overflow:hidden;background:#ddd}
.mini img{width:100%;height:100%;object-fit:cover}
.mini button{position:absolute;right:2px;top:2px;width:20px;height:20px;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;cursor:pointer;line-height:1}
.mini--add{display:grid;place-items:center;font-size:24px;border:2px dashed #b4bea3;background:var(--card);cursor:pointer;color:var(--olive)}
.checklist{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:8px;font-size:14px}
.checklist li{padding:9px 12px;border-radius:8px;background:var(--card);border:1px solid var(--line)}
.checklist .ok{color:#5c4110}
.checklist .todo{color:var(--warn);border-color:#e6d7ac;background:#fbf5e4}
.checklist .opt{color:var(--muted)}
.paywall{background:var(--dark);color:#f1f2ec;border-radius:12px;padding:20px}
.paywall strong{font-size:17px}
.paywall p{color:#c5cabd;font-size:14px;line-height:1.55;margin:8px 0 16px}
.paywall .btn{background:var(--accent);color:var(--dark);border-color:var(--accent)}
.share{display:flex;flex-direction:column;gap:14px}
.share .field{margin:0}
.share-btns{display:flex;gap:8px;flex-wrap:wrap}
.qr-box{display:flex;gap:16px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px}
.qr{width:112px;height:112px;flex-shrink:0;display:grid;place-items:center;font-size:11px;color:var(--muted);text-align:center}
.qr canvas{width:112px;height:112px;image-rendering:pixelated}
.qr-box p{margin:4px 0 8px}
#embed{font-family:Consolas,monospace;font-size:12px}
.swatches{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.swatch{width:34px;height:34px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #c9cfbf;cursor:pointer;padding:0}
.swatch.is-active{box-shadow:0 0 0 2px var(--ink)}
.swatch--custom{position:relative;overflow:hidden;background:conic-gradient(#e63946,#f5c518,#2ec4b6,#3a86ff,#b14aed,#e63946)}
.swatch--custom input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.brand-sample{background:#060d1a;color:#f1f2ec;border-radius:12px;padding:14px;margin:4px 0 14px;display:flex;flex-direction:column;gap:12px}
.bs-head{display:flex;align-items:center;gap:10px}
.bs-head img{height:30px;max-width:90px;object-fit:contain}
.bs-head strong{font-size:15px}
.bs-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bs-dot{width:30px;height:30px;border-radius:50%;background:var(--a3v-accent);color:#10213a;display:grid;place-items:center;font-weight:900;box-shadow:0 0 0 5px color-mix(in srgb,var(--a3v-accent) 28%,transparent)}
.bs-tab{background:var(--a3v-accent);color:#111;font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;padding:8px 14px;border-radius:30px}
.bs-btn{background:var(--a3v-accent);color:#111;font-size:12px;font-weight:700;padding:9px 14px;border-radius:7px}
.brand-sample small{color:#a3a99d;font-size:11.5px}
.brand-row{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.brand-logo{width:96px;height:48px;object-fit:contain;background:#10213a;border-radius:8px;padding:6px}
.brand-logo--empty{display:grid;place-items:center;color:#777;font-size:12px}

/* Responsivo */
@media(max-width:1100px){.plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){
  .ed-body{grid-template-columns:1fr;grid-template-rows:minmax(250px,43vh) 1fr}
  .ed-body.is-compact{grid-template-rows:minmax(200px,31vh) 1fr}
  /* La barra de consejos solo aparece en celular cuando hay que hacer algo (colocar un punto o agregar uno). */
  .ed-help:not(.ed-help--placing):not(:has(button)){display:none}
  /* Safari en iPhone hace zoom a la página si un campo tiene letra menor a 16 px, y la deja movida. */
  input,select,textarea,.scene input,.video-frames select{font-size:16px!important}
  .ed-size{display:flex;align-items:center;justify-content:center;gap:6px;border:0;background:none;color:#a3a99d;font-size:12px;font-weight:700;padding:6px 0 0;cursor:pointer}
  .ed-size span{font-size:14px}
  .ed-preview{order:-1;padding:8px}
  .ed-panel{border-right:0;border-top:1px solid var(--line);padding:4px 16px 20px}
  .ed-step-l{display:none}
  .ed-step.is-active .ed-step-l{display:inline}
  .ed-help{min-height:38px;font-size:12.5px;margin-bottom:6px}
  .ed-under{display:none}
  .auth{grid-template-columns:1fr}
  .auth-side{padding:90px 24px 36px}
  .auth-side .brand{top:28px}
  .pay-info{grid-template-columns:1fr}
}
@media(max-width:640px){
  .topbar{padding:12px 16px;gap:12px;flex-wrap:wrap}
  .topnav{order:3;width:100%;flex:none;overflow-x:auto}
  .page{padding:24px 16px 48px}
  .page-head{flex-direction:column;align-items:stretch}
  .plan-grid{grid-template-columns:1fr}
  .ed-top{padding:8px 10px;gap:8px}
  .ed-back span,.ed-title .save-state{display:none}
  .ed-top-actions .btn{padding:9px 11px;font-size:12.5px}
  .ed-top-actions .btn--ghost{border:1px solid var(--line)}
  .grid2{grid-template-columns:1fr}
  .type-grid{grid-template-columns:repeat(2,1fr)}
}
/* Celular acostado: vista previa y formulario lado a lado, con barras más delgadas. */
@media(max-width:1000px) and (orientation:landscape) and (max-height:560px){
  .ed-top{padding:4px 10px}
  .ed-steps{padding:3px 10px}
  .ed-step{padding:5px 10px}
  .ed-body,.ed-body.is-compact{grid-template-columns:minmax(0,1.25fr) minmax(280px,1fr);grid-template-rows:1fr}
  .ed-preview{padding:6px}
  .ed-panel{border-top:0;border-left:1px solid var(--line)}
  .ed-size{display:none}
  .ed-help:not(.ed-help--placing):not(:has(button)){display:flex}
  .ed-help{min-height:32px;padding:5px 10px;margin-bottom:4px}
}
