:root{--purple:#5c2d94;--ink:#333;--line:#e2e2e8;--bg:#f5f4f8}*{box-sizing:border-box}body{color:var(--ink);background:var(--bg);margin:0;font-family:Open Sans,Arial,sans-serif}.app{max-width:1200px;margin:0 auto;padding:2rem 1.5rem 4rem}.app__header{margin-bottom:1.5rem}.app__bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.25rem;display:flex}.app__tabs{flex-wrap:wrap;gap:.5rem;display:flex}.app__tab{border:1px solid var(--line);cursor:pointer;color:var(--ink);background:#fff;border-radius:8px;padding:.45rem .9rem;font-size:.85rem}.app__tab--active{background:var(--purple);border-color:var(--purple);color:#fff}.app__auth{align-items:center;gap:.75rem;margin-left:auto;display:flex}.app__user{color:#555;font-size:.85rem}.app__header h1{color:var(--purple);letter-spacing:.04em;margin:0;font-size:1.6rem}.app__subtitle{color:#666;margin:.4rem 0 0}.app__main{grid-template-columns:minmax(320px,420px) 1fr;align-items:start;gap:1.5rem;display:grid}@media (width<=900px){.app__main{grid-template-columns:1fr}}.panel{border:1px solid var(--line);background:#fff;border-radius:12px;padding:1.25rem 1.25rem 1.5rem}.panel__title{text-transform:uppercase;letter-spacing:.08em;color:var(--purple);margin:0 0 1rem;font-size:1rem}.form{flex-direction:column;gap:.9rem;display:flex}.field{flex-direction:column;gap:.3rem;display:flex}.field__label{color:#555;font-size:.8rem;font-weight:600}.field__hint{color:#888;margin:0;font-size:.75rem;line-height:1.4}.field__error{color:#c0392b;margin:0;font-size:.78rem;line-height:1.4}.field__hint--cta{color:#1f3a5f;background:#eef4fb;border:1px solid #c5d8ef;border-left:4px solid #2f6fb3;border-radius:8px;margin:0;padding:.65rem .8rem;font-size:.82rem;line-height:1.45}.field__hint--cta strong{font-weight:700}.field input{border:1px solid #ccc;border-radius:8px;padding:.55rem .65rem;font-family:inherit;font-size:.9rem}.field input:focus{border-color:var(--purple);outline:none;box-shadow:0 0 0 3px #5c2d941f}.photo-preview{align-items:center;gap:.75rem;display:flex}.photo-preview img{object-fit:cover;border:1px solid var(--line);border-radius:50%;width:64px;height:64px}.link-button{color:var(--purple);cursor:pointer;background:0 0;border:none;padding:0;font-size:.8rem;text-decoration:underline}.framer-backdrop{z-index:50;background:#140c238c;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.framer{background:#fff;border-radius:12px;flex-direction:column;gap:.75rem;width:100%;max-width:360px;padding:1.25rem;display:flex}.framer__title{text-transform:uppercase;letter-spacing:.08em;color:var(--purple);margin:0;font-size:1rem}.framer__viewport{touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;background:#f0eef5;border-radius:8px;margin:.25rem auto;position:relative;overflow:hidden}.framer__viewport:active{cursor:grabbing}.framer__mask{pointer-events:none;border-radius:50%;position:absolute;inset:0;box-shadow:0 0 0 9999px #fff9}.framer__zoom{flex-direction:column;gap:.3rem;display:flex}.framer__zoom input{width:100%}.framer__actions{justify-content:space-between;align-items:center;gap:.75rem;margin-top:.25rem;display:flex}.primary-button:disabled{opacity:.6;cursor:default}.preview{flex-direction:column;gap:1rem;display:flex}.preview__frame{border:1px dashed var(--line);background:#fff;border-radius:8px;padding:.5rem;overflow-x:auto}.preview__canvas--desktop{min-width:760px}.preview__canvas--mobile{width:375px;margin:0 auto}.preview__toolbar{gap:.25rem;display:flex}.preview__toggle{color:var(--purple);border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:8px;padding:.35rem .9rem;font-size:.85rem;font-weight:600}.preview__toggle.is-active{background:var(--purple);color:#fff;border-color:var(--purple)}.preview__actions{gap:.75rem;display:flex}.primary-button{background:var(--purple);color:#fff;cursor:pointer;letter-spacing:.03em;border:none;border-radius:8px;padding:.65rem 1.25rem;font-size:.9rem;font-weight:600}.primary-button:hover{background:#4a2479}.secondary-button{color:var(--purple);border:1px solid var(--purple);cursor:pointer;letter-spacing:.03em;background:0 0;border-radius:8px;padding:.65rem 1.25rem;font-size:.9rem;font-weight:600}.secondary-button:hover{background:#5c2d9414}.preview__fallback{border:1px solid #ccc;border-radius:8px;width:100%;min-height:160px;padding:.5rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.75rem}