/* Elevate SitePilot phone-first visual studio */
.visual-studio{background:linear-gradient(140deg,#1a2c44,#101b2f 85%)}
.visual-studio h2{margin:5px 0}.visual-studio .row{align-items:flex-start}
.visual-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:23px 0 14px}
.visual-segment{display:flex;padding:4px;gap:5px;background:#101a2e;border:1px solid #435770;border-radius:13px}
.visual-segment button{border:0;color:#cddaea;background:transparent;border-radius:10px;padding:10px 13px;font-weight:750;min-height:43px}
.visual-segment button.selected{background:#79e8d8;color:#081e28}
.visual-workspace{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(270px,.9fr);gap:20px;align-items:start}
.visual-preview-wrap{min-width:0;background:#0a1425;border-radius:20px;border:1px solid #394961;padding:18px}
.visual-preview{--visual-accent:#75ead9;max-width:405px;margin:0 auto;transition:max-width .2s ease;border:1px solid #547089;border-radius:23px;overflow:hidden;background:#0b1528;box-shadow:0 15px 40px #0005}
.visual-preview.desktop{max-width:100%}
.visual-preview-nav{padding:15px 17px;background:#111e35;font-size:.87rem;font-weight:900;letter-spacing:-.02em;color:#fff}
.visual-preview-nav span{color:var(--visual-accent)}
.visual-block{display:flex;flex-direction:column;width:100%;text-align:left;padding:16px 19px;border:2px solid transparent;border-bottom:1px solid #2e415c;border-radius:0;background:transparent;color:#e5f7ff;gap:8px;overflow-wrap:anywhere;white-space:pre-line;cursor:pointer}
.visual-block strong{font-size:1.13rem;line-height:1.28;letter-spacing:-.03em}
.visual-block[data-edit=headline]{padding:24px 20px;background:radial-gradient(circle at 100% 0,#20626077,transparent 75%)}
.visual-block[data-edit=headline] strong{font-size:clamp(1.5rem,3vw,2.1rem)}
.visual-block span:last-child{font-size:.9rem;color:#c1d0df}
.visual-block.selected,.visual-block:hover,.visual-block:focus-visible{border:2px solid var(--visual-accent);outline:0;background:#1d3648}
.visual-hint{font-size:.72rem!important;letter-spacing:.035em;font-weight:850;color:var(--visual-accent)!important;text-transform:uppercase}
.visual-preview-strip{background:#153c48;padding:10px 20px;color:#baf7e8;letter-spacing:.08em;font-size:.66rem;font-weight:850}
.visual-preview-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:14px}
.visual-preview-actions button{background:#254459;border:1px solid #3d6f74;border-radius:10px;color:#e9fffa;font-size:.78rem;font-weight:750;padding:10px 5px;min-height:49px}
.visual-form{position:sticky;top:15px;border:1px solid #526882;border-radius:19px;padding:20px;background:#14263c}
.visual-form textarea{min-height:105px}.visual-form .swatch{width:76px;min-height:45px}
.visual-save-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:19px}
.visual-save-actions .btn{font-size:.85rem;padding:12px 14px}
.visual-form #visual-feedback{line-height:1.45;min-height:20px}
@media(max-width:850px){.visual-workspace{grid-template-columns:1fr}.visual-form{position:static;order:-1}.visual-preview-wrap{padding:12px}.visual-block{min-height:85px}.visual-studio{padding:16px}.visual-studio .visual-preview.mobile{max-width:420px}}
@media(max-width:400px){.visual-preview-actions{grid-template-columns:1fr 1fr}.visual-save-actions .btn{width:100%}}

/* Per-section text styling controls */
.visual-form{min-width:0}
.typography-panel{border:1px solid #48617b;background:linear-gradient(145deg,#132e46,#112337);border-radius:16px;padding:17px;margin:19px 0 8px}
.typography-panel h3{margin:0;font-size:1.12rem;letter-spacing:-.025em}
.typography-panel .row{align-items:center}
.typography-panel #visual-reset-style{font-size:.75rem;padding:8px 11px}
.typography-panel .label{min-width:0;margin:10px 0 7px;display:block}
.visual-controls-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.visual-controls-grid .field{min-width:0}
.visual-sizing{display:grid;grid-template-columns:minmax(0,1fr) 85px;align-items:center;gap:13px}
.visual-sizing input[type=range]{width:100%;min-width:0;accent-color:#83e9dd;min-height:42px}
.visual-sizing input[type=number]{min-width:0}
#visual-size-label{color:#88f3de;font-variant-numeric:tabular-nums}
.visual-block{min-width:0}
.visual-block #visual-headline,.visual-block #visual-tagline,.visual-block #visual-services,.visual-block #visual-description,.visual-block #visual-status_message,.visual-block #visual-email{display:block;width:100%;box-sizing:border-box;overflow-wrap:anywhere;white-space:pre-line}
.visual-block .visual-hint{font-family:Inter,system-ui,sans-serif!important;font-size:.72rem!important;line-height:1.45!important}
@media(max-width:440px){.visual-controls-grid{grid-template-columns:1fr}.typography-panel{padding:12px}.typography-panel .row{gap:6px}.typography-panel h3{font-size:1rem}}

/* True website preview: priority on every phone, not hidden beneath the editor. */
.visual-preview-wrap [hidden]{display:none!important}
.visual-live-head{display:flex;flex-direction:column;gap:4px;margin:0 0 13px}
.visual-live-head strong{font-size:1.12rem;color:#f7fcff;letter-spacing:-.025em}
.visual-live-head .mini{margin:2px 0 0;color:#b3c7da}
.visual-live-frame{--frame-scale:.5;width:100%;height:540px;overflow:hidden;border-radius:17px;border:2px solid #5c8793;background:#101a2d;box-shadow:0 20px 50px #0005}
.visual-live-frame iframe{display:block;width:100%;height:100%;border:0;background:#0b1021}
.visual-live-frame.desktop{height:540px}
.visual-live-frame.desktop iframe{width:1100px;height:1000px;transform:scale(var(--frame-scale));transform-origin:0 0}
.visual-preview-switch{display:flex;gap:6px;margin:12px 0 0;padding:4px;border:1px solid #3d6371;background:#081a2c;border-radius:12px}
.visual-preview-switch button{flex:1;min-width:0;border:0;border-radius:9px;min-height:43px;color:#c2d4e8;background:transparent;font-weight:800;font-size:.82rem}
.visual-preview-switch button.selected{color:#06252b;background:#85e9dc}
.visual-preview-simple{padding-top:12px}
.visual-workspace .visual-preview-wrap{order:0}
.visual-workspace .visual-form{order:1}
@media(max-width:850px){
 .visual-workspace{display:flex;flex-direction:column;gap:15px}
 .visual-preview-wrap,.visual-form{width:100%}
 .visual-form{order:1;position:static}
 .visual-preview-wrap{order:0}
 .visual-live-frame{height:490px}
 .visual-studio>.row{align-items:start;gap:6px}
 .visual-studio>.row .muted{margin:5px 0 0;font-size:.9rem;line-height:1.43}
 .visual-studio>.row h2{font-size:1.45rem;margin:3px 0}
 .visual-studio>.row .pill{font-size:.67rem;padding:3px 9px}
 .visual-toolbar{margin:13px 0 11px}
}
@media(max-width:440px){.visual-live-frame{height:450px}.visual-preview-wrap{padding:10px}.visual-studio .visual-live-head strong{font-size:1rem}}

/* Direct, phone-friendly logo/button/image editing */
.sp-quick-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:11px 0 0}
.sp-quick-actions button{min-height:45px;padding:9px 6px;border:1px solid #4a7883;background:#153f4b;color:#b8fff3;border-radius:11px;font-size:.8rem;font-weight:850}
.sp-quick-actions button:hover,.sp-quick-actions button:focus-visible{border-color:#8bfff0;background:#255866}
.sp-advanced-section{margin:17px 0;border:1px solid #4e6a85;border-radius:17px;background:#11233a;overflow:hidden}
.sp-advanced-section summary{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:15px;min-height:62px;font-weight:850;font-size:1rem;background:#193249;list-style:none;cursor:pointer}
.sp-advanced-section summary::before{content:''}
.sp-advanced-section summary>span{font-size:.72rem;font-weight:500;color:#b5d4da;text-align:right}
.sp-advanced-section[open] summary{background:#215463;color:#e7fff8}
.sp-advanced-section .sp-editor-body{padding:14px}
.sp-advanced-section input[type=range]{width:100%;min-height:43px;accent-color:#78e9d8}
.sp-advanced-section .sp-link-edit{border:1px solid #365a71;border-radius:13px;padding:14px;margin:11px 0;background:#122c41}
.sp-advanced-section .sp-link-edit h4{margin:0;color:#affaf0;font-size:.88rem}
.sp-advanced-section .sp-link-edit .label{margin:7px 0}
.sp-advanced-section .sp-external-field[hidden]{display:none!important}
.sp-advanced-section .sp-editor-body>h3{margin:23px 0 9px;font-size:1.05rem}
.sp-brand .sp-logo-text{display:inline-block;max-width:100%;line-height:1.25;overflow-wrap:anywhere}
.sp-brand .sp-logo-image{display:block;max-width:min(100%,290px);object-fit:contain;object-position:left}
.sp-image-picker{display:flex;gap:7px;flex-wrap:wrap;margin:13px 0}
.sp-image-choice{display:flex;gap:6px;align-items:center;flex-direction:column;border:2px solid #426079;background:#172b44;border-radius:10px;padding:8px;color:#fff;font-size:.8rem;min-width:73px}
.sp-image-choice.active{border-color:#75f4dd;background:#1d5556}
.sp-image-choice img{width:62px;height:55px;object-fit:contain}
.sp-image-controls{padding:12px;border:1px solid #435f79;border-radius:13px}
.sp-image-controls .label{margin:12px 0}
.sp-image-buttons{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
.sp-image-controls .danger{background:#7f4057;color:#fff}
.sp-advanced-section .field[type=file]{padding:10px;max-width:100%}
@media(max-width:420px){.sp-quick-actions button{font-size:.75rem;padding:8px 3px}.sp-advanced-section summary{padding:11px}.sp-advanced-section summary>span{max-width:100px}.sp-advanced-section .sp-editor-body{padding:10px}}