.visual-editor{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:28px;align-items:start}.editor-panel{padding:0;overflow:hidden}.editor-section{padding:26px 28px;border-bottom:1px solid #eceae4}.editor-section h3{font-size:20px;margin:0 0 16px}.editor-section p{font-size:13px;color:#777;margin:4px 0}.section-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.template-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.template-option{cursor:pointer}.template-option input{position:absolute;opacity:0}.template-option strong{display:block;text-align:center;font-size:13px;margin-top:7px}.template-thumb{height:100px;border-radius:16px;border:2px solid transparent;display:block;position:relative;overflow:hidden;background:#f0efeb}.template-thumb:before{content:"";position:absolute;width:38px;height:38px;border-radius:50%;background:#bbb;left:14px;top:17px}.template-thumb:after{content:"";position:absolute;left:14px;right:14px;bottom:18px;height:18px;border-radius:6px;background:#d4d2cc;box-shadow:0 -24px 0 -5px #c5c3bd}.template-thumb.bold{background:#191919}.template-thumb.bold:before{background:#5b5cf0;width:48px;height:48px}.template-thumb.bold:after{background:#555;box-shadow:0 -24px 0 -5px #fff}.template-thumb.glass{background:linear-gradient(135deg,#796dff,#d5b7ff)}.template-thumb.glass:after{background:rgba(255,255,255,.55);box-shadow:0 -24px 0 -5px rgba(255,255,255,.8)}.template-option input:checked+.template-thumb{border-color:#5b5cf0;box-shadow:0 0 0 3px #5b5cf025}.upload-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}.upload-box{border:1px dashed #c9c6bd;border-radius:16px;padding:16px;font-size:13px;font-weight:800;cursor:pointer}.upload-box input{display:none}.upload-box span{display:block;color:#5b5cf0;margin-top:7px;font-size:12px}.palette-picker{display:flex;gap:10px;margin:10px 0 18px}.palette{width:34px;height:34px;border:5px solid #fff;border-radius:50%;background:var(--p);box-shadow:0 0 0 1px #d7d4ca;cursor:pointer}.editor-section select,.editor-section .field select{font:inherit;padding:13px 14px;border:1px solid #dedcd4;border-radius:14px;background:#fbfbf9}.editor-panel>.publish-toggle{margin:24px 28px}.save-design{margin:0 28px 28px;width:calc(100% - 56px)}.link-editor{display:grid;grid-template-columns:28px 105px 1fr 1.5fr 104px;gap:8px}.row-tools{display:flex;gap:4px}.row-tools button{width:31px;height:38px;border:1px solid #dedcd4;background:#fff;border-radius:10px;cursor:pointer}.remove-link{color:#d33}.phone-preview-wrap{position:sticky;top:94px}.preview-label{display:flex;justify-content:space-between;color:#777;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin:0 10px 10px}.phone-frame{border:9px solid #171717;border-radius:46px;background:#171717;padding:12px 5px 5px;box-shadow:0 30px 80px rgba(0,0,0,.2);height:720px;overflow:hidden}.phone-speaker{width:75px;height:5px;border-radius:9px;background:#555;margin:0 auto 10px}.phone-frame #live-preview{height:670px;overflow:auto;border-radius:30px;background:#fff}.visual-card{background:var(--profile-bg);color:var(--profile-text);border-radius:36px;overflow:hidden;box-shadow:0 20px 60px rgba(45,45,30,.1)}.cover{height:170px;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent),white 65%));background-size:cover;background-position:center}.visual-body{padding:0 38px 38px}.visual-avatar{margin-top:-58px;border:5px solid var(--profile-bg);position:relative}.visual-card h1{color:var(--profile-text);font-size:clamp(36px,7vw,62px);line-height:.98;letter-spacing:-.055em;margin:0}.visual-card .role,.visual-card .bio{color:color-mix(in srgb,var(--profile-text),transparent 30%)}.visual-card .visual-link{color:var(--profile-text);border-color:color-mix(in srgb,var(--profile-text),transparent 85%)}.visual-card.buttons-outline .visual-link{background:transparent;border:2px solid var(--accent)}.visual-card.buttons-solid .visual-link{background:var(--accent);color:#fff;border-color:var(--accent)}.visual-card.buttons-solid .social-icon{background:rgba(255,255,255,.2)}.visual-card.template-bold .visual-body{padding-top:26px}.visual-card.template-bold .visual-avatar{margin:0;width:128px;height:128px}.visual-card.template-bold h1{font-size:clamp(48px,8vw,76px);text-transform:uppercase}.visual-card.template-bold .cover{height:105px;background:var(--accent)}.visual-card.template-bold .visual-links{grid-template-columns:1fr}.visual-card.template-glass{background:linear-gradient(145deg,var(--profile-bg),color-mix(in srgb,var(--accent),var(--profile-bg) 80%))}.visual-card.template-glass .cover{height:220px}.visual-card.template-glass .visual-body{margin:-45px 20px 20px;padding:25px;border-radius:28px;background:color-mix(in srgb,var(--profile-bg),transparent 12%);backdrop-filter:blur(20px)}.visual-card.template-glass .visual-avatar{margin-top:-77px}.designed-profile{grid-template-columns:minmax(0,640px) 320px}.phone-frame .visual-card{min-height:100%;border-radius:30px;box-shadow:none}.phone-frame .cover{height:130px}.phone-frame .visual-body{padding:0 22px 28px}.phone-frame .visual-avatar{width:82px;height:82px;margin-top:-43px;font-size:24px}.phone-frame .visual-card h1{font-size:34px}.phone-frame .visual-card .role,.phone-frame .visual-card .bio{font-size:13px}.phone-frame .visual-links{grid-template-columns:1fr;gap:7px;margin:18px 0}.phone-frame .visual-link{padding:10px;border-radius:13px;font-size:13px}.phone-frame .social-icon{width:27px;height:27px}.phone-frame .template-bold .visual-avatar{margin-top:0}.phone-frame .template-bold h1{font-size:42px}.phone-frame .template-glass .visual-body{padding:20px;margin:-35px 12px 12px}.phone-frame .template-glass .visual-avatar{margin-top:-62px}
@media(max-width:1000px){.visual-editor{grid-template-columns:1fr}.phone-preview-wrap{position:static;width:min(390px,100%);margin:auto}.designed-profile{grid-template-columns:1fr}.designed-profile .side-card{position:static}}
@media(max-width:650px){.template-picker{gap:7px}.template-thumb{height:80px}.upload-grid{grid-template-columns:1fr}.link-editor{grid-template-columns:28px 1fr 100px}.link-editor select{grid-column:2}.link-editor .link-label,.link-editor .link-url{grid-column:2/-1}.row-tools{grid-column:3;grid-row:1}.visual-body{padding:0 22px 28px}.cover{height:140px}}