@font-face { font-family: Manrope; src: url("/a/j/manrope.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: Prata; src: url("/a/j/prata.woff2") format("woff2"); font-display: swap; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0px; background: rgb(247, 243, 238); color: rgb(27, 27, 26); font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 14px; line-height: 1.65; font-family: Manrope, Arial, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; }
a { color: inherit; text-decoration: none; }
button, input { font-style: inherit; font-variant-caps: inherit; font-weight: inherit; font-width: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-size-adjust: inherit; font-kerning: inherit; font-variant-alternates: inherit; font-variant-ligatures: inherit; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-feature-settings: inherit; font-optical-sizing: inherit; font-variation-settings: inherit; }
button { color: inherit; cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 2px solid rgb(122, 98, 56); outline-offset: 5px; }
button { border: 0px; background: none; }
.wrap { max-width: 1120px; margin: auto; }
header.header { height: 94px; display: flex; align-items: center; gap: 35px; }
.wordmark { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 25px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; white-space: nowrap; letter-spacing: -1px; }
.header nav { display: flex; gap: 25px; font-size: 12px; }
.header nav a:hover, .footer a:hover { color: rgb(122, 98, 56); }
.search-trigger { margin-left: auto; display: flex; gap: 22px; align-items: center; font-size: 10px; color: rgb(105, 101, 91); padding: 0px; }
.language { font-size: 10px; }
.app-pill { border: 1px solid rgb(122, 98, 56); border-radius: 30px; padding: 9px 15px; color: rgb(122, 98, 56); font-size: 10px; white-space: nowrap; }
.app-pill span { margin-left: 14px; }
.eyebrow { font-size: 9px; letter-spacing: 0.12em; color: rgb(153, 126, 91); font-weight: 600; }
.text-link { color: rgb(122, 98, 56); font-size: 12px; font-weight: 600; display: inline-block; }
.byline { font-size: 10px; margin-top: 39px; }
.byline span { color: rgb(153, 126, 91); font-size: 8px; letter-spacing: 0.12em; margin-right: 15px; }
.source-link { font-size: 9px; text-decoration: underline; text-underline-offset: 4px; color: rgb(105, 101, 91); }
.reading { display: grid; grid-template-columns: 36% 35% 29%; padding: 42px 0px 66px; border-top: 1px solid rgb(27, 27, 26); }
.reading-head h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 34px; line-height: 1.27; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -1px; margin: 5px 0px 25px; }
.story { padding: 0px 34px 0px 0px; display: flex; flex-direction: column; align-items: flex-start; }
.story h3 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 25px; line-height: 1.35; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.7px; margin: 22px 0px 12px; }
.story p { font-size: 11px; color: rgb(105, 101, 91); max-width: 260px; line-height: 1.8; margin: 0px 0px 30px; }
.story:hover h3 { text-decoration: underline 1px; text-underline-offset: 5px; }
.footer { border-top: 1px solid rgb(27, 27, 26); display: grid; grid-template-columns: 25% 25% 1fr; padding: 35px 0px 30px; gap: 10px; }
.breadcrumb { font-size: 10px; color: rgb(105, 101, 91); padding: 26px 0px 16px; display: flex; gap: 15px; border-top: 1px solid rgb(220, 213, 202); }
.article-heading { padding: 45px 0px 45px 240px; position: relative; }
.article-heading h1 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 57px; line-height: 1.2; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -2px; margin: 25px 0px; }
.article-deck { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 20px; line-height: 1.5; font-family: Manrope; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(105, 101, 91); }
.article-heading > .eyebrow { position: absolute; left: 0px; top: 61px; max-width: 130px; line-height: 1.7; }
.article-body { max-width: 640px; margin: auto; font-size: 15px; line-height: 1.9; }
.article-body p { margin: 24px 0px; }
.article-body .quick-answer { font-size: 19px; line-height: 1.65; color: rgb(27, 27, 26); margin-bottom: 34px; }
.article-body h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 30px; line-height: 1.3; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.8px; margin: 52px 0px 20px; }
.inline-source { font-size: 11px; color: rgb(122, 98, 56); }
.comparison { display: grid; grid-template-columns: 1fr 1fr; margin: 45px 0px 55px; padding: 34px 0px; border-top: 1px solid rgb(27, 27, 26); border-bottom: 1px solid rgb(220, 213, 202); gap: 60px; }
.comparison > div { padding: 0px 35px; }
.comparison > div + div { border-left: 1px solid rgb(220, 213, 202); padding-left: 55px; }
.comparison-code { display: block; font-size: 90px; line-height: 1.1; letter-spacing: -7px; font-weight: 500; }
.outline { color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: rgb(27, 27, 26); }
.comparison h3 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 26px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.7px; }
.comparison p { max-width: 340px; color: rgb(105, 101, 91); font-size: 12px; }
.end-object { display: flex; gap: 35px; align-items: center; margin: 50px 0px; border-block: 1px solid rgb(220, 213, 202); padding: 20px 0px; }
.end-object img { width: 110px; height: 170px; object-fit: contain; }
.end-object h3 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 30px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; margin: 10px 0px; }
.end-object p { font-size: 12px; margin: 0px 0px 8px; }
.article-sources { margin: 55px 0px 65px; font-size: 11px; color: rgb(105, 101, 91); }
.article-sources p { margin: 10px 0px; }
.article-sources a { text-decoration: underline; }
.article-sources small { font-size: 10px; }
.fragrance-top { display: grid; grid-template-columns: 36% 64%; padding: 45px 0px 60px; }
.fragrance-image { display: flex; justify-content: center; align-items: center; }
.fragrance-image img { height: 350px; width: 270px; object-fit: contain; }
.fragrance-info { padding: 15px 0px 0px 35px; }
.fragrance-info h1 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 60px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -2px; margin: 20px 0px 6px; }
.fragrance-info .sub { font-size: 13px; color: rgb(105, 101, 91); }
.version-switch { display: flex; gap: 28px; margin: 28px 0px; }
.version-switch button { font-size: 11px; border-bottom: 1px solid rgb(220, 213, 202); padding: 0px 0px 7px; }
.version-switch button[aria-pressed="true"] { color: rgb(122, 98, 56); border-color: rgb(122, 98, 56); }
.fragrance-info .description { max-width: 420px; font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 21px; line-height: 1.5; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.3px; }
.save { color: rgb(122, 98, 56); font-size: 12px; padding: 10px 0px; margin-right: 30px; }
.save-status { font-size: 10px; color: rgb(105, 101, 91); min-height: 20px; }
.note-grid { display: grid; grid-template-columns: 36% 32% 32%; padding: 35px 0px 50px; border-top: 1px solid rgb(220, 213, 202); }
.note-grid h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 32px; line-height: 1.3; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -1px; margin: 10px 0px; }
.note-item { display: flex; align-items: center; gap: 15px; }
.note-item img { width: 85px; height: 100px; object-fit: contain; }
.note-item h3 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 22px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; margin: 0px 0px 10px; }
.note-item small { font-size: 9px; color: rgb(105, 101, 91); }
.notice { color: rgb(105, 101, 91); font-size: 11px; max-width: 640px; margin: 0px auto 50px; }
.simple { max-width: 640px; min-height: 480px; margin: 60px auto; }
.simple h1 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 44px; line-height: 1.25; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -1px; }
.simple h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 27px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; margin-top: 35px; }
.simple p { line-height: 1.9; }
.simple a { color: rgb(122, 98, 56); }
.catalog-card { display: flex; gap: 25px; align-items: center; }
.catalog-card img { width: 120px; height: 170px; object-fit: contain; }
dialog { border: 0px; background: rgb(247, 243, 238); color: rgb(27, 27, 26); width: min(640px, 100% - 32px); padding: 40px; box-shadow: rgba(0, 0, 0, 0.133) 0px 10px 70px; }
dialog label { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 26px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; display: block; margin: 10px 0px 28px; }
dialog input { width: 100%; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgb(27, 27, 26); border-image: none; background: none; padding: 12px 0px; font-size: 16px; color: rgb(27, 27, 26); }
dialog .close { position: absolute; right: 18px; top: 8px; font-size: 25px; }
@media (max-width: 1190px){
.wrap { margin-left: 36px; margin-right: 36px; }
.header.header { gap: 22px; }
.header nav { gap: 18px; }
.search-trigger span { display: none; }
.article-heading { padding-left: 21.4%; }
.article-heading h1 { font-size: 52px; }
}
@media (max-width: 740px){
.wrap { margin-left: 24px; margin-right: 24px; }
.header.header { height: 78px; gap: 16px; flex-wrap: wrap; position: relative; padding-bottom: 22px; align-content: center; }
.wordmark { font-size: 21px; }
.header nav { position: absolute; left: 0px; bottom: 0px; gap: 23px; font-size: 10px; }
.search-trigger { margin-left: auto; }
.app-pill { font-size: 0px; padding: 5px 11px; }
.app-pill::before { content: "iPhone"; font-size: 9px; }
.app-pill span { font-size: 11px; margin-left: 8px; }
.language { font-size: 9px; }
.byline { margin-top: 25px; }
.reading { grid-template-columns: 1fr 1fr; padding: 30px 0px 35px; gap: 25px 0px; }
.reading-head { grid-column-start: 1; grid-column-end: -1; display: flex; justify-content: space-between; align-items: flex-end; }
.reading-head h2 { font-size: 27px; margin: 0px; }
.story { padding: 0px 20px 0px 0px; }
.story .eyebrow { font-size: 7px; min-height: 24px; }
.story h3 { font-size: 20px; line-height: 1.4; margin: 12px 0px; }
.story p { font-size: 10px; margin-bottom: 24px; }
.footer { grid-template-columns: 1fr 1fr; padding-top: 25px; }
.footer .wordmark { font-size: 22px; }
.breadcrumb { margin-top: 18px; font-size: 9px; }
.article-heading { padding: 28px 0px 30px; }
.article-heading > .eyebrow { position: static; max-width: none; font-size: 8px; }
.article-heading h1 { font-size: 35px; letter-spacing: -1.2px; line-height: 1.25; margin: 24px 0px; }
.article-deck { font-size: 15px; }
.article-body { font-size: 13px; line-height: 1.9; }
.article-body .quick-answer { font-size: 16px; }
.article-body h2 { font-size: 26px; margin-top: 35px; }
.comparison { gap: 0px; margin: 30px 0px; padding: 25px 0px; }
.comparison > div { padding: 0px 16px 0px 0px; }
.comparison > div + div { padding-left: 17px; }
.comparison-code { font-size: 53px; letter-spacing: -5px; }
.comparison h3 { font-size: 20px; line-height: 1.4; }
.comparison p { font-size: 10px; }
.comparison .source-link { font-size: 8px; }
.end-object { gap: 18px; }
.end-object img { width: 85px; height: 140px; }
.end-object h3 { font-size: 26px; }
.fragrance-top { display: flex; flex-direction: column; padding: 20px 0px 30px; }
.fragrance-image img { height: 240px; width: 200px; }
.fragrance-info { padding: 15px 0px 0px; }
.fragrance-info h1 { font-size: 43px; letter-spacing: -1.5px; }
.fragrance-info .description { font-size: 20px; }
.note-grid { grid-template-columns: 1fr 1fr; padding-top: 20px; }
.note-grid > h2 { grid-column-start: 1; grid-column-end: -1; font-size: 27px; }
.note-item { gap: 8px; flex-direction: column; align-items: flex-start; }
.note-item img { width: 65px; height: 80px; }
.note-item h3 { font-size: 21px; }
.simple { margin: 35px auto; min-height: 400px; }
.simple h1 { font-size: 33px; }
.simple p { font-size: 13px; }
.notice { font-size: 10px; }
dialog { padding: 28px 22px; }
dialog label { font-size: 22px; }
dialog input { font-size: 14px; }
}
@media (max-width: 359px){
.wrap { margin-left: 20px; margin-right: 20px; }
.header.header { gap: 12px; }
.story h3 { font-size: 18px; }
.story { padding-right: 15px; }
.article-heading h1 { font-size: 31px; }
.comparison-code { font-size: 48px; }
.fragrance-info h1 { font-size: 38px; }
}
@media (prefers-reduced-motion: reduce){
html { scroll-behavior: auto; }
}
@media (min-width: 741px){
.byline { margin-top: 28px; }
.header nav { font-size: 13px; }
.search-trigger { font-size: 11px; }
.app-pill { font-size: 11px; }
.story p { font-size: 12px; }
.eyebrow { font-size: 10px; }
}
@media (min-width: 741px) and (max-width: 1000px){
.header.header { gap: 19px; }
.header nav { font-size: 11px; }
.app-pill { font-size: 10px; }
.byline { margin-top: 22px; }
}
.homepage .header .wordmark { display: none; }
.homepage .header.header { height: 69px; }
.homepage .header nav { gap: 30px; }
.homepage .header .search-trigger span { display: block; }
.homepage .footer .wordmark { display: block; }
.masthead { padding: 0px 0px 30px; }
.masthead h1 { font-style: normal; font-variant-caps: normal; font-weight: 400; font-width: normal; font-size: min(275px, -17.5px + 24.3vw); line-height: 1.09; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.065em; white-space: nowrap; margin: 0px 0px 15px; position: relative; left: -0.015em; }
.editorial-cover { display: block; position: relative; overflow: hidden; background: rgb(253, 251, 247); isolation: isolate; }
.cover-kicker, .cover-caption { display: flex; align-items: center; justify-content: space-between; font-size: 8px; letter-spacing: 0.07em; position: relative; z-index: 3; }
.cover-caption { font-size: 7px; color: rgb(105, 101, 91); margin-top: 12px; }
.headline-arrow { color: rgb(122, 98, 56); font-style: normal; font-variant-caps: normal; font-weight: 400; font-width: normal; font-size: 0.65em; line-height: normal; font-family: Manrope; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; display: inline-block; vertical-align: middle; margin-left: 10px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 29px; }
.section-heading h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 32px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -1px; margin: 0px; }
.section-heading > .text-link { font-size: 11px; }
.cover-pyramid { aspect-ratio: 1.24 / 1; padding: 18px; background: rgb(238, 233, 225); }
.cover-pyramid .cover-kicker { font-size: 7px; }
.cover-pyramid img { position: absolute; right: 9px; bottom: 20px; width: 50%; height: 48%; object-fit: contain; z-index: 0; transform: rotate(-17deg); }
.cover-trial { aspect-ratio: 1.24 / 1; padding: 18px; display: flex; flex-direction: column; justify-content: space-between; }
.cover-trial .cover-kicker { font-size: 7px; }
.trial-mark { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 100px; line-height: 0.9; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -8px; display: flex; align-items: center; justify-content: space-around; padding-top: 12px; }
.trial-mark i { font-style: normal; font-variant-caps: normal; font-weight: 400; font-width: normal; font-size: 88px; line-height: normal; font-family: Manrope; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(105, 101, 91); transform: rotate(12deg); }
.trial-mark span:last-child { color: transparent; -webkit-text-stroke-width: 0.7px; -webkit-text-stroke-color: rgb(27, 27, 26); }
@media (min-width: 741px) and (max-width: 1100px){
.cover-kicker { font-size: 7px; }
.cover-caption { font-size: 6px; }
.trial-mark { font-size: 85px; }
.cover-pyramid img { width: 44%; height: 44%; }
.homepage .header .search-trigger span { display: none; }
}
@media (max-width: 740px){
.homepage .header .wordmark { display: block; }
.homepage .header.header { height: 78px; }
.homepage .header nav { gap: 23px; }
.homepage .header .search-trigger span { display: none; }
.masthead { padding: 15px 0px 22px; }
.masthead h1 { font-size: calc(-11.66px + 24.3vw); letter-spacing: -0.065em; margin: 0px 0px 21px; line-height: 1.12; left: -0.01em; }
.cover-kicker { font-size: 6px; letter-spacing: 0.035em; }
.cover-caption { font-size: 6px; margin-top: 8px; }
.section-heading { margin-bottom: 22px; }
.section-heading h2 { font-size: 26px; }
.section-heading .text-link { font-size: 10px; }
.cover-pyramid, .cover-trial { aspect-ratio: 0.92 / 1; padding: 12px; }
.cover-pyramid .cover-kicker, .cover-trial .cover-kicker { font-size: 5px; }
.cover-pyramid .cover-kicker span:last-child, .cover-trial .cover-kicker span:last-child { display: none; }
.cover-pyramid img { width: 58%; height: 45%; right: -5px; bottom: 18px; }
.trial-mark { font-size: 58px; letter-spacing: -5px; padding-top: 0px; }
.trial-mark i { font-size: 48px; }
.cover-trial .cover-caption { font-size: 4px; letter-spacing: 0px; }
.homepage .header .wordmark { font-size: 18px; }
.homepage .header .search-trigger { margin-left: auto; }
}
@media (max-width: 359px){
.masthead h1 { font-size: calc(-9.72px + 24.3vw); }
.trial-mark { font-size: 49px; }
.trial-mark i { font-size: 39px; }
}
@media (max-width: 740px){
.homepage .header .wordmark { display: none; }
.homepage .header.header { height: 55px; padding: 0px; gap: 12px; flex-wrap: nowrap; align-content: normal; }
.homepage .header nav { position: static; gap: 18px; font-size: 10px; }
}
@media (max-width: 359px){
.homepage .header.header { gap: 9px; }
.homepage .header nav { gap: 13px; font-size: 9px; }
}
.fragrance-tile { display: block; min-width: 0px; }
.tile-image { height: 180px; display: flex; align-items: center; justify-content: center; }
.tile-image img { max-width: 100%; width: 165px; height: 170px; object-fit: contain; display: block; }
.tile-brand { display: block; font-size: 8px; letter-spacing: 0.08em; color: rgb(153, 126, 91); margin: 15px 0px 9px; }
.fragrance-tile h3 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 20px; line-height: 1.35; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.5px; margin: 0px 0px 8px; overflow-wrap: anywhere; }
.tile-detail { font-size: 9px; color: rgb(105, 101, 91); display: block; line-height: 1.7; }
.fragrance-tile:hover h3 { color: rgb(122, 98, 56); }
.real-note { min-width: 0px; display: flex; flex-direction: column; align-items: flex-start; font-size: 11px; line-height: 1.5; position: relative; padding: 8px 0px 15px; }
.real-note img { width: 100%; height: 100px; object-fit: contain; margin-bottom: 12px; }
.real-note span { display: block; overflow-wrap: anywhere; padding-right: 15px; }
.real-note b { font-weight: 400; color: rgb(122, 98, 56); position: absolute; bottom: 15px; right: 2px; font-size: 12px; }
.cover-mosaique .mosaique-cover-name { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 43px; line-height: 1.1; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -1.7px; position: relative; z-index: 2; margin-top: 24px; }
.cover-mosaique img.mosaic-plum { position: absolute; right: 28px; bottom: 27px; width: 45%; height: 49%; object-fit: contain; transform: rotate(7deg); z-index: 1; }
.cover-mosaique img.mosaic-ylang { position: absolute; left: 12px; bottom: 37px; width: 46%; height: 43%; object-fit: contain; transform: rotate(-9deg); z-index: 0; }
.mosaic-base { position: absolute; font-size: 7px; letter-spacing: 0.1em; bottom: 17px; left: 18px; }
.data-heading { padding: 33px 0px 34px; }
.data-heading h1 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 58px; line-height: 1.2; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -2px; margin: 18px 0px; }
.data-heading > p { font-size: 14px; color: rgb(105, 101, 91); }
.catalog-controls { display: flex; gap: 35px; align-items: flex-end; margin: 5px 0px 40px; }
.catalog-controls label { display: flex; flex-direction: column; gap: 12px; font-size: 10px; color: rgb(105, 101, 91); flex: 1 1 0%; }
.catalog-controls input, .catalog-controls select { background: none; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgb(220, 213, 202); border-image: none; border-radius: 0px; color: rgb(27, 27, 26); min-width: 0px; width: 100%; padding: 9px 0px; font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 14px; line-height: normal; font-family: Manrope; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; }
.catalog-controls > span { font-size: 11px; color: rgb(105, 101, 91); padding-bottom: 10px; min-width: 80px; text-align: right; }
.full-catalog { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 45px 35px; margin: 25px 0px 55px; }
.full-catalog .tile-image { height: 245px; }
.full-catalog .tile-image img { height: 230px; width: 230px; }
.full-catalog h3 { font-size: 25px; }
.full-catalog .tile-brand { font-size: 9px; }
.full-notes { display: grid; grid-template-columns: repeat(7, minmax(0px, 1fr)); gap: 20px 28px; padding: 15px 0px 60px; }
.catalog-source { font-size: 10px; color: rgb(105, 101, 91); max-width: 520px; margin: 20px 0px 40px; line-height: 1.8; }
.catalog-source summary { cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.catalog-source p { padding-top: 9px; }
.real-fragrance { display: grid; grid-template-columns: 42% 58%; padding: 40px 0px 50px; align-items: center; gap: 0px; }
.real-fragrance-art { display: flex; align-items: center; justify-content: center; }
.real-fragrance-art > img { height: 370px; width: 330px; object-fit: contain; }
.real-fragrance-info { padding-left: 32px; min-width: 0px; }
.real-fragrance-info h1 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 54px; line-height: 1.18; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -1.9px; margin: 23px 0px; overflow-wrap: anywhere; }
.fragrance-meta { font-size: 12px; color: rgb(105, 101, 91); line-height: 1.8; }
.real-saves { display: flex; gap: 28px; margin-top: 25px; }
.real-saves button { padding: 9px 0px; color: rgb(122, 98, 56); font-size: 12px; }
.data-save-status { font-size: 10px; min-height: 15px; color: rgb(105, 101, 91); }
.real-fragrance-info .catalog-source { margin: 15px 0px 0px; }
.real-fragrance-notes { padding: 30px 0px 40px; border-top: 1px solid rgb(220, 213, 202); }
.fragrance-note-list { display: grid; grid-template-columns: repeat(6, minmax(0px, 1fr)); gap: 15px 30px; }
.related-fragrances { border-top: 1px solid rgb(27, 27, 26); padding: 32px 0px 50px; }
.related-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 40px; }
.shared-note-label { font-size: 10px; color: rgb(105, 101, 91); line-height: 1.75; margin: 15px 0px; }
.catalog-explanation { font-size: 11px; color: rgb(105, 101, 91); margin-top: 30px; max-width: 600px; }
.note-detail { display: grid; grid-template-columns: 34% 66%; align-items: center; padding: 45px 0px 60px; }
.note-detail > div:first-child > img { width: 220px; height: 240px; object-fit: contain; display: block; margin: auto; }
.note-detail h1 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 60px; line-height: 1.15; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -2px; margin: 21px 0px; }
.note-detail p { font-size: 14px; max-width: 400px; }
.note-context { color: rgb(105, 101, 91); font-size: 11px !important; }
.editorial-related { display: block; border-top: 1px solid rgb(220, 213, 202); padding: 30px 0px 40px; }
.editorial-related h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 30px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.8px; }
.editorial-related p { font-size: 12px; color: rgb(105, 101, 91); }
.mosaic-article { padding: 20px 0px 0px; }
.mosaic-article .article-body { padding-top: 15px; }
.mosaic-tiers { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 35px; margin: 45px 0px; }
.mosaic-tiers > div { border-top: 1px solid rgb(220, 213, 202); padding-top: 20px; }
.mosaic-tiers h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 30px; line-height: normal; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.8px; }
.mosaic-tiers > div > div { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 25px; }
.mosaic-tiers .real-note { font-size: 10px; }
.mosaic-tiers .real-note img { height: 85px; }
.mosaic-source { color: rgb(105, 101, 91); font-size: 11px !important; }
.mosaic-source a { color: rgb(122, 98, 56); }
dialog { max-height: 85vh; overflow-y: auto; }
@media (min-width: 741px){
.masthead { padding-bottom: 22px; }
.masthead h1 { line-height: 1.05; }
}
@media (min-width: 741px) and (max-width: 1050px){
.fragrance-tile h3 { font-size: 18px; }
.tile-image { height: 150px; }
.tile-image img { height: 145px; }
.tile-brand { font-size: 7px; }
.tile-detail { font-size: 8px; }
.full-notes { grid-template-columns: repeat(6, minmax(0px, 1fr)); }
.real-fragrance-info h1 { font-size: 45px; }
.cover-mosaique .mosaique-cover-name { font-size: 36px; }
}
@media (max-width: 740px){
.tile-image { height: 160px; }
.tile-image img { height: 155px; width: 145px; }
.tile-brand { font-size: 8px; margin: 10px 0px 8px; }
.fragrance-tile h3 { font-size: 21px; line-height: 1.35; }
.tile-detail { font-size: 9px; }
.real-note { font-size: 10px; }
.real-note img { height: 80px; margin-bottom: 9px; }
.real-note b { font-size: 10px; }
.cover-mosaique .mosaique-cover-name { font-size: 26px; letter-spacing: -1px; margin-top: 20px; }
.cover-mosaique img.mosaic-plum { width: 55%; height: 49%; right: 6px; bottom: 23px; }
.cover-mosaique img.mosaic-ylang { width: 49%; height: 39%; left: 1px; bottom: 31px; }
.mosaic-base { font-size: 4.5px; left: 12px; bottom: 12px; letter-spacing: 0.05em; }
.data-heading { padding: 23px 0px; }
.data-heading h1 { font-size: 37px; letter-spacing: -1.2px; margin: 17px 0px; }
.data-heading > p { font-size: 12px; }
.catalog-controls { flex-wrap: wrap; gap: 20px; margin: 0px 0px 25px; }
.catalog-controls label { flex: 1 1 auto; width: 100%; }
.catalog-controls input, .catalog-controls select { font-size: 14px; padding: 9px 0px; }
.catalog-controls > span { width: 100%; padding: 0px; text-align: left; font-size: 10px; }
.full-catalog { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 29px 22px; margin: 20px 0px 35px; }
.full-catalog .tile-image { height: 165px; }
.full-catalog .tile-image img { height: 155px; width: 140px; }
.full-catalog h3 { font-size: 21px; }
.full-catalog .tile-brand { font-size: 8px; }
.full-notes { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 20px 22px; }
.catalog-source { font-size: 10px; }
.real-fragrance { display: flex; flex-direction: column; padding: 20px 0px 30px; }
.real-fragrance-art > img { height: 260px; width: 240px; }
.real-fragrance-info { padding: 15px 0px 0px; width: 100%; }
.real-fragrance-info h1 { font-size: 38px; line-height: 1.25; letter-spacing: -1.2px; margin: 20px 0px; }
.fragrance-meta { font-size: 11px; }
.real-saves { gap: 25px; }
.real-saves button { font-size: 11px; }
.real-fragrance-notes { padding: 25px 0px; }
.fragrance-note-list { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 15px 18px; }
.related-fragrances { padding: 25px 0px; }
.related-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 25px 20px; }
.related-grid > div:last-child { display: none; }
.shared-note-label { font-size: 9px; }
.catalog-explanation { font-size: 10px; }
.note-detail { display: flex; flex-direction: column; padding: 20px 0px 30px; align-items: stretch; }
.note-detail > div:first-child > img { height: 180px; width: 180px; }
.note-detail > div:last-child { padding-top: 20px; }
.note-detail h1 { font-size: 40px; letter-spacing: -1.3px; }
.note-detail p { font-size: 13px; }
.editorial-related h2 { font-size: 27px; line-height: 1.4; }
.mosaic-tiers { display: block; margin: 30px 0px; }
.mosaic-tiers > div { padding: 15px 0px; }
.mosaic-tiers h2 { font-size: 27px; }
.mosaic-tiers > div > div { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 15px; }
.mosaic-tiers .real-note img { height: 75px; }
.mosaic-tiers .real-note { font-size: 9px; }
}
@media (max-width: 359px){
.fragrance-tile h3, .full-catalog h3 { font-size: 19px; }
.tile-image, .full-catalog .tile-image { height: 145px; }
.tile-image img, .full-catalog .tile-image img { height: 140px; }
.cover-mosaique .mosaique-cover-name { font-size: 22px; }
.real-fragrance-info h1 { font-size: 33px; }
.real-note span { font-size: 9px; }
.full-notes { gap: 18px 17px; }
}
.article-index-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 45px 38px; padding: 25px 0px 55px; }
.article-index-grid h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 30px; line-height: 1.35; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.8px; }
.article-index-grid .editorial-cover { aspect-ratio: 1.7 / 1; min-height: 0px; }
.article-index-grid .draft-meta { display: block; font-size: 8px; margin-top: 20px; }
.article-index-grid .cover-mosaique .mosaique-cover-name { font-size: 59px; }
.article-categories { display: flex; flex-wrap: wrap; gap: 23px; font-size: 11px; margin-bottom: 20px; }
.text-only-cover { padding: 25px; background: rgb(238, 233, 225); }
.text-only-cover > span:last-child { display: block; font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 42px; line-height: 1.3; font-family: Prata; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -1px; margin-top: 20px; }
@media (max-width: 740px){
.article-index-grid { grid-template-columns: 1fr; gap: 32px; }
.article-index-grid h2 { font-size: 27px; }
.article-index-grid .editorial-cover { aspect-ratio: 1.48 / 1; }
.article-index-grid .cover-mosaique .mosaique-cover-name { font-size: 44px; }
.article-categories { gap: 12px 19px; font-size: 10px; }
.text-only-cover > span:last-child { font-size: 35px; }
.article-index-grid .cover-trial .trial-mark { font-size: 95px; }
.article-index-grid .cover-trial .trial-mark i { font-size: 80px; }
}
.missing-fields { font-size: 10px; color: rgb(105, 101, 91); line-height: 1.75; max-width: 390px; }
.mosaic-tiers .real-note { min-height: 130px; }
.mosaic-tiers .real-note > span { margin-top: auto; }
.homepage .masthead { padding-bottom: 34px; }
@media (max-width: 740px){
.homepage .masthead { padding: 12px 0px 28px; }
.homepage .footer { padding-top: 28px; }
}
.skip-home { position: fixed; left: 20px; top: 12px; transform: translateY(-180%); z-index: 20; background: rgb(253, 251, 247); color: rgb(122, 98, 56); padding: 10px 16px; box-shadow: rgba(27, 27, 26, 0.094) 0px 2px 16px; }
.skip-home:focus { transform: none; }
#content:focus { outline: medium; }
.homepage .header nav { align-items: center; }
.homepage .header nav a { display: flex; align-items: center; min-height: 44px; }
.homepage .header .search-trigger { min-height: 44px; min-width: 44px; justify-content: center; }
.homepage .header .app-pill { min-height: 40px; display: flex; align-items: center; }
@media (min-width: 741px) and (max-width: 900px){
.homepage .footer { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 740px){
.homepage .header.header { height: 62px; gap: 10px; }
.homepage .header nav { gap: 16px; font-size: 11px; }
.homepage .header .app-pill { min-height: 36px; }
}
@media (max-width: 359px){
.homepage .header.header { gap: 7px; }
.homepage .header nav { gap: 12px; font-size: 10px; }
.homepage .header .search-trigger { min-width: 32px; }
}
.fan { display: grid; grid-template-columns: var(--columns,5fr 1.7fr 1fr 1fr 1fr); gap: 8px; height: 570px; margin: 58px 0px 90px; transition: grid-template-columns 0.65s cubic-bezier(0.22, 0.8, 0.22, 1); }
@media (max-width: 1100px) and (min-width: 701px){
.fan { height: 540px; gap: 6px; }
}
@media (max-width: 700px){
.fan { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; height: 520px; margin: 32px 0px 55px; gap: 10px; padding-bottom: 12px; }
}
@media (prefers-reduced-motion: reduce){
.fan, .fan * { transition: none !important; }
}
@import url('branch-bronze.css');
.composed-scene .composed-branch{position:absolute;width:400px;height:auto;max-width:none;right:-1%;left:auto;bottom:-330px;object-fit:contain;transform:none}
.botanical-fan .fan-short{font-size:27px;top:52px;left:24px;padding:0;background:none}
@media(max-width:1100px){.composed-scene .composed-branch{width:370px;right:-4%;bottom:-320px}}
.composed-scene .composed-branch{bottom:-430px}
@media(max-width:1100px){.composed-scene .composed-branch{bottom:-415px}}
.composed-scene .composed-branch{width:400px;bottom:-330px;right:0}
.botanical-fan .fan-short{writing-mode:horizontal-tb;font-size:24px;top:55px;left:24px;letter-spacing:-.8px}
@media(max-width:1100px){.composed-scene .composed-branch{width:370px;bottom:-320px;right:0}.botanical-fan .fan-short{font-size:20px;left:17px}}
.botanical-fan:not(.is-idle) .fan-short{writing-mode:vertical-rl;font-size:24px;left:15px;background:#fff;padding:5px 3px}

.leaf-stage { position: relative; background: rgb(255, 255, 255); margin: 58px 0px 90px; isolation: isolate; }
.leaf-stage .fan { margin: 0px; height: 490px; background: none; }
@media (max-width: 1100px) and (min-width: 701px){
.leaf-stage .fan { height: 470px; }
}
@media (max-width: 700px){
.leaf-stage { margin: 32px 0px 55px; }
.leaf-stage .fan { margin: 0px; height: 500px; }
}
.leaf-stage .fan.clean-spines { display: grid; grid-template-columns: 3.55fr 2.55fr 1.9fr 1.35fr 0.85fr; height: 570px; gap: 8px; background: none; transition: none; }
.clean-spine { display: block; position: relative; min-width: 0px; background: rgb(255, 255, 255); color: rgb(27, 27, 26); overflow: hidden; }
.clean-spine > span { position: absolute; top: 30px; left: 26px; writing-mode: vertical-rl; font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 28px; line-height: 1.15; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.8px; white-space: nowrap; }
.clean-spine:focus-visible { outline: 2px solid rgb(122, 98, 56); outline-offset: -3px; }
@media (max-width: 700px){
.leaf-stage .fan.clean-spines { display: grid; grid-template-columns: repeat(5, minmax(0px, 1fr)); height: 380px; gap: 5px; overflow: visible; padding: 0px; }
.clean-spine > span { top: 20px; left: 50%; transform: translateX(-50%); font-size: 20px; letter-spacing: -0.5px; }
}
.leaf-stage .fan.clean-spines { background: rgb(250, 250, 248) !important; }
.homepage .masthead { padding-top: 62px !important; padding-bottom: 0px !important; margin-bottom: 0px !important; border: 0px !important; }
.homepage .masthead h1 { margin: 0px !important; padding: 0px 0px 35px !important; border: 0px !important; }
.homepage .leaf-stage { margin-top: 58px !important; }
.spine-number { position: absolute; top: 26px; left: 26px; font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 11px; line-height: 1.3; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: 1px; color: rgb(153, 126, 91); }
.clean-spine > span { top: 62px; }
@media (max-width: 700px){
.homepage .masthead { padding-top: 38px !important; }
.homepage .masthead h1 { padding-bottom: 20px !important; }
.homepage .leaf-stage { margin-top: 30px !important; }
.spine-number { top: 19px; left: 50%; transform: translateX(-50%); font-size: 9px; }
.clean-spine > span { top: 49px; }
}
button.clean-spine { border: 0px; border-radius: 0px; padding: 0px; text-align: left; cursor: pointer; appearance: none; font-style: inherit; font-variant-caps: inherit; font-weight: inherit; font-width: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-size-adjust: inherit; font-kerning: inherit; font-variant-alternates: inherit; font-variant-ligatures: inherit; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-feature-settings: inherit; font-optical-sizing: inherit; font-variation-settings: inherit; }
.leaf-stage .fan.clean-spines { transition: grid-template-columns 0.65s cubic-bezier(0.22, 0.8, 0.22, 1); }
@media (prefers-reduced-motion: reduce){
.leaf-stage .fan.clean-spines { transition: none; }
}
.spine-art { position: absolute; inset: 65px 18px 28px 70px; pointer-events: none; opacity: 0; overflow: visible; transition: opacity 0.2s; isolation: isolate; }
.clean-spine.is-open .spine-art { opacity: 1; transition: opacity 0.35s 0.12s; }
.spine-art img { position: absolute; object-fit: contain; max-width: none; transition: width 0.65s cubic-bezier(0.22, 0.8, 0.22, 1), height 0.65s cubic-bezier(0.22, 0.8, 0.22, 1), left 0.65s cubic-bezier(0.22, 0.8, 0.22, 1), right 0.65s cubic-bezier(0.22, 0.8, 0.22, 1), top 0.65s cubic-bezier(0.22, 0.8, 0.22, 1), bottom 0.65s cubic-bezier(0.22, 0.8, 0.22, 1), transform 0.65s cubic-bezier(0.22, 0.8, 0.22, 1); }
@media (max-width: 700px){
.spine-art { inset: 45px 8px 18px 42px; }
.clean-spine:not(.is-open) .spine-art { opacity: 0; }
.clean-spine.is-open > span { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce){
.spine-art, .spine-art img { transition: none !important; }
}
.homepage .masthead h1 { background-color: rgb(32, 32, 32); background-image: url("/a/j/section-art/black-original-pigment.svg?v=1"); background-size: 1200px 300px; background-position: center center; background-repeat: repeat; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: rgb(32, 32, 32) !important; }
.art-names-cloud { inset: 105px 23px 65px 75px; container-type: inline-size; }
.cloud-name { position: absolute; display: block; white-space: nowrap; font-family: Prata, serif; line-height: 1.15; color: rgb(27, 27, 26); letter-spacing: -0.035em; transform: translate(var(--dx),var(--dy)) scale(.84); transform-origin: center center; transition: transform 0.9s cubic-bezier(0.2, 1.18, 0.35, 1), opacity 0.4s !important; }
.is-open .cloud-name { transform: translate(0px) scale(1); }
@media (max-width: 700px){
.art-names-cloud { inset: 85px 10px 40px 43px; }
}
@media (prefers-reduced-motion: reduce){
.cloud-name { transition: none !important; }
}
.art-names-cloud { inset: 115px 25px 80px 77px; }
.cloud-name { letter-spacing: -0.04em; }
.art-names-cloud { top: 88px; bottom: 44px; mask-image: linear-gradient(transparent 0%, rgb(0, 0, 0) 13%, rgb(0, 0, 0) 85%, transparent 100%); }
.art-names-cloud .cloud-name { color: rgb(46, 99, 137); opacity: 0; transform: translate(var(--dx),var(--dy)) rotate(var(--tilt,-8deg)) scale(.6); transition: transform 1.05s cubic-bezier(0.17, 1.3, 0.32, 1) 0ms, opacity 0.5s !important; }
.art-names-cloud .cloud-name:nth-child(2n) { color: rgb(139, 137, 108); --tilt: 9deg; }
.is-open .art-names-cloud .cloud-name { opacity: 1; transform: translate(0px) rotate(0deg) scale(1); transition-delay: var(--wait,0ms) !important; }
@media (prefers-reduced-motion: reduce){
.art-names-cloud .cloud-name { transition: none !important; }
}
.art-names-cloud { mask-image: none; }
.art-names-cloud.names-packed { inset: 120px 32px auto 69px; height: 0px; padding-bottom: 0px; aspect-ratio: 1 / 1.13; container-type: inline-size; mask-image: none; display: block; }
.names-packed .cloud-name { position: absolute; line-height: 1.02; letter-spacing: -0.045em; white-space: nowrap; }
.names-packed .cloud-name:nth-child(3n) { color: rgb(139, 137, 108); }
@media (max-width: 700px){
.art-names-cloud.names-packed { left: 44px; right: 13px; top: 105px; }
}
.art-names-cloud.names-packed { height: auto; bottom: 45px; aspect-ratio: auto; }
.names-packed .cloud-name:nth-child(15) { transform-origin: 0px 0px; left: 0px !important; top: 62cqw !important; font-size: 3.8cqw !important; }
.is-open .names-packed .cloud-name:nth-child(15) { transform: rotate(-90deg) !important; }
.names-packed .cloud-name:nth-child(16) { transform-origin: 0px 0px; left: 96% !important; top: 34cqw !important; font-size: 3.5cqw !important; }
.is-open .names-packed .cloud-name:nth-child(16) { transform: rotate(90deg) !important; }
.names-packed .cloud-name:nth-child(17) { left: 8% !important; top: 83cqw !important; }
.names-packed .cloud-name:nth-child(18) { left: 74% !important; top: 82cqw !important; }
.names-packed .cloud-name:nth-child(19) { left: 6% !important; top: 15cqw !important; }
.names-packed .cloud-name:nth-child(20) { left: 31% !important; top: 88cqw !important; }
.names-packed .cloud-name:nth-child(21) { transform-origin: 0px 0px; left: 93% !important; top: 13cqw !important; }
.is-open .names-packed .cloud-name:nth-child(21) { transform: rotate(90deg) !important; }
.names-packed .cloud-name:nth-child(13) { left: 37% !important; top: 5cqw !important; }
.names-packed .cloud-name:nth-child(11) { left: 19% !important; top: 10cqw !important; }
.spine-art.art-jadore { inset: 85px 28px 35px 72px; }
.art-jadore img { position: absolute; left: var(--x); top: var(--y); width: var(--w); height: var(--h); z-index: var(--layer); object-fit: contain; filter: none; transform: translate(var(--dx),var(--dy)) rotate(calc(var(--r) - 8deg)) scale(.8); transition: transform 0.88s cubic-bezier(0.2, 1.22, 0.35, 1), width 0.65s, height 0.65s !important; }
.is-open .art-jadore img { transform: translate(0,0) rotate(var(--r)) scale(1); transition-delay: var(--wait) !important; }
@media (max-width: 700px){
.spine-art.art-jadore { inset: 75px 13px 35px 43px; }
}
@media (prefers-reduced-motion: reduce){
.art-jadore img { transition: none !important; }
}
.spine-art.art-jadore { inset: 120px 32px 45px 69px; }
@media (max-width: 700px){
.spine-art.art-jadore { inset: 105px 13px 45px 44px; }
}
.spine-art.art-jadore { top: 92px; bottom: 4px; }
@media (max-width: 700px){
.spine-art.art-jadore { top: 79px; bottom: 15px; }
}
.spine-art.art-jadore { top: 110px; bottom: 35px; transform: scale(1.1); transform-origin: 50% 50%; }
@media (max-width: 700px){
.spine-art.art-jadore { top: 96px; bottom: 35px; }
}
.spine-art.art-jadore { transform: translateY(-32px) scale(1.02); }
.art-jadore .jadore-jasmine { top: 3% !important; }
.art-jadore .jadore-jasmine { top: -3% !important; z-index: 2 !important; }
.art-jadore .jadore-freesia { z-index: 1 !important; }
.art-jadore .jadore-rose { z-index: 3 !important; }
.art-jadore .jadore-magnolia { z-index: 4 !important; }
.art-jadore .jadore-ylang { z-index: 5 !important; }
@media (min-width: 741px){
.homepage .header.header { height: 88px; gap: 28px; }
.homepage .header nav { font-size: 22px; gap: 28px; line-height: 1.25; }
.homepage .header .search-trigger { font-size: 18px; line-height: 1.3; }
.homepage .header .search-trigger svg { width: 21px; height: 21px; }
.homepage .header .language { font-size: 16px; }
.homepage .header .app-pill { font-size: 17px; line-height: 1.3; padding: 13px 18px; white-space: nowrap; }
}
@media (min-width: 741px) and (max-width: 1100px){
.homepage .header.header { gap: 20px; }
.homepage .header nav { font-size: 20px; gap: 22px; }
.homepage .header .search-trigger span { display: none; }
.homepage .header .app-pill { font-size: 16px; }
}
@media (max-width: 740px){
.homepage .header nav { font-size: 15px; }
.homepage .header .app-pill { font-size: 13px; }
.homepage .header .language { font-size: 13px; }
.homepage .header .search-trigger svg { width: 22px; height: 22px; }
}
.spine-art.art-culture-five { inset: 88px 26px auto 64px; aspect-ratio: 1122 / 1402; isolation: isolate; }
.art-culture-five .culture-plane { position: absolute; inset: 0px; transform-origin: 50% 57%; opacity: 0; transition: transform 0.98s cubic-bezier(0.18, 1.16, 0.34, 1), opacity 0.35s; }
.art-culture-five .culture-plane img { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: contain; filter: none; transform-origin: 0px 0px; transition: none !important; }
.art-culture-five .culture-vendome img { transform: translate(10%, -1%) scale(0.85) !important; }
.art-culture-five .culture-factory img { transform: translate(8%, 12%) scale(0.58) !important; }
.art-culture-five .culture-pharmacy img { transform: translate(22%, 8%) scale(0.78) !important; }
.art-culture-five .culture-villa img { transform: translate(4%, 25%) scale(0.65) !important; }
.art-culture-five .culture-garden img { transform: translate(30%, 32%) scale(0.69) !important; }
.culture-vendome { z-index: 1; transform: translate(0px, -64px) rotate(-3deg) scale(0.87); }
.culture-factory { z-index: 2; transform: translate(-68px, -14px) rotate(-7deg) scale(0.89); }
.culture-pharmacy { z-index: 3; transform: translate(70px, -12px) rotate(6deg) scale(0.89); }
.culture-villa { z-index: 4; transform: translate(-44px, 66px) rotate(-5deg) scale(0.9); }
.culture-garden { z-index: 5; transform: translate(48px, 70px) rotate(5deg) scale(0.88); }
.is-open .art-culture-five .culture-plane { opacity: 1; transform: translate(0px) rotate(0deg) scale(1); }
.is-open .culture-vendome { transition-delay: 20ms; }
.is-open .culture-factory { transition-delay: 80ms; }
.is-open .culture-pharmacy { transition-delay: 125ms; }
.is-open .culture-villa { transition-delay: 180ms; }
.is-open .culture-garden { transition-delay: 235ms; }
@media (max-width: 700px){
.spine-art.art-culture-five { left: 44px; right: 13px; top: 88px; }
}
@media (prefers-reduced-motion: reduce){
.art-culture-five .culture-plane { transition: none; }
}
.art-culture-five .culture-factory img { transform: translate(6%, 10%) scale(0.62) !important; }
.art-culture-five .culture-pharmacy img { transform: translate(20%, 8%) scale(0.8) !important; }
.art-culture-five .culture-villa img { transform: translate(2%, 24%) scale(0.73) !important; }
.art-culture-five .culture-garden img { transform: translate(25%, 25%) scale(0.72) !important; }
.spine-art.art-culture-five { transform: scale(0.88); transform-origin: 50% 45%; }
.spine-art.art-culture-five { top: 62px; }
.culture-green { z-index: 6; transform: translate(0px, 38px) scale(0.92); }
.art-culture-five .culture-green img { transform: none !important; }
.is-open .culture-green { transition-delay: 170ms; }
@media (max-width: 700px){
.spine-art.art-culture-five { top: 65px; }
}
.culture-green { z-index: 0; }
.art-culture-five .culture-green img { transform: translate(3%, 6%) scale(0.94) !important; }
.art-culture-five .culture-green img { transform: translate(-3%, 1%) scale(1.06) !important; }
.spine-art.art-culture-five { left: 69px; right: 32px; top: 80px; transform: scale(0.76); transform-origin: 50% 45%; }
@media (max-width: 700px){
.spine-art.art-culture-five { left: 44px; right: 13px; top: 83px; }
}
.spine-art.art-culture-five { top: 63px; transform: scale(0.71); }
@media (max-width: 700px){
.spine-art.art-culture-five { top: 78px; }
}
.spine-art.art-jadore { transform: translateY(-25px) scale(0.96); transform-origin: 50% 50%; }
.spine-art.art-culture-five { transform: translateY(10px) scale(0.71); transform-origin: 50% 45%; }
.spine-art.art-practice-layers { inset: 128px auto auto 50%; width: 393px; aspect-ratio: 1315 / 1197; transform: translateX(calc(-50% + 10px)); isolation: isolate; }
.art-practice-layers .practice-plane { position: absolute; inset: 0px; opacity: 0; transform: translate(var(--dx),var(--dy)) rotate(var(--turn)) scale(.84); transform-origin: 50% 60%; transition: transform 0.95s cubic-bezier(0.18, 1.18, 0.34, 1), opacity 0.25s; will-change: transform; }
.art-practice-layers .practice-plane img { position: absolute; object-fit: contain; max-width: none; filter: none; transform: none !important; transition: none !important; }
.clean-spine.is-open .art-practice-layers .practice-plane { opacity: 1; transform: translate(0px) rotate(0deg) scale(1); transition-delay: var(--wait); }
.practice-scarf { z-index: 0; }
.practice-diary { z-index: 1; }
.practice-rack { z-index: 2; }
.practice-atomizer { z-index: 3; }
.practice-pipette { z-index: 4; }
@media (max-width: 700px){
.spine-art.art-practice-layers { top: 98px; width: calc(100% - 57px); transform: translateX(calc(-50% + 10px)); }
}
@media (prefers-reduced-motion: reduce){
.art-practice-layers .practice-plane { transition: none; transform: none; }
.clean-spine.is-open .art-practice-layers .practice-plane { transition-delay: 0ms; }
}
.spine-art.art-personal-collection { inset: 83.602px auto auto 50%; width: 467.252px; aspect-ratio: 1000 / 900; transform: translateX(calc(-50% + 0.564px)); isolation: isolate; }
.art-personal-collection .personal-bottle { position: absolute; opacity: 0; transform: translate(var(--dx),var(--dy)) rotate(var(--turn)) scale(.85); transform-origin: 50% 65%; transition: transform 0.95s cubic-bezier(0.18, 1.18, 0.34, 1), opacity 0.25s; }
.art-personal-collection .personal-bottle img { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: contain; filter: none; transform: none !important; transition: none !important; }
.clean-spine.is-open .art-personal-collection .personal-bottle { opacity: 1; transform: translate(0px) rotate(0deg) scale(1); transition-delay: var(--wait); }
@media (max-width: 700px){
.spine-art.art-personal-collection { top: 84px; width: calc(100% - 40px); }
}
@media (prefers-reduced-motion: reduce){
.art-personal-collection .personal-bottle { transition: none; transform: none; }
.clean-spine.is-open .art-personal-collection .personal-bottle { transition-delay: 0ms; }
}
.clean-spine > span { transition: color 0.18s; }
@media (hover: hover){
.clean-spine:not(.is-open):hover > span { color: rgb(122, 98, 56); }
}
.clean-spine:focus-visible { outline: 2px solid rgb(122, 98, 56); outline-offset: -4px; }
.clean-spine:not(.is-open):focus-visible > span { color: rgb(122, 98, 56); }
.names-packed .cloud-name:nth-child(2) { font-size: 14.5cqw !important; left: 12% !important; top: 61.5cqw !important; }
.names-packed .cloud-name:nth-child(3) { font-size: 10.5cqw !important; left: 20% !important; top: 50cqw !important; }
.names-packed .cloud-name:nth-child(4) { font-size: 12cqw !important; left: 30% !important; top: 16cqw !important; }
.names-packed .cloud-name:nth-child(6) { left: 68% !important; top: 24cqw !important; }
.names-packed .cloud-name:nth-child(8) { left: 73% !important; top: 65cqw !important; }
.names-packed .cloud-name:nth-child(9) { font-size: 6.2cqw !important; left: 34% !important; top: 78cqw !important; }
.names-packed .cloud-name:nth-child(10) { top: 77.5cqw !important; }
.names-packed .cloud-name:nth-child(12) { left: 70% !important; }
.art-names-cloud .cloud-name { transition: transform 0.86s cubic-bezier(0.2, 1.08, 0.35, 1), opacity 0.3s !important; }
.art-jadore img { transition: transform 0.98s cubic-bezier(0.2, 1.12, 0.35, 1) !important; }
.art-culture-five .culture-plane { transition: transform 0.88s cubic-bezier(0.2, 0.85, 0.25, 1), opacity 0.3s; }
.art-practice-layers .practice-plane { transition: transform 0.88s cubic-bezier(0.2, 1.04, 0.32, 1), opacity 0.28s; }
.art-practice-layers .practice-scarf { transition-duration: 1.04s, 0.32s; }
.art-practice-layers .practice-rack { transition-duration: 0.82s, 0.28s; }
.art-practice-layers .practice-pipette { transition-duration: 0.94s, 0.28s; }
.art-personal-collection .personal-bottle { transition: transform 0.86s cubic-bezier(0.2, 1.02, 0.3, 1), opacity 0.28s; }
@media (prefers-reduced-motion: reduce){
.leaf-stage .fan.clean-spines, .clean-spine > span, .art-jadore img, .art-names-cloud .cloud-name, .art-culture-five .culture-plane, .art-practice-layers .practice-plane, .art-personal-collection .personal-bottle { transition: none !important; animation: auto !important; }
}
@media (min-width: 701px){
.clean-spine > span { font-size: 38px; line-height: 1; }
}
.journal-feed { margin: 76px 0px 90px; color: rgb(27, 27, 26); }
.journal-feed a { color: inherit; text-decoration: none; }
.journal-feed a:hover { color: rgb(122, 98, 56); }
.journal-heading { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 30px; }
.journal-heading h2, .journal-news h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 38px; line-height: 1.2; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; margin: 0px; letter-spacing: -1px; }
.journal-heading > a { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 14px; line-height: normal; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(122, 98, 56); }
.journal-lead { display: grid; grid-template-columns: 1.16fr 1fr; gap: 64px; align-items: center; }
.journal-cover { height: 360px; background: rgb(255, 255, 255); position: relative; display: flex; align-items: center; justify-content: center; gap: 28px; overflow: hidden; }
.journal-cover > span { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 92px; line-height: 1; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -9px; }
.journal-cover > span span { font-family: Prata, serif; font-size: 120px; letter-spacing: -6px; }
.journal-cover > .journal-cover-arrow { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 40px; line-height: normal; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: 0px; }
.journal-cover .cover-edp { -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: rgb(27, 27, 26); color: transparent; }
.journal-cover .cover-edp > span { -webkit-text-stroke-width: 0px; -webkit-text-stroke-color: currentcolor; color: rgb(27, 27, 26); }
.journal-cover small { position: absolute; bottom: 28px; left: 30px; font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 10px; line-height: normal; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: 1.5px; color: rgb(119, 120, 110); }
.journal-meta { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 10px; line-height: 1.5; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: 1px; color: rgb(121, 120, 108); display: block; }
.journal-lead h3 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 54px; line-height: 1.12; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -1.7px; margin: 20px 0px; }
.journal-lead p { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 17px; line-height: 1.65; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(100, 100, 92); max-width: 360px; margin: 0px 0px 22px; }
.journal-author { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 12px; line-height: normal; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; display: block; margin-bottom: 22px; }
.journal-read { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 14px; line-height: normal; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(122, 98, 56) !important; }
.journal-secondary { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin-top: 52px; }
.journal-secondary article { display: grid; grid-template-columns: 160px 1fr; gap: 24px; align-items: center; }
.journal-small-art { height: 190px; display: block; position: relative; background: rgb(255, 255, 255); overflow: hidden; }
.mosaique-art > span { position: absolute; left: 14px; top: 18px; font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 24px; line-height: normal; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; z-index: 2; }
.mosaique-art img { position: absolute; object-fit: contain; width: 110px; height: 130px; bottom: 0px; left: -5px; }
.mosaique-art img + img { left: 62px; bottom: -4px; transform: rotate(-15deg); }
.trial-art { display: flex; justify-content: center; align-items: center; gap: 6px; }
.trial-art span { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 66px; line-height: normal; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; }
.trial-art i { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 38px; line-height: normal; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(139, 137, 108); }
.journal-secondary h3 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 25px; line-height: 1.3; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.6px; margin: 12px 0px; }
.journal-secondary p { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 14px; line-height: 1.6; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(100, 100, 92); margin: 0px; }
.journal-news { margin-top: 64px; padding-top: 28px; border-top: 1px solid rgb(217, 217, 210); }
.journal-news-items { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px; }
.journal-news-items article + article { border-left: 1px solid rgb(222, 222, 216); padding-left: 30px; }
.journal-news h3 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 24px; line-height: 1.3; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -0.5px; margin: 12px 0px; }
.journal-news p { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 14px; line-height: 1.6; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(100, 100, 92); margin: 0px 0px 14px; }
.journal-news .news-source { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 11px; line-height: normal; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(122, 98, 56); }
@media (max-width: 700px){
.journal-lead, .journal-secondary, .journal-news-items { grid-template-columns: 1fr; }
.journal-lead { gap: 24px; }
.journal-cover { height: 250px; }
.journal-cover > span { font-size: 60px; }
.journal-cover > span span { font-size: 80px; }
.journal-lead h3 { font-size: 40px; }
.journal-secondary article { grid-template-columns: 110px 1fr; }
.journal-news-items article + article { border-left: 0px; padding-left: 0px; }
}
.app-invitation { background: rgb(255, 255, 255); padding: 64px 40px 66px; min-height: 470px; text-align: center; color: rgb(27, 27, 26); }
.homepage .app-invitation h2 { font-size: 52px; margin: 23px 0px; color: rgb(27, 27, 26) !important; }
@media (max-width: 700px){
.app-invitation { padding: 45px 25px; min-height: 0px; }
.homepage .app-invitation h2 { font-size: 36px; }
}
.news-outside-heading { display: flex; align-items: baseline; gap: 28px; margin: 64px 0px 26px; }
.news-outside-heading h2 { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 30px; line-height: 1.2; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: -1px; margin: 0px; }
.news-outside-heading > span { font-style: normal; font-variant-caps: normal; font-weight: normal; font-width: normal; font-size: 9px; line-height: normal; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: 0.8px; color: rgb(121, 120, 108); }
.journal-news { margin-top: 0px; padding: 28px 30px; background: rgb(255, 255, 255); border-top: 0px; }
.app-invitation { position: relative; isolation: isolate; overflow: hidden; margin: 0px 0px 70px; }
.app-invitation h2 { font-family: Prata, serif; line-height: 1.2; letter-spacing: -1.2px; }
.journal-news-items article + article { border-left: 0px; padding-left: 0px; }
.journal-news-items { gap: 48px; }
body.homepage > .header { display: none; }
.homepage .masthead { padding-top: 105px !important; padding-bottom: 44px !important; }
.art-names-cloud .cloud-name, .art-culture-five .culture-plane, .art-practice-layers .practice-plane, .art-personal-collection .personal-bottle { will-change: transform; transition: transform 0.98s cubic-bezier(0.2, 1.12, 0.35, 1), opacity 0.12s linear !important; }
.clean-spine:not(.is-open) .art-names-cloud .cloud-name { transform: translate(calc(var(--dx) * 1.3),calc(var(--dy) * 1.3)) rotate(var(--tilt,-8deg)) scale(.8); }
.clean-spine:not(.is-open) .practice-plane, .clean-spine:not(.is-open) .personal-bottle { transform: translate(calc(var(--dx) * 1.65),calc(var(--dy) * 1.65)) rotate(var(--turn)) scale(.8); }
.clean-spine:not(.is-open) .culture-vendome { transform: translate(0px, -105px) rotate(-8deg) scale(0.8); }
.clean-spine:not(.is-open) .culture-factory { transform: translate(-105px, -35px) rotate(-10deg) scale(0.8); }
.clean-spine:not(.is-open) .culture-pharmacy { transform: translate(105px, -28px) rotate(9deg) scale(0.8); }
.clean-spine:not(.is-open) .culture-villa { transform: translate(-75px, 95px) rotate(-8deg) scale(0.8); }
.clean-spine:not(.is-open) .culture-garden { transform: translate(80px, 105px) rotate(8deg) scale(0.8); }
.clean-spine:not(.is-open) .culture-green { transform: translate(0px, 75px) rotate(-4deg) scale(0.8); }
.clean-spine.is-open .art-names-cloud .cloud-name, .clean-spine.is-open .practice-plane, .clean-spine.is-open .personal-bottle { transition-delay: var(--wait,0ms) !important; }
.clean-spine.is-open .culture-vendome { transition-delay: 0ms !important; }
.clean-spine.is-open .culture-factory { transition-delay: 65ms !important; }
.clean-spine.is-open .culture-pharmacy { transition-delay: 130ms !important; }
.clean-spine.is-open .culture-villa { transition-delay: 195ms !important; }
.clean-spine.is-open .culture-garden { transition-delay: 260ms !important; }
.clean-spine.is-open .culture-green { transition-delay: 165ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(1) { transition-delay: 0ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(2) { transition-delay: 65ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(3) { transition-delay: 130ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(4) { transition-delay: 195ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(5) { transition-delay: 260ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(6) { transition-delay: 0ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(7) { transition-delay: 65ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(8) { transition-delay: 130ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(9) { transition-delay: 195ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(10) { transition-delay: 260ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(11) { transition-delay: 0ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(12) { transition-delay: 65ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(13) { transition-delay: 130ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(14) { transition-delay: 195ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(15) { transition-delay: 260ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(16) { transition-delay: 0ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(17) { transition-delay: 65ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(18) { transition-delay: 130ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(19) { transition-delay: 195ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(20) { transition-delay: 260ms !important; }
.clean-spine.is-open .art-names-cloud .cloud-name:nth-child(21) { transition-delay: 0ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(1) { transition-delay: 0ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(2) { transition-delay: 40ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(3) { transition-delay: 80ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(4) { transition-delay: 120ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(5) { transition-delay: 160ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(6) { transition-delay: 200ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(7) { transition-delay: 240ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(8) { transition-delay: 280ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(9) { transition-delay: 320ms !important; }
.clean-spine.is-open .personal-bottle:nth-child(10) { transition-delay: 360ms !important; }
.clean-spine.is-open .practice-plane:nth-child(1) { transition-delay: 0ms !important; }
.clean-spine.is-open .practice-plane:nth-child(2) { transition-delay: 65ms !important; }
.clean-spine.is-open .practice-plane:nth-child(3) { transition-delay: 130ms !important; }
.clean-spine.is-open .practice-plane:nth-child(4) { transition-delay: 195ms !important; }
.clean-spine.is-open .practice-plane:nth-child(5) { transition-delay: 260ms !important; }
@media (prefers-reduced-motion: reduce){
.art-names-cloud .cloud-name, .art-culture-five .culture-plane, .art-practice-layers .practice-plane, .art-personal-collection .personal-bottle { transition: none 0ms !important; }
}
.art-culture-five .culture-garden img { transform: translate(20%, 25%) scale(0.76) !important; }
.culture-center-bush { z-index: 4; transform: translate(-35px, 65px) scale(0.8); }
.art-culture-five .culture-center-bush img { inset: 35% auto auto 34%; width: 29%; height: 30%; transform: none !important; }
.clean-spine.is-open .culture-center-bush { transition-delay: 195ms !important; }
.culture-shalimar-new { z-index: 7; transform: translate(25px, 85px) rotate(7deg) scale(0.8); }
.art-culture-five .culture-shalimar-new img { inset: 44% auto auto 33%; width: 40%; height: 50%; transform: none !important; }
.clean-spine.is-open .culture-shalimar-new { transition-delay: 260ms !important; }
.cloud-word { display: block; height: auto; max-width: none; }
.homepage .masthead h1 { cursor: pointer; }
html body .spine-number, html body .journal-meta, html body .tile-brand, html body .tile-detail, html body .breadcrumb, html body .breadcrumb *, html body .news-source, html body .source-link, html body .footer small, html body .news-outside-heading span, html body .journal-author, html body .draft-meta, html body .byline, html body .byline *, html body .app-invitation-kicker, html body .journal-cover small, html body .cover-kicker { font-size: 12px !important; }
html body .tile-detail, html body .breadcrumb, html body .breadcrumb *, html body .footer small, html body .news-outside-heading span, html body .journal-cover small, html body .notice, html body .catalog-source, html body .missing-fields, html body .article-sources small { color: rgb(100, 100, 92) !important; }
html body .spine-number { color: rgb(122, 98, 56) !important; }
html body .journal-feed p, html body .journal-news p, html body .notice, html body .missing-fields, html body .article-sources small { font-size: 14px !important; }
html body .real-note span { font-size: 13px !important; }
html body .real-note b { display: none !important; }
html body .article-body p { font-size: 17px !important; line-height: 1.65 !important; }
html body .article-body .quick-answer { font-size: 20px !important; }
html body .simple p { font-size: 17px !important; line-height: 1.65 !important; }
html body .note-item small, html body .shared-note-label, html body .catalog-explanation { font-size: 13px !important; }
.catalog-controls { align-items: end !important; }
.catalog-controls label { margin: 0px !important; }
.data-heading p { display: none; }
@media (max-width: 700px){
html body .clean-spine.is-open > span { left: 14px !important; transform: none !important; }
html body .spine-art.art-personal-collection { left: calc(50% + 12px) !important; width: calc(100% - 56px) !important; }
html body .journal-small-art.mosaique-art > span { font-size: 19px !important; }
html body .journal-small-art.trial-art { overflow: hidden; font-size: 40px !important; }
html body .journal-small-art.trial-art > span, html body .journal-small-art.trial-art > i { font-size: 40px !important; }
html body .app-invitation h2 { font-size: 34px !important; line-height: 1.14 !important; }
html body .tile-detail { font-size: 12px !important; }
html body .article-body p, html body .simple p { font-size: 16px !important; }
html body .article-body .quick-answer { font-size: 18px !important; }
html body .real-note span { font-size: 12px !important; }
}
html body .eyebrow, html body .language, html body .search-trigger, html body .search-trigger span, html body .header nav a, html body .article-categories a, html body #catalog-count, html body #note-count, html body .byline span, html body .app-pill { font-size: 12px !important; }
html body .header nav a, html body .app-pill, html body .search-trigger span { font-size: 13px !important; }
html body .journal-heading, html body .news-outside-heading, html body .journal-read, html body .news-source { display: none !important; }
html body .journal-news { margin-top: 64px !important; }
html body .journal-feed { padding-top: 72px !important; }
html body .app-invitation-link span, html body .app-pill span { display: none !important; }
@media (min-width: 701px){
html { zoom: 0.75; }
html body .spine-number, html body .journal-meta, html body .tile-brand, html body .tile-detail, html body .breadcrumb, html body .breadcrumb *, html body .footer small, html body .journal-author, html body .draft-meta, html body .byline, html body .byline *, html body .app-invitation-kicker, html body .journal-cover small, html body .cover-kicker, html body .eyebrow, html body .language, html body .article-categories a, html body #catalog-count, html body #note-count, html body .byline span, html body .source-link { font-size: 16px !important; }
html body .header nav a, html body .app-pill, html body .search-trigger span, html body .footer a:not(.wordmark) { font-size: 17.5px !important; }
html body .journal-feed p, html body .journal-news p, html body .app-invitation p, html body .notice, html body .missing-fields, html body .article-sources small, html body .catalog-controls label, html body .catalog-controls input, html body .catalog-controls select, html body .description, html body .sub { font-size: 18.7px !important; }
html body .real-note span, html body .note-item small, html body .shared-note-label, html body .catalog-explanation, html body .inline-source { font-size: 17.5px !important; }
html body .article-body p, html body .simple p, html body .comparison p { font-size: 22.7px !important; line-height: 1.65 !important; }
html body .article-body .quick-answer { font-size: 26.7px !important; }
html body .save, html body .real-saves button, html body .version-switch button, html body .app-invitation-link { font-size: 17.5px !important; }
}
@media (min-width: 701px){
html body .text-link, html body .end-object .text-link { font-size: 17.5px !important; }
}
.art-names-cloud { --c: 1cqw; }
@media (min-width: 701px){
.art-names-cloud { --c: 4.0742px; }
.homepage .spine-art.art-names-cloud { translate: -1px var(--spine-y,183px); left: 96px !important; right: auto !important; width: 407.42px !important; top: 0px !important; }
}
html body .art-names-cloud.names-packed .cloud-name:nth-child(2) { font-size: calc(14.5*var(--c)) !important; left: 12% !important; top: calc(61.5*var(--c)) !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(3) { font-size: calc(10.5*var(--c)) !important; left: 20% !important; top: calc(50*var(--c)) !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(4) { font-size: calc(12*var(--c)) !important; left: 30% !important; top: calc(16*var(--c)) !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(6) { left: 68% !important; top: calc(24*var(--c)) !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(8) { left: 73% !important; top: calc(65*var(--c)) !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(9) { font-size: calc(6.2*var(--c)) !important; left: 34% !important; top: calc(78*var(--c)) !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(10) { top: calc(77.5*var(--c)) !important; }
@media (min-width: 701px){
html body .art-names-cloud.names-packed .cloud-name:nth-child(11) { top: 41px !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(13) { top: 20px !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(17) { top: 338px !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(18) { top: 334px !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(19) { top: 61px !important; }
html body .art-names-cloud.names-packed .cloud-name:nth-child(20) { top: 359px !important; }
}
:root { --block-gap: 48px; }
@media (min-width: 701px){
:root { --block-gap: 85.33px; }
}
html body.homepage .leaf-stage { margin-bottom: 0px !important; padding-bottom: 0px !important; }
html body.homepage .journal-feed { margin: var(--block-gap) auto 0 !important; padding: 0px !important; }
html body.homepage .journal-lead { margin: 0px !important; }
html body.homepage .journal-secondary { margin: var(--block-gap) 0 0 !important; padding: 0px !important; }
html body.homepage .journal-news { margin: var(--block-gap) 0 0 !important; }
html body.homepage .app-invitation { margin: var(--block-gap) auto 0 !important; }
html body.homepage main#content { padding-bottom: 0px !important; margin-bottom: 0px !important; }
html body.homepage .footer { margin-top: var(--block-gap) !important; }
:root { --inner-gap: 14px; }
@media (min-width: 701px){
:root { --inner-gap: 21.33px; }
}
html body.homepage .journal-secondary, html body.homepage .journal-news { margin-top: var(--inner-gap) !important; }
@media (min-width: 701px){
html body.homepage .spine-art.art-jadore { top: 0px !important; bottom: auto !important; height: 409px !important; }
}
html body .journal-meta, html body .journal-author, html body .journal-cover small, html body .spine-number, html body .s6 .s6-kicker { background: url("/a/j/section-art/bronze-original-pigment.svg") center center / 600px 150px padding-box text rgb(109, 87, 49); -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: rgb(109, 87, 49) !important; }
html body.homepage .journal-meta, html body.homepage .journal-author, html body.homepage .journal-cover small { display: none !important; }
@media (min-width: 701px){
.clean-spine > span { font-size: 38px; line-height: 1; }
}
@media (min-width: 701px){
.homepage .leaf-stage { position: relative; z-index: 3; margin-top: -131px !important; height: auto !important; }
.homepage .clean-spines { height: var(--spine-h,766px) !important; min-height: var(--spine-h,766px) !important; }
}
html body .app-invitation.s6 { position: relative; overflow: hidden; display: block !important; background: rgb(255, 255, 255) !important; padding: 0px !important; height: 447px !important; min-height: 0px !important; text-align: left !important; box-shadow: none !important; }
.s6 .s6-copy { position: absolute; left: 31px; top: 50%; transform: translateY(-50%); text-align: center; }
html body .s6 h2 { letter-spacing: 0px; white-space: nowrap; font-style: normal !important; font-variant-caps: normal !important; font-weight: 400 !important; font-width: normal !important; font-size: 54.67px !important; line-height: 62px !important; font-family: Prata, serif !important; font-size-adjust: none !important; font-kerning: auto !important; font-variant-alternates: normal !important; font-variant-ligatures: normal !important; font-variant-numeric: normal !important; font-variant-east-asian: normal !important; font-variant-position: normal !important; font-variant-emoji: normal !important; font-feature-settings: normal !important; font-optical-sizing: auto !important; font-variation-settings: normal !important; color: rgb(27, 27, 26) !important; margin: 0px 0px 24px !important; text-align: left !important; }
html body .s6 .s6-btn { display: inline-block; font-style: normal; font-variant-caps: normal; font-weight: 400; font-width: normal; font-size: 18px; line-height: 1; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; background: rgb(122, 98, 56); border-radius: 3px; padding: 16px 26px; text-decoration: none; color: rgb(255, 255, 255) !important; }
.s6 .s6-art { position: absolute; right: 46px; top: 46px; width: 391px; height: 355px; }
.s6 .s6-phone { position: absolute; z-index: 8; left: 132px; top: 44px; width: 127px; padding: 4px; border-radius: 23px; background: rgb(27, 26, 25); line-height: 0; box-shadow: rgba(40, 32, 20, 0.5) 0px 10px 20px -12px; }
.s6 .s6-phone img { display: block; width: 100%; height: auto; border-radius: 19px; }
.s6 .s6-l { position: absolute; display: block; height: auto; max-width: none; opacity: 0; transform: translate(var(--dx),var(--dy)) rotate(calc(var(--r) - 8deg)) scale(.8); transition: transform .88s cubic-bezier(.2,1.22,.35,1) var(--w),opacity .25s ease var(--w); }
.s6.in .s6-l { opacity: 1; transform: rotate(var(--r)); }
.s6 .s6-lilac { z-index: 1; width: 112px; left: 84px; top: -2px; --r: -16deg; --dx: -30px; --dy: -50px; --w: 0ms; }
.s6 .s6-hyacinth { z-index: 1; width: 92px; left: 222px; top: 0px; --r: 14deg; --dx: 30px; --dy: -50px; --w: 35ms; }
.s6 .s6-mimosa { z-index: 1; width: 124px; left: 0px; top: 112px; --r: -58deg; --dx: -60px; --dy: 0px; --w: 70ms; }
.s6 .s6-lavender { z-index: 1; width: 112px; left: 286px; top: 92px; --r: 48deg; --dx: 60px; --dy: 0px; --w: 105ms; }
.s6 .s6-peony { z-index: 3; width: 158px; left: 14px; top: 22px; --r: -8deg; --dx: -50px; --dy: -40px; --w: 140ms; }
.s6 .s6-blackrose { z-index: 3; width: 136px; left: 240px; top: 30px; --r: 10deg; --dx: 50px; --dy: -40px; --w: 175ms; }
.s6 .s6-amaryllis { z-index: 2; width: 120px; left: 262px; top: 138px; --r: 8deg; --dx: 60px; --dy: 10px; --w: 210ms; }
.s6 .s6-orchid { z-index: 3; width: 140px; left: 8px; top: 176px; --r: -6deg; --dx: -55px; --dy: 30px; --w: 245ms; }
.s6 .s6-marigold { z-index: 3; width: 116px; left: 256px; top: 232px; --r: 8deg; --dx: 50px; --dy: 45px; --w: 280ms; }
.s6 .s6-frangipani { z-index: 4; width: 112px; left: 62px; top: 262px; --r: -4deg; --dx: -25px; --dy: 50px; --w: 315ms; }
.s6 .s6-violet { z-index: 4; width: 90px; left: 208px; top: 276px; --r: 4deg; --dx: 15px; --dy: 50px; --w: 350ms; }
@media (max-width: 700px){
html body .app-invitation.s6 { height: auto !important; padding: 24px 20px !important; }
.s6 .s6-copy { position: static; transform: none; display: inline-block; }
html body .s6 h2 { font-size: 29px !important; line-height: 33px !important; margin-bottom: 14px !important; }
html body .s6 .s6-btn { font-size: 15px; padding: 13px 20px; }
.s6 .s6-art { position: relative; right: auto; top: auto; margin: 20px 0px 0px -195.5px; left: 50%; transform: scale(0.76); transform-origin: 50% 0px; height: 270px; }
}
@media (prefers-reduced-motion: reduce){
.s6 .s6-l { transition: none; opacity: 1; transform: rotate(var(--r)); }
}
.s6 .s6-whiterose { z-index: 2; width: 112px; left: 140px; top: 270px; --r: 0deg; --dx: 0px; --dy: 55px; --w: 300ms; }
@media (min-width: 701px){
.s6 .s6-art { transform: scale(0.92); transform-origin: 50% 50%; right: 46px; }
.s6 .s6-lilac { left: 112px; top: -10px; }
.s6 .s6-hyacinth { left: 196px; top: -8px; }
.s6 .s6-phone { left: 127px; top: 33px; width: 137px; border-radius: 25px; }
.s6 .s6-phone img { border-radius: 21px; }
}
html body .s6 h2 { margin-bottom: 28px !important; }
html body .s6 .s6-btn { display: block; background: url("/a/j/spine6/bronze-banner-pigment.svg") center center / cover rgb(127, 104, 73); border-radius: 0px; padding: 20px 0px; text-align: center; font-style: normal; font-variant-caps: normal; font-weight: 400; font-width: normal; font-size: 18px; line-height: 1; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; letter-spacing: 0.03em; color: rgb(255, 255, 255) !important; }
@media (max-width: 700px){
html body .s6 .s6-btn { padding: 14px 0px; font-size: 15px; }
html body .s6 h2 { margin-bottom: 16px !important; }
}
html body .s6 .s6-btn { background: linear-gradient(rgba(38, 27, 10, 0.3), rgba(38, 27, 10, 0.3)), url("/a/j/spine6/bronze-banner-pigment.svg") center center / cover, rgb(127, 104, 73); }
html body .s6 .s6-btn { background: url("/a/j/section-art/black-original-pigment.svg") center center / 1200px 300px rgb(32, 32, 32); padding: 17px 0px; }
@media (max-width: 700px){
html body .s6 .s6-btn { padding: 13px 0px; }
}
html body .s6 .s6-btn { background: rgb(27, 27, 26); }
html body .footer.foot2 { justify-content: space-between; align-items: baseline; gap: 24px; border-top: 1px solid rgb(217, 217, 210); padding-top: 26px; padding-bottom: 30px; display: flex !important; height: auto !important; }
html body .foot2 .wordmark { font-style: normal; font-variant-caps: normal; font-weight: 400; font-width: normal; font-size: 28px; line-height: 1.2; font-family: Prata, serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; color: rgb(27, 27, 26) !important; }
html body .foot2 nav { display: flex; align-items: baseline; gap: 24px; }
html body .foot2 nav a { text-decoration: none; font-style: normal !important; font-variant-caps: normal !important; font-weight: 400 !important; font-width: normal !important; font-size: 17.33px !important; line-height: 1.5 !important; font-family: Manrope, sans-serif !important; font-size-adjust: none !important; font-kerning: auto !important; font-variant-alternates: normal !important; font-variant-ligatures: normal !important; font-variant-numeric: normal !important; font-variant-east-asian: normal !important; font-variant-position: normal !important; font-variant-emoji: normal !important; font-feature-settings: normal !important; font-optical-sizing: auto !important; font-variation-settings: normal !important; color: rgb(27, 27, 26) !important; min-height: 0px !important; padding: 0px !important; display: inline !important; }
html body .foot2 nav a:hover { text-decoration: underline 1px; text-underline-offset: 3px; }
.foot2 .foot-lang { display: flex; gap: 10px; margin-left: 8px; }
html body .foot2 .foot-lang a:not([aria-current]) { color: rgb(100, 100, 92) !important; }
@media (max-width: 700px){
html body .footer.foot2 { position: relative; padding-top: 20px; padding-bottom: 24px; display: block !important; }
html body .foot2 .wordmark { font-size: 24px; }
html body .foot2 nav { margin-top: 12px; gap: 18px; }
html body .foot2 nav a { font-size: 13px !important; }
html body .foot2 .foot-lang { position: absolute; right: 0px; top: 26px; margin: 0px; }
}
html body.homepage .masthead h1 { background-color: rgb(44, 41, 30) !important; background-image: url("/a/j/spine6/bronze-ink.webp") !important; background-size: 1500px 420px !important; background-position: 1350px 220px !important; background-repeat: repeat !important; }
html body .s6 .s6-btn { letter-spacing: 0.02em; background: url("/a/j/spine6/bronze-from-splash-dark.webp") center center / 1500px 420px rgb(109, 103, 82) !important; font-weight: 500 !important; }
html body:not(.homepage) { --ink: #1b1b1a; --bronze: #7a6238; }
body:not(.homepage) .header { display: flex; align-items: center; gap: 30px; height: 88px; margin-bottom: 8px; border: 0px !important; }
body:not(.homepage) .header .wordmark { letter-spacing: -0.02em; color: rgb(44, 41, 30); background: url("/a/j/spine6/bronze-ink.webp") center center / 900px 252px padding-box text rgb(44, 41, 30); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-style: normal !important; font-variant-caps: normal !important; font-weight: normal !important; font-width: normal !important; font-size: 38px !important; line-height: 1 !important; font-family: Prata, serif !important; font-size-adjust: none !important; font-kerning: auto !important; font-variant-alternates: normal !important; font-variant-ligatures: normal !important; font-variant-numeric: normal !important; font-variant-east-asian: normal !important; font-variant-position: normal !important; font-variant-emoji: normal !important; font-feature-settings: normal !important; font-optical-sizing: auto !important; font-variation-settings: normal !important; }
body:not(.homepage) .header nav { display: flex; gap: 26px; margin-right: auto; font-style: normal; font-variant-caps: normal; font-weight: 500; font-width: normal; font-size: 16px; line-height: 1; font-family: Manrope, sans-serif; font-size-adjust: none; font-kerning: auto; font-variant-alternates: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-position: normal; font-variant-emoji: normal; font-feature-settings: normal; font-optical-sizing: auto; font-variation-settings: normal; }
body:not(.homepage) .header nav a, body:not(.homepage) .header .language, body:not(.homepage) .header .search-trigger { font-size: 16px; color: var(--ink) !important; }
body:not(.homepage) .header nav a:hover, body:not(.homepage) .header .search-trigger:hover { color: var(--bronze) !important; }
body:not(.homepage) .header .search-trigger span { display: none; }
body:not(.homepage) .header .search-trigger svg { width: 20px; height: 20px; }
body:not(.homepage) .header .app-pill { letter-spacing: 0.02em; background: url("/a/j/spine6/bronze-from-splash-dark.webp") center center / 1500px 420px rgb(109, 103, 82); font-style: normal !important; font-variant-caps: normal !important; font-weight: 500 !important; font-width: normal !important; font-size: 15px !important; line-height: 1 !important; font-family: Manrope, sans-serif !important; font-size-adjust: none !important; font-kerning: auto !important; font-variant-alternates: normal !important; font-variant-ligatures: normal !important; font-variant-numeric: normal !important; font-variant-east-asian: normal !important; font-variant-position: normal !important; font-variant-emoji: normal !important; font-feature-settings: normal !important; font-optical-sizing: auto !important; font-variation-settings: normal !important; color: rgb(255, 255, 255) !important; border: 0px !important; border-radius: 0px !important; padding: 14px 22px !important; }
body:not(.homepage) .header .app-pill::before { content: none !important; }
body:not(.homepage) .header .app-pill span { display: none; }
body:not(.homepage) main h1 { background: url("/a/j/spine6/bronze-ink.webp") 40% 30% / 900px 252px padding-box text rgb(44, 41, 30); -webkit-background-clip: text; -webkit-text-fill-color: transparent; padding-bottom: 0.12em; color: rgb(44, 41, 30) !important; }
body:not(.homepage) main .eyebrow, body:not(.homepage) main .tile-brand, body:not(.homepage) main .draft-meta { color: var(--bronze) !important; }
body:not(.homepage) main .simple a, body:not(.homepage) main .inline-source, body:not(.homepage) main .text-link, body:not(.homepage) main .article-body a { text-decoration-line: underline; text-decoration-style: solid; text-decoration-color: var(--bronze); text-decoration-thickness: 1px; text-underline-offset: 0.22em; color: var(--ink) !important; }
body:not(.homepage) main .simple a:hover, body:not(.homepage) main .inline-source:hover, body:not(.homepage) main .text-link:hover { color: var(--bronze) !important; }
body:not(.homepage) main .catalog-card, body:not(.homepage) main .catalog-card * { text-decoration: none; color: var(--ink) !important; }
body:not(.homepage) main .version-switch button { color: var(--ink) !important; border-color: var(--bronze) !important; }
body:not(.homepage) main .save { color: var(--ink) !important; }
body:not(.homepage) main .simple { background: rgb(255, 255, 255); width: auto; padding: 60px max(72px, 50% - 340px); max-width: none !important; margin: 8px 0px 64px !important; }
body:not(.homepage) main .editorial-cover { background: rgb(255, 255, 255) !important; }
body:not(.homepage) main .article { background: rgb(255, 255, 255); padding: 64px 64px 72px; margin-bottom: 64px; }
body:not(.homepage) main .fragrance-top { background: rgb(255, 255, 255); padding: 48px 56px; }
body:not(.homepage) main .note-grid, body:not(.homepage) main .reading { background: rgb(255, 255, 255); padding: 40px 56px; margin-top: 16px; }
body:not(.homepage) main .fragrance-tile, body:not(.homepage) main .real-note { background: rgb(255, 255, 255); padding: 18px; }
@media (max-width: 700px){
body:not(.homepage) .header { grid-template-columns: 1fr auto auto; align-items: center; gap: 0px 14px; display: grid !important; height: auto !important; padding: 18px 0px 14px !important; margin: 0px 24px 4px !important; }
body:not(.homepage) .header .wordmark { background-size: 460px 129px; font-size: 27px !important; }
body:not(.homepage) .header nav { grid-column-start: 1; grid-column-end: -1; grid-row-start: 2; grid-row-end: auto; margin: 14px 0px 0px; gap: 20px; font-size: 15px; position: static !important; }
body:not(.homepage) .header nav a { font-size: 15px; }
body:not(.homepage) .header .app-pill { display: none !important; }
body:not(.homepage) main h1 { background-size: 460px 129px; }
body:not(.homepage) main .simple { padding: 26px 20px; margin-bottom: 40px; }
body:not(.homepage) main .article { padding: 26px 20px 32px; margin-bottom: 40px; }
body:not(.homepage) main .fragrance-top, body:not(.homepage) main .note-grid, body:not(.homepage) main .reading { padding: 24px 20px; }
body:not(.homepage) main .fragrance-tile, body:not(.homepage) main .real-note { padding: 12px; }
}
@media (min-width: 701px){
html body .wrap { margin-left: auto !important; margin-right: auto !important; }
html body.homepage .masthead h1 { font-size: 275px !important; line-height: 1.05 !important; }
}
@media (max-width: 700px){
html body.homepage { --ph-p: clamp(40px,calc(40px + (100svh - 600px)*.2),110px); }
html body.homepage .masthead { container-type: inline-size; padding: var(--ph-p) 0 0 !important; margin-left: -16px !important; margin-right: -16px !important; }
html body.homepage .masthead h1 { font-size: 24.9cqw !important; margin: 0px !important; line-height: 1.05 !important; background-size: 518px 145px !important; background-position: 466px 76px !important; }
html body.homepage .leaf-stage { position: relative; z-index: 3; margin-left: -16px; margin-right: -16px; margin-top: calc(-16.14344px - 5.3535vw) !important; }
html body .s6 .s6-btn { background-size: 460px 129px !important; }
html body.homepage .clean-spines { height: var(--ph-h,70svh) !important; min-height: var(--ph-h,70svh) !important; }
html body.homepage .clean-spines > .clean-spine { -webkit-tap-highlight-color: transparent; }
html body.homepage .clean-spine > .spine-number { letter-spacing: 0.04em; left: 50% !important; right: auto !important; top: 14px !important; width: auto !important; margin: 0px !important; transform: translateX(-50%) !important; translate: none !important; font-size: 10px !important; }
html body.homepage .clean-spine > span { letter-spacing: 0.01em; left: 50% !important; right: auto !important; top: 36px !important; margin: 0px !important; transform: translateX(-50%) !important; font-size: clamp(14px, 3.7vw, 22px) !important; line-height: 1 !important; }
html body.homepage .clean-spine.is-open > .spine-number { left: 10px !important; transform: none !important; }
html body.homepage .clean-spine.is-open > span { left: 10px !important; transform: none !important; font-size: clamp(14px, 3.7vw, 22px) !important; }
html body.homepage .spine-art.art-jadore { inset: 0px auto auto 0px !important; width: 457px !important; height: 409px !important; }
html body.homepage .spine-art.art-culture-five { inset: 0px auto auto 0px !important; width: 393px !important; height: 492px !important; }
html body.homepage .spine-art.art-practice-layers { inset: 0px auto auto 0px !important; width: 393px !important; height: 357px !important; }
html body.homepage .spine-art.art-personal-collection { inset: 0px auto auto 0px !important; width: 467px !important; height: 420px !important; }
html body.homepage .art-names-cloud { --c: calc(((100vw - 36px)*.64 - 44px)/100); }
html body.homepage .spine-art.art-names-cloud { inset: 50% auto auto 34px !important; width: calc(100*var(--c)) !important; height: calc(92*var(--c)) !important; translate: 0px -50% !important; }
html body.homepage .journal-feed { margin-top: 40px; }
html body.homepage .journal-lead { gap: 16px; }
html body.homepage .journal-cover { height: 180px; }
html body.homepage .journal-secondary { gap: 14px; }
html body.homepage .journal-small-art { height: 128px; width: 112px; flex: 0 0 auto; }
html body .journal-small-art.mosaique-art > span { left: 10px; top: 10px; font-size: 14px !important; }
html body .mosaique-art img { width: 84px !important; height: 84px !important; left: 4px !important; bottom: 6px !important; right: auto !important; }
html body .mosaique-art img + img { width: 52px !important; height: 52px !important; left: 58px !important; bottom: 4px !important; }
html body.homepage .journal-secondary h2, html body.homepage .journal-secondary h3 { font-size: 19px !important; line-height: 24px !important; }
html body.homepage .journal-secondary p { font-size: 13.5px !important; line-height: 19px !important; }
html body.homepage .journal-news { padding: 22px 20px !important; }
html body.homepage .journal-news-items { gap: 22px !important; }
html body.homepage .journal-news h2, html body.homepage .journal-news h3 { font-size: 19px !important; line-height: 24px !important; }
html body.homepage .journal-news p { font-size: 13.5px !important; line-height: 19px !important; }
}
@media (hover: hover){
html body.homepage .clean-spine:not(.is-open):hover > span { color: rgb(122, 98, 56) !important; }
}
@media (hover: none){
html body.homepage .clean-spine > span { color: rgb(27, 27, 26) !important; }
}
/* Дополнения к стилям прототипа: корешок как ссылка, разделы, высота первого экрана без скриптов */
a.clean-spine{display:block;color:inherit;text-decoration:none;text-align:left}
.homepage .spine-art:not(.placed):not(.art-names-cloud){opacity:0}
.clean-spine.is-open .visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
[hidden]{display:none!important}
.rubric-head{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;background:#fff;padding:56px 64px;gap:40px;margin:8px 0 16px}
.rubric-head .num{display:block;font:500 15px/1 Manrope,sans-serif;color:#7a6238;margin-bottom:22px;letter-spacing:.04em}
.rubric-head h1{font:400 88px/1.05 Prata,serif;margin:0 0 20px}
.rubric-head p{font-size:20px;line-height:1.5;color:#64645c;max-width:520px;margin:0}
.rubric-head img{display:block;width:100%;max-width:420px;max-height:360px;object-fit:contain;margin:auto}
.rubric-empty{background:#fff;padding:48px 64px;font-size:19px;color:#64645c;margin-bottom:64px}
.feed-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px}
.feed-card{display:block;background:#fff;padding:36px 40px;color:inherit;text-decoration:none}
.feed-card h2{font:400 31px/1.2 Prata,serif;margin:12px 0}
.feed-card p{font-size:17px;line-height:1.5;color:#64645c;margin:0}
.feed-card:hover h2{color:#7a6238}
.feed-card .eyebrow{color:#7a6238}
.feed-title{font:400 34px/1.2 Prata,serif;margin:48px 0 18px}
.news-page{background:#fff;padding:60px max(72px,calc((100% - 680px)/2));margin:8px 0 64px}
.news-page .source{margin-top:28px;font-size:17px}
.rubric-nav{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0 0 26px;font-size:17px}
.rubric-nav a{color:inherit}
@media(max-width:700px){
 html body.homepage .clean-spines{height:max(340px,calc(100svh - clamp(40px,calc(40px + (100svh - 600px)*.2),110px) - .814*.249*(100vw - 16px) - 6.4px))!important;min-height:0!important}
  .rubric-head{grid-template-columns:1fr;padding:28px 20px;gap:20px}
 .rubric-head h1{font-size:50px}
 .rubric-head p{font-size:16px}
 .rubric-head img{max-width:240px;max-height:220px}
 .rubric-empty{padding:26px 20px;font-size:16px;margin-bottom:40px}
 .feed-list{grid-template-columns:1fr;gap:10px}
 .feed-card{padding:22px 20px}
 .feed-card h2{font-size:23px}
 .feed-card p{font-size:15px}
 .feed-title{font-size:26px;margin:34px 0 12px}
 .news-page{padding:26px 20px;margin-bottom:40px}
}
body.fan-page{background:#FAFAF8!important;color:#1B1B1A!important}
body:not(.homepage) main h1{font-family:Prata,serif;font-weight:400}
main .eyebrow{text-transform:uppercase;letter-spacing:.08em}
.real-saves{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.app-link{display:inline-block;padding:14px 20px;color:#fff!important;text-decoration:none!important;font:500 16px/1 Manrope,sans-serif;background:#6d6752 url("/a/j/spine6/bronze-from-splash-dark.webp") center/1500px 420px}
@media(max-width:700px){.rubric-head h1{font-size:clamp(38px,12.5vw,60px)}.app-link{padding:13px 16px;font-size:14px}}
.byline span{color:#64645c!important}
@media(max-width:700px){html body.homepage .masthead h1{background-image:url("/a/j/spine6/bronze-ink-phone.webp")!important}html body .s6 .s6-btn,.app-link{background-image:url("/a/j/spine6/bronze-dark-phone.webp")!important;background-size:518px 145px!important}body:not(.homepage) main h1,body:not(.homepage) .header .wordmark{background-image:url("/a/j/spine6/bronze-ink-phone.webp")!important}}
html body.homepage .clean-spines{grid-template-columns:5fr 1.8fr 1.2fr .9fr .85fr}
@media(max-width:700px){html body.homepage .clean-spines{grid-template-columns:64fr 10.76fr 9.1fr 8.28fr 7.86fr}}
@media(max-width:700px){html body.homepage .leaf-stage .fan.clean-spines:not([style*="grid-template"]){grid-template-columns:64fr 10.76fr 9.1fr 8.28fr 7.86fr!important}}
@media(min-width:701px){html body.homepage .leaf-stage .fan.clean-spines:not([style*="grid-template"]){grid-template-columns:5fr 1.8fr 1.2fr .9fr .85fr!important}}
/* Обложки из конструктора (lesite/covers): картинка на белом листе карточки */
.journal-cover-img{padding:0;background:none}
.journal-cover-img img{display:block;width:100%;height:100%;object-fit:cover}
.journal-cover.journal-cover-img{height:auto;aspect-ratio:1200/732}
.article-cover{margin:0 auto 48px;max-width:960px}
.article-cover img{display:block;width:100%;height:auto}
@media (max-width:740px){.article-cover{margin:0 0 32px}}

/* #3728 (07.11.2026): выдача поиска стояла одной строкой — у #search-results не было стилей. Строка — ссылка,
   под ней тихая подпись (бренд или «Нота»); цвета и шрифты те же, что у диалога. */
#search-results { margin-top: 14px; }
#search-results a { display: block; padding: 10px 0; border-bottom: 1px solid rgba(27, 27, 26, 0.12); color: rgb(27, 27, 26); text-decoration: none; font-family: Prata; font-size: 18px; line-height: 1.3; }
#search-results a small { display: block; margin-top: 2px; font-family: inherit; font-size: 12px; letter-spacing: .04em; opacity: .6; font-family: system-ui, sans-serif; }
#search-results p { margin: 10px 0 0; opacity: .7; }
/* #3728: названия нот на французском и английском длиннее — перенос по слогам, а не посреди буквы. */
.real-note span { overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; }

/* 07.11.2026 (Денис: «я же говорил — вот это не используем на сайте»): служебные заголовки главной («Статьи»,
   «Новости») — только для читалок экрана. Класс .visually-hidden был описан лишь внутри корешка, поэтому
   заголовок «Articles» стоял на главной видимым. Решение 05.11: без надзаголовков и служебных подписей. */
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* 07.11.2026 (Денис: «почему картинка не соответствует размеру текста?»): обложка главной статьи по высоте
   равна колонке текста, рисунок целиком на белом поле, без обрезки. */
html body.homepage .journal-lead{align-items:stretch}
.journal-lead .journal-cover.journal-cover-img{height:auto;aspect-ratio:auto;min-height:360px;background:#fff}
.journal-lead .journal-cover-img img{object-fit:contain}
.journal-lead .journal-lead-copy{align-self:center}
@media(max-width:700px){.journal-lead .journal-cover.journal-cover-img{min-height:0;aspect-ratio:1200/732}}
/* Ч/б сайт, цвет растекается акварелью от картинки при наведении (Денис 07.11.2026). Серый слой с дырами-лепестками
   (маски пересекаются) и «мокрый» край: насыщенность чуть выше там, где цвет только что пришёл. Маски задаёт app.js. */
#ls-bloom,#ls-wet{position:fixed;inset:0;pointer-events:none;z-index:2147483000}
#ls-bloom{-webkit-backdrop-filter:grayscale(1);backdrop-filter:grayscale(1);-webkit-mask-image:linear-gradient(#000,#000);mask-image:linear-gradient(#000,#000);-webkit-mask-composite:source-in;mask-composite:intersect}
#ls-wet{-webkit-backdrop-filter:saturate(1.08);backdrop-filter:saturate(1.08);-webkit-mask-image:linear-gradient(transparent,transparent);mask-image:linear-gradient(transparent,transparent)}
.ls-twin{position:absolute;pointer-events:none;-webkit-mask-image:linear-gradient(transparent,transparent);mask-image:linear-gradient(transparent,transparent)}
/* Действия к приложению — как в приложении: синий текст #2E6389 без заливки, у главного действия стрелка (design-code:
   «Залитые кнопки запрещены», «Начать дневник →»). Цвет проявляет кисть, как у картинок (Денис 07.11.2026). */
html body .s6 .s6-btn,html body .app-pill,html body .app-link{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:#2E6389!important;-webkit-text-fill-color:#2E6389!important}
html body .s6 .s6-btn{display:block!important;padding:6px 0!important;font-size:20px!important;letter-spacing:0!important;text-align:left!important}
html body .s6 .s6-btn::after{content:" →"}
html body .app-pill{padding:6px 0!important;font-size:14px!important}
@media(max-width:700px){html body .s6 .s6-btn{display:block!important;text-align:center!important;font-size:18px!important}html body .app-pill{font-size:12px!important}}
/* Страница приложения (#3740): только блок приложения с главной, «Скоро» без стрелки */
html body .s6 .s6-soon::after{content:none}
/* Шапки на сайте нет (Денис 07.11): на внутренних страницах — тихая ссылка «назад» в углу */
.back-link{display:inline-block;margin:28px 0 0;font:400 13px/1 Manrope,sans-serif;color:#69655B;text-decoration:none;letter-spacing:.02em}
.back-link:hover{color:#1B1B1A}
body:not(.homepage) main{margin-top:18px}
html body .breadcrumb{border-top:0!important}  /* линия была границей под шапкой; шапки нет */
/* #3741 доступность без изменения вида: поле нажатия EN/FR/RU в подвале 24×24 (отступы гасятся отрицательным полем) */
/* html zoom .75: 24 видимых px = 32 CSS px; base.css гасит padding у nav a через !important */
html body .foot2 nav .foot-lang a{padding-top:4px!important;padding-bottom:4px!important;margin-top:-4px!important;margin-bottom:-4px!important}
/* поле нажатия по ширине: EN 22 + 10.5 слева, FR 20 + 10 слева + 2.5 справа, RU 23.3 + 9 справа (CSS px) — щели 10 px не перекрываются */
html body .foot2 nav .foot-lang a:nth-child(1){padding-left:10.5px!important;margin-left:-10.5px!important}
html body .foot2 nav .foot-lang a:nth-child(2){padding-left:10px!important;margin-left:-10px!important;padding-right:2.5px!important;margin-right:-2.5px!important}
html body .foot2 nav .foot-lang a:nth-child(3){padding-right:9px!important;margin-right:-9px!important}