/* метр.art — architectural wordmark, graphite surfaces and signal lime. */
:root{--art-accent:#d6ff47;--art-ink:#171b16;--art-muted:#71796b;--art-surface:#fff;--art-soft:#eaece4;--art-line:#dce0d5;--green:#3c5a20;--lime:#d6ff47;--paper:#f4f5ef;--ink:#20261e;--muted:#727b6c;--line:#dce0d5}
html[data-theme=dark]{--art-accent:#d6ff47;--art-ink:#171b16;--art-muted:#a3ad99;--art-surface:#1b211a;--art-soft:#252d22;--art-line:#343f2e;--green:#d6ff47;--lime:#d6ff47;--paper:#121710;--ink:#f0f3e9;--muted:#a3ad99;--line:#343f2e}
body,html[data-theme=dark] body{background:var(--paper);color:var(--ink)}
aside,html[data-theme=dark] aside{background:var(--art-surface);border-color:var(--line);backdrop-filter:none}
.logo{gap:9px;cursor:default}.logo .brand-symbol{width:39px;height:39px;border-radius:11px;box-shadow:none;transition:none}.logo:hover .brand-symbol{transform:none}.logo .brand-word,html[data-theme=dark] .logo .brand-word{font-size:29px;letter-spacing:-1.8px;color:var(--ink);font-weight:800!important;white-space:nowrap}.logo .brand-point{color:var(--ink);letter-spacing:-1.4px}.logo small,html[data-theme=dark] .logo small{font-size:5.5px;letter-spacing:.65px;color:var(--muted);margin-top:8px}.workspace,html[data-theme=dark] .workspace{color:var(--muted);font-size:8px;letter-spacing:1.4px}
nav button,html[data-theme=dark] nav button{color:var(--muted)}nav button.active,html[data-theme=dark] nav button.active{background:var(--art-accent);color:#171b16;border-radius:9px}nav button:hover,html[data-theme=dark] nav button:hover{background:var(--art-soft);color:var(--ink)}nav button.active:hover,html[data-theme=dark] nav button.active:hover{background:#c7f235;color:#171b16}
.heading{position:relative;padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:25px}.heading:after{content:'';position:absolute;left:0;bottom:-1px;width:54px;height:3px;background:var(--art-accent)}h1{font-weight:800;letter-spacing:-1.5px;line-height:1.12}.eyebrow{color:var(--muted);font-weight:700;letter-spacing:1.5px}.sub{line-height:1.7;color:var(--muted)}
.card,html[data-theme=dark] .card,.row,html[data-theme=dark] .row{background:var(--art-surface);border-color:var(--line);border-radius:14px;box-shadow:none;animation:none}.card:hover,html[data-theme=dark] .card:hover{background:var(--art-surface);box-shadow:none;border-color:var(--art-line)}
.primary,html[data-theme=dark] .primary{background:var(--art-accent);color:#171b16;border:1px solid transparent;border-radius:9px;font-weight:800;box-shadow:none}.primary:hover,html[data-theme=dark] .primary:hover{background:#c7f235;color:#171b16;box-shadow:0 5px 15px #171b1612}.secondary,.chip,html[data-theme=dark] .secondary,html[data-theme=dark] .chip{background:var(--art-surface);color:var(--ink);border-color:var(--line);border-radius:8px}.chip.active,html[data-theme=dark] .chip.active{background:var(--art-accent);border-color:var(--art-accent);color:#171b16}.tag,.local-badge,html[data-theme=dark] .tag,html[data-theme=dark] .local-badge{background:var(--art-soft);color:var(--ink);border-radius:5px}.local-badge{font-size:9px}
button{transition:background .16s,border-color .16s,box-shadow .16s}button:hover{transform:none}button:active{transform:translateY(1px)}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #8aaf16;outline-offset:3px}
input,select,textarea,html[data-theme=dark] input,html[data-theme=dark] select,html[data-theme=dark] textarea,html[data-theme=dark] #post{background:var(--paper);color:var(--ink);border-color:var(--line);border-radius:8px}input:focus,select:focus,textarea:focus,html[data-theme=dark] input:focus,html[data-theme=dark] select:focus,html[data-theme=dark] textarea:focus{border-color:#91ac42;box-shadow:0 0 0 3px #a6bd4f19}label,html[data-theme=dark] label{color:var(--ink)}
.preview,.proof,html[data-theme=dark] .preview,html[data-theme=dark] .proof{background:var(--art-soft);border-color:var(--line)}.starter-card,html[data-theme=dark] .starter-card,.visual-preset,html[data-theme=dark] .visual-preset{background:var(--art-surface);color:var(--ink);border-color:var(--line);animation:none}.starter-card.selected,.visual-preset.selected,html[data-theme=dark] .starter-card.selected,html[data-theme=dark] .visual-preset.selected{background:var(--art-soft);border-color:#8ba732;outline-color:#8ba732}.starter-tag,html[data-theme=dark] .starter-tag{background:var(--art-soft);color:var(--ink)}.starter-use,.starter-arrow{color:var(--green)}.starter-description,.visual-preset small,html[data-theme=dark] .visual-preset small{color:var(--muted)}
.workbench-nav,html[data-theme=dark] .workbench-nav{background:var(--art-soft);border-color:var(--line);border-radius:11px}.workbench-nav button,html[data-theme=dark] .workbench-nav button{color:var(--muted)}.workbench-nav button.active,html[data-theme=dark] .workbench-nav button.active{background:var(--art-surface);color:var(--ink);box-shadow:0 2px 5px #00000008}.creative-setting-group,.post-setting-group,.visual-library,html[data-theme=dark] .creative-setting-group,html[data-theme=dark] .post-setting-group,html[data-theme=dark] .visual-library{background:var(--art-surface);border-color:var(--line)}.creative-setting-group summary>span,html[data-theme=dark] .creative-setting-group summary>span{background:var(--art-soft);color:var(--ink)}.creative-grid .canvas-wrap,html[data-theme=dark] .creative-grid .canvas-wrap{background:var(--art-soft)}
.theme-picker,html[data-theme=dark] .theme-picker{background:var(--art-soft);border-color:var(--line)}.theme-picker button,html[data-theme=dark] .theme-picker button{color:var(--muted)}.theme-picker button.selected,html[data-theme=dark] .theme-picker button.selected{background:var(--art-surface);color:var(--ink);box-shadow:none}
aside .side-bottom>.small-brand,html[data-theme=dark] aside .side-bottom>.small-brand{background:none;border:0;border-radius:0;padding:0;color:var(--muted);font-size:9px;white-space:normal}aside .side-bottom>.small-brand:before{background:var(--art-accent);box-shadow:none;border-radius:1px;width:5px;height:5px}.profile,html[data-theme=dark] .profile{border-color:var(--line)}.account-trigger>b{background:var(--art-soft);color:var(--ink)}.account-trigger i{color:var(--muted)}header,html[data-theme=dark] header,footer{color:var(--muted)}footer{letter-spacing:1.3px}.click-feedback{display:none!important}
.auth-layout{background:var(--paper);color:var(--ink)}.auth-brand{background:#171b16;background-image:linear-gradient(90deg,#d6ff4707 1px,transparent 1px),linear-gradient(#d6ff4707 1px,transparent 1px);background-size:54px 54px;color:#f0f3e9;border-right:1px solid #343f2e}.auth-word{font-size:clamp(48px,5.3vw,76px);font-weight:800;letter-spacing:-4px;line-height:1}.auth-word>span{display:inline-block;color:#d6ff47;letter-spacing:-3px}.auth-eyebrow{color:var(--muted)}.auth-brand .auth-eyebrow{color:#d6ff47}.auth-brand h1{font-size:clamp(35px,3.7vw,60px);line-height:1.06;letter-spacing:-2px;margin-top:24px}.auth-brand p{color:#b1baa9;max-width:350px}.auth-brand>small{color:#a5b098;border-left:3px solid #d6ff47;padding-left:13px}.auth-tabs{border-color:var(--line)}.auth-tabs button{color:var(--muted)}.auth-tabs button[aria-pressed=true]{border-color:#91ac42;color:var(--ink)}.auth-links button{color:var(--green)}.auth-card input,.account-dialog input,html[data-theme=dark] .auth-card input,html[data-theme=dark] .account-dialog input{background:var(--art-surface);color:var(--ink);border-color:var(--line)}.account-dialog{background:var(--paper);color:var(--ink);border-color:var(--line)}.auth-card h2{letter-spacing:-1px}
#toast{background:#20291a;color:#f0f3e9;border:1px solid #495c35}html[data-theme=dark] .auth-note{color:var(--muted)}
@media(max-width:1050px) and (min-width:701px){.logo{gap:7px}.logo .brand-symbol{width:30px;height:30px}.logo .brand-word{font-size:25px}.logo small{font-size:4.5px;letter-spacing:.4px}}
@media(max-width:750px){.auth-word{font-size:42px;letter-spacing:-2px}.auth-word>span{letter-spacing:-2px}.auth-brand{padding:25px}.auth-panel{padding-top:30px}.heading{padding-bottom:16px}h1{font-size:28px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

/* Short copy and a calmer working canvas. */
.auth-brand{background-image:none}.auth-brand h1{font-size:clamp(32px,3.3vw,52px)}.auth-brand>small{display:none}.auth-brand p{font-size:14px;max-width:310px}.logo small{font-size:6px;letter-spacing:1.3px}footer{font-size:9px;letter-spacing:.7px}.heading .eyebrow{display:none}.heading h1{font-size:30px;letter-spacing:-1px}.heading:after{height:2px;width:28px}.heading .sub{font-size:12px}.starter-heading .eyebrow{display:none}.starter-heading h2,.visual-library .starter-heading h2{font-size:20px}.starter-description{line-height:1.5}.card{padding:24px}.auth-tabs button[aria-pressed=true]{border-color:#809176}.auth-brand{background:#1b201d}.auth-brand .auth-eyebrow{color:#c7d3be}.auth-note{font-size:11px}@media(max-width:700px){.card{padding:17px}.heading h1{font-size:26px}}

/* New visual library: large images, quiet framing and no horizontal strip. */
.ai-visual-library{padding:24px;border-radius:18px}.ai-visual-library .visual-presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:visible;gap:18px;padding:0}.ai-visual-library .visual-preset{min-width:0;width:100%;padding:0 0 15px;border-radius:14px;border-color:transparent;background:transparent!important;overflow:hidden;outline:none!important}.ai-visual-library .visual-preset canvas{width:100%;max-height:none;height:auto;border-radius:12px;box-shadow:none;display:block;aspect-ratio:4/5;object-fit:cover}.ai-visual-library .visual-preset.selected{border-color:#93b1aa;box-shadow:0 0 0 2px #93b1aa35}.ai-visual-library .visual-preset strong{display:block;padding:13px 12px 0;font-size:13px}.ai-visual-library .visual-preset small{display:block;padding:5px 12px 0;font-size:10px;color:var(--muted)}.ai-visual-library .starter-heading{margin-bottom:24px}.ai-visual-library .agency-template-filters{gap:6px;margin-bottom:22px}.ai-visual-library .agency-template-filters button{padding:8px 12px;font-size:11px}@media(max-width:1200px){.ai-visual-library .visual-presets{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:850px){.ai-visual-library .visual-presets{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ai-visual-library{padding:16px}}

.ai-visual-library [data-visual][hidden]{display:none!important}

#holidayLibrary[hidden]{display:none!important}.holiday-heading{display:flex;align-items:center;justify-content:space-between;gap:22px;margin:4px 0 24px}.holiday-heading h2{margin:0 0 9px;font-size:24px;letter-spacing:-.7px}.holiday-heading p{margin:0;color:var(--muted);font-size:12px}.holiday-heading a{text-decoration:none;white-space:nowrap}.holiday-formats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}.holiday-formats small{display:block;margin-top:4px;opacity:.65;font-size:9px}.holiday-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.holiday-card{min-width:0;background:var(--art-surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}.holiday-card>img{width:100%;height:290px;object-fit:contain;background:#171b16;display:block}.holiday-card>div{padding:16px}.holiday-card h3{font-size:14px;line-height:1.45;min-height:40px;margin:7px 0 15px}.holiday-card small{color:var(--muted);font-size:10px}.holiday-card a{display:inline-flex;text-decoration:none;font-size:10px;padding:9px 11px}@media(max-width:1150px){.holiday-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:850px){.holiday-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.holiday-heading{align-items:flex-start;flex-direction:column}.holiday-card>img{height:250px}.workbench-nav{flex-wrap:wrap}}@media(max-width:450px){.holiday-grid{grid-template-columns:1fr 1fr}.holiday-card>img{height:190px}.holiday-card>div{padding:11px}.holiday-card a{padding:8px;font-size:9px}}

.auth-brand.has-auth-video{position:sticky;top:0;height:100svh;min-height:480px;padding:0;gap:0;overflow:hidden;background:#0d150a;align-self:start}.auth-brand.has-auth-video>:not(video):not(.auth-video-toggle){display:none!important}.auth-brand .auth-video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#0d150a}.auth-video-toggle{position:absolute;right:20px;bottom:20px;z-index:1;padding:8px 12px;border:1px solid #ffffff32;border-radius:7px;color:#eef3e8;background:#10170caa;font-size:10px;backdrop-filter:blur(8px)}.auth-video-toggle:hover{background:#283422}.auth-video-toggle[hidden]{display:none}.auth-panel{min-height:100svh}@media(max-width:750px){.auth-brand.has-auth-video{position:relative;top:auto;height:280px;min-height:0}.auth-brand .auth-video{object-fit:contain}.auth-video-toggle{right:12px;bottom:12px}.auth-panel{min-height:0}}

.workbench-nav[hidden]{display:none!important}.holiday-menu-entry span{line-height:1.35}

/* Match the decoded video background exactly; no gradients or contrasting side bands. */
.auth-brand.has-auth-video,.auth-brand .auth-video{background:#0d1408!important;background-image:none!important}.auth-brand.has-auth-video{border-right:0}
/* Compact navigation with a scroll fallback on short desktop viewports. */
@media(min-width:701px){
  body>aside{height:100vh;height:100dvh;max-height:100dvh;min-height:0;padding:20px 16px 16px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
  body>aside>*{flex-shrink:0}
  body>aside .logo{gap:8px}
  body>aside .logo .brand-symbol{width:32px;height:32px;border-radius:9px}
  body>aside .logo .brand-word{font-size:26px;letter-spacing:-1.5px}
  body>aside .logo small{font-size:5px;letter-spacing:.8px;margin-top:6px}
  body>aside .workspace{margin:27px 9px 12px;font-size:8px}
  body>aside>nav{display:grid;gap:4px;align-content:start}
  body>aside>nav>button{padding:10px 11px;min-height:40px;gap:10px;font-size:16px;line-height:1.25}
  body>aside>nav>button>span{font-size:12px;line-height:1.3}
  body>aside .side-bottom{margin-top:auto;padding-top:20px}
  body>aside .side-bottom>.small-brand{font-size:8px}
  body>aside .profile{margin-top:12px;padding-top:12px;gap:8px}
  body>aside .account-trigger>b{padding:8px;font-size:10px}
  body>aside .account-trigger>span{font-size:10px}
  body>aside .account-sync{font-size:8px;margin-top:8px}
}
@media(min-width:701px) and (max-height:650px){
  body>aside{padding-top:14px;padding-bottom:12px}
  body>aside .workspace{margin-top:18px;margin-bottom:8px}
  body>aside>nav>button{min-height:34px;padding:7px 10px}
  body>aside>nav>button>span{font-size:11px}
  body>aside .side-bottom{padding-top:12px}
}
