:root{color-scheme:only light;--color-canvas:#f5f5f5;--color-paper:#ffffff;--color-surface-alt:#fafafa;--color-ink:#0a0a0a;--color-ink-soft:#171717;--color-mid-gray:#737373;--color-hairline:#e5e5e5;--color-ember:#e7000b;--bg:var(--color-canvas);--panel:var(--color-paper);--ink:var(--color-ink);--muted:var(--color-mid-gray);--line:var(--color-hairline);--accent:var(--color-ink);--error:var(--color-ember);--radius-cards:24px;--radius-inputs:18px;--radius-buttons:18px;--shadow-card:0 0 0 1px rgb(23 23 23 / .05),0 1px 3px rgb(0 0 0 / .1),0 1px 2px -1px rgb(0 0 0 / .1);--ease:cubic-bezier(.22,1,.36,1);font-family:Geist,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-feature-settings:"ss01" on,"cv11" on;color:var(--ink);background:var(--bg)}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);forced-color-adjust:none}
body{font-size:14px;line-height:1.43}button,input,textarea,select{font:inherit}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}
a{color:var(--accent);text-underline-offset:4px}button{cursor:pointer}
button,.button{min-height:44px;border:1px solid var(--line);border-radius:var(--radius-buttons);background:var(--bg);color:var(--ink);padding:10px 16px;font-size:14px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;line-height:1.3;transition:transform 120ms var(--ease),background-color 160ms var(--ease),border-color 160ms var(--ease);max-width:100%}
button:hover,.button:hover{border-color:#737373}button:active,.button:active{transform:scale(.98)}
button:disabled{opacity:.45;cursor:not-allowed;transform:none}
button.primary,.button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
button.quiet,.button.quiet{background:transparent;border-color:transparent}
button.danger{color:var(--error)}button.small,.button.small{font-size:13px;padding:8px 12px}
button.icon-button{width:44px;min-height:44px;padding:8px;flex:0 0 44px}
button svg,.button svg,.nav-icon{display:block;width:20px;height:20px;flex:0 0 20px;margin:0;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app-header{height:72px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:16px}
.wordmark{min-height:44px;font-size:24px;font-weight:600;letter-spacing:-.025em;text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:16px}
.wordmark span{font-size:12px;font-weight:400;color:var(--muted);letter-spacing:0;border-left:1px solid var(--line);padding-left:16px}
.header-actions{display:flex;align-items:center;gap:16px}.sync-label{font-size:12px;color:var(--muted)}
main{max-width:1280px;margin:auto;padding:32px 24px 64px;min-width:0}
.loading{padding:80px 0;color:var(--muted)}.skip{position:fixed;top:-100px;z-index:100;background:white;padding:12px}.skip:focus-visible{top:8px}
h1,h2,h3,p{margin-top:0}h1{font-size:30px;letter-spacing:-.025em;font-weight:600;line-height:1.2;margin-bottom:16px}
h2{font-size:24px;letter-spacing:-.025em;font-weight:600;line-height:1.33;margin-bottom:8px}
h3{font-size:15px;font-weight:600;margin-bottom:8px}.muted,.hint{color:var(--muted)}
.hint{font-size:14px;line-height:1.5;margin:8px 0 0}.eyebrow{display:block;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:16px}
.row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.row.end{justify-content:space-between}.stack{display:grid;gap:16px}
.section{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-cards);padding:20px;margin-bottom:16px;min-width:0;box-shadow:var(--shadow-card)}
.section-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:24px}.section-head p{margin-bottom:0}
.section-head .eyebrow{margin-bottom:8px}
label{display:block;font-size:13px;font-weight:500;margin-bottom:8px}
input,textarea,select{display:block;width:100%;min-width:0;max-width:100%;border:1px solid transparent;border-radius:var(--radius-inputs);color:var(--ink);background:var(--bg);font-size:16px;min-height:44px;padding:10px 12px;line-height:1.35}
textarea{resize:vertical;min-height:88px}form>label:not(:first-child){margin-top:16px}
input[type=checkbox]{width:20px;height:20px;min-height:20px;flex:0 0 20px;accent-color:var(--accent)}
input[aria-invalid=true],textarea[aria-invalid=true]{border-color:var(--error);box-shadow:0 0 0 1px #e7000b20}
.field-error{font-size:13px;color:var(--error);margin:8px 0 0;line-height:1.5}
.check{display:flex;gap:8px;align-items:flex-start;font-size:13px;font-weight:400}
.form-actions{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:16px;flex-wrap:wrap}
.status{font-size:12px;color:var(--accent)}.warning{border:1px solid #e5e5e5;background:#fafafa;border-radius:18px;padding:16px;color:#171717;font-size:13px;margin-bottom:16px}
.error{color:var(--error);font-size:13px;white-space:pre-wrap}.success{color:var(--accent)}
.app-toolbar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:24px}.app-toolbar h1{margin-bottom:0}.app-toolbar .eyebrow{margin-bottom:8px}
.desktop-nav{display:flex;gap:8px;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:24px}
.desktop-nav button{background:transparent;border:0;color:var(--muted)}
.desktop-nav button.active{background:#fff;color:var(--accent)}
.workspace{display:grid;grid-template-columns:minmax(0,3fr) minmax(354px,2fr);gap:24px;align-items:start;min-width:0}
.main-pane,.preview-column{min-width:0}.preview-column{position:sticky;top:24px}
.workspace.view-profile{display:block;max-width:none}
.workspace.no-card:not(.view-profile){display:block;max-width:720px;margin:auto}
.preview-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:16px;font-size:12px;color:var(--muted)}
.preview-top .open-page{padding:8px 14px;border:1px solid #e5e5e5;border-radius:18px;font-size:13px}
.phone-frame{height:690px;width:354px;max-width:100%;margin:0 auto;position:relative;border:6px solid #171717;border-radius:18px;overflow:hidden;background:var(--bg);box-shadow:0 2px 4px #0a0a0a08,0 16px 40px #0a0a0a0c}
.phone-frame iframe{position:absolute;inset:0;display:block;border:0;width:100%;height:100%;background:var(--bg);transition:opacity 220ms var(--ease)}
.preview-next{opacity:0;z-index:2;pointer-events:none}.preview-current{opacity:1;z-index:2}.preview-leaving{opacity:0;z-index:3;pointer-events:none}
.share-panel{margin:24px 0 0;padding:24px;border:1px solid var(--line);border-radius:18px;background:#fff}
.share-panel h2{font-size:18px}.share-panel>.hint{margin:0 0 16px}
.export-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.export-grid button{font-size:13px;padding:10px 8px}
.export-grid button:last-child:nth-child(3){grid-column:1/-1}
.share-tools{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:8px}.share-tools button{font-size:12px;padding:8px}
.editor-divider{height:1px;background:var(--line);margin:24px 0}
.upload-control{margin-bottom:24px}.drop-zone{position:relative;min-height:80px;display:flex;align-items:center;gap:16px;border:1px dashed #e5e5e5;border-radius:18px;padding:16px;cursor:pointer;background:var(--bg);font-size:14px}
.upload-status{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:13px;color:var(--muted)}
.drop-zone:focus-within,.drop-zone.dragging{outline:2px solid var(--accent);outline-offset:3px}
.drop-zone img{width:64px;height:48px;object-fit:contain}.drop-zone>svg{width:24px;height:24px;flex:0 0 24px;stroke:currentColor;fill:none;stroke-width:1.5}
.drop-zone small{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:4px}
.drop-zone input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer;padding:0}
.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}.mode-choice{font-size:13px;padding:10px 8px}
.mode-choice.active{border-color:var(--accent);background:#f5f5f5;color:var(--accent)}
.smart-input{display:flex;gap:8px;flex-wrap:wrap}.smart-input input{flex:1;min-width:180px}.smart-input button{white-space:nowrap}
.contact-row{display:grid;grid-template-columns:32px minmax(0,1fr);gap:8px 12px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);min-width:0;animation:arrive 220ms var(--ease)}
.contact-glyph{width:32px;height:32px;border-radius:18px;background:var(--bg);display:flex;align-items:center;justify-content:center}
.contact-glyph img{width:20px;height:20px;object-fit:contain}.contact-content{min-width:0}
.contact-name.quiet{min-height:44px;max-width:100%;padding:0;text-align:left;justify-content:flex-start;overflow-wrap:anywhere;line-height:1.35;word-break:break-word;font-size:14px}
.contact-name svg{width:14px;height:14px;flex-basis:14px;color:var(--muted)}
.contact-url{font-size:12px;color:var(--muted);overflow-wrap:anywhere;line-height:1.5}
.contact-actions{grid-column:2;display:flex;gap:8px;justify-content:flex-end}.contact-actions button{min-height:44px}
.contact-empty{padding:16px 0}
.contact-removed{display:flex;gap:8px;align-items:center;justify-content:space-between;min-height:64px;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted)}
details summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:14px;gap:8px}
details summary:before{content:'+';font-weight:400;color:var(--muted);font-size:18px}
details[open]>summary:before{content:'−'}
.contact-options{margin-top:8px}.advanced summary{font-size:13px}.advanced{padding-top:8px;padding-bottom:8px}.danger-zone summary{color:var(--error)}
.empty-state{text-align:center;max-width:480px;margin:32px auto;padding:32px}.empty-state form{text-align:left;margin-top:24px}
.empty-state button[type=submit]{width:100%;margin-top:16px}.empty-state h1{font-size:28px}
.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:24px 0}
.metric{padding:16px 12px;background:#fafafa;border:1px solid var(--line);border-radius:24px;min-width:0}.metric strong{display:block;font-size:36px;line-height:1.2;letter-spacing:-.025em;font-weight:600;margin:8px 0}.metric span{display:block;font-size:12px;color:var(--muted)}
.stats-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;font-size:13px}.stats-top span{overflow-wrap:anywhere}
.segment{display:flex;gap:4px;border:1px solid var(--line);border-radius:24px;padding:4px;background:#fafafa}.segment button{font-size:13px;padding:8px 12px;border:0;border-radius:18px;background:transparent;white-space:nowrap}.segment .active{background:var(--accent);color:#fff}
.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:24px}
.plan{border:1px solid var(--line);border-radius:18px;padding:16px}.plan strong{font-size:24px;font-weight:500;display:block}.plan p{font-size:12px;color:var(--muted);margin:8px 0 16px}.plan button{width:100%;font-size:13px;padding:8px}
.profile-meta{font-size:13px;display:grid;grid-template-columns:80px minmax(0,1fr);gap:8px;margin:16px 0}.profile-meta dd{margin:0;overflow-wrap:anywhere}.profile-meta dt{color:var(--muted)}
.key-output{display:block;background:var(--bg);padding:16px;border:1px solid var(--line);border-radius:18px;overflow-wrap:anywhere;font-family:ui-monospace,monospace;font-size:14px;line-height:1.8;margin:16px 0}
.auth-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:64px;align-items:start;margin:48px auto 0;max-width:1080px}
.auth-intro h1,.home-hero h1{font-size:clamp(36px,4vw,48px);line-height:1.1;letter-spacing:-.05em;font-weight:600;margin:24px 0}
.auth-intro .lead,.home-hero .lead{font-size:17px;color:var(--muted);line-height:1.7;max-width:460px}
.principles{display:grid;gap:24px;margin-top:40px;max-width:430px}
.principles>div{display:grid;grid-template-columns:24px 1fr;gap:16px;font-size:13px;color:var(--muted)}
.principles svg{width:20px;height:20px;stroke:var(--accent);fill:none;stroke-width:1.5}
.principles strong{display:block;font-weight:500;color:var(--ink)}
.auth-panel{padding:24px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-card)}
.auth-tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:24px}
.auth-tabs button{background:transparent;border:0;color:var(--muted);font-size:13px;padding:8px 12px}.auth-tabs button.active{background:var(--bg);color:var(--ink)}
.auth-panel form{margin-top:24px}.text-button{border:0;background:transparent;padding:8px 0;color:var(--accent);font-size:13px}
.below,.legal-note{font-size:12px;color:var(--muted);line-height:1.6;margin:24px 0 0}
.home-hero{display:grid;grid-template-columns:1.2fr 1fr;gap:96px;align-items:center;padding:64px 0}
.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:24px}
.secondary-link{font-size:14px;min-height:44px;display:inline-flex;align-items:center}
.home-details{display:grid;gap:24px}.home-detail{padding-bottom:24px;border-bottom:1px solid var(--line)}.home-detail:last-child{border:0}
.home-detail h2{font-size:18px}.home-detail p{font-size:14px;color:var(--muted);line-height:1.6;margin:0}
.home-footer{border-top:1px solid var(--line);padding-top:24px;font-size:12px;color:var(--muted);line-height:1.7;margin-top:32px}
.editor-tabs{display:flex;gap:8px;margin-bottom:16px}
.editor-tabs button{flex:1;background:transparent}
.editor-tabs button[aria-selected=true]{background:var(--ink);color:white;border-color:var(--ink)}
.qr-design-layout{display:grid;grid-template-columns:180px minmax(0,1fr);gap:24px;align-items:start;margin:24px 0}
.qr-current{margin:0;text-align:center;min-width:0}.qr-current>img{display:block;width:100%;height:auto;background:white;border:1px solid var(--line);border-radius:12px}
.qr-current figcaption{font-size:12px;line-height:1.6}
.qr-template-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-width:0}
.qr-choice{flex-direction:column;gap:8px;padding:12px 6px;min-width:0;min-height:112px;background:white}
.qr-choice img{display:block;width:64px;height:64px;max-width:100%;object-fit:contain}
.qr-choice span{font-size:12px;line-height:1.4;overflow-wrap:anywhere}
.qr-choice[aria-pressed=true]{border:2px solid var(--ink);padding:11px 5px;background:var(--bg)}
@media(max-width:1100px){.qr-design-layout{grid-template-columns:1fr}.qr-current{width:180px;margin:0 auto}}
.seo-section{border-top:1px solid var(--line);padding:48px 0;max-width:100%;min-width:0}
.seo-section>h2{font-size:clamp(24px,3vw,32px);max-width:720px;text-wrap:balance;margin-bottom:32px}
.seo-cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.seo-cases article{min-width:0;padding-left:20px;border-left:1px solid var(--line)}
.seo-cases h3{font-size:18px;line-height:1.4;text-wrap:balance}
.seo-cases p,.seo-faq details p,.seo-pricing{font-size:15px;line-height:1.75;color:var(--muted);margin-bottom:0;overflow-wrap:anywhere}
.seo-faq details{border-bottom:1px solid var(--line);padding:0 0 16px;margin-bottom:16px}
.seo-faq summary{font-size:16px;font-weight:500;cursor:pointer;min-height:48px;padding:12px 32px 12px 0;line-height:1.5}
.seo-faq details p{max-width:820px;padding:0 0 8px}.seo-pricing{max-width:820px;margin-top:32px}
.home-footer nav{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:16px}.home-footer nav a{display:inline-flex;align-items:center;min-height:44px}
.info-page{max-width:800px}.info-page>h1{margin:32px 0}.info-page section{margin:32px 0}.info-page section p{font-size:16px;line-height:1.75;color:var(--muted)}
@media(max-width:959px){.seo-section{padding:32px 0}.seo-cases{grid-template-columns:1fr;gap:24px}.seo-section>h2{margin-bottom:24px}}
dialog{border:1px solid var(--line);border-radius:24px;padding:24px;width:min(520px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;color:var(--ink);background:#fff;box-shadow:var(--shadow-card)}
dialog::backdrop{background:#0a0a0a55;backdrop-filter:blur(3px)}
dialog form{display:grid;gap:16px}dialog h2{margin-bottom:16px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:24px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:1000;max-width:min(480px,calc(100% - 32px));padding:16px 24px;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--ink);box-shadow:0 8px 24px #0a0a0a14;font-size:14px;animation:toast-in 220ms var(--ease)}
.toast.error{border-color:#e7000b66;color:var(--error)}
.spinner{display:inline-block;width:16px;height:16px;border:1.5px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite;flex:0 0 16px}
.offline-card{max-width:520px;margin:48px auto;text-align:center}.offline-card img{display:block;max-width:240px;width:100%;margin:24px auto}.offline-card .button,.offline-card button{margin-top:24px}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes toast-in{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
.bottom-nav{display:none}
.section h2{display:flex;align-items:center;gap:10px}.section h2>svg{width:22px;height:22px;flex:0 0 22px;fill:none;stroke:var(--accent);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.optional{font-size:12px;color:var(--muted);font-weight:400;margin-left:8px}
.mobile-preview-button{display:none}
.card-switcher{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;margin-bottom:24px;box-shadow:0 1px 2px #0a0a0a03,0 8px 24px #0a0a0a03}
.switcher-top{display:flex;align-items:center;gap:16px;justify-content:space-between}.switcher-top>.custom-select{min-width:0;flex:1;max-width:480px}.switcher-actions{display:flex;gap:8px;flex-wrap:wrap}
button.danger-outline{border-color:#e5e5e5;background:#fafafa;color:#e7000b}button.danger-outline:hover{background:#f5f5f5;border-color:#e7000b}
.card-avatar{width:36px;height:36px;flex:0 0 36px;object-fit:contain;background:#fafafa;border-radius:18px;padding:3px}
.monogram-small{display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:13px;font-weight:600}
.card-pills{display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin;max-width:100%;padding:12px 0 4px}
.card-pill{flex:0 0 auto;border-radius:18px;padding:4px 12px 4px 5px;font-size:13px;max-width:260px;background:#fafafa}.card-pill span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-pill.active{color:var(--accent);background:#f5f5f5;border-color:#e5e5e5}.card-pill .card-avatar{width:30px;height:30px;flex-basis:30px;border-radius:50%}
.custom-select{position:relative;min-width:0}.select-trigger{width:100%;min-height:52px;padding:8px 12px;border:1px solid #e5e5e5;border-radius:18px;justify-content:flex-start;background:#fff}.select-trigger>span:not(.card-avatar){flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-trigger>svg:last-child{margin-left:auto;width:16px;height:16px;flex-basis:16px}.select-trigger[aria-expanded=true]{border-color:#737373;background:#fafafa}
.select-menu{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:40;border:1px solid #e5e5e5;background:#fff;border-radius:18px;padding:4px;box-shadow:0 12px 32px rgba(20,20,19,.08);max-height:320px;overflow-y:auto;animation:arrive 120ms var(--ease)}
.select-menu [role=option]{width:100%;text-align:left;justify-content:flex-start;background:transparent;border:0;border-radius:18px;padding:8px;min-height:48px;font-weight:400;overflow-wrap:anywhere}.select-menu [role=option]>span:not(.card-avatar){flex:1;min-width:0}.select-menu [role=option]:hover,.select-menu [role=option]:focus-visible,.select-menu [aria-selected=true]{background:#f5f5f5;color:#0a0a0a}.select-menu [role=option]:focus-visible{outline-offset:-2px}
.profile-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:24px;align-items:start}.profile-left,.profile-analytics{min-width:0}.profile-analytics{position:sticky;top:24px;max-height:calc(100dvh - 48px);overflow-y:auto;scrollbar-width:none;border-radius:18px}.profile-analytics::-webkit-scrollbar{display:none;width:0;height:0}.profile-analytics>.section{margin-bottom:0}
.settings-actions{display:flex;flex-wrap:wrap;gap:8px}.settings-actions button{flex:1 1 180px;justify-content:flex-start}.account-danger{margin-top:24px;padding-top:24px;border-top:1px solid #e5e5e5}.account-danger>strong{color:#e7000b}.settings-panel h2 svg{width:20px;height:20px}
.account-rows{display:grid;gap:8px;margin:0 0 16px}.account-rows>div{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fafafa;border-radius:18px;padding:12px 16px;min-height:48px;font-size:13px}.account-rows dt{color:var(--muted);flex:0 0 auto}.account-rows dd{margin:0;text-align:right;overflow-wrap:anywhere;min-width:0}
.badge{display:inline-flex;border-radius:18px;padding:4px 10px;font-size:12px;background:#f5f5f5;color:var(--muted)}.badge.connected{color:#0a0a0a;background:#f5f5f5}
.credentials{margin-top:16px}.credentials>summary.button{display:flex;justify-content:flex-start;background:#f5f5f5;border:1px solid #e5e5e5;border-radius:18px;padding:10px 16px;min-height:44px}.credentials>summary:before{display:none}.credentials form{padding-top:16px;animation:arrive 220ms var(--ease)}
.profile-cards .section-head{flex-wrap:wrap;align-items:center}.profile-card-row{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}.profile-card-row:last-child{border-bottom:0;padding-bottom:0}.profile-card-row>.card-avatar{width:44px;height:44px;flex-basis:44px}.profile-card-info{min-width:0}.profile-card-info strong{display:block;font-size:14px;overflow-wrap:anywhere}.profile-card-info small{display:block;font-size:12px;color:var(--muted);overflow-wrap:anywhere;margin-top:4px}.profile-card-actions{display:flex;gap:8px;grid-column:1/-1;flex-wrap:wrap}.profile-card-actions .small{flex:1;padding:8px;font-size:12px}
.analytics-panel .section-head{flex-wrap:wrap;gap:16px;align-items:center;margin-bottom:16px}.analytics-panel .section-head .eyebrow{font-size:12px;margin-bottom:8px}.analytics-panel .stats-grid{margin:16px 0 8px}.metric>svg{width:18px;height:18px;fill:none;stroke:var(--accent);stroke-width:1.5;margin-bottom:8px}.metric small{font-size:12px;color:var(--muted)}.metric .trend-up{color:#737373}.metric .trend-down{color:#e7000b}.comparison-note{font-size:12px;color:var(--muted);line-height:1.5;margin:0 0 24px}
.chart-heading{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;align-items:center;margin:16px 0 8px}.chart-heading h3{margin:0}.chart-legend{display:flex;gap:12px;font-size:12px;color:var(--muted)}.chart-legend span:before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:4px;background:#0a0a0a}.chart-legend .legend-qr:before{background:#737373}.chart-legend .legend-clicks:before{background:#a3a3a3}
.activity-chart{display:block;width:100%;height:auto;overflow:visible}.chart-grid line{stroke:#e5e5e5;stroke-width:1;stroke-dasharray:3 5}.chart-grid text,.chart-date{fill:#737373;font-size:12px}.chart-hit{fill:transparent}.series-0{fill:#0a0a0a}.series-1{fill:#737373}.series-2{fill:#a3a3a3}.chart-bar{transform-origin:center bottom;transform-box:fill-box;animation:bar-grow 350ms var(--ease)}.chart-day:hover .chart-hit,.chart-day:focus .chart-hit{fill:#0a0a0a0c}.chart-day:focus-visible{outline:none}.chart-day:focus-visible .chart-hit{stroke:#0a0a0a;stroke-width:1}
.chart-tooltip{font-size:12px;color:var(--muted);background:#fafafa;border-radius:18px;padding:8px 12px;min-height:40px;margin:8px 0 24px;line-height:1.6}.top-heading{margin:0 0 16px}.contact-meter{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:8px 12px;align-items:center;margin-bottom:16px;font-size:12px}.contact-meter>img{width:24px;height:24px;object-fit:contain}.meter-info{min-width:0}.meter-info strong{display:block;overflow-wrap:anywhere;font-weight:500}.meter-info small{display:block;overflow-wrap:anywhere;color:var(--muted);font-size:12px}.contact-meter>span{font-variant-numeric:tabular-nums}.contact-meter progress{grid-column:2/-1;width:100%;height:6px;appearance:none;border:0;border-radius:18px;overflow:hidden;background:#f5f5f5;accent-color:#737373}.contact-meter progress::-webkit-progress-bar{background:#f5f5f5}.contact-meter progress::-webkit-progress-value{background:#737373;border-radius:18px}.contact-meter progress::-moz-progress-bar{background:#737373;border-radius:18px}
.analytics-loading{display:flex;align-items:center;gap:8px}.analytics-panel[aria-busy=true] .stats-grid,.analytics-panel[aria-busy=true] .activity-chart{opacity:.5}
.chart-body{display:grid;grid-template-columns:24px minmax(0,1fr);gap:8px;margin-top:16px}.chart-plot{min-width:0}.chart-body .activity-chart{height:180px}.chart-axis-y{display:flex;flex-direction:column;justify-content:space-between;height:180px;font-size:12px;color:var(--muted);text-align:right}.chart-axis-x{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted);margin-top:8px}.chart-body .chart-grid line{vector-effect:non-scaling-stroke}
@keyframes bar-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
/* DESIGN.md: neutral surfaces, shared geometry and no chromatic UI accents. */
.card-switcher,.share-panel,.plan,.offline-card{border-radius:var(--radius-cards)}
.card-switcher,.share-panel{box-shadow:var(--shadow-card)}
.home-details{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-cards);padding:24px;box-shadow:var(--shadow-card)}
.home-detail:last-child{padding-bottom:0}
.phone-frame{border-radius:24px}
.contact-glyph img,.contact-meter>img{filter:grayscale(1)}
.metric .trend-up,.metric .trend-down{color:var(--muted)}
.series-0{fill:#171717}.series-1{fill:#737373}.series-2{fill:#8a8a8a}
.chart-legend .legend-views:before{background:#171717}.chart-legend .legend-qr:before{background:#737373}.chart-legend .legend-clicks:before{background:#8a8a8a}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
input:focus-visible,textarea:focus-visible,select:focus-visible{background:var(--panel);border-color:var(--line)}
.drop-zone,.select-trigger,.select-menu,.select-menu [role=option],.mode-choice,.segment,.segment button,.badge{border-radius:18px}
.toast{border-radius:24px;box-shadow:var(--shadow-card)}
.section-head .eyebrow,.analytics-panel .section-head .eyebrow{font-size:12px;letter-spacing:.05em}
.account-settings-button{border-radius:50%;align-self:flex-start}
.recovery-settings{margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}
button,.button,summary,.select-trigger,.select-menu [role=option]{transition:background-color 200ms var(--ease),color 200ms var(--ease),border-color 200ms var(--ease),box-shadow 200ms var(--ease),transform 160ms var(--ease)}
.select-menu{animation:arrive 200ms var(--ease)}
dialog[open]{animation:dialog-arrive 200ms var(--ease)}
dialog{opacity:0;transform:translateY(8px) scale(.98);transition:opacity 180ms var(--ease),transform 180ms var(--ease),display 180ms allow-discrete,overlay 180ms allow-discrete}
dialog[open]{opacity:1;transform:none}
dialog::backdrop{transition:background-color 200ms var(--ease)}
@keyframes dialog-arrive{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@media(hover:hover) and (pointer:fine){button:not(:disabled):hover,.button:hover{background:var(--color-surface-alt)}button.primary:not(:disabled):hover,.button.primary:hover{background:var(--color-ink-soft);color:#fff}}
.account-panel .section-head>div{min-width:0}
.settings-dialog .settings-actions{display:grid;gap:8px}
.settings-dialog .settings-actions button{width:100%;flex:none}
.analytics-details>summary{width:100%;justify-content:center;margin-top:16px}
.analytics-details>summary:before,.profile-cards summary:before{display:none}
.analytics-details>summary svg,.profile-cards summary>svg{width:18px;height:18px;flex:0 0 18px;stroke:currentColor;fill:none;stroke-width:1.5}
.analytics-details .when-open{display:none}
.analytics-details[open] .when-open{display:inline}.analytics-details[open] .when-closed{display:none}
.analytics-details[open]>summary svg,.profile-cards details[open]>summary>svg{transform:rotate(180deg)}
.analytics-detail-body,.profile-cards-body{padding-top:20px}
.profile-cards summary{gap:12px;min-height:44px}
.profile-cards summary h2{margin:0;flex:1;min-width:0}
.analytics-panel .metric{padding:12px 8px}.analytics-panel .metric strong{font-size:28px;margin:4px 0}
.analytics-panel .metric>svg{margin-bottom:4px}
@media(max-width:959.98px){
  .app-header{height:64px;padding:0 20px}.wordmark{font-size:24px}.wordmark span,.sync-label{display:none}
  main{padding:24px 20px calc(96px + env(safe-area-inset-bottom))}
  button,.button,input,select{min-height:48px}input,textarea,select{font-size:16px}
  button.icon-button{min-height:48px;width:48px;flex-basis:48px}
  .app-toolbar{margin-bottom:24px}.app-toolbar h1{font-size:28px}.app-toolbar>button{font-size:13px;padding:8px}
  .workspace{display:block}.preview-column{display:none;position:static}
  .preview-column.mobile-open{display:block;margin:24px auto;max-width:480px;scroll-margin-top:24px}.desktop-nav{display:none}
  .bottom-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;position:fixed;bottom:0;left:0;right:0;padding:8px 12px calc(8px + env(safe-area-inset-bottom));z-index:50;background:#fff;border-top:1px solid var(--line)}
  .bottom-nav button{display:flex;flex-direction:column;gap:4px;padding:8px 4px;border:0;background:transparent;font-size:12px;min-height:56px;color:var(--muted)}
  .bottom-nav button.active{background:#f5f5f5;color:var(--accent)}
  .section{padding:24px 16px}.section-head{margin-bottom:16px}.section-head h2{font-size:20px}
  .phone-frame{width:min(354px,100%);height:min(690px,calc((100vw - 40px)*1.95))}.share-panel{padding:16px}.export-grid button{min-height:48px;font-size:13px}
  .mobile-preview-button{display:inline-flex}.app-toolbar{align-items:center;gap:8px}.app-toolbar .eyebrow{font-size:12px}
  .card-switcher{padding:12px}.switcher-top{display:block}.switcher-top>.custom-select{max-width:none}.switcher-actions{display:grid;grid-template-columns:1fr 1fr;margin-top:12px}.switcher-actions button{font-size:12px;padding:8px}.switcher-actions svg{width:16px;height:16px;flex-basis:16px}
  .profile-layout{display:flex;flex-direction:column;gap:16px}.profile-left,.profile-analytics{width:100%}.profile-left{display:contents}.account-panel{order:-2;width:100%;margin-bottom:0}.profile-analytics{position:static;max-height:none;overflow:visible;order:-1}.profile-analytics .analytics-panel{padding:20px 16px}
  .account-rows>div{padding:12px;gap:8px}.profile-card-actions .small{min-height:48px}.credentials>summary.button{min-height:48px}.analytics-panel .section-head .segment{margin-left:auto}.metric{padding:12px 8px}.metric strong{font-size:26px}.metric span{font-size:12px}.chart-legend{gap:8px}
  .share-tools{justify-content:center}.share-tools button{min-height:48px}
  .drop-zone{padding:12px;gap:8px}.drop-zone img{width:48px}.drop-zone small{font-size:12px}
  .mode-choice{font-size:12px;padding:8px 4px}
  .smart-input input{flex-basis:100%;min-width:0}.smart-input button{width:100%}
  .contact-actions button{min-height:48px}.contact-name.quiet{min-height:48px}
  .auth-layout{display:block;margin:8px auto;max-width:520px}.auth-intro h1{font-size:36px;letter-spacing:-1px}.auth-intro .lead{font-size:15px}.auth-intro .principles{display:none}.auth-panel{margin-top:24px;padding:24px 16px}
  .auth-intro{display:none}.auth-panel{margin-top:0}
  .home-hero{display:block;padding:24px 0}.home-hero h1{font-size:44px}.home-hero .home-details{margin-top:48px}.hero-actions{gap:16px}
  .home-footer{margin-top:16px}
  .plan-grid{grid-template-columns:1fr}.plan{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;align-items:center}.plan p{margin:0}.plan button{grid-column:2;grid-row:1/3;min-width:88px}
  .toast{bottom:calc(88px + env(safe-area-inset-bottom));font-size:13px;padding:16px}
  .empty-state{margin:16px auto;padding:24px 16px}.empty-state h1{font-size:28px}
}
@media(max-width:359px){main{padding-left:12px;padding-right:12px}.app-header{padding:0 12px}.app-toolbar h1{font-size:25px}.section{padding-left:16px;padding-right:16px}.stats-grid{gap:6px}.metric{padding:12px 8px}.metric strong{font-size:24px}.metric span{font-size:12px}.auth-tabs{gap:0}.auth-tabs button{padding:8px;font-size:12px}.phone-frame{width:100%;height:570px}.export-grid button svg{display:none}.profile-card-actions .small{font-size:12px}.profile-card-actions .small svg{width:16px;height:16px;flex-basis:16px}.analytics-panel .section-head{display:block}.analytics-panel .segment{width:max-content;margin-top:16px}.chart-heading{display:block}.chart-legend{margin-top:8px}}
.signup-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden;pointer-events:none}
.telegram-entry{width:100%;margin-top:16px}
#signup-challenge:not([hidden]){display:grid;gap:8px}
.key-output{overflow-wrap:anywhere;word-break:break-word}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}button:active,.button:active{transform:none!important}}