/* ---------- admin design preview ---------- */
.design-section-head{display:flex;justify-content:space-between;gap:24px;align-items:end}
.design-section-head h3{margin:4px 0 0}
.design-note{max-width:680px;font-size:12px;line-height:1.7;color:#81746f;text-align:right}
.signature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.theme-admin-card.signature-card{display:block;padding:14px;border-radius:20px;overflow:hidden}
.signature-preview{width:100%;aspect-ratio:16/10;overflow:hidden;border-radius:14px;border:1px solid #ebe3df;background:#f5f1ee}
.signature-preview img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .28s ease}
.signature-card:hover .signature-preview img{transform:scale(1.015)}
.signature-card-copy{padding:16px 4px 4px}
.signature-card-copy h4{font-size:18px;margin:4px 0 6px;letter-spacing:-.03em}
.signature-card-copy p{min-height:40px;margin:0 0 14px;font-size:12.5px;line-height:1.7;color:#766a65}

/* ---------- semantic public tokens ---------- */
html[data-view-mode="public"][data-site-theme]{
 --ui-bg:var(--st-bg);--ui-surface:var(--st-surface);--ui-soft:var(--st-soft);--ui-line:var(--st-line);
 --ui-text:var(--st-ink);--ui-muted:var(--st-muted);--ui-accent:var(--st-accent);--ui-accent2:var(--st-accent2);
 --ui-accent-text:#fff;--ui-dark:var(--st-dark);--ui-dark-text:var(--st-darktext);
 --ui-hero:var(--st-herocopy);--ui-hero-text:var(--st-herotext);--ui-hero-muted:var(--st-heromuted);
 --ui-radius:var(--st-radius);--ui-card-radius:var(--st-cardradius);--ui-shadow:var(--st-shadow);
 --ink:var(--ui-text);--muted:var(--ui-muted);--line:var(--ui-line);--paper:var(--ui-surface);
 --cream:var(--ui-soft);--cream2:color-mix(in srgb,var(--ui-soft) 76%,var(--ui-accent) 7%);
 --brown:var(--ui-accent);--brown2:var(--ui-dark);--rose:var(--ui-accent);--gold:var(--ui-accent2);
 --shadow:var(--ui-shadow);--radius:var(--ui-radius);
 color-scheme:light;
}
html[data-view-mode="public"][data-site-theme="midnight-purple"],
html[data-view-mode="public"][data-public-layout="fullscreen-impact"]{color-scheme:dark}

/* layout palettes are explicit so text/background always move together */
html[data-view-mode="public"][data-public-layout="fullscreen-impact"]{
 --ui-bg:#11100f;--ui-surface:#171513;--ui-soft:#211d19;--ui-line:#3d342b;
 --ui-text:#f8f1e7;--ui-muted:#b9aa99;--ui-accent:#c7a46c;--ui-accent2:#e0c99f;--ui-accent-text:#15110d;
 --ui-dark:#090909;--ui-dark-text:#fff8ed;--ui-hero:#0b0a09;--ui-hero-text:#fff8ed;--ui-hero-muted:#d3c5b4;
 --ui-radius:4px;--ui-card-radius:4px;--ui-shadow:none;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"]{
 --ui-bg:#f7f3ee;--ui-surface:#fbf9f6;--ui-soft:#eee6de;--ui-line:#d9cec3;
 --ui-text:#302b28;--ui-muted:#716760;--ui-accent:#a48671;--ui-accent2:#c5aa94;--ui-accent-text:#302b28;
 --ui-dark:#332d29;--ui-dark-text:#fff;--ui-hero:#f8f4ef;--ui-hero-text:#302b28;--ui-hero-muted:#756b65;
 --ui-radius:0px;--ui-card-radius:0px;--ui-shadow:none;
}
html[data-view-mode="public"][data-public-layout="minimal-premium"]{
 --ui-bg:#fff;--ui-surface:#fff;--ui-soft:#f8f6f4;--ui-line:#ece8e5;
 --ui-text:#24211f;--ui-muted:#6f6863;--ui-accent:#c7a39c;--ui-accent2:#ddc3bc;--ui-accent-text:#24211f;
 --ui-dark:#24211f;--ui-dark-text:#fff;--ui-hero:#fff;--ui-hero-text:#24211f;--ui-hero-muted:#756f6a;
 --ui-radius:26px;--ui-card-radius:18px;--ui-shadow:0 16px 48px rgba(31,27,25,.045);
}
html[data-view-mode="public"][data-public-layout="cat-illustration"]{
 --ui-bg:#fffaf7;--ui-surface:#fff;--ui-soft:#fff0ec;--ui-line:#efd9d4;
 --ui-text:#5b4039;--ui-muted:#775d57;--ui-accent:#d77f86;--ui-accent2:#e7a99b;--ui-accent-text:#3d2925;
 --ui-dark:#6a4941;--ui-dark-text:#fffaf7;--ui-hero:#fff2ee;--ui-hero-text:#573d37;--ui-hero-muted:#7c625c;
 --ui-radius:30px;--ui-card-radius:22px;--ui-shadow:0 16px 44px rgba(108,67,58,.07);
}

/* ten color themes retain classic layout but share strong semantic contrast */
html[data-view-mode="public"][data-site-theme="midnight-purple"]{--ui-accent-text:#18151d}
html[data-view-mode="public"][data-site-theme="luxury-gold"]{--ui-accent-text:#332d27}
html[data-view-mode="public"][data-site-theme="sky"]{--ui-accent-text:#294351}
html[data-view-mode="public"][data-site-theme="cocoa-cream"]{--ui-accent-text:#fffaf5}
html[data-view-mode="public"][data-site-theme="peach-blossom"]{--ui-accent-text:#3b2722}
html[data-view-mode="public"][data-site-theme="lavender-mist"]{--ui-accent-text:#ffffff}
html[data-view-mode="public"][data-site-theme="forest-cream"]{--ui-accent-text:#ffffff}
html[data-view-mode="public"][data-site-theme="cat-illustration"]{--st-muted:#775d57}
html[data-view-mode="public"][data-site-theme="sage-natural"]{--st-muted:#637067}
html[data-view-mode="public"][data-site-theme="teal"]{--st-muted:#5d7470}
html[data-view-mode="public"][data-site-theme="sky"]{--st-muted:#5b7482}

/* ---------- public global contrast authority ---------- */
html[data-view-mode="public"] body,
html[data-view-mode="public"] #app,
html[data-view-mode="public"] #app main{background:var(--ui-bg)!important;color:var(--ui-text)!important}
html[data-view-mode="public"] #app main :where(h1,h2,h3,h4,h5,h6,strong,b,dt,summary){color:var(--ui-text)!important}
html[data-view-mode="public"] #app main :where(p,li,dd,small,label,.lead,.copy,.desc,.sub,.helper,.form-help,.meta){color:var(--ui-muted)!important}
html[data-view-mode="public"] #app main :where(.kicker,.eyebrow,.brandline,.no,.tag,.n){color:var(--ui-accent)!important}
html[data-view-mode="public"] #app main a:not(.btn){color:var(--ui-text)!important}
html[data-view-mode="public"] #app main a:not(.btn):hover{color:var(--ui-accent)!important}
html[data-view-mode="public"] #app :where(input,select,textarea){
 color:var(--ui-text)!important;background:var(--ui-surface)!important;border-color:var(--ui-line)!important
}
html[data-view-mode="public"] #app :where(input,textarea)::placeholder{color:color-mix(in srgb,var(--ui-muted) 76%,transparent)!important}
html[data-view-mode="public"] #app .field label{color:var(--ui-text)!important}
html[data-view-mode="public"] #app select option{color:#222;background:#fff}
html[data-view-mode="public"] #app .btn{background:var(--ui-dark);border-color:var(--ui-dark);color:var(--ui-dark-text)!important}
html[data-view-mode="public"] #app .btn.secondary,
html[data-view-mode="public"] #app .btn.ghost{background:var(--ui-surface)!important;border-color:var(--ui-line)!important;color:var(--ui-text)!important}
html[data-view-mode="public"] #app .btn.danger{color:#fff!important}
html[data-view-mode="public"] #app :where(.filter,.review-page-btn,.member-badge,.review-cat-chip,.badge,.status,.care-chip,.booking-day,.time-slot){
 color:var(--ui-text)!important;background:var(--ui-soft)!important;border-color:var(--ui-line)!important
}
html[data-view-mode="public"] #app :where(.filter.active,.review-page-btn.active,.booking-day.selected,.time-slot.selected){
 color:var(--ui-dark-text)!important;background:var(--ui-dark)!important;border-color:var(--ui-dark)!important
}
html[data-view-mode="public"] #app :where(.content-empty,.empty-state,.review-empty){
 background:var(--ui-soft)!important;color:var(--ui-muted)!important;border-color:var(--ui-line)!important
}

/* every detail page/card follows palette */
html[data-view-mode="public"] #app :where(
 .detail,.detail-info,.info-item,.notice,.case-card,.price-card,.review,.review-write-card,.public-post-card,.post-detail,
 .faq details,.store-info,.store-info-row,.map-card,.auth-card,.booking-form-card,.time-panel,.booking-selection,.reservation-profile,
 .my-member-card,.my-cat-card,.my-data-card,.my-list-row,.form-card,.booking-card,.home-compare-empty,.care-report-hero-note,
 .care-report-history-row,.care-report-paper,.care-report-catbox,.care-report-checks,.care-report-note,.care-report-notes,
 .public-report,.public-care-card,.public-report-note,.timeline-box,.site-popup-card,.panel
){
 background:var(--ui-surface)!important;border-color:var(--ui-line)!important;color:var(--ui-text)!important;
 border-radius:var(--ui-card-radius)!important;box-shadow:var(--ui-shadow)
}
html[data-view-mode="public"] #app :where(
 .detail,.detail-info,.info-item,.notice,.case-card,.price-card,.review,.review-write-card,.public-post-card,.post-detail,
 .faq details,.store-info,.store-info-row,.auth-card,.booking-form-card,.time-panel,.booking-selection,.reservation-profile,
 .my-member-card,.my-cat-card,.my-data-card,.my-list-row,.form-card,.booking-card,.home-compare-empty,.care-report-hero-note,
 .care-report-history-row,.care-report-paper,.public-report,.public-care-card,.public-report-note,.timeline-box,.site-popup-card,.panel
) :where(h1,h2,h3,h4,strong,b,dt,summary){color:var(--ui-text)!important}
html[data-view-mode="public"] #app :where(
 .detail,.detail-info,.info-item,.notice,.case-card,.price-card,.review,.review-write-card,.public-post-card,.post-detail,
 .faq details,.store-info,.store-info-row,.auth-card,.booking-form-card,.time-panel,.booking-selection,.reservation-profile,
 .my-member-card,.my-cat-card,.my-data-card,.my-list-row,.form-card,.booking-card,.home-compare-empty,.care-report-hero-note,
 .care-report-history-row,.care-report-paper,.public-report,.public-care-card,.public-report-note,.timeline-box,.site-popup-card,.panel
) :where(p,li,dd,small,span,.lead,.meta,.form-help){color:var(--ui-muted)!important}
html[data-view-mode="public"] #app :where(.booking-month-actions button,.location-actions button){
 color:var(--ui-text)!important;background:var(--ui-surface)!important;border-color:var(--ui-line)!important
}

/* care report paper is themed too */
html[data-view-mode="public"] #app .care-report-paper{background:var(--ui-surface)!important}
html[data-view-mode="public"] #app .care-report-paper.sample{
 background:linear-gradient(180deg,var(--ui-surface),color-mix(in srgb,var(--ui-soft) 82%,var(--ui-surface)))!important
}
html[data-view-mode="public"] #app .care-report-paper-head{border-color:var(--ui-text)!important}
html[data-view-mode="public"] #app .care-report-sample-badge{
 color:var(--ui-accent)!important;border-color:var(--ui-accent)!important;background:color-mix(in srgb,var(--ui-accent) 8%,var(--ui-surface))!important
}

/* ================================================================
   CLASSIC HEADER / COLOR THEMES
   ================================================================ */
html[data-view-mode="public"][data-public-layout="classic"] .public-header{
 color:var(--ui-text);background:color-mix(in srgb,var(--ui-surface) 90%,transparent);border-color:var(--ui-line)
}
html[data-view-mode="public"][data-public-layout="classic"] .public-header :where(.nav button,.top-actions button,.top-actions a){color:var(--ui-text)!important}
html[data-view-mode="public"][data-public-layout="classic"] .public-header .nav button:hover,
html[data-view-mode="public"][data-public-layout="classic"] .public-header .nav button.active{background:var(--ui-soft)!important;color:var(--ui-text)!important}

/* ================================================================
   01 FULLSCREEN IMPACT — TRUE SIDE NAV + CINEMATIC LAYOUT
   ================================================================ */
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app{padding-left:218px}
.impact-sidebar{
 position:fixed;inset:0 auto 0 0;width:218px;z-index:90;display:flex;flex-direction:column;
 background:#080807;border-right:1px solid #2f2922;color:#fff;padding:24px 18px 18px
}
.impact-brand{display:flex;flex-direction:column;gap:12px;color:#fff!important;text-decoration:none;padding:5px 7px 24px;border-bottom:1px solid #2f2922}
.impact-brand img{width:104px;height:58px;object-fit:contain;object-position:left;filter:brightness(0) invert(1)}
.impact-brand span{font-size:9px;letter-spacing:.24em;line-height:1.7;color:#aa9b89}
.impact-nav{display:grid;margin-top:28px}
.impact-nav button{display:grid;grid-template-columns:32px 1fr;gap:8px;align-items:center;text-align:left;border:0;background:transparent;color:#cfc2b2;padding:13px 6px;border-bottom:1px solid #1d1a16;cursor:pointer}
.impact-nav button small{font-size:8px;color:#725f49;letter-spacing:.15em}
.impact-nav button span{font-size:13px;font-weight:700}
.impact-nav button.active,.impact-nav button:hover{color:#fff;background:#16130f}
.impact-nav button.active small,.impact-nav button:hover small{color:#c7a46c}
.impact-actions{display:grid;gap:7px;margin-top:auto}
.impact-actions .btn{width:100%;border-radius:2px!important;font-size:11px;padding:10px 8px}
.impact-actions .btn.secondary{background:#111!important;border-color:#342d25!important;color:#e7dbcd!important}
.impact-actions .btn:not(.secondary){background:#c7a46c!important;border-color:#c7a46c!important;color:#15110d!important}
.impact-rail-note{margin-top:18px;color:#6f6254;font-size:8px;letter-spacing:.17em;writing-mode:vertical-rl;height:88px}
.impact-home{background:#11100f!important}
.impact-hero{position:relative;min-height:100vh;overflow:hidden;background:#090909}
.impact-hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.78) contrast(1.05) brightness(.74)}
.impact-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.48) 38%,rgba(0,0,0,.08) 70%,rgba(0,0,0,.32))}
.impact-hero-copy{position:absolute;left:max(38px,6vw);top:50%;transform:translateY(-50%);z-index:2;width:min(660px,55vw)}
.impact-overline{color:#c7a46c;font-size:10px;font-weight:800;letter-spacing:.24em;margin-bottom:28px}
.impact-hero-copy h1{margin:0;color:#fff8ed!important;font-family:Georgia,"Noto Serif KR",serif;font-size:clamp(58px,7vw,110px);font-weight:500;line-height:.94;letter-spacing:-.07em}
.impact-hero-copy p{max-width:560px;margin:26px 0;color:#d4c7b7!important;font-size:15px;line-height:1.9}
.impact-hero-actions{display:flex;gap:12px;align-items:center}
.impact-text-link{border:0;background:transparent;color:#e3d4c2!important;font-size:11px;font-weight:800;letter-spacing:.12em;cursor:pointer}
.impact-hero-meta{position:absolute;right:34px;bottom:28px;z-index:3;display:flex;gap:24px;color:#d9cdbc;font-size:10px;letter-spacing:.1em}
.impact-scroll{position:absolute;right:24px;top:50%;z-index:3;writing-mode:vertical-rl;color:#8d7f70;font-size:8px;letter-spacing:.22em}
.layout-notice{width:100%;display:flex;align-items:center;gap:18px;padding:15px max(26px,5vw);border:0;border-bottom:1px solid var(--ui-line);background:var(--ui-surface);color:var(--ui-text);text-align:left;cursor:pointer}
.layout-notice span{color:var(--ui-accent)!important;font-size:9px;letter-spacing:.18em;font-weight:800}.layout-notice b{color:var(--ui-text)!important}.layout-notice i{margin-left:auto;color:var(--ui-accent)}
.impact-services,.impact-portfolio,.impact-standard,.impact-contact{padding:105px max(34px,6vw)}
.impact-services{display:grid;grid-template-columns:280px 1fr;gap:60px;background:#f4eee7;color:#231d18}
.impact-section-label span,.impact-section-head span,.impact-standard-title>span,.impact-contact>div>span{display:block;color:#9a7745!important;font-size:9px;letter-spacing:.18em;font-weight:800}
.impact-section-label b{display:block;margin:14px 0;color:#231d18!important;font-family:Georgia,"Noto Serif KR",serif;font-size:28px}
.impact-section-label p{color:#6a5b4e!important}
.impact-service-list{border-top:1px solid #cfc0ae}
.impact-service-list button{width:100%;display:grid;grid-template-columns:58px 1fr 30px;gap:12px;align-items:center;padding:23px 0;border:0;border-bottom:1px solid #d6c8b7;background:transparent;text-align:left;cursor:pointer}
.impact-service-list em{font-style:normal;color:#9a7745}.impact-service-list b{display:block;color:#231d18!important;font-size:18px}.impact-service-list small{color:#6a5b4e!important}.impact-service-list i{color:#9a7745}
.impact-portfolio{background:#0b0b0a}
.impact-section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:36px}
.impact-section-head h2{margin:10px 0 0;color:#fff8ed!important;font-size:clamp(40px,5vw,68px);font-family:Georgia,"Noto Serif KR",serif;font-weight:500}
.impact-portfolio-grid{display:grid;grid-template-columns:1.25fr .75fr;grid-auto-rows:290px;gap:10px}.impact-portfolio-grid article{position:relative;overflow:hidden;cursor:pointer}.impact-portfolio-grid article.wide{grid-row:span 2}
.impact-portfolio-grid img{width:100%;height:100%;object-fit:cover;filter:saturate(.82)}.impact-portfolio-grid article>div{position:absolute;left:0;right:0;bottom:0;padding:18px;background:linear-gradient(0deg,rgba(0,0,0,.75),transparent);display:grid}
.impact-portfolio-grid small{color:#b9aa99!important}.impact-portfolio-grid b{color:#fff!important}
.impact-standard{display:grid;grid-template-columns:.78fr 1.22fr;gap:65px;background:#11100f}
.impact-standard-title h2{color:#fff8ed!important;font-family:Georgia,"Noto Serif KR",serif;font-weight:500;font-size:clamp(42px,5vw,70px);line-height:1.05;margin:14px 0 30px}
.impact-standard-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #393129;border-left:1px solid #393129}
.impact-standard-grid article{padding:28px;border-right:1px solid #393129;border-bottom:1px solid #393129;min-height:210px}
.impact-standard-grid span{color:#c7a46c!important;font-size:10px}.impact-standard-grid b{display:block;margin:50px 0 8px;color:#fff8ed!important;font-size:17px}.impact-standard-grid p{color:#b9aa99!important;line-height:1.75}
.impact-contact{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;background:#c7a46c;color:#15110d}
.impact-contact h2{color:#15110d!important;font-family:Georgia,"Noto Serif KR",serif;font-size:clamp(46px,6vw,80px);line-height:1}.impact-contact-info{align-self:end}.impact-contact-info p{color:#44351f!important}.impact-contact .btn{margin-right:8px;background:#111!important;color:#fff!important;border-color:#111!important}.impact-contact .btn.secondary{background:transparent!important;color:#15110d!important;border-color:#6f5735!important}
.impact-footer{display:grid;grid-template-columns:1.2fr .6fr 1fr;gap:30px;padding:34px max(34px,6vw);background:#060606;border-top:1px solid #26211c;color:#d8ccbd}.impact-footer>div:first-child{display:flex;flex-direction:column}.impact-footer b{color:#fff!important}.impact-footer span,.impact-footer div{color:#8f8274!important;font-size:11px}.impact-footer a{color:#c7a46c!important;font-size:20px;font-weight:700;text-decoration:none}
.impact-page-hero{display:grid;grid-template-columns:110px 1fr 1px;gap:36px;min-height:350px;align-items:center;padding:90px max(34px,6vw);background:#0d0c0b;border-bottom:1px solid #332c25}
.impact-page-index{font-family:Georgia,serif;font-size:72px;color:#3a3026}.impact-page-hero h1{margin:10px 0;color:#fff8ed!important;font-family:Georgia,"Noto Serif KR",serif;font-size:clamp(48px,6vw,84px);font-weight:500}.impact-page-hero p{max-width:700px;color:#b9aa99!important}.impact-page-line{height:170px;background:#c7a46c}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .section{max-width:1320px;margin:auto;background:#11100f}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app :where(.case-card,.price-card,.review,.review-write-card,.public-post-card,.map-card,.store-info,.store-info-row,.auth-card,.booking-form-card,.my-member-card,.my-cat-card,.my-data-card,.care-report-paper,.public-report,.public-care-card,.panel){background:#171513!important;border-color:#3d342b!important;color:#f8f1e7!important}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app :where(.case-card,.price-card,.review,.review-write-card,.public-post-card,.auth-card,.my-member-card,.my-cat-card,.my-data-card,.care-report-paper,.public-report,.public-care-card,.panel) :where(h1,h2,h3,h4,strong,b){color:#f8f1e7!important}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app :where(.case-card,.price-card,.review,.review-write-card,.public-post-card,.auth-card,.my-member-card,.my-cat-card,.my-data-card,.care-report-paper,.public-report,.public-care-card,.panel) :where(p,li,dd,small,span,.meta,.lead){color:#b9aa99!important}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app :where(input,select,textarea){background:#1d1a17!important;color:#f8f1e7!important;border-color:#43392f!important}

/* ================================================================
   02 EDITORIAL MAGAZINE — TRUE MAGAZINE GRID
   ================================================================ */
.editorial-header{background:#fbf9f6;border-bottom:1px solid #d8cec4}
.editorial-mast{max-width:1460px;margin:auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:20px 30px 14px}
.editorial-brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:#302b28!important}.editorial-brand img{width:100px;height:48px;object-fit:contain}.editorial-brand span{font-family:Georgia,serif;font-size:13px;letter-spacing:.16em}
.editorial-issue{text-align:center;color:#8c7c70;font-size:9px;letter-spacing:.18em}.editorial-actions{justify-self:end;display:flex;gap:6px}.editorial-actions .btn{border-radius:0!important;padding:8px 11px;font-size:10px}
.editorial-nav{max-width:1460px;margin:auto;display:flex;justify-content:center;border-top:1px solid #e3dad2;padding:0 20px}
.editorial-nav button{border:0;border-left:1px solid #e3dad2;background:transparent;padding:12px 22px;color:#4d433e;font-size:10px;letter-spacing:.06em;cursor:pointer}.editorial-nav button:last-child{border-right:1px solid #e3dad2}.editorial-nav button.active,.editorial-nav button:hover{background:#eee6de;color:#302b28}
.editorial-home{background:#f7f3ee!important}
.editorial-home .layout-notice{max-width:1460px;margin:auto;border-left:1px solid #d9cec3;border-right:1px solid #d9cec3}
.editorial-cover{max-width:1460px;margin:auto;display:grid;grid-template-columns:36% 48% 16%;min-height:620px;border:1px solid #d9cec3;border-top:0}
.editorial-cover-copy{padding:70px 52px;display:flex;flex-direction:column;justify-content:center}.editorial-cover-copy>small,.editorial-copy-block>small,.editorial-menu-block>small,.editorial-works-title>small,.editorial-standard>div>small,.editorial-book small{color:#9b8778!important;font-size:9px;letter-spacing:.18em}
.editorial-cover-copy h1{font-family:"Noto Serif KR",Georgia,serif;font-size:clamp(48px,5vw,78px);font-weight:500;line-height:1.07;letter-spacing:-.06em;color:#302b28!important}.editorial-cover-copy p{color:#716760!important;line-height:1.9}.editorial-link,.minimal-link,.cat-text-link{border:0;background:transparent;padding:0;color:var(--ui-text)!important;font-weight:700;cursor:pointer;text-align:left}
.editorial-cover-photo{position:relative;margin:0;overflow:hidden;border-left:1px solid #d9cec3;border-right:1px solid #d9cec3}.editorial-cover-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.72) sepia(.08)}.editorial-cover-photo figcaption{position:absolute;right:28px;bottom:25px;color:#8f7767;font-family:cursive;font-size:30px;transform:rotate(-7deg);text-align:right}
.editorial-cover-note{padding:55px 24px;display:flex;flex-direction:column;gap:34px}.editorial-cover-note b{font-size:10px;letter-spacing:.18em}.editorial-cover-note p{font-family:"Noto Serif KR",Georgia,serif;font-size:18px;line-height:1.7;color:#564a43!important}.editorial-cover-note span{margin-top:auto;color:#9b8778!important;font-size:10px}
.editorial-spread{max-width:1460px;margin:auto;display:grid;grid-template-columns:27% 27% 46%;border:1px solid #d9cec3;border-top:0}.editorial-spread>article{min-height:430px}.editorial-philosophy{border-right:1px solid #d9cec3}.editorial-photo-box{height:100%;position:relative}.editorial-photo-box img{width:100%;height:100%;object-fit:cover;filter:saturate(.65)}.editorial-photo-box blockquote{position:absolute;left:25px;right:25px;bottom:28px;margin:0;color:#fff;font-family:"Noto Serif KR",serif;font-size:19px;line-height:1.65;text-shadow:0 2px 15px rgba(0,0,0,.4)}
.editorial-copy-block,.editorial-menu-block{padding:46px}.editorial-copy-block{border-right:1px solid #d9cec3}.editorial-copy-block h2,.editorial-menu-block h2{font-family:"Noto Serif KR",Georgia,serif;font-weight:500;font-size:36px;line-height:1.25;color:#302b28!important}.editorial-copy-block p{line-height:1.9}
.editorial-mini-services{display:grid;grid-template-columns:1fr 1fr;margin-top:28px;border-top:1px solid #d9cec3}.editorial-mini-services button{border:0;border-bottom:1px solid #d9cec3;background:transparent;text-align:left;padding:17px 0;cursor:pointer}.editorial-mini-services button:nth-child(odd){border-right:1px solid #d9cec3;padding-right:14px}.editorial-mini-services button:nth-child(even){padding-left:14px}.editorial-mini-services b{display:block;color:#302b28!important}.editorial-mini-services span{color:#9b8778!important;font-size:9px}
.editorial-works{max-width:1460px;margin:auto;display:grid;grid-template-columns:26% 74%;border:1px solid #d9cec3;border-top:0}.editorial-works-title{padding:48px}.editorial-works-title h2{font-family:"Noto Serif KR",serif;font-weight:500;font-size:38px;color:#302b28!important}.editorial-works-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#d9cec3}.editorial-works-grid article{background:#fbf9f6;cursor:pointer}.editorial-works-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:saturate(.72)}.editorial-works-grid span{display:block;padding:13px;color:#51463f!important;font-size:11px}
.editorial-standard{max-width:1460px;margin:auto;display:grid;grid-template-columns:28% 72%;border:1px solid #d9cec3;border-top:0;padding:52px}.editorial-standard h2{font-family:"Noto Serif KR",serif;font-weight:500;color:#302b28!important;font-size:38px}.editorial-standard-grid{display:grid;grid-template-columns:1fr 1fr}.editorial-standard-grid article{padding:22px;border-left:1px solid #d9cec3;border-bottom:1px solid #d9cec3}.editorial-standard-grid span{color:#a48671!important;font-size:9px}.editorial-standard-grid b{display:block;margin:20px 0 7px;color:#302b28!important}.editorial-standard-grid p{color:#716760!important}
.editorial-book{max-width:1460px;margin:auto;display:grid;grid-template-columns:58% 42%;min-height:360px;border:1px solid #d9cec3;border-top:0}.editorial-book-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.68)}.editorial-book>div:last-child{padding:55px;display:flex;flex-direction:column;justify-content:center}.editorial-book h2{font-family:"Noto Serif KR",serif;font-weight:500;font-size:40px;color:#302b28!important}
.editorial-footer{max-width:1460px;margin:auto;display:grid;grid-template-columns:1.1fr 1.4fr 1fr 1fr;gap:28px;padding:34px 28px;border:1px solid #d9cec3;border-top:0;background:#f0e8e0;color:#514740}.editorial-footer-brand{font-family:"Noto Serif KR",serif;font-size:22px}.editorial-footer-brand small{display:block;font-family:system-ui;font-size:8px;letter-spacing:.12em;color:#817269!important}.editorial-footer>div,.editorial-footer button{color:#514740!important}.editorial-footer-links{display:grid;grid-template-columns:1fr 1fr}.editorial-footer-links button{border:0;background:transparent;text-align:left;font-size:10px}.editorial-footer-script{font-family:cursive;font-size:20px;transform:rotate(-4deg)}
.editorial-page-hero{max-width:1460px;margin:24px auto 0;display:grid;grid-template-columns:20% 55% 25%;border:1px solid #d9cec3;background:#fbf9f6}.editorial-page-kicker,.editorial-page-title,.editorial-page-desc{padding:48px}.editorial-page-kicker{font-size:9px;letter-spacing:.18em;color:#a48671!important;border-right:1px solid #d9cec3}.editorial-page-title h1{font-family:"Noto Serif KR",Georgia,serif!important;font-size:clamp(42px,5vw,68px);font-weight:500!important;color:#302b28!important}.editorial-page-desc{border-left:1px solid #d9cec3}.editorial-page-desc p{color:#716760!important}.editorial-page-desc span{display:block;margin-top:55px;color:#9b8778!important;font-size:8px;letter-spacing:.14em}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .section{max-width:1460px;margin:auto}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app :where(.case-card,.price-card,.review,.review-write-card,.public-post-card,.map-card,.store-info,.store-info-row,.auth-card,.booking-form-card,.my-member-card,.my-cat-card,.my-data-card,.care-report-paper,.public-report,.public-care-card,.panel){border-radius:0!important;box-shadow:none!important}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app :where(.section h2,.detail h2,.auth-card h2,.care-report-paper h2,.public-report-head h1){font-family:"Noto Serif KR",Georgia,serif!important;font-weight:500!important}

/* ================================================================
   03 MINIMAL PREMIUM — CENTERED, AIRY, PRODUCT-LIKE
   ================================================================ */
.minimal-header{height:92px;display:grid;grid-template-columns:180px 1fr auto;align-items:center;gap:30px;padding:0 max(28px,calc((100vw - 1450px)/2));background:rgba(255,255,255,.94);border-bottom:1px solid #eee9e6;position:sticky;top:0;z-index:60;backdrop-filter:blur(14px)}
.minimal-brand img{width:122px;height:52px;object-fit:contain}.minimal-nav{display:flex;justify-content:center;gap:4px}.minimal-nav button{border:0;background:transparent;color:#34302d;padding:10px 13px;border-radius:9px;font-size:11px;cursor:pointer}.minimal-nav button.active,.minimal-nav button:hover{background:#f6f3f1}.minimal-actions{display:flex;gap:6px}.minimal-actions .btn{font-size:10px;padding:9px 12px}
.minimal-home{background:#fff!important}
.minimal-home .layout-notice{max-width:1450px;margin:auto;border-left:1px solid #ece8e5;border-right:1px solid #ece8e5}
.minimal-hero{max-width:1450px;margin:0 auto;display:grid;grid-template-columns:44% 56%;min-height:680px;padding:50px 0 70px}.minimal-hero-copy{display:flex;flex-direction:column;justify-content:center;padding:30px 60px 30px 10px}.minimal-hero-copy>span,.minimal-section-title>span,.minimal-process>div>span,.minimal-booking span{font-size:9px;letter-spacing:.18em;color:#a88a83!important}.minimal-hero-copy h1{font-size:clamp(52px,6vw,90px);line-height:1.02;letter-spacing:-.075em;font-weight:690;color:#24211f!important}.minimal-hero-copy p{max-width:520px;color:#756f6a!important;font-size:15px;line-height:1.9}.minimal-hero-copy>div{display:flex;gap:8px;margin-top:18px}.minimal-hero-photo{position:relative;border-radius:30px;overflow:hidden;background:#f4efec}.minimal-hero-photo img{width:100%;height:100%;object-fit:cover}.minimal-hero-photo>div{position:absolute;right:32px;top:42px;font-family:cursive;font-size:25px;color:#7e6c66;transform:rotate(-6deg)}
.minimal-values{max-width:1450px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #ece8e5;border-bottom:1px solid #ece8e5}.minimal-values article{display:grid;grid-template-columns:44px 1fr;grid-template-rows:auto auto;column-gap:15px;padding:23px 30px;border-right:1px solid #ece8e5}.minimal-values article:last-child{border:0}.minimal-values article>span{grid-row:1/3;font-size:28px;color:#b5948d}.minimal-values b{color:#24211f!important}.minimal-values p{margin:2px 0 0;color:#756f6a!important;font-size:11px}
.minimal-services,.minimal-process,.minimal-portfolio{max-width:1450px;margin:auto;padding:110px 0}.minimal-section-title{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:42px}.minimal-section-title h2,.minimal-process h2{max-width:650px;margin:9px 0 0;font-size:clamp(38px,4.6vw,62px);line-height:1.08;color:#24211f!important}.minimal-service-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.minimal-service-cards button{position:relative;min-height:260px;text-align:left;padding:26px;border:1px solid #ece8e5;border-radius:20px;background:#faf8f6;cursor:pointer}.minimal-service-cards button>span{color:#b5948d!important;font-size:10px}.minimal-service-cards b{display:block;margin-top:88px;font-size:19px;color:#24211f!important}.minimal-service-cards p{color:#756f6a!important;line-height:1.65}.minimal-service-cards i{position:absolute;right:24px;bottom:22px;color:#b5948d}
.minimal-process{display:grid;grid-template-columns:.72fr 1.28fr;gap:70px;background:#fbfaf9;padding-left:50px;padding-right:50px;border-radius:30px}.minimal-process-steps{display:grid;grid-template-columns:1fr 1fr}.minimal-process-steps article{padding:26px;border-bottom:1px solid #e9e4e1;border-left:1px solid #e9e4e1}.minimal-process-steps span{color:#b5948d!important;font-size:10px}.minimal-process-steps b{display:block;margin:42px 0 8px;color:#24211f!important}.minimal-process-steps p{color:#756f6a!important}
.minimal-portfolio-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.minimal-portfolio-grid article{cursor:pointer}.minimal-portfolio-grid img{width:100%;aspect-ratio:1/1.05;object-fit:cover;border-radius:18px}.minimal-portfolio-grid b{display:block;margin:10px 0 3px;color:#24211f!important}.minimal-portfolio-grid span{color:#807873!important;font-size:11px}
.minimal-booking{max-width:1450px;margin:0 auto 70px;display:grid;grid-template-columns:1fr .45fr;background:#f0e4e0;border-radius:28px;overflow:hidden}.minimal-booking>div:first-child{padding:58px}.minimal-booking h2{font-size:clamp(36px,4vw,55px);color:#292320!important}.minimal-booking p{color:#6c5d58!important}.minimal-booking-mark{display:grid;place-items:center;text-align:center;font-size:22px;letter-spacing:.12em;color:#b99088!important;background:rgba(255,255,255,.27)}
.minimal-footer{display:grid;grid-template-columns:160px 1.4fr .7fr 1fr;align-items:center;gap:24px;padding:35px max(28px,calc((100vw - 1450px)/2));background:#faf9f8;border-top:1px solid #ece8e5;color:#625b57}.minimal-footer img{width:110px}.minimal-footer a{color:#24211f!important;font-weight:700;text-decoration:none}.minimal-footer-links{display:flex;gap:12px;justify-content:flex-end}.minimal-footer-links button{border:0;background:transparent;color:#625b57!important;font-size:10px}
.minimal-page-hero{max-width:1200px;margin:0 auto;text-align:center;padding:110px 24px 90px}.minimal-page-hero h1{margin:14px auto;font-size:clamp(46px,6vw,76px);letter-spacing:-.07em;color:#24211f!important}.minimal-page-hero p{max-width:700px;margin:auto;color:#756f6a!important}.minimal-page-hero .kicker{color:#ad8b84!important}
html[data-view-mode="public"][data-public-layout="minimal-premium"] #app .section{max-width:1200px;margin:auto;padding-top:90px;padding-bottom:90px}
html[data-view-mode="public"][data-public-layout="minimal-premium"] #app :where(.case-card,.price-card,.review,.review-write-card,.public-post-card,.map-card,.store-info,.store-info-row,.auth-card,.booking-form-card,.my-member-card,.my-cat-card,.my-data-card,.care-report-paper,.public-report,.public-care-card,.panel){box-shadow:none!important;border-color:#ece8e5!important}

/* ================================================================
   04 CAT ILLUSTRATION — SALON-LIKE, PLAYFUL BUT CLEAN
   ================================================================ */
.cat-header{max-width:1450px;margin:12px auto;display:grid;grid-template-columns:210px 1fr auto;align-items:center;gap:18px;padding:9px 13px;background:rgba(255,255,255,.92);border:1px solid #efd9d4;border-radius:22px;position:sticky;top:10px;z-index:60;box-shadow:0 12px 40px rgba(108,67,58,.07);backdrop-filter:blur(14px)}
.cat-brand{display:flex;align-items:center;gap:9px;text-decoration:none}.cat-brand img{width:92px;height:42px;object-fit:contain}.cat-brand span{color:#96635f!important;font-size:10px;font-family:cursive}
.cat-nav{display:flex;justify-content:center;gap:5px}.cat-nav button{border:0;background:transparent;color:#684a43;padding:8px 10px;border-radius:14px;font-size:10px;cursor:pointer}.cat-nav button.active,.cat-nav button:hover{background:#fff0ec;color:#a05e63}.cat-nav-dot{display:none}
.cat-actions{display:flex;gap:5px}.cat-actions .btn{padding:8px 11px;font-size:10px;border-radius:14px!important}
.cat-home{background:#fffaf7!important}
.cat-home .layout-notice{max-width:1450px;margin:0 auto;border-radius:16px;border:1px solid #efd9d4}
.cat-hero{max-width:1450px;margin:14px auto 0;display:grid;grid-template-columns:46% 54%;min-height:590px;border-radius:34px;overflow:hidden;background:linear-gradient(135deg,#fff5f0,#f8ddd6);border:1px solid #efd6d1}.cat-hero-copy{position:relative;padding:70px 62px;display:flex;flex-direction:column;justify-content:center}.cat-hero-copy>span{font-size:9px;letter-spacing:.16em;color:#bb7779!important}.cat-hero-copy h1{font-size:clamp(50px,5.8vw,82px);line-height:1.06;letter-spacing:-.07em;color:#573d37!important}.cat-hero-copy p{max-width:500px;color:#775d57!important;font-size:15px;line-height:1.9}.cat-hero-copy .btn{align-self:flex-start}.cat-doodle{position:absolute;right:30px;bottom:35px;color:#bd7c7e!important;font-family:cursive;font-size:18px;transform:rotate(-5deg)}
.cat-hero-photo{position:relative;overflow:hidden}.cat-hero-photo img{width:100%;height:100%;object-fit:cover}.cat-heart,.cat-paw{position:absolute;color:#fff!important;text-shadow:0 3px 15px rgba(109,66,57,.2)}.cat-heart{left:28px;top:35px;font-size:55px}.cat-paw{right:26px;bottom:28px;font-size:32px}
.cat-quick{max-width:1450px;margin:14px auto 0;display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.cat-quick button{display:grid;grid-template-columns:48px 1fr;text-align:left;align-items:center;padding:18px;border:1px solid #efd9d4;border-radius:18px;background:#fff;cursor:pointer}.cat-quick button>span{grid-row:1/3;font-size:28px;color:#c9797e!important}.cat-quick b{color:#5b4039!important}.cat-quick small{color:#775d57!important}
.cat-menu-panel{max-width:1450px;margin:70px auto 0;display:grid;grid-template-columns:.7fr 1.3fr;gap:28px;padding:38px;background:#fff0ec;border-radius:30px}.cat-menu-panel>div:first-child{padding:18px}.cat-menu-panel small,.cat-middle-grid small,.cat-portfolio small,.cat-location-book small{color:#bd7278!important;font-size:9px;letter-spacing:.16em}.cat-menu-panel h2,.cat-care-card h2,.cat-review-card h2,.cat-portfolio h2,.cat-location-book h2{color:#5b4039!important;line-height:1.18}.cat-menu-panel p{color:#775d57!important}
.cat-menu-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}.cat-menu-cards article{position:relative;padding:22px;background:#fff;border:1px solid #efd9d4;border-radius:20px}.cat-menu-cards article>span{font-size:28px}.cat-menu-cards b{display:block;margin:25px 0 5px;color:#5b4039!important}.cat-menu-cards p{color:#775d57!important;font-size:12px}
.cat-middle-grid{max-width:1450px;margin:12px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.cat-care-card,.cat-review-card{min-height:360px;padding:36px;background:#fff;border:1px solid #efd9d4;border-radius:26px}.cat-care-card{display:grid;grid-template-columns:1fr .8fr;gap:25px}.cat-care-card p,.cat-review-card p{color:#775d57!important}.cat-report-paper{align-self:center;transform:rotate(-3deg);display:grid;gap:10px;padding:25px;background:#fff9f5;border:1px solid #e8cfc8;border-radius:10px;box-shadow:0 14px 35px rgba(108,67,58,.08)}.cat-report-paper span{font-family:cursive;color:#b36f70!important}.cat-report-paper b{color:#6b4b44!important;font-size:12px}
.cat-review-card blockquote{margin:16px 0;padding:18px;border-radius:17px;background:#fff5f1}.cat-review-card blockquote span{color:#e0a05f!important}.cat-review-card blockquote p{margin:8px 0}.cat-review-card blockquote b{color:#5b4039!important;font-size:11px}
.cat-portfolio{max-width:1450px;margin:12px auto 0;padding:38px;background:#fff;border:1px solid #efd9d4;border-radius:28px}.cat-portfolio>div:first-child{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:25px}.cat-portfolio-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.cat-portfolio-grid article{padding:8px;background:#fff7f4;border-radius:18px;cursor:pointer}.cat-portfolio-grid img{width:100%;aspect-ratio:1/1.02;object-fit:cover;border-radius:13px}.cat-portfolio-grid b{display:block;margin:9px 4px 2px;color:#5b4039!important}.cat-portfolio-grid span{margin-left:4px;color:#846963!important;font-size:10px}
.cat-location-book{max-width:1450px;margin:12px auto 70px;display:grid;grid-template-columns:1.1fr .9fr;gap:12px}.cat-location-book>div{padding:40px;border-radius:26px;border:1px solid #efd9d4;background:#fff}.cat-location-book>div:last-child{background:linear-gradient(135deg,#e69aa0,#d77f86);display:flex;flex-direction:column;justify-content:center}.cat-location-book>div:last-child h2{color:#fffaf7!important}.cat-location-book p{color:#775d57!important}
.cat-footer{max-width:1450px;margin:0 auto 24px;display:grid;grid-template-columns:1.1fr 1.4fr 1fr;gap:30px;align-items:center;padding:30px 34px;border-radius:24px;background:#fff3ef;border:1px solid #efd8d2}.cat-footer-brand{display:grid;grid-template-columns:82px 1fr;align-items:center}.cat-footer-brand img{grid-row:1/3;width:72px}.cat-footer-brand b{color:#5b4039!important}.cat-footer-brand span{color:#866760!important;font-size:10px}.cat-footer-info{display:flex;flex-direction:column;gap:5px;color:#765750}.cat-footer-info a{color:#9e5f62!important;font-weight:700}.cat-footer-links{display:flex;gap:9px;justify-content:flex-end}.cat-footer-links button{border:0;background:transparent;color:#765750!important;font-size:10px}
.cat-page-hero{max-width:1450px;margin:18px auto 0;display:grid;grid-template-columns:1fr 180px;min-height:300px;border:1px solid #efd9d4;border-radius:30px;background:radial-gradient(circle at 95% 10%,#fff,transparent 25%),#fff0ec;overflow:hidden}.cat-page-copy{padding:55px}.cat-page-copy h1{font-size:clamp(42px,5vw,66px);color:#5b4039!important}.cat-page-copy p{max-width:720px;color:#775d57!important}.cat-page-mark{display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:70px;color:#e2a0a4!important;background:rgba(255,255,255,.35)}.cat-page-mark span{font-size:32px}
html[data-view-mode="public"][data-public-layout="cat-illustration"] #app .section{max-width:1320px;margin:auto}
html[data-view-mode="public"][data-public-layout="cat-illustration"] #app :where(.case-card,.price-card,.review,.review-write-card,.public-post-card,.map-card,.store-info,.store-info-row,.auth-card,.booking-form-card,.my-member-card,.my-cat-card,.my-data-card,.care-report-paper,.public-report,.public-care-card,.panel){border-radius:22px!important;border-color:#efd9d4!important}
html[data-view-mode="public"][data-public-layout="cat-illustration"] #app :where(.member-badge,.review-cat-chip,.badge,.status,.care-chip,.filter,.review-page-btn){background:#fff0ec!important;color:#8f5b5d!important;border-color:#ecc9c6!important}

/* ---------- classic home dark block + footer contrast ---------- */
html[data-view-mode="public"][data-public-layout="classic"] #app .salon-promise,
html[data-view-mode="public"][data-public-layout="classic"] #app .salon-promise :where(h1,h2,h3,h4,p,strong,b){color:var(--ui-dark-text)!important}
html[data-view-mode="public"][data-public-layout="classic"] #app .salon-promise{background:var(--ui-dark)!important}
html[data-view-mode="public"][data-public-layout="classic"] #app .salon-footer,
html[data-view-mode="public"][data-public-layout="classic"] #app .salon-footer :where(h1,h2,h3,h4,p,a,button,small,strong,b){color:var(--ui-dark-text)!important}


html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .btn:not(.secondary):not(.danger){background:#c7a46c!important;border-color:#c7a46c!important;color:#15110d!important}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .btn:not(.secondary):not(.danger){background:#302b28!important;border-color:#302b28!important;color:#fff!important}
html[data-view-mode="public"][data-public-layout="minimal-premium"] #app .btn:not(.secondary):not(.danger){background:#24211f!important;border-color:#24211f!important;color:#fff!important}
html[data-view-mode="public"][data-public-layout="cat-illustration"] #app .btn:not(.secondary):not(.danger){background:#d77f86!important;border-color:#d77f86!important;color:#3d2925!important}

/* ---------- responsive ---------- */
@media(max-width:1100px){
 .impact-sidebar{width:178px}.impact-nav button span{font-size:11px}html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app{padding-left:178px}
 .editorial-cover{grid-template-columns:40% 60%}.editorial-cover-note{display:none}.editorial-spread{grid-template-columns:1fr 1fr}.editorial-menu-block{grid-column:1/3;border-top:1px solid #d9cec3}.editorial-works{grid-template-columns:1fr}.editorial-works-grid{grid-template-columns:repeat(3,1fr)}
 .minimal-header{grid-template-columns:140px 1fr auto}.minimal-nav{gap:0}.minimal-nav button{padding:8px}.minimal-services,.minimal-process,.minimal-portfolio{padding-left:28px;padding-right:28px}.minimal-service-cards{grid-template-columns:1fr 1fr}
 .cat-header{grid-template-columns:170px 1fr auto}.cat-nav button{padding:7px}.cat-brand span{display:none}.cat-quick{grid-template-columns:repeat(3,1fr)}.cat-menu-panel{grid-template-columns:1fr}.cat-portfolio-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
 html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app{padding-left:0}
 .impact-sidebar{position:sticky;top:0;width:100%;height:auto;flex-direction:row;align-items:center;padding:8px 10px;background:#080807}.impact-brand{border:0;padding:0}.impact-brand img{width:72px;height:38px}.impact-brand span,.impact-rail-note{display:none}.impact-nav{display:flex;margin:0 auto;overflow:auto}.impact-nav button{display:block;white-space:nowrap;border:0;padding:8px 9px}.impact-nav button small{display:none}.impact-actions{display:flex;margin:0}.impact-actions .btn.secondary{display:none}.impact-actions .btn{width:auto}.impact-hero{min-height:680px}.impact-hero-copy{left:22px;right:22px;bottom:60px;top:auto;transform:none;width:auto}.impact-hero-copy h1{font-size:52px}.impact-hero-meta,.impact-scroll{display:none}.impact-services,.impact-standard,.impact-contact{grid-template-columns:1fr;padding:70px 20px}.impact-portfolio{padding:70px 20px}.impact-portfolio-grid{grid-template-columns:1fr;grid-auto-rows:330px}.impact-portfolio-grid article.wide{grid-row:span 1}.impact-standard-grid{grid-template-columns:1fr}.impact-footer{grid-template-columns:1fr;padding:28px 20px}.impact-page-hero{grid-template-columns:1fr;padding:60px 20px}.impact-page-index,.impact-page-line{display:none}
 .editorial-mast{grid-template-columns:1fr auto;padding:12px 14px}.editorial-issue{display:none}.editorial-brand span{display:none}.editorial-actions .btn.secondary{display:none}.editorial-nav{justify-content:flex-start;overflow:auto;padding:0}.editorial-nav button{white-space:nowrap;padding:11px 14px}.editorial-cover{grid-template-columns:1fr;margin:0 10px}.editorial-cover-copy{padding:45px 24px}.editorial-cover-copy h1{font-size:48px}.editorial-cover-photo{min-height:430px;border:0;border-top:1px solid #d9cec3}.editorial-spread{grid-template-columns:1fr;margin:0 10px}.editorial-menu-block{grid-column:auto}.editorial-copy-block,.editorial-philosophy{border-right:0;border-bottom:1px solid #d9cec3}.editorial-works,.editorial-standard,.editorial-book{margin:0 10px;grid-template-columns:1fr}.editorial-works-grid{grid-template-columns:1fr}.editorial-standard{padding:34px 22px}.editorial-standard-grid{grid-template-columns:1fr}.editorial-book-photo{min-height:320px}.editorial-footer{margin:0 10px;grid-template-columns:1fr}.editorial-page-hero{margin:10px;grid-template-columns:1fr}.editorial-page-kicker,.editorial-page-title,.editorial-page-desc{padding:26px;border:0}.editorial-page-desc span{margin-top:20px}
 .minimal-header{height:auto;grid-template-columns:1fr auto;padding:10px 14px}.minimal-nav{grid-column:1/3;order:3;justify-content:flex-start;overflow:auto}.minimal-nav button{white-space:nowrap}.minimal-actions .btn.secondary{display:none}.minimal-hero{grid-template-columns:1fr;padding:30px 14px}.minimal-hero-copy{padding:40px 10px}.minimal-hero-copy h1{font-size:50px}.minimal-hero-photo{min-height:440px}.minimal-values{grid-template-columns:1fr}.minimal-values article{border-right:0;border-bottom:1px solid #ece8e5}.minimal-section-title{display:block}.minimal-service-cards,.minimal-process,.minimal-portfolio-grid{grid-template-columns:1fr}.minimal-services,.minimal-process,.minimal-portfolio{padding:70px 18px}.minimal-process{margin:0 10px}.minimal-process-steps{grid-template-columns:1fr}.minimal-booking{margin:0 10px 40px;grid-template-columns:1fr}.minimal-booking-mark{min-height:160px}.minimal-footer{grid-template-columns:1fr;padding:30px 20px}.minimal-footer-links{justify-content:flex-start}.minimal-page-hero{padding:70px 20px}
 .cat-header{margin:6px;grid-template-columns:1fr auto;border-radius:18px}.cat-nav{grid-column:1/3;order:3;justify-content:flex-start;overflow:auto}.cat-nav button{white-space:nowrap}.cat-actions .btn.secondary{display:none}.cat-hero{margin:8px;grid-template-columns:1fr}.cat-hero-copy{padding:48px 24px}.cat-hero-copy h1{font-size:49px}.cat-hero-photo{min-height:430px}.cat-doodle{display:none}.cat-quick{margin:8px;grid-template-columns:1fr 1fr}.cat-menu-panel,.cat-middle-grid,.cat-portfolio,.cat-location-book{margin-left:8px;margin-right:8px}.cat-middle-grid,.cat-location-book{grid-template-columns:1fr}.cat-care-card{grid-template-columns:1fr}.cat-menu-cards,.cat-portfolio-grid{grid-template-columns:1fr}.cat-footer{margin:8px;grid-template-columns:1fr}.cat-footer-links{justify-content:flex-start}.cat-page-hero{margin:8px;grid-template-columns:1fr}.cat-page-mark{display:none}
 .signature-grid{grid-template-columns:1fr}.design-section-head{display:block}.design-note{display:block;max-width:none;margin-top:8px;text-align:left}
}

/* safety: any disabled control stays legible */
html[data-view-mode="public"] #app button:disabled{opacity:.5}



/* ================================================================
   PUBLIC DESIGN SYSTEM V6 — COMPLETE CONTRAST + HERO MOTION
   2026-09-12
   ---------------------------------------------------------------
   Rules:
   1. Public-only. Admin CMS is untouched.
   2. Every surface owns a matching text token.
   3. Accent/dark/soft/surface areas never inherit the wrong text.
   4. Final runtime contrast guard catches any legacy inline/hard-coded
      combination that still falls below readable contrast.
   5. Hero motion is restored for Classic + all 4 independent layouts.
   ================================================================ */

/* ---------- readable accent text for all 14 designs ---------- */
html[data-view-mode="public"][data-site-theme="salon-ivory"]{--ui-accent-text:#241b19}
html[data-view-mode="public"][data-site-theme="dusty-rose"]{--ui-accent-text:#1f1215}
html[data-view-mode="public"][data-site-theme="sage-natural"]{--ui-accent-text:#07110b}
html[data-view-mode="public"][data-site-theme="luxury-gold"]{--ui-accent-text:#231b12}
html[data-view-mode="public"][data-site-theme="midnight-purple"]{--ui-accent-text:#17111d}
html[data-view-mode="public"][data-site-theme="digital-blue"]{--ui-accent-text:#ffffff}
html[data-view-mode="public"][data-site-theme="teal"]{--ui-accent-text:#000000}
html[data-view-mode="public"][data-site-theme="monochrome"]{--ui-accent-text:#ffffff}
html[data-view-mode="public"][data-site-theme="sky"]{--ui-accent-text:#142a35}
html[data-view-mode="public"][data-site-theme="wine-red"]{--ui-accent-text:#ffffff}
html[data-view-mode="public"][data-site-theme="fullscreen-impact"]{--ui-accent-text:#15110d}
html[data-view-mode="public"][data-site-theme="editorial-magazine"]{--ui-accent-text:#231b17}
html[data-view-mode="public"][data-site-theme="minimal-premium"]{--ui-accent-text:#201917}
html[data-view-mode="public"][data-site-theme="cat-illustration"]{--ui-accent-text:#2b1d1a}

/* ---------- semantic surface contracts ---------- */
html[data-view-mode="public"] #app{
  background:var(--ui-bg)!important;
  color:var(--ui-text)!important;
}
html[data-view-mode="public"] #app main{
  background:var(--ui-bg)!important;
  color:var(--ui-text)!important;
}

/* normal surface */
html[data-view-mode="public"] #app :where(
  .stat,.case-card,.care-card,.step,.timeline-box,.price-card,.review,.form-card,.panel,
  .map-card,.store-info,.store-info-row,.booking-card,.booking-form-card,.booking-selection,
  .time-panel,.auth-card,.review-write-card,.my-member-card,.my-cat-card,.my-data-card,
  .my-list-row,.public-post-card,.post-detail,.detail,.detail-info,.info-item,.notice,
  .faq details,.home-compare-empty,.reservation-profile,.site-popup-card,
  .salon-result,.salon-feature-caption,.salon-stack-card .mini-cap,
  .salon-step,.salon-location-info,.salon-map
){
  background:var(--ui-surface)!important;
  border-color:var(--ui-line)!important;
  color:var(--ui-text)!important;
}
html[data-view-mode="public"] #app :where(
  .stat,.case-card,.care-card,.step,.timeline-box,.price-card,.review,.form-card,.panel,
  .map-card,.store-info,.store-info-row,.booking-card,.booking-form-card,.booking-selection,
  .time-panel,.auth-card,.review-write-card,.my-member-card,.my-cat-card,.my-data-card,
  .my-list-row,.public-post-card,.post-detail,.detail,.detail-info,.info-item,.notice,
  .faq details,.home-compare-empty,.reservation-profile,.site-popup-card,
  .salon-result,.salon-feature-caption,.salon-stack-card .mini-cap,
  .salon-step,.salon-location-info
) :where(h1,h2,h3,h4,h5,h6,strong,b,dt,summary,label,.title,.name){
  color:var(--ui-text)!important;
}
html[data-view-mode="public"] #app :where(
  .stat,.case-card,.care-card,.step,.timeline-box,.price-card,.review,.form-card,.panel,
  .map-card,.store-info,.store-info-row,.booking-card,.booking-form-card,.booking-selection,
  .time-panel,.auth-card,.review-write-card,.my-member-card,.my-cat-card,.my-data-card,
  .my-list-row,.public-post-card,.post-detail,.detail,.detail-info,.info-item,.notice,
  .faq details,.home-compare-empty,.reservation-profile,.site-popup-card,
  .salon-result,.salon-feature-caption,.salon-stack-card .mini-cap,
  .salon-step,.salon-location-info
) :where(p,li,dd,small,.desc,.sub,.lead,.meta,.form-help){
  color:var(--ui-muted)!important;
}

/* page hero */
html[data-view-mode="public"][data-public-layout="classic"] #app .page-hero{
  background:var(--ui-soft)!important;
  border-color:var(--ui-line)!important;
  color:var(--ui-text)!important;
}
html[data-view-mode="public"][data-public-layout="classic"] #app .page-hero :where(h1,h2,h3,strong,b){
  color:var(--ui-text)!important;
}
html[data-view-mode="public"][data-public-layout="classic"] #app .page-hero :where(p,small,.lead){
  color:var(--ui-muted)!important;
}

/* alternate/light sections */
html[data-view-mode="public"] #app .section.alt{
  background:var(--ui-soft)!important;
  color:var(--ui-text)!important;
}
html[data-view-mode="public"] #app .section.alt :where(h1,h2,h3,h4,strong,b){
  color:var(--ui-text)!important;
}
html[data-view-mode="public"] #app .section.alt :where(p,small,span,.lead){
  color:var(--ui-muted)!important;
}

/* small navigation / filters / chips */
html[data-view-mode="public"] #app :where(
  .filter,.review-page-btn,.badge,.status,.member-badge,.review-cat-chip,.care-chip,
  .booking-tab,.mini-tab,.category-chip,.pill
){
  color:var(--ui-text)!important;
  background:var(--ui-soft)!important;
  border-color:var(--ui-line)!important;
}
html[data-view-mode="public"] #app :where(
  .filter.active,.review-page-btn.active,.booking-tab.active,.category-chip.active
){
  color:var(--ui-accent-text)!important;
  background:var(--ui-accent)!important;
  border-color:var(--ui-accent)!important;
}

/* forms */
html[data-view-mode="public"] #app :where(input,select,textarea){
  background:var(--ui-surface)!important;
  color:var(--ui-text)!important;
  border-color:var(--ui-line)!important;
}
html[data-view-mode="public"] #app :where(input,textarea)::placeholder{
  color:color-mix(in srgb,var(--ui-muted) 78%,transparent)!important;
}
html[data-view-mode="public"] #app .field label{color:var(--ui-text)!important}
html[data-view-mode="public"] #app select option{background:#fff!important;color:#222!important}

/* generic buttons */
html[data-view-mode="public"] #app .btn:not(.secondary):not(.danger){
  background:var(--ui-accent)!important;
  border-color:var(--ui-accent)!important;
  color:var(--ui-accent-text)!important;
}
html[data-view-mode="public"] #app .btn.secondary{
  background:var(--ui-surface)!important;
  border-color:var(--ui-line)!important;
  color:var(--ui-text)!important;
}
html[data-view-mode="public"] #app .btn.secondary:hover{background:var(--ui-soft)!important}

/* ---------- IMPORTANT: all accent panels use on-accent text ---------- */
html[data-view-mode="public"][data-public-layout="classic"] #app :where(.appointment-band,.cta){
  background:var(--ui-accent)!important;
  color:var(--ui-accent-text)!important;
}
html[data-view-mode="public"][data-public-layout="classic"] #app :where(.appointment-band,.cta) :where(
  h1,h2,h3,h4,h5,h6,p,small,span,strong,b
){
  color:var(--ui-accent-text)!important;
}
html[data-view-mode="public"][data-public-layout="classic"] #app .appointment-band .btn,
html[data-view-mode="public"][data-public-layout="classic"] #app .cta .btn{
  background:var(--ui-dark)!important;
  border-color:var(--ui-dark)!important;
  color:var(--ui-dark-text)!important;
}

/* dark salon standard */
html[data-view-mode="public"] #app .salon-promise{
  background:var(--ui-dark)!important;
  color:var(--ui-dark-text)!important;
}
html[data-view-mode="public"] #app .salon-promise :where(h1,h2,h3,h4,h5,h6,strong,b){
  color:var(--ui-dark-text)!important;
}
html[data-view-mode="public"] #app .salon-promise :where(p,small){
  color:color-mix(in srgb,var(--ui-dark-text) 80%,transparent)!important;
}
html[data-view-mode="public"] #app .salon-promise :where(.kicker,.icon){
  color:var(--ui-accent2)!important;
}

/* care report: no white-cell/light-text collisions */
html[data-view-mode="public"] #app .care-report-paper{
  background:var(--ui-surface)!important;
  border-color:var(--ui-line)!important;
  color:var(--ui-text)!important;
}
html[data-view-mode="public"] #app :where(
  .care-report-catbox,.care-report-check,.care-report-note,.care-report-hero-note,
  .care-report-history-row,.public-report,.public-care-card,.public-report-note
){
  background:var(--ui-soft)!important;
  border-color:var(--ui-line)!important;
  color:var(--ui-text)!important;
}
html[data-view-mode="public"] #app :where(
  .care-report-paper,.care-report-catbox,.care-report-check,.care-report-note,
  .care-report-hero-note,.care-report-history-row,.public-report,.public-care-card,.public-report-note
) :where(h1,h2,h3,h4,h5,strong,b,.brandline,.care-value){
  color:var(--ui-text)!important;
}
html[data-view-mode="public"] #app :where(
  .care-report-paper,.care-report-catbox,.care-report-check,.care-report-note,
  .care-report-hero-note,.care-report-history-row,.public-report,.public-care-card,.public-report-note
) :where(p,small,span,.report-meta,.care-report-disclaimer){
  color:var(--ui-muted)!important;
}

/* booking controls */
html[data-view-mode="public"] #app :where(.day,.booking-day,.booking-month-actions button,.time-slot){
  background:var(--ui-surface)!important;
  color:var(--ui-text)!important;
  border-color:var(--ui-line)!important;
}
html[data-view-mode="public"] #app :where(.day.selected,.booking-day.selected,.time-slot.selected){
  background:var(--ui-accent)!important;
  color:var(--ui-accent-text)!important;
  border-color:var(--ui-accent)!important;
}

/* footer */
html[data-view-mode="public"] #app .salon-footer{
  background:var(--ui-dark)!important;
  color:var(--ui-dark-text)!important;
}
html[data-view-mode="public"] #app .salon-footer :where(h1,h2,h3,h4,strong,b,a,button){
  color:var(--ui-dark-text)!important;
}
html[data-view-mode="public"] #app .salon-footer :where(p,small,span){
  color:color-mix(in srgb,var(--ui-dark-text) 78%,transparent)!important;
}

/* ---------- independent layout guarantees ---------- */

/* Fullscreen Impact */
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-sidebar{
  background:#080807!important;color:#fff!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-sidebar :where(
  b,strong,span,button,a
){color:#f7ede1!important}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-nav button small{color:#c7a46c!important}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-services{
  background:#f4eee7!important;color:#231d18!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-services :where(h1,h2,h3,h4,strong,b){
  color:#231d18!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-services :where(p,small,span){
  color:#5b4f44!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app :where(.impact-portfolio,.impact-standard){
  background:#11100f!important;color:#fff8ed!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app :where(.impact-portfolio,.impact-standard) :where(h1,h2,h3,h4,strong,b){
  color:#fff8ed!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app :where(.impact-portfolio,.impact-standard) :where(p,small,span){
  color:#d2c4b2!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-contact{
  background:#c7a46c!important;color:#15110d!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-contact :where(h1,h2,h3,h4,strong,b){
  color:#15110d!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-contact :where(p,small,span){
  color:#44351f!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-contact .btn{
  background:#11100f!important;border-color:#11100f!important;color:#fff!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-page-hero{
  background:#0d0c0b!important;color:#fff8ed!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-page-hero :where(h1,h2,h3,strong,b){
  color:#fff8ed!important
}
html[data-view-mode="public"][data-public-layout="fullscreen-impact"] #app .impact-page-hero p{color:#d2c4b2!important}

/* Editorial */
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app :where(
  .editorial-header,.editorial-mast,.editorial-nav,.editorial-cover,.editorial-spread,
  .editorial-works,.editorial-standard,.editorial-book,.editorial-footer,.editorial-page-hero
){
  color:#302b28!important
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app :where(
  .editorial-cover,.editorial-spread,.editorial-works,.editorial-standard,.editorial-book,.editorial-page-hero
) :where(h1,h2,h3,h4,strong,b){
  color:#302b28!important
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app :where(
  .editorial-cover,.editorial-spread,.editorial-works,.editorial-standard,.editorial-book,.editorial-page-hero
) :where(p,small,span){
  color:#665c56!important
}

/* Minimal */
html[data-view-mode="public"][data-public-layout="minimal-premium"] #app :where(
  .minimal-header,.minimal-hero,.minimal-values,.minimal-services,.minimal-process,
  .minimal-portfolio,.minimal-booking,.minimal-footer,.minimal-page-hero
){
  color:#24211f!important
}
html[data-view-mode="public"][data-public-layout="minimal-premium"] #app :where(
  .minimal-header,.minimal-hero,.minimal-values,.minimal-services,.minimal-process,
  .minimal-portfolio,.minimal-booking,.minimal-footer,.minimal-page-hero
) :where(h1,h2,h3,h4,strong,b){
  color:#24211f!important
}
html[data-view-mode="public"][data-public-layout="minimal-premium"] #app :where(
  .minimal-header,.minimal-hero,.minimal-values,.minimal-services,.minimal-process,
  .minimal-portfolio,.minimal-booking,.minimal-footer,.minimal-page-hero
) :where(p,small,span){
  color:#625b56!important
}

/* Cat Illustration */
html[data-view-mode="public"][data-public-layout="cat-illustration"] #app :where(
  .cat-header,.cat-hero,.cat-quick,.cat-menu-panel,.cat-middle-grid,.cat-portfolio,
  .cat-location-book,.cat-footer,.cat-page-hero
){
  color:#5b4039!important
}
html[data-view-mode="public"][data-public-layout="cat-illustration"] #app :where(
  .cat-header,.cat-hero,.cat-quick,.cat-menu-panel,.cat-middle-grid,.cat-portfolio,
  .cat-location-book,.cat-footer,.cat-page-hero
) :where(h1,h2,h3,h4,strong,b){
  color:#5b4039!important
}
html[data-view-mode="public"][data-public-layout="cat-illustration"] #app :where(
  .cat-header,.cat-hero,.cat-quick,.cat-menu-panel,.cat-middle-grid,.cat-portfolio,
  .cat-location-book,.cat-footer,.cat-page-hero
) :where(p,small,span){
  color:#6d514b!important
}
html[data-view-mode="public"][data-public-layout="cat-illustration"] #app .cat-location-book>div:last-child{
  background:linear-gradient(135deg,#e69aa0,#d77f86)!important;
  color:#2b1d1a!important
}
html[data-view-mode="public"][data-public-layout="cat-illustration"] #app .cat-location-book>div:last-child :where(h1,h2,h3,p,small,span,strong,b){
  color:#2b1d1a!important
}

/* ================================================================
   HERO MOTION RESTORE
   Cause fixed: older Clean Boutique rule set animation:none on
   .salon-main-photo, and the 4 new layout images had no animation.
   ================================================================ */
@keyframes yjHeroBreath{
  0%{transform:scale(var(--hero-zoom,1.03)) translate3d(0,0,0)}
  50%{transform:scale(calc(var(--hero-zoom,1.03) + .035)) translate3d(-.35%,.15%,0)}
  100%{transform:scale(calc(var(--hero-zoom,1.03) + .065)) translate3d(.25%,-.2%,0)}
}
html[data-view-mode="public"] #app .salon-main-photo,
html[data-view-mode="public"] #app .impact-hero-photo,
html[data-view-mode="public"] #app .editorial-cover-photo img,
html[data-view-mode="public"] #app .minimal-hero-photo img,
html[data-view-mode="public"] #app .cat-hero-photo img{
  animation:yjHeroBreath 12s ease-in-out infinite alternate!important;
  transform-origin:center center;
  will-change:transform;
  backface-visibility:hidden;
}
@media (prefers-reduced-motion:reduce){
  html[data-view-mode="public"] #app .salon-main-photo,
  html[data-view-mode="public"] #app .impact-hero-photo,
  html[data-view-mode="public"] #app .editorial-cover-photo img,
  html[data-view-mode="public"] #app .minimal-hero-photo img,
  html[data-view-mode="public"] #app .cat-hero-photo img{
    animation:none!important;
    transform:scale(var(--hero-zoom,1.03))!important;
  }
}


/* ================================================================
   BEFORE / AFTER COMPARE SLIDER FIX V7 — 2026-09-12
   Hide the native horizontal range control permanently.
   Interaction is handled on the image itself.
   ================================================================ */
html[data-view-mode="public"] #app .compare{
  position:relative;
  cursor:ew-resize;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
}
html[data-view-mode="public"] #app .compare #compareRange,
html[data-view-mode="public"] #app .compare input[type="range"]{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  min-width:1px!important;
  min-height:1px!important;
  left:0!important;
  top:0!important;
  margin:-1px!important;
  padding:0!important;
  border:0!important;
  opacity:0!important;
  background:transparent!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  pointer-events:none!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
}
html[data-view-mode="public"] #app .compare #compareRange::-webkit-slider-runnable-track,
html[data-view-mode="public"] #app .compare #compareRange::-webkit-slider-thumb,
html[data-view-mode="public"] #app .compare #compareRange::-moz-range-track,
html[data-view-mode="public"] #app .compare #compareRange::-moz-range-thumb{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:0!important;
  height:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
html[data-view-mode="public"] #app .compare .compare-line{
  pointer-events:none;
  z-index:3;
}
html[data-view-mode="public"] #app .compare .compare-knob{
  z-index:4;
  cursor:ew-resize;
  outline:none;
}
html[data-view-mode="public"] #app .compare .compare-knob:focus-visible{
  outline:3px solid color-mix(in srgb,var(--ui-accent) 70%,#ffffff);
  outline-offset:3px;
}


/* ================================================================
   EDITORIAL MAGAZINE — DYNAMIC PHOTO MOTION V8
   2026-09-12
   Each photo moves independently with a different slow cinematic
   pan/zoom pattern. Text/layout remains stable.
   ================================================================ */

/* Keep every moving image clipped inside its editorial frame */
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app :where(
  .editorial-cover-photo,
  .editorial-photo-box,
  .editorial-works-grid article,
  .editorial-book-photo
){
  overflow:hidden;
  isolation:isolate;
}

/* Make image movement smooth and GPU-friendly */
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app :where(
  .editorial-cover-photo img,
  .editorial-photo-box img,
  .editorial-works-grid img,
  .editorial-book-photo img
){
  will-change:transform,filter;
  backface-visibility:hidden;
  transform:translateZ(0);
}

/* Main hero: broad, calm pan + zoom */
@keyframes yjEditorialHeroDrift{
  0%{
    transform:scale(var(--hero-zoom,1.06)) translate3d(-1.4%,0,0);
    filter:saturate(.70) sepia(.06) brightness(1);
  }
  42%{
    transform:scale(calc(var(--hero-zoom,1.06) + .035)) translate3d(.7%,-.55%,0);
    filter:saturate(.78) sepia(.04) brightness(1.015);
  }
  100%{
    transform:scale(calc(var(--hero-zoom,1.06) + .065)) translate3d(1.35%,.35%,0);
    filter:saturate(.73) sepia(.06) brightness(1);
  }
}

/* Philosophy image: slow diagonal breathing */
@keyframes yjEditorialPhotoA{
  0%{transform:scale(1.04) translate3d(-1.6%,1.0%,0)}
  50%{transform:scale(1.085) translate3d(.9%,-.9%,0)}
  100%{transform:scale(1.06) translate3d(1.6%,.55%,0)}
}

/* Portfolio #1: horizontal editorial pan */
@keyframes yjEditorialPhotoB{
  0%{transform:scale(1.055) translate3d(-2.2%,0,0)}
  45%{transform:scale(1.09) translate3d(.3%,-.45%,0)}
  100%{transform:scale(1.065) translate3d(2.0%,.2%,0)}
}

/* Portfolio #2: vertical pan */
@keyframes yjEditorialPhotoC{
  0%{transform:scale(1.07) translate3d(.2%,-2.0%,0)}
  50%{transform:scale(1.105) translate3d(-.6%,.2%,0)}
  100%{transform:scale(1.075) translate3d(.4%,1.9%,0)}
}

/* Portfolio #3: gentle push-in with opposing drift */
@keyframes yjEditorialPhotoD{
  0%{transform:scale(1.035) translate3d(1.5%,.8%,0)}
  55%{transform:scale(1.095) translate3d(-.7%,-.7%,0)}
  100%{transform:scale(1.065) translate3d(-1.5%,.15%,0)}
}

/* Lower reservation/location photo: wide cinematic float */
@keyframes yjEditorialPhotoE{
  0%{transform:scale(1.04) translate3d(-1.2%,.55%,0)}
  50%{transform:scale(1.085) translate3d(.8%,-.4%,0)}
  100%{transform:scale(1.055) translate3d(1.35%,.3%,0)}
}

/* The main cover already had a generic hero animation in V6.
   This later rule deliberately replaces it for this layout only. */
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-cover-photo img{
  animation:yjEditorialHeroDrift 16s cubic-bezier(.45,.05,.35,1) infinite alternate!important;
  transform-origin:52% 48%;
}

/* Each photo gets its own motion, speed and negative delay so they do not sync */
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-photo-box img{
  animation:yjEditorialPhotoA 13.5s ease-in-out -2.2s infinite alternate!important;
  transform-origin:45% 55%;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-works-grid article:nth-child(1) img{
  animation:yjEditorialPhotoB 11.8s ease-in-out -4.0s infinite alternate!important;
  transform-origin:40% 50%;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-works-grid article:nth-child(2) img{
  animation:yjEditorialPhotoC 13.2s ease-in-out -7.1s infinite alternate!important;
  transform-origin:52% 42%;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-works-grid article:nth-child(3) img{
  animation:yjEditorialPhotoD 12.4s ease-in-out -1.8s infinite alternate!important;
  transform-origin:60% 48%;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-book-photo img{
  animation:yjEditorialPhotoE 15.5s ease-in-out -5.3s infinite alternate!important;
  transform-origin:48% 52%;
}

/* Subtle visual depth on cards without moving text */
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-works-grid article{
  transition:box-shadow .35s ease,background .35s ease;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-works-grid article:hover{
  box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--ui-accent) 38%,transparent);
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-works-grid article:hover img,
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-photo-box:hover img,
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-book-photo:hover img{
  filter:saturate(.92) contrast(1.02)!important;
}

/* Mobile: keep motion visible but less aggressive */
@media(max-width:680px){
  html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app :where(
    .editorial-photo-box img,
    .editorial-works-grid img,
    .editorial-book-photo img
  ){
    animation-duration:17s!important;
  }
}

/* Accessibility: respect reduced-motion preference */
@media(prefers-reduced-motion:reduce){
  html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app :where(
    .editorial-cover-photo img,
    .editorial-photo-box img,
    .editorial-works-grid img,
    .editorial-book-photo img
  ){
    animation:none!important;
    transform:scale(1.02)!important;
    transition:none!important;
  }
}


/* ================================================================
   EDITORIAL PORTFOLIO CAPTION V9 — 2026-09-12
   Larger, lower, easier-to-read cat name/service captions.
   ================================================================ */
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-works-grid article{
  display:flex;
  flex-direction:column;
  min-width:0;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-works-grid article>img{
  display:block;
  width:100%;
  flex:0 0 auto;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-case-caption{
  position:relative;
  z-index:5;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  min-height:76px;
  padding:18px 18px 20px;
  margin:0;
  background:#fbf9f6!important;
  border-top:1px solid #d9cec3;
  color:#302b28!important;
  box-sizing:border-box;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-case-caption b{
  display:block;
  margin:0;
  font-family:system-ui,-apple-system,"Pretendard","Noto Sans KR",sans-serif;
  font-size:15px;
  line-height:1.35;
  font-weight:750;
  letter-spacing:-.025em;
  color:#302b28!important;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-case-caption span{
  display:block;
  padding:0!important;
  margin:0;
  font-family:system-ui,-apple-system,"Pretendard","Noto Sans KR",sans-serif;
  font-size:12px!important;
  line-height:1.45;
  font-weight:550;
  letter-spacing:.02em;
  color:#756960!important;
}
html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-works-grid article:hover .editorial-case-caption{
  background:#f4ede6!important;
}

/* Mobile: keep the caption easy to read without becoming too tall */
@media(max-width:680px){
  html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-case-caption{
    min-height:68px;
    padding:15px 14px 17px;
  }
  html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-case-caption b{
    font-size:14px;
  }
  html[data-view-mode="public"][data-public-layout="editorial-magazine"] #app .editorial-case-caption span{
    font-size:11.5px!important;
  }
}


/* ================================================================
   MEMBER / AUTH / MY THEME CONTRACT V10 — 2026-09-12
   Login, signup, MY and member-related public UI now follow each
   selected template with guaranteed readable text colors.
   Admin CMS is excluded.
   ================================================================ */

html[data-view-mode="public"]{
  --auth-intro-bg:var(--ui-dark);
  --auth-intro-text:var(--ui-dark-text);
  --auth-intro-muted:color-mix(in srgb,var(--ui-dark-text) 76%,transparent);
  --auth-card-bg:var(--ui-surface);
  --auth-card-text:var(--ui-text);
  --auth-card-muted:var(--ui-muted);
  --auth-line:var(--ui-line);
  --auth-soft:var(--ui-soft);
}