/* La sélection — shared visual system, loaded after surface styles. */
@font-face {font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/InterVariable.woff2') format('woff2')}
:root {
  --bg:#f0f0f0; --surface:#fcfcfc; --soft:#f4f4f2; --line:#e3e3e6;
  --text:#10111b; --muted:#606173; --accent:#7d6249; --control:#8b9192;
  --hover:#eeefeb; --danger:#9b342c; --focus:#796149; --radius:12px;
  --ui-font:'Inter',Arial,Helvetica,sans-serif; --page-gap:24px;
}
:root[data-theme=dark] {
  --bg:#171d21; --surface:#22292d; --soft:#2b3439; --line:#465056;
  --text:#f3f4ef; --muted:#b9c2c5; --accent:#d5b897; --control:#919da2;
  --hover:#303b41; --danger:#ffb4a6; --focus:#e2c6a7;
}
.selection-site {font-family:var(--ui-font); background:var(--bg); line-height:1.5}
.site-frame {width:min(1280px,calc(100% - 40px)); margin:40px auto 16px; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 3px 18px #17182209; min-height:calc(100svh - 56px)}
.selection-site [hidden] {display:none!important}
.wrap {width:calc(100% - 46px)}
main.wrap {min-height:calc(100svh - 122px)}
h1,h2,h3,h4,.member-content h1,.member-phone-panel h2,.tg-detail-heading h2 {
  font-family:var(--ui-font); font-weight:650; letter-spacing:-.025em; text-wrap:balance;
}
h1 {font-size:clamp(32px,3.3vw,46px); line-height:1.13; margin:0 0 14px}
h2 {font-size:25px; line-height:1.3}
h3 {font-size:19px; line-height:1.4}
p,.prose {overflow-wrap:anywhere}
.muted,.help {color:var(--muted)}
.help {font-size:13px; line-height:1.65}
.text-link {color:var(--accent); text-underline-offset:4px; text-decoration-thickness:1px}
.text-link:hover {color:var(--text)}
a,button,input,select,textarea,summary {outline-offset:4px}
:focus-visible {outline:3px solid var(--focus)}
input,select,textarea {font-family:var(--ui-font); border-color:var(--control); border-radius:8px; font-size:15px; line-height:1.5}
input:not([type=checkbox]):not([type=range]),select {min-height:46px}
input::placeholder,textarea::placeholder {color:var(--muted); opacity:1}
label {font-size:13px; font-weight:500; color:var(--text)}
.btn,.nav-action {min-height:44px; padding:10px 16px; font-size:14px; font-weight:550; border-radius:8px; background:var(--surface)}
.btn.primary {background:var(--text); color:var(--surface); border-color:var(--text)}
.btn.primary:hover {background:var(--accent); border-color:var(--accent); color:var(--surface)}
:root[data-theme=dark] .btn.primary:hover {color:var(--bg)}
.btn.quiet {background:transparent; color:var(--muted)}
.btn:disabled,button:disabled {cursor:not-allowed; opacity:.6}
.topbar {height:auto; min-height:62px; background:transparent; border-bottom:1px solid var(--line); border-radius:12px 12px 0 0}
.topbar .wrap {display:flex; min-height:62px; gap:24px; padding:0}
.brand {max-width:none; font-size:28px; font-weight:750; gap:10px; letter-spacing:-.035em; flex-shrink:0}
.brand span {max-width:220px; overflow-wrap:anywhere; line-height:1.15}
.brand-icon {width:30px; height:30px}
.primary-links {display:flex; align-items:stretch; justify-content:center; gap:42px; margin:0 auto; align-self:stretch}
.primary-links>a {display:flex; align-items:center; position:relative; min-height:44px; font-size:14px; white-space:nowrap; color:var(--text)}
.primary-links>a:hover,.primary-links>a[aria-current=page] {color:var(--text)}
.primary-links>a[aria-current=page] {font-weight:650}
.primary-links>a[aria-current=page]::after {content:''; position:absolute; bottom:2px; left:4px; right:4px; height:3px; background:var(--accent); border-radius:2px 2px 0 0}
.header-nav {gap:12px; flex-shrink:0; width:auto}
.notification-link {width:44px; min-height:44px; display:grid; place-items:center; position:relative}
.notification-link svg {width:21px; height:21px}
.notification-link .counter {position:absolute; top:0; right:0; padding:0; font-size:11px}
.account-label {max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.theme-button {font-size:12px; padding:9px 4px; background:none}
.nav-menu summary {display:flex; gap:9px; align-items:center; border:0; padding:8px 0 8px 8px; font-size:13px}
.nav-menu summary>svg {width:15px; height:15px}
.nav-avatar {width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:var(--surface); font-weight:650}
:root[data-theme=dark] .nav-avatar {color:var(--bg)}
.nav-menu-panel {top:58px; width:272px; max-width:calc(100vw - 32px); padding:10px; border-radius:12px; z-index:40}
.nav-identity {font-size:13px; font-weight:650; padding:12px; overflow-wrap:anywhere; border-bottom:1px solid var(--line); margin-bottom:6px}
.nav-menu-panel form {border-top:1px solid var(--line); margin-top:6px; padding-top:6px}
.nav-menu-panel form button {width:100%; justify-content:flex-start}
.nav-menu-panel a:hover {background:var(--hover)}
.intro {padding:28px 0 21px; display:flex; flex-direction:row; gap:28px; align-items:flex-start}
.intro p {font-size:18px; max-width:65ch; color:var(--text)}
.intro h1 {margin-bottom:4px; font-size:40px; line-height:1.15; font-weight:750; letter-spacing:-.035em}
.intro .catalog-count {flex-shrink:0; margin:16px 0 0 auto; font-size:14px; color:var(--accent); font-variant-numeric:tabular-nums}
.compare-entry {flex-shrink:0; margin-left:auto; white-space:nowrap}
.catalog-tools {border:0; padding:0; margin:0 0 19px}
.search-line {position:relative; gap:0; align-items:stretch}
.search-field {position:relative; margin:0; flex:1; min-width:0}
.search-field>svg {position:absolute; top:19px; left:18px; width:22px; height:22px; pointer-events:none; color:var(--muted)}
.search-field input {min-height:55px; padding:14px 18px 14px 54px; font-size:16px; font-weight:400; background:var(--soft); border-color:var(--line); border-radius:9px; margin:0}
.search-submit {position:absolute; inset:7px auto 7px 7px; width:44px; padding:10px; display:grid; place-items:center; border:0; border-radius:6px; background:transparent; color:var(--text); cursor:pointer}
.search-submit svg {width:22px; height:22px}
.search-submit:hover {background:var(--soft)}
.filter-line {display:flex; gap:12px; margin-top:16px; align-items:center}
.filter-line label {font-size:13px; color:var(--text); font-weight:400; margin:0; min-width:0; width:118px}
.filter-line .category-filter {width:182px}
.filter-line select {font-size:13px; margin:0; min-height:39px; background:var(--surface); color:var(--text); border-color:var(--line); padding:9px 12px; text-overflow:ellipsis}
.filter-line .sort-filter {display:flex; align-items:center; gap:14px; width:182px; flex-shrink:0}
.sort-filter>span {flex-shrink:0}
.sort-filter select {min-width:0}
.filter-line .compare-entry {min-height:39px; padding:9px 14px; font-size:13px}
.catalog-options {position:relative; flex-shrink:0}
.catalog-options summary {width:44px; min-height:44px; justify-content:center; padding:10px; border:1px solid var(--line); border-radius:8px}
.catalog-options summary>svg {width:20px; height:20px}
.catalog-options-panel {position:absolute; z-index:35; top:52px; right:0; width:260px; max-width:calc(100vw - 32px); padding:18px; background:var(--surface); border:1px solid var(--line); border-radius:10px; display:grid; gap:14px}
.catalog-options-panel .check-label {width:auto; font-size:13px; gap:10px; white-space:normal}
.catalog-options-panel .btn {justify-content:flex-start; padding:8px 0; width:100%}
.catalog-options-panel .text-link {font-size:13px}
.filter-line select:focus {border-color:var(--focus)}
.filter-footer {margin-top:14px; gap:22px; font-size:13px}
.filter-footer .check-label {font-size:13px}
.filter-footer .btn {font-size:12px}
.filter-toggle {margin:12px 0 0; width:100%; justify-content:space-between}
.filter-toggle::after {content:'−'; font-size:20px}
.filter-toggle[aria-expanded=false]::after {content:'+'}
#catalog-results[aria-busy=true] {opacity:.55; pointer-events:none}
.result-heading {padding:0; margin:0; border:0; font-size:14px}
.result-heading strong {color:var(--text); font-weight:650; font-variant-numeric:tabular-nums}
.tag {background:var(--soft); border:0; padding:5px 10px; border-radius:6px; font-size:12px}
.catalog {grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; padding:0 0 28px; align-items:start}
.shop-card {position:relative; border:1px solid var(--line); border-radius:9px; background:var(--surface); min-width:0; overflow:hidden}
.shop-link {display:block; border-radius:inherit}
.shop-link:hover {background:var(--surface)}
.shop-card:has(.shop-link:hover) {border-color:var(--accent)}
.cover-shell {aspect-ratio:8/5; overflow:hidden; background:var(--soft); border-radius:9px 9px 5px 5px}
.cover {background:var(--soft)}
.cover-shell .cover {width:100%; height:100%; object-fit:cover}
.cover-shell .logo-cover {object-fit:scale-down; background:var(--logo-bg); padding:28px}
.cover-shell .contained-cover,.detail-hero>.contained-cover {object-fit:scale-down; background:var(--logo-bg); padding:20px}
.fallback {color:var(--accent); background:var(--soft)}
.fallback span,.member-shop-initials,.list-initials,.image-initials {font-family:var(--ui-font); font-weight:600}
.shop-card .card-body {min-height:0; padding:8px 13px 14px}
.shop-card h2 {font-size:20px; line-height:1.25; font-weight:700; margin:0 0 4px; letter-spacing:-.035em; overflow-wrap:anywhere; text-wrap:initial}
.card-arrow {font-size:18px; margin-left:10px; color:var(--muted)}
.card-category {font-size:14px; line-height:20px; color:var(--muted); margin:0 0 7px; text-transform:none; letter-spacing:0}
.section-label {margin:18px 0 9px; font-size:11px; color:var(--muted); letter-spacing:0}
.method {gap:16px; padding:12px 0; min-height:45px; font-size:14px; align-items:center}
.method:last-child {padding-bottom:2px}
.method .difficulty {gap:4px}
.difficulty i {width:11px; height:11px; border-width:1px}
.methods .empty {display:flex; align-items:center; gap:14px; padding:13px 0 0; margin-top:17px; border-top:1px solid var(--line); font-size:13px; color:var(--text); min-height:36px}
.methods .empty>svg {width:21px; height:21px; flex-shrink:0}
.methods .empty .card-arrow {margin-left:auto; font-size:23px; line-height:1}
.card-action {position:absolute; top:12px; right:12px; padding:0; border:0; margin:0}
.favorite-button {display:grid; place-items:center; border:1px solid var(--line); background:var(--surface); color:var(--text); width:42px; height:42px; border-radius:50%; padding:0; box-shadow:0 2px 6px #1718220a}
.favorite-button svg {width:21px; height:21px}
.favorite-button:hover {background:var(--soft)}
.favorite-button.is-favorite {color:var(--accent)}
.favorite-button.is-favorite svg {fill:currentColor}
.catalog-guide {display:flex; align-items:center; gap:24px; flex-wrap:wrap; color:var(--muted); padding:20px 0 30px; font-size:12px}
.catalog-guide .legend-item {font-size:12px}
.catalog.is-compact {grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}
.catalog.is-compact .card-body {padding:16px}
.catalog.is-compact h2 {font-size:19px}
.pagination {justify-content:center; gap:28px; padding:14px 0 32px}
.pagination>span {color:var(--muted); font-variant-numeric:tabular-nums}
.catalog-foot {padding:26px 0 32px; margin-top:24px; font-size:12px; gap:24px}
.catalog-foot strong {font-weight:650; color:var(--text)}
.page-heading,.admin-heading {padding:36px 0 28px}
.page-heading h1,.admin-heading h1 {font-size:clamp(30px,3vw,40px); margin-bottom:12px; font-weight:650; letter-spacing:-.025em}
.page-heading p,.admin-heading p {max-width:70ch}
.breadcrumb {font-size:12px; margin:0 0 18px; color:var(--muted)}
.breadcrumb a:hover {text-decoration:underline}
.shop-heading {padding-bottom:22px}
.shop-heading .help {font-size:12px; margin-top:6px}
.detail-nav {display:flex; gap:30px; border-bottom:1px solid var(--line); margin-bottom:30px; overflow:auto}
.detail-nav a {font-size:14px; padding:12px 0; min-height:46px; flex-shrink:0}
.detail-nav a:first-child {font-weight:650; border-bottom:2px solid var(--accent)}
.detail-nav a:hover {color:var(--accent)}
.detail-layout {grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); gap:48px; align-items:start; padding-bottom:48px}
.detail-image .cover {border-radius:12px}
.detail-image .help {font-size:12px}
.detail-copy {min-width:0}
.detail-copy>h2 {margin:0 0 20px; font-size:26px}
.detail-actions {gap:10px; margin-top:22px}
.detail-actions .text-link {font-size:13px; padding:4px 0; width:fit-content}
.detail-empty {background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:28px}
.detail-empty h3 {font-size:20px; margin:0 0 12px}
.detail-empty p {color:var(--muted); font-size:14px; max-width:60ch}
.detail-empty .btn {margin-top:22px}
.method-detail {padding:26px 0; scroll-margin-top:24px}
.method-heading {margin-bottom:10px; gap:20px}
.method-heading h3 {font-size:21px}
.method-detail h4 {margin:22px 0 8px; font-size:15px}
.review-status {display:block; font-size:12px; line-height:1.6; margin-bottom:16px}
.method-meta {padding:18px; border-radius:8px; background:var(--soft); border:0; margin-top:22px; font-size:14px}
.method-meta .help {font-size:12px}
.method-actions {gap:18px; font-size:12px; margin-top:20px}
.prose {font-size:15px; line-height:1.8; max-width:72ch}
.comments-section {max-width:880px; padding:32px 0 52px; border-top:1px solid var(--line)}
.comments-section>h2 {font-size:28px; margin-bottom:8px}
.comments-section>.muted {font-size:14px}
.comment {padding:26px 0}
.comment-meta strong {font-size:14px}
.comment-actions {gap:10px 18px; font-size:12px}
.comment-form {background:var(--surface); border:1px solid var(--line); padding:28px; border-radius:12px; margin-top:24px}
.comment-form textarea {min-height:140px}
.comment-form .btn {margin-top:12px}
.faq {padding:17px 0}
.faq summary {font-size:14px; min-height:40px}
.compare-picker {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto; gap:16px; background:var(--surface); padding:24px; border:1px solid var(--line); border-radius:12px; align-items:end}
.compare-slot {min-width:0}
.compare-slot>label {font-size:13px; margin:0 0 8px}
.compare-picker select {margin:0}
.compare-search input {font-size:14px; min-height:44px}
.compare-picker .help {font-size:11px; margin:6px 0 0; min-height:18px}
.compare-picker>.btn {align-self:center}
.comparison {gap:24px; margin-top:32px}
.comparison>section {border:1px solid var(--line); border-radius:12px; padding:0 20px 22px; background:var(--surface); overflow:hidden}
.comparison-cover {display:block; margin:0 -20px}
.comparison h2 {font-size:23px; margin:20px 0 6px}
.comparison h3 {font-size:17px}
.comparison .method-detail {padding:20px 0}
.comparison .text-link {display:inline-block; padding-top:14px; font-size:13px}
.empty-page {padding:38px 0 48px; max-width:70ch}
.empty-page h2 {font-size:25px}
.empty-page .text-link {display:inline-block; margin-top:18px}
.editorial-list {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin:0 0 40px}
.editorial-list>article {padding:26px; background:var(--surface); border:1px solid var(--line); border-radius:12px; min-width:0}
.editorial-list h2 {margin:0 0 12px}
.editorial-list .empty-page {grid-column:1/-1}
.auth-layout {max-width:500px; background:var(--surface); padding:36px; border:1px solid var(--line); border-radius:12px; margin:52px auto}
.auth-layout h1,.editor-layout h1 {font-size:36px; font-weight:650; letter-spacing:-.025em}
.auth-layout>p {font-size:14px; line-height:1.7}
.auth-layout form {margin:26px 0 18px}
.auth-layout .help {font-size:12px}
.editor-layout {max-width:760px; margin:36px auto 56px}
.editor-layout>form {padding:28px; background:var(--surface); border:1px solid var(--line); border-radius:12px}
.admin-nav {gap:6px; padding:16px 0; align-items:center; border-bottom:1px solid var(--line)}
.admin-nav a {padding:10px 13px; min-height:44px; font-size:13px; border-radius:7px; margin:0; color:var(--muted)}
.admin-nav a:hover {background:var(--hover); color:var(--text)}
.admin-nav a[aria-current=page] {background:var(--text); color:var(--surface); border:0}
.admin-nav a:last-child {margin-left:0}
.admin-shortcuts {gap:10px; padding-bottom:14px}
.admin-shortcuts>a {border:1px solid var(--line); background:var(--surface); padding:12px 16px; font-size:13px; border-radius:8px}
.admin-shortcuts>a:hover {border-color:var(--accent)}
.toolbar {gap:10px; margin:18px 0 30px}
.admin-workflows {padding:18px 0; border-bottom:1px solid var(--line); align-items:center}
.admin-workflows .btn {font-size:12px; min-height:42px}
.shop-row {padding:18px 20px; background:var(--surface); border:1px solid var(--line); border-bottom:0; gap:20px}
.shop-row:first-child {border-radius:12px 12px 0 0}
.shop-row:last-child {border-bottom:1px solid var(--line); border-radius:0 0 12px 12px}
.shop-row:only-child {border-radius:12px}
.shop-row h2 {font-size:19px; margin:0 0 4px}
.shop-row p {font-size:12px}
.row-search {display:flex; gap:20px; align-items:end; margin:0 0 24px}
.row-search label {width:560px; max-width:100%; margin:0}
.row-search input {margin-top:8px}
.row-search .help {padding-bottom:12px; white-space:nowrap}
.list-thumb,.list-initials {width:80px; height:56px; border-radius:8px}
.methods-admin-layout {gap:48px; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
.methods-admin-layout>section,.bulk-section {min-width:0}
.methods-admin-layout h2 {font-size:22px; margin-bottom:22px}
.method-library,.bulk-section>form,.new-method-form {background:var(--surface); border:1px solid var(--line); padding:22px; border-radius:12px}
.new-method-form {margin-top:24px}
.new-method-form h3 {margin-top:0}
.library-row:first-child {border:0; padding-top:0}
.library-row:last-child {padding-bottom:0}
.shop-choices>div {max-height:390px; overflow:auto; padding:6px 4px; border-block:1px solid var(--line); overscroll-behavior:contain}
.shop-choices label {padding:6px 0; min-height:44px}
.shop-choices .select-all {padding-bottom:10px}
.admin-layout {gap:48px}
.form-section h2 {font-size:20px}
.form-actions {gap:12px; flex-wrap:wrap}
.table-scroll {position:relative; border:1px solid var(--line); border-radius:10px; background:var(--surface); margin:24px 0 32px}
table {font-size:13px}
th,td {padding:16px; border-color:var(--line)}
thead {background:var(--soft)}
th {font-weight:600; white-space:nowrap}
tbody tr:last-child td {border-bottom:0}
.image-gallery {gap:24px; padding:12px 0 32px}
.image-editor {padding:22px; background:var(--surface); border:1px solid var(--line); border-radius:12px}
.image-editor h2 {font-size:20px}
.settings-layout {gap:48px}
.message,.notice {border-radius:8px; background:var(--surface); border-color:var(--line); font-size:14px}
.sticky-actions {background:var(--surface); border-top:1px solid var(--line); padding:16px; border-radius:10px 10px 0 0}
.member-shell {--member-ink:#202529; --member-paper:#ffffff; --member-on-ink:#c9ced0; gap:36px; padding-top:32px}
.member-sidebar {top:24px}
.member-avatar {font:600 20px var(--ui-font)}
.member-content h1 {font-size:38px; font-weight:650; letter-spacing:-.025em}
.member-welcome {padding:30px 32px 0; background:var(--surface); color:var(--text); border:1px solid var(--line); border-radius:12px}
.member-welcome h1 span,.member-welcome-note strong {color:var(--text)}
.member-welcome .member-eyebrow {color:var(--accent)}
.member-welcome>div>p:not(.member-eyebrow),.member-welcome-note {color:var(--muted)}
.member-welcome-note {border-color:var(--line)}
.member-welcome-note:hover {color:var(--text)}
.member-welcome-button {background:var(--text); color:var(--surface); border-color:var(--text)}
.member-welcome-button:hover {background:var(--accent); color:var(--surface); border-color:var(--accent)}
.member-phone-panel h2 {font-size:24px; font-weight:650}
.member-shop-initials {font-size:40px}
.member-eyebrow {letter-spacing:0}
.tg-heading h1 {font-family:var(--ui-font); font-weight:650; font-size:38px; letter-spacing:-.025em}
.tg-detail-heading h2 {font-family:var(--ui-font); font-weight:650; font-size:27px}
.tg-inbox {border-radius:12px}
.tg-admin-menu .admin-nav {padding:8px; gap:4px}
.tg-admin-menu .admin-nav a {padding:10px 12px}
.tg-tabs a {font-size:14px}
/* Composition of the approved mock: image-led shop page and an admin rail. */
.shop-return {display:flex; align-items:center; justify-content:space-between; padding:20px 0 16px; gap:16px}
.shop-return>a {display:flex; align-items:center; gap:6px; min-height:44px; font-size:14px}
.shop-return>a svg {width:20px; height:20px}
.shop-return .favorite-button {border:0}
.shop-page .detail-layout {align-items:start; margin-top:0; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
.detail-hero {aspect-ratio:8/5; overflow:hidden; border-radius:8px; background:var(--soft)}
.detail-hero>.cover {width:100%; height:100%; object-fit:cover}
.detail-hero>.logo-cover {object-fit:contain}
.shop-heading {padding:16px 0 8px}
.shop-heading h1 {font-size:30px; line-height:1.2; font-weight:750; margin:0 0 5px}
.shop-heading .muted {font-size:15px}
.shop-information {font-size:13px; color:var(--muted); margin:8px 0 16px}
.shop-information>summary {cursor:pointer; min-height:44px; padding:10px 0}
.shop-information .help {margin:10px 0}
.shop-page .detail-nav {justify-content:space-between; gap:16px; margin:0 0 24px; border-bottom:1px solid var(--line)}
.shop-page .detail-nav a {padding:12px 0; font-size:14px; min-height:46px; border-bottom:2px solid transparent; font-weight:400}
.shop-page .detail-nav .is-current {font-weight:650; color:var(--text); border-bottom:2px solid var(--accent)}
.shop-page .detail-copy>h2 {font-size:24px; margin-bottom:14px}
.shop-page .detail-empty {display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:28px; min-height:240px; background:var(--bg); border:0; border-radius:8px; gap:10px}
.empty-icon {width:38px; height:38px; color:var(--accent); flex-shrink:0}
.detail-empty .empty-icon {margin-bottom:14px}
.shop-page .detail-empty h3 {font-size:16px; margin:0}
.shop-page .detail-empty p {font-size:14px; color:var(--muted); margin:0; max-width:42ch}
.shop-page .detail-empty .btn {font-size:13px; margin-top:4px}
.comments-empty {display:grid; justify-items:center; text-align:center; gap:10px; padding:24px 0; color:var(--muted); font-size:14px}
.comments-empty .empty-icon {width:28px; height:28px; color:var(--muted)}
.comment-entry {gap:10px; background:var(--accent)!important; border-color:var(--accent)!important; margin:10px 0 18px}
.comment-entry svg {width:19px; height:19px}
.comment-form {scroll-margin-top:24px}
main.wrap:has(> .admin-nav) {position:relative; padding-left:212px; min-height:calc(100svh - 74px)}
main.wrap>.admin-nav {position:absolute; left:0; top:24px; width:184px; display:flex; flex-direction:column; align-items:stretch; border:0; padding:0; gap:4px}
main.wrap>.admin-nav a {display:flex; align-items:center; gap:10px; min-height:44px; padding:10px 12px; font-size:13px; border-radius:6px}
main.wrap>.admin-nav a[aria-current=page] {background:var(--bg); color:var(--accent)}
.admin-nav svg {width:17px; height:17px; flex-shrink:0}
.methods-heading {display:flex; justify-content:space-between; align-items:flex-start; gap:20px}
.methods-heading>.btn {flex-shrink:0; background:var(--accent); border-color:var(--accent); font-size:13px}
.methods-empty {display:grid; justify-items:center; gap:12px; background:var(--bg); border-radius:8px; text-align:center; padding:32px 24px; margin:20px 0}
.methods-empty h3 {font-size:16px; margin:0}
.methods-empty p {font-size:13px; color:var(--muted); max-width:40ch}
.new-method-form {scroll-margin-top:24px}
.methods-admin-layout {display:block}
.method-library:has(.methods-empty) {padding:0; border:0}
.methods-admin-layout>.bulk-section,.new-method-panel {padding:16px 0; border:0; border-bottom:1px solid var(--line); margin:12px 0; scroll-margin-top:24px}
.methods-admin-layout>details>summary {font-size:17px; font-weight:600; min-height:44px; padding:8px 0; cursor:pointer}
.methods-admin-layout>details>form {margin-top:16px}
.shop-card .card-body:has(.methods .empty) {min-height:138px; display:flex; flex-direction:column}
.shop-card .card-body:has(.methods .empty) .methods {margin-top:auto}
.catalog-invitation {min-height:310px; height:100%; border:1px dashed var(--line); border-radius:9px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:32px 20px; gap:12px; font-size:15px}
.catalog-invitation>svg {width:48px; height:48px; stroke-width:1.3; color:#b5a28f; margin-bottom:16px}
.catalog-invitation h2 {font-size:16px; margin:0; letter-spacing:-.02em}
.catalog-invitation .muted {font-size:14px; line-height:1.5}
.catalog-invitation .btn {margin-top:10px; min-height:38px; font-size:12px; border-color:#cdbfaf; padding:9px 20px}
.catalog-invitation:hover {border-color:var(--accent)}
.catalog-continuation {grid-column:1/-1; height:0; margin-top:-18px; scroll-margin-top:24px}
.catalog.is-compact .catalog-invitation,.catalog.is-compact .catalog-continuation {display:none}
.catalogue-site .catalog-options {position:absolute; top:11px; right:8px}
.catalogue-site .catalog-options summary {border:0; width:34px; min-height:34px; padding:7px}
.catalogue-site .catalog-options-panel {top:40px}
.catalogue-site .catalog-tools {position:relative}
.catalogue-site .search-field input {padding-right:54px}
.shop-page {position:relative}
.shop-return {padding-right:44px}
.shop-information {position:absolute; right:0; top:20px; margin:0; z-index:20}
.shop-information>summary {width:40px; min-height:44px; padding:0; font-size:0; justify-content:center; list-style:none}
.shop-information>summary::after {content:'···'; font-size:23px; color:var(--text)}
.shop-information[open] {width:min(360px,100%); background:var(--surface); border:1px solid var(--line); border-radius:9px; padding:0 18px 18px; box-shadow:0 6px 24px #17182218}
.shop-information[open]>summary {margin-left:auto; margin-right:-18px}
.shop-information>summary::-webkit-details-marker {display:none}
.comment-compose>summary {min-height:44px; padding:10px 0; font-size:13px; color:var(--muted)}
.comment-compose:not([open]) {margin-top:30px}
.detail-hero>.logo-cover {object-fit:scale-down; padding:28px}
img.cover.contained-cover {object-fit:scale-down; padding:20px}
.admin-more>summary {cursor:pointer; font-size:12px; color:var(--muted); min-height:44px; padding:12px}
.methods-site .topbar .primary-links {display:none}
.methods-site .header-nav {margin-left:auto}
.methods-site .brand {font-size:24px}
.methods-site .topbar,.methods-site .topbar .wrap {min-height:58px}
.methods-site main.wrap {width:100%; padding-left:224px}
.methods-site main.wrap>.admin-nav {top:0; width:200px; min-height:calc(100svh - 130px); border-right:1px solid var(--line); padding:12px 0}
.methods-site main.wrap>.admin-nav a {border-radius:0; padding-left:20px}
.methods-site .admin-nav a[aria-current=page] {background:var(--soft); border-left:2px solid var(--accent); padding-left:18px}
.methods-site .methods-heading {padding:24px 24px 24px 0; align-items:center}
.methods-site .methods-heading h1 {font-size:28px; margin:0}
.methods-site .methods-heading>.btn {font-size:13px; min-height:40px; padding:9px 14px}
.methods-site .methods-admin-layout {padding-right:24px}
.methods-site .methods-empty {min-height:320px; margin:0; padding:40px 24px; gap:14px; align-content:center; background:var(--soft)}
.methods-site .methods-empty .empty-icon {width:46px; height:46px; color:#ad9781; margin-bottom:16px}
.methods-site .methods-empty h3 {font-size:17px}
.methods-site .methods-empty p {font-size:14px; max-width:42ch}
.methods-site .new-method-panel:not([open]):not(:target) {display:none}
.methods-site .bulk-section {margin-top:100px}
.methods-site .catalog-foot {margin-right:24px}
@media(min-width:1600px) {.catalog.is-compact{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1150px) {
  .wrap{width:calc(100% - 46px)} .topbar .wrap{gap:18px} .primary-links{gap:32px}
  .brand{font-size:28px}.brand span{max-width:170px}.header-nav{gap:8px}
  .shop-card h2{font-size:20px}.catalog{gap:18px}.shop-card .card-body{padding:8px 13px 14px}
  .filter-line{gap:10px}.filter-line label{width:118px}.filter-line .category-filter{width:180px}.filter-line .sort-filter{width:190px;gap:10px}
  .compare-picker{grid-template-columns:repeat(3,minmax(0,1fr))}.compare-picker>.btn{grid-column:1/-1;justify-self:end}
}
@media(max-width:900px) {
  .account-label{display:none}
  .methods-site main.wrap{padding-left:0;width:calc(100% - 24px)}
  .methods-site main.wrap>.admin-nav{position:static;width:100%;min-height:0;border-right:0;display:flex;flex-direction:row;flex-wrap:nowrap;overflow:auto;padding:6px 0;gap:4px}
  .methods-site main.wrap>.admin-nav>a{font-size:12px;white-space:nowrap;padding:8px;min-height:44px}
  .methods-site .admin-more{flex-shrink:0}.methods-site .admin-more[open]{min-width:160px}
  .methods-site .methods-heading{padding:18px 0;gap:12px}.methods-site .methods-admin-layout{padding-right:0}
  main.wrap:has(> .admin-nav){padding-left:0}main.wrap>.admin-nav{position:static;width:100%;flex-direction:row;flex-wrap:wrap;padding:16px 0;border-bottom:1px solid var(--line);gap:4px}
  main.wrap>.admin-nav a{font-size:12px;padding:8px 10px}.methods-heading{flex-wrap:wrap}
  .primary-links{gap:18px}.topbar .wrap{flex-wrap:wrap;min-height:74px;gap:0 20px;padding-top:12px}
  .header-nav{margin-left:auto}.primary-links{order:3;width:100%;margin:4px 0 0;justify-content:flex-start;min-width:0;overflow:auto;gap:28px}
  .primary-links>a{min-height:50px}.brand span{max-width:280px}.brand{max-width:55%;flex-shrink:1}
  .intro{gap:18px;padding-top:32px}.intro p{font-size:15px}.compare-entry{font-size:12px}
  .catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog.is-compact{grid-template-columns:repeat(3,minmax(0,1fr))}
  .filter-line{flex-wrap:wrap}.filter-line label{flex:1;min-width:120px}.filter-line .category-filter{width:auto}.filter-line .sort-filter{width:auto;flex:1.5}.filter-line .compare-entry{margin-left:0}.detail-layout{gap:28px;grid-template-columns:1fr 1.3fr}
  .methods-admin-layout{grid-template-columns:1fr;gap:32px}.bulk-section{border:0;padding:0}
  .admin-layout,.settings-layout{gap:30px}.member-shell{gap:24px;grid-template-columns:190px minmax(0,1fr)}
}
@media(max-width:700px) {
  .site-frame{width:calc(100% - 20px);margin:10px auto;border-radius:12px;min-height:calc(100svh - 20px)}
  body:has(.shop-page) .topbar{display:none}
  .detail-site .site-frame{width:100%;margin:0;border:0;border-radius:0;box-shadow:none;min-height:100svh}
  .detail-site main.wrap{width:calc(100% - 24px)}
  .shop-information{top:0}.shop-information>summary{font-size:0!important;padding:0!important}
  .shop-information[open]{top:0}
  .shop-return{padding:0 40px 0 0}.shop-page .detail-layout{grid-template-columns:1fr;gap:0;padding-bottom:0}
  .shop-page .detail-image{max-width:none}.shop-heading{padding:10px 0 8px}.shop-heading h1{font-size:22px;letter-spacing:-.04em}
  .shop-heading .muted{font-size:14px;line-height:20px}.detail-hero{aspect-ratio:1.73;border-radius:6px}
  .shop-information{margin:0 0 8px}.shop-information>summary{font-size:12px;min-height:44px;padding:10px 0}
  .shop-page .detail-nav{margin-bottom:16px;gap:12px}.shop-page .detail-nav a{font-size:12px;min-height:40px;padding:10px 6px}
  .shop-page .detail-copy>h2{font-size:18px;margin-bottom:10px}.shop-page .detail-empty{min-height:134px;padding:16px 12px;gap:5px;background:var(--soft)}
  .shop-page .detail-empty h3{font-size:13px;line-height:20px;letter-spacing:0}.shop-page .detail-empty p{font-size:12px;line-height:18px}
  .detail-empty .empty-icon{width:32px;height:32px;margin-bottom:6px;color:#ad9781}
  .shop-page .comments-section{padding:12px 0 20px;margin-top:16px}.shop-page .comments-section>h2{font-size:18px;margin-bottom:0}
  .shop-page .comment-list:has(.comments-empty){margin-top:0}
  .comments-empty{font-size:12px;gap:8px;padding:8px 0 18px}.comments-empty .empty-icon{width:24px;height:24px}
  .shop-page .comment-entry{min-height:38px;padding:9px 12px;font-size:13px;margin:0}
  .shop-page .comments-section>.muted{display:none}.comment-entry{display:flex;width:100%;margin-top:10px}
  .wrap{width:calc(100% - 32px)} .topbar .wrap{gap:0 12px}.brand{font-size:21px}.brand-icon{width:25px;height:25px}
  .catalog-invitation{min-height:260px}.catalog-continuation{display:block;height:0;margin-top:-22px}
  .methods-site .topbar .wrap{flex-wrap:nowrap;padding-top:0}
  .methods-site .topbar,.methods-site .topbar .wrap{min-height:48px}
  .methods-site .brand{font-size:20px}
  .methods-site main.wrap{padding-left:0;width:calc(100% - 24px)}
  .methods-site main.wrap>.admin-nav{position:static;width:100%;min-height:0;border-right:0;display:flex;flex-direction:row;flex-wrap:nowrap;overflow:auto;padding:6px 0;gap:4px}
  .methods-site main.wrap>.admin-nav>a{font-size:11px;white-space:nowrap;padding:8px;min-height:40px}
  .methods-site .admin-more{flex-shrink:0}.methods-site .admin-more[open]{min-width:160px}
  .methods-site .methods-heading{padding:18px 0;gap:12px;flex-wrap:nowrap}.methods-site .methods-heading h1{font-size:22px}
  .methods-site .methods-heading>.btn{font-size:11px;padding:9px 8px;gap:5px;min-height:40px}
  .methods-site .methods-admin-layout{padding-right:0}.methods-site .methods-empty{min-height:260px;padding:24px 16px}
  .methods-site .methods-empty h3{font-size:15px}.methods-site .methods-empty p{font-size:12px}
  .methods-site .bulk-section{margin-top:32px}.methods-site .catalog-foot{margin-right:0}
  .theme-button{font-size:11px}.nav-menu summary{padding-left:2px}.nav-avatar{width:30px;height:30px}
  .header-nav{gap:8px}.primary-links{gap:24px}.primary-links>a{font-size:13px}
  .intro{align-items:flex-start;flex-direction:column;padding:28px 0 22px;gap:10px}.intro h1{font-size:34px}
  .intro p{max-width:52ch;font-size:14px;line-height:1.65}.intro .catalog-count{margin:0;font-size:13px}.compare-entry{margin:0;font-size:13px;min-height:44px}
  .search-field input{font-size:16px;min-height:54px;padding-left:44px}.search-field>svg{left:14px;top:17px;width:20px;height:20px}
  .search-submit{inset:5px auto 5px 2px}.filter-line{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
  .filter-line label,.filter-line .category-filter,.filter-line .sort-filter{width:100%;min-width:0}.filter-line .sort-filter{display:block}.sort-filter>span{display:none}
  .filter-line select{font-size:16px}.filter-line .compare-entry{justify-content:center}.catalog-options{justify-self:end}.catalog-options-panel .check-label{display:flex}
  .catalog-tools{padding-bottom:0;margin-bottom:18px}.result-heading{padding:0;font-size:13px}
  .detail-layout{grid-template-columns:1fr;gap:30px}.detail-image{max-width:none}.detail-nav{gap:22px;margin-bottom:24px}
  .detail-nav a{font-size:13px}.detail-actions{grid-template-columns:1fr 1fr}.detail-actions>.text-link{grid-column:1/-1}
  .detail-actions .btn{font-size:13px;height:100%;width:100%}.detail-copy>h2{font-size:25px}.method-heading h3{font-size:20px}
  .comments-section{padding-top:26px}.comment-form{padding:22px}.comment-meta{flex-wrap:wrap;gap:5px 16px}
  .page-heading,.admin-heading{padding:28px 0 24px}.page-heading h1,.admin-heading h1{font-size:32px}
  .compare-picker{padding:20px;grid-template-columns:1fr;gap:20px}.compare-picker>.btn{grid-column:auto;justify-self:stretch}
  .compare-slot input,.compare-slot select{font-size:16px}.comparison{grid-template-columns:1fr;gap:24px}
  .comparison>section{padding-bottom:24px}.editorial-list{grid-template-columns:1fr}
  .admin-nav{gap:4px;padding:12px 0}.admin-nav a{font-size:12px;padding:10px}.admin-shortcuts>a{font-size:12px;padding:10px 12px}
  .shop-row{padding:16px;gap:14px}.row-search{flex-wrap:wrap;gap:4px}.row-search .help{padding:0}
  .image-gallery{grid-template-columns:1fr 1fr;gap:16px}.image-editor{padding:18px}.table-scroll{margin-top:18px}
  .member-shell{grid-template-columns:1fr;gap:22px;padding:24px 0 32px}.member-sidebar{position:static;border:0;padding:0}
  .member-content h1{font-size:32px}.member-welcome{padding:24px 24px 0}.member-phone-panel h2{font-size:22px}
  .tg-heading h1{font-size:32px}.tg-detail-heading h2{font-size:25px}.auth-layout{margin:32px auto;padding:28px}
  .editor-layout>form{padding:22px}.catalog-foot{flex-direction:column;gap:8px;font-size:11px}
}
@media(max-width:560px) {
  .catalog{grid-template-columns:1fr;gap:22px}.catalog.is-compact{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .shop-card .card-body{padding:10px 13px 14px}.shop-card h2{font-size:20px}.card-category{font-size:14px;margin-bottom:7px}
  .method{font-size:14px;padding:12px 0}.catalog.is-compact .card-body{padding:12px}.catalog.is-compact h2{font-size:17px}
  .catalog.is-compact .method{flex-wrap:wrap;gap:7px;font-size:12px}.catalog.is-compact .difficulty{margin-left:auto}
  .catalog.is-compact .favorite-button{width:44px;height:44px}.catalog.is-compact .card-action{top:8px;right:8px}
  .catalog-guide{gap:12px 18px;padding-top:12px}.catalog-guide>span:first-child{width:100%}
  .pagination{gap:14px;font-size:12px}.pagination>.btn{font-size:12px;padding:10px}
  .shop-row h2{font-size:18px}.shop-row .btn{font-size:12px}.list-thumb,.list-initials{width:64px;height:50px}
  .image-gallery{grid-template-columns:1fr}.detail-empty{padding:24px}.detail-actions{grid-template-columns:1fr}
  .comment-meta{flex-direction:column}.auth-layout{padding:24px}.auth-layout h1{font-size:32px}
  .library-row{flex-direction:column;align-items:flex-start;gap:12px}.library-row .btn{align-self:flex-end}
}
@media(max-width:360px) {
  .brand{font-size:19px;max-width:53%}.brand-icon{display:none}.theme-button{font-size:10px}.header-nav{gap:4px}
  .primary-links{gap:21px}.primary-links>a{font-size:12px}.intro h1{font-size:30px}
  .search-line{flex-wrap:nowrap}.search-field{flex-basis:100%}
  .filter-line{grid-template-columns:1fr}.filter-footer{gap:8px 16px}.method-heading{gap:14px}
  .shop-row{padding:14px}.comment-form{padding:18px}.auth-layout{padding:20px}
}
@media(prefers-reduced-motion:no-preference) {
  #catalog-results{transition:opacity .16s ease-out}.shop-card{transition:border-color .16s ease-out}
}
@media print {
  .topbar,.detail-nav,.catalog-guide,.card-action{display:none}.wrap{width:100%}.detail-layout{display:block}
  .selection-site{background:white;color:black}.detail-image{max-width:300px}.catalog-foot{display:none}
}