#enter-editor{border:0;background:none;color:inherit;font:inherit;padding:5px 8px;cursor:pointer}
#enter-editor:hover,#enter-editor:focus-visible{color:inherit;text-decoration:underline}
html[data-layout] body{background-color:var(--portfolio-bg);background-size:cover;background-position:center;background-attachment:fixed;color:var(--portfolio-text)}
html[data-layout] main,html[data-layout] .profile{background:var(--portfolio-card)}
html[data-layout] .card{background:transparent}
html[data-layout] :is(p,.role,.eyebrow,.card h2,.link small,.icon,footer){color:var(--portfolio-text)}
html[data-layout] :is(.tag,.link:hover,.link:focus-visible){color:var(--portfolio-accent)}
html[data-layout] :is(.link:hover,.link:focus-visible){border-color:var(--portfolio-accent)}
html:is([data-layout=stacked],[data-layout=links]) main{max-width:650px;grid-template-columns:1fr}
html[data-layout=links] main>section{display:none}
#site-editor{width:min(570px,calc(100% - 24px));max-height:85dvh;border:1px solid #393939;border-radius:20px;padding:24px;background:#171717;color:#f1f1f1}
#site-editor::backdrop{background:#080808b8}
#site-editor h2{margin:0 0 12px;font-size:22px}
#site-editor form,#site-editor label,#edit-links{display:grid;gap:8px}
#site-editor form{gap:14px}
#site-editor [hidden]{display:none}
#site-editor input,#site-editor select,#site-editor button{font:inherit;color:inherit;background:#232323;border:1px solid #515151;border-radius:8px;padding:8px 10px;min-width:0}
#site-editor input[type=color]{width:100%;height:40px;padding:3px}
#site-editor fieldset,#site-editor article{border:1px solid #444;border-radius:10px;padding:12px;min-width:0}
#site-editor article{display:grid;gap:8px}
#site-editor fieldset>button{margin-top:10px}
#site-editor button{cursor:pointer}
#site-editor button:disabled{opacity:.6;cursor:wait}
#site-editor .editor-actions{display:flex;flex-wrap:wrap;gap:8px}
#site-editor .editor-colors{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
#site-editor #editor-status{margin-top:12px;font-size:14px}

#site-editor{width:min(690px,calc(100% - 28px));max-height:min(88dvh,850px);padding:0;border-radius:26px;border-color:#42364c;background:#141218;box-shadow:0 30px 120px #000b;scrollbar-color:#685676 #17141b}
#site-editor::backdrop{backdrop-filter:blur(8px);background:#08050bc9}
#site-editor form{padding:24px;gap:18px}
#site-editor .editor-heading{padding:6px 0 2px}
#site-editor h2{font-size:clamp(23px,5vw,32px);letter-spacing:-.04em;margin:0}
#site-editor h3,#site-editor legend{font-size:15px;letter-spacing:.015em;font-weight:700;margin:0}
#site-editor .editor-section{display:grid;gap:13px;padding:17px;margin:0;border:1px solid #372d41;border-radius:17px;background:#1d1823}
#site-editor label{font-size:13px;font-weight:600;color:#ddd2e5}
#site-editor input,#site-editor select{background:#17141b;border-color:#463951;color:#faf6ff;min-height:40px;border-radius:10px}
#site-editor :focus-visible{outline:2px solid #e4b2ff;outline-offset:3px}
#site-editor article{padding:14px;background:#17141b;border-color:#40344a;border-radius:13px}
#site-editor article h3{color:#f1d9ff;margin-bottom:4px}
#site-editor button{background:#302438;border-color:#54405f;color:#f5e6ff;border-radius:10px}
#site-editor button:hover{background:#493152}
#site-editor #publish,#site-login button{background:#e6b5fe;color:#240e30;border-color:#e6b5fe;font-weight:750}
#site-settings>.editor-actions{position:sticky;bottom:-24px;padding:12px 0;background:#141218;z-index:1}
#site-editor #editor-status{min-height:1em;margin:0;padding:0 24px 14px;color:#e6b5fe}
#site-editor #editor-status:empty{display:none}
#site-editor input[type=file]{width:100%;padding:6px}
#site-editor input::file-selector-button{margin-right:10px;padding:6px 8px;border:0;border-radius:6px;background:#422d4d;color:#f5e6ff;cursor:pointer}
.media-upload{display:grid;gap:8px;border:1px dashed #624d70;border-radius:12px;padding:12px}
.media-upload small{color:#bbaac5;font-size:12px}
.media-upload button{justify-self:start}
.media-preview:empty,.portfolio-header-media:empty{display:none}
.media-preview :is(img,video){display:block;max-width:100%;max-height:140px;border-radius:9px}
.portfolio-header-media{margin-bottom:22px}
.portfolio-header-media :is(img,video){display:block;width:100%;max-height:300px;object-fit:cover;border-radius:16px}
.link .icon{overflow:hidden}
.link .icon img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:480px){#site-editor form{padding:16px}#site-editor .editor-colors{grid-template-columns:repeat(2,1fr)}#site-settings>.editor-actions{bottom:-16px}}
