/* ===== БАЗА ===== */
*,*::before,*::after{box-sizing:border-box}
:root{
--bg:#FAF6F0;--bg-2:#F2EBE0;--panel:#EDE4D8;--card:#F2EBE0;--card-2:#E8DFD0;
--line:#C8DFD6;--line-2:#A87840;
--gold:#4A9E8E;--gold-l:#5FB3A2;--cream:#1E3330;--muted:#2F4A44;--muted-2:#5A7A74;
--flame:#A87840;--wine:#7A5630;--r:16px;--r-s:10px;
--shadow:0 24px 60px rgba(42,37,32,.14);
--shadow-soft:0 8px 24px rgba(42,37,32,.06);
--muted-3:#9A9088;
--card-end:#EDE4D8;
--header-bg:rgba(245,239,230,.88);
--header-bg-scrolled:rgba(240,232,220,.98);
--overlay-bg:rgba(43,38,32,.42);
--scrim-bg:rgba(43,38,32,.32);
--modal-bg:linear-gradient(180deg,#F5EFE6,#EDE4D8);
--drawer-bg:#F5EFE6;
--input-bg:#FFFFFF;
--room-stone:#1A1714;
--room-purple:#1F1620;
--room-burgundy:#1F1420;
--room-light:#F5EFE6;
--room-text:#E8E2D5;
--serif:'Philosopher','Cinzel',Georgia,serif;
--sans:'Philosopher','Bad Script',Arial,sans-serif;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
margin:0;background:var(--bg);color:var(--muted);
font-family:var(--sans);font-size:16px;font-weight:400;line-height:1.6;
letter-spacing:0;overflow-x:hidden;
-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
background:radial-gradient(1000px 700px at 15% -10%,rgba(168,120,64,.14),transparent 62%),
radial-gradient(800px 600px at 90% 8%,rgba(168,120,64,.10),transparent 65%),
radial-gradient(1000px 800px at 50% 110%,rgba(168,120,64,.08),transparent 60%);}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
h1,h2,h3,h4{
font-family:var(--serif);font-weight:600;line-height:1.15;
margin:0;letter-spacing:.01em;color:var(--cream);
}
p{margin:0}
.wrap{width:min(1200px,calc(100% - 40px));margin:0 auto;position:relative;z-index:1}
.section{padding:96px 0;position:relative}
.section--tight{padding:72px 0}
/* типографика */
.kicker{font-family:var(--sans);font-size:12px;letter-spacing:.28em;text-transform:uppercase;
color:var(--gold);font-weight:600;margin-bottom:16px;
display:flex;align-items:center;gap:12px}
.kicker::after{content:"";height:1px;flex:1;max-width:80px;background:linear-gradient(90deg,var(--line-2),transparent)}
.kicker--center{justify-content:center}
.h-sec{font-size:clamp(28px,3.6vw,36px);font-weight:600;margin-bottom:16px;letter-spacing:.02em;line-height:1.15}
.sub{color:var(--muted-2);font-size:16px;max-width:640px;line-height:1.65;font-weight:400}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:48px;flex-wrap:wrap}
.link-more{color:var(--gold);font-size:14px;letter-spacing:.06em;white-space:nowrap;border-bottom:1px solid var(--line-2);padding-bottom:4px;transition:.2s}
.link-more:hover{color:var(--gold-l);border-color:var(--gold-l)}
/* кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
padding:14px 26px;border-radius:10px;font-family:var(--sans);
font-size:15px;font-weight:500;letter-spacing:.02em;
transition:.18s ease;white-space:nowrap;border:0}
.btn-primary{background:linear-gradient(180deg,#D8B584,#DC82A0 60%,#8B6B44);color:#1F1620;box-shadow:0 10px 30px rgba(168,120,64,.32)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 44px rgba(168,120,64,.48);background:linear-gradient(180deg,#D8B584,#DC82A0 60%,#8B6B44)}
.btn-ghost{border:1px solid var(--line-2);color:var(--cream);background:rgba(255,255,255,.02)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-l);background:rgba(168,120,64,.08)}
.btn-line{border:1px solid var(--line-2);color:var(--gold-l);padding:10px 20px;font-size:14px;border-radius:8px;background:transparent;font-family:var(--sans);font-weight:500}
.btn-line:hover{background:rgba(168,120,64,.12);border-color:var(--gold)}
.btn-sm{padding:10px 18px;font-size:14px}
.btn-heart{width:52px;height:52px;border-radius:50%;border:1px solid var(--line-2);font-size:20px;display:inline-grid;place-items:center}
.btn-heart:hover{border-color:var(--gold);color:var(--gold-l)}
/* тултипы */
/* ===== ШАПКА ===== */
.header{position:sticky;top:0;z-index:60;background:rgba(250,246,240,.94);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border-bottom:1px solid rgba(232,223,208,.9);box-shadow:0 2px 12px rgba(42,37,32,.05);transition:.25s}
.header.is-scrolled{background:rgba(250,246,240,.98);border-bottom-color:#E8DFD0;box-shadow:0 6px 24px rgba(42,37,32,.10)}
.header-in{display:flex;align-items:center;gap:26px;height:auto;min-height:96px;padding:18px 0;flex-wrap:nowrap}
.logo{display:flex;flex-direction:column;line-height:1;flex-shrink:0;text-decoration:none;position:relative;padding-right:8px}
.logo b{font-family:"Philosopher",serif;font-style:italic;font-size:28px;letter-spacing:.14em;color:#2A2520;font-weight:700;line-height:1}
.logo b::before,
.logo b::after{
content:"❦";
position:absolute;top:50%;transform:translateY(-52%);
font-size:16px;color:#A87840;font-family:Georgia,serif;
opacity:.55;pointer-events:none;
filter:drop-shadow(0 0 8px rgba(200,160,100,.4));
}
.logo b::before{left:-2px}
.logo b::after{right:-2px;transform:translateY(-52%) scaleX(-1)}
.logo span{font-family:"Philosopher",serif;font-style:italic;font-size:10px;letter-spacing:.32em;color:#A87A3A;text-transform:uppercase;margin-top:7px;font-weight:400}
.logo b{font-family:"Philosopher",serif;font-style:italic;font-size:26px;letter-spacing:.14em;color:var(--cream,#2A2520);font-weight:700;line-height:1}
.logo span{font-family:"Philosopher",serif;font-style:italic;font-size:9.5px;letter-spacing:.32em;color:var(--gold,#C89B5A);text-transform:uppercase;margin-top:6px;font-weight:400}
.nav{display:flex;gap:4px;flex:1 1 auto;justify-content:center;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px 0;min-width:0}
.nav::-webkit-scrollbar{display:none}
.nav a{padding:10px 14px;border-radius:10px;font-family:"Philosopher",serif;font-style:italic;font-weight:700;font-size:15px;line-height:1.2;color:#3A342C;transition:.18s;white-space:nowrap;flex-shrink:0}
.nav a:hover{color:var(--gold-l);background:rgba(168,120,64,.10)}
.nav a.is-18{color:#d98b8b}
.header-act{display:flex;align-items:center;gap:6px;flex-shrink:0;flex-wrap:nowrap;position:relative;z-index:70}
.icon-btn{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:18px;border:1px solid transparent;transition:.18s;background:transparent;color:#3A342C;font-family:"Philosopher",serif;font-style:italic;flex-shrink:0}
.icon-btn:hover{background:rgba(168,120,64,.12);border-color:var(--line)}
.burger{display:none;width:46px;height:46px;border-radius:12px;font-size:22px;color:#3A342C;background:transparent;cursor:pointer}
.user{position:relative}
.user-btn{display:flex;align-items:center;gap:9px;padding:10px 18px;border-radius:999px;border:1px solid #E8DFD0;font-family:"Philosopher",serif;font-style:italic;font-weight:700;font-size:15px;transition:.18s;background:transparent;color:#3A342C;white-space:nowrap;flex-shrink:0}
.user-btn:hover{border-color:var(--gold)}
.user-menu{position:absolute;right:0;top:calc(100% + 12px);min-width:210px;background:#1a130c;border:1px solid var(--line);border-radius:14px;padding:8px;box-shadow:var(--shadow);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.2s}
.user.is-open .user-menu{opacity:1;visibility:visible;transform:translateY(0)}
.user-menu a{display:block;padding:10px 14px;border-radius:9px;font-size:14px;color:var(--muted)}
.user-menu a:hover{background:rgba(168,120,64,.10);color:var(--gold-l)}
.user-menu hr{border:0;border-top:1px solid var(--line);margin:6px 8px}
.mobile-nav{display:none;position:fixed;top:0;bottom:0;left:0;right:0;background:rgba(12,9,6,.98);z-index:55;padding:110px 20px 28px;overflow:auto}
.mobile-nav.is-open{display:block}
.mobile-nav a{display:block;padding:16px 4px;font-size:24px;font-family:var(--serif);border-bottom:1px solid var(--line)}
/* ===== ХЛЕБНЫЕ КРОШКИ ===== */
.breadcrumbs{padding:22px 0 0;font-family:var(--sans);font-size:16px;color:var(--muted-2);letter-spacing:.02em}
.breadcrumbs a{color:var(--muted);transition:.18s}
.breadcrumbs a:hover{color:var(--gold-l)}
.breadcrumbs .sep{margin:0 8px;opacity:.5}
.breadcrumbs .cur{color:var(--gold-l)}
/* ===== HERO главной ===== */
.hero{position:relative;min-height:min(92vh,900px);display:flex;align-items:center;padding:90px 0 70px;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;
background:linear-gradient(90deg,rgba(20,14,22,.86) 0%,rgba(20,14,22,.62) 45%,rgba(20,14,22,.40) 75%,rgba(20,14,22,.78) 100%),
linear-gradient(180deg,rgba(20,14,22,.55) 0%,transparent 40%,rgba(20,14,22,.85) 100%),
url('../img/hero.jpg?v=92fc4751') center/cover no-repeat,
radial-gradient(circle at 30% 40%,#2B1F2E,#150E18 70%);}
.hero-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,720px);gap:0;align-items:center}
.hero-kicker{
font-family:'Philosopher',serif;font-style:italic;
font-size:12px;letter-spacing:.5em;text-transform:uppercase;
color:#D8B584;margin-bottom:26px;font-weight:400;
display:inline-flex;align-items:center;gap:14px;
}
.hero-kicker::before,
.hero-kicker::after{
content:"";height:1px;width:44px;background:linear-gradient(90deg,transparent,#D8B584);
}
.hero-kicker::after{background:linear-gradient(90deg,#D8B584,transparent)}
.hero h1{
font-family:var(--serif);
font-size:clamp(56px,10vw,96px);
font-weight:700;line-height:1.02;letter-spacing:.04em;
color:#FAF6F0;margin-bottom:22px;
text-shadow:0 4px 24px rgba(0,0,0,.55);
}
.hero h1::before,
.hero h1::after{
content:"❦";
position:absolute;top:50%;transform:translateY(-50%);
font-size:clamp(28px,4vw,52px);color:#D8B584;font-family:Georgia,serif;
opacity:.65;
filter:drop-shadow(0 0 20px rgba(216,181,132,.55));
}
.hero h1::before{left:-14px}
.hero h1::after{right:-14px;transform:translateY(-50%) scaleX(-1)}
.hero-sub{font-family:var(--serif);font-size:clamp(20px,2.4vw,28px);color:var(--gold-l);margin-bottom:18px;font-style:italic}
.hero-text{color:#cdbfa9;font-size:16.5px;max-width:520px;margin-bottom:34px}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:44px}
.stats{display:flex;flex-wrap:wrap;gap:34px;padding-top:26px;border-top:1px solid var(--line);max-width:640px}
.stat b{display:block;font-family:var(--serif);font-size:30px;color:var(--gold-l);line-height:1}
.stat span{font-size:12px;color:var(--muted-2);letter-spacing:.08em;text-transform:uppercase}
.deliv-line{margin-top:20px;font-size:13px;color:var(--muted-2);letter-spacing:.03em}
.hero-visual{position:relative;display:flex;justify-content:flex-end}
.hero-frame{width:100%;max-width:440px;aspect-ratio:4/5;border-radius:22px;overflow:hidden;border:1px solid var(--line-2);box-shadow:var(--shadow);position:relative;background:linear-gradient(160deg,#2a2016,#150f09)}
.hero-frame img{width:100%;height:100%;object-fit:cover;opacity:.92}
.hero-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(10,7,4,.85))}
.hero-badge{position:absolute;left:22px;bottom:22px;z-index:2;background:rgba(12,9,6,.82);backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:14px;padding:14px 18px}
.hero-badge b{display:block;font-family:var(--serif);font-size:19px;color:var(--gold-l)}
.hero-badge span{font-size:12px;color:var(--muted)}
/* ===== СЕТКИ и КАРТОЧКИ ===== */
.grid{display:grid;gap:20px}
.g-4{grid-template-columns:repeat(4,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-5{grid-template-columns:repeat(5,1fr)}
.g-6{grid-template-columns:repeat(6,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px;
transition:.2s ease;position:relative;box-shadow:var(--shadow-soft)}
.card::before{content:"";position:absolute;inset:0;opacity:0;transition:.3s;background:radial-gradient(400px 200px at 50% -20%,rgba(168,120,64,.16),transparent 70%)}
.card:hover{border-color:var(--line-2);box-shadow:0 10px 30px rgba(42,37,32,.10);transform:translateY(-3px)}
.card:hover::before{opacity:1}
.card>*{position:relative;z-index:1}
.hall{display:flex;flex-direction:column;gap:14px;min-height:230px}
.hall-ico{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-size:26px;background:rgba(168,120,64,.10);border:1px solid var(--line)}
.hall h3{font-family:var(--serif);font-size:20px;font-weight:400;line-height:1.2}
.hall p{color:var(--muted);font-size:14.5px;flex:1}
.hall.is-18{border-color:rgba(217,139,139,.28)}
.hall.is-18 .hall-ico{background:rgba(217,139,139,.10);border-color:rgba(217,139,139,.3)}
.role{display:flex;flex-direction:column;gap:14px}
.role-num{font-family:var(--serif);font-size:56px;color:rgba(220,182,112,.40);line-height:1}
.role h3{font-family:var(--serif);font-size:20px;font-weight:400;line-height:1.2}
.role p{color:var(--muted);font-size:15px;flex:1}
.role .btn-line{align-self:flex-start}
/* ===== СЕКРЕТ ===== */
#secret{background:linear-gradient(180deg,#1F1420,#150E18);border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:#E8E2D5}
.secret-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:56px;align-items:center}
.secret h2{font-size:clamp(32px,5vw,54px)}
.secret-text{color:#cbb9a5;font-size:16.5px;margin:20px 0 30px;max-width:480px}
.blur-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.blur-card{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:linear-gradient(140deg,#3a2a1e,#1a1209);position:relative;aspect-ratio:4/3}
.blur-card .veil{position:absolute;inset:0;backdrop-filter:blur(16px);background:radial-gradient(circle at 35% 35%,rgba(168,120,64,.35),transparent 60%),radial-gradient(circle at 70% 70%,rgba(122,47,47,.45),transparent 60%)}
.blur-card .cap{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;font-size:12.5px;background:linear-gradient(0deg,rgba(10,7,4,.92),transparent);color:var(--gold-l)}
/* ===== НОВИНКИ / КАРТОЧКИ ТОВАРА (главная) ===== */
.prod{background:linear-gradient(180deg,var(--card),var(--card-end));border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.25s;display:flex;flex-direction:column}
.prod:hover{transform:translateY(-5px);border-color:var(--line-2);box-shadow:0 22px 50px rgba(0,0,0,.5)}
.prod-img{aspect-ratio:1/1;display:grid;place-items:center;font-size:56px;background:radial-gradient(circle at 50% 30%,rgba(168,120,64,.20),transparent 65%),linear-gradient(160deg,#EDE4D8,#E0D5C5);border-bottom:1px solid var(--line);position:relative}
.prod-body{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.prod-body h4{font-size:20px;font-weight:400;font-family:var(--serif);line-height:1.25}
.prod-price{font-family:var(--serif);font-size:30px;color:var(--gold-l);margin-top:auto;letter-spacing:.01em}
.prod-meta{font-size:11.5px;color:var(--muted-2);letter-spacing:.06em}
/* ===== МАСТЕРА ===== */
.master{display:flex;align-items:center;gap:16px;padding:16px 20px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.015);transition:.2s}
.master:hover{border-color:var(--line-2);background:rgba(168,120,64,.06);transform:translateX(4px)}
.ava{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;font-family:var(--serif);font-size:24px;color:var(--gold-l);background:linear-gradient(140deg,rgba(168,120,64,.28),rgba(168,120,64,.06));border:1px solid var(--line-2)}
.master b{font-family:var(--serif);font-size:22px;font-weight:400;display:block;line-height:1.2}
.master span{font-family:var(--sans);font-size:16px;color:var(--muted);line-height:1.35}
/* ===== ДОСТАВКА ===== */
.ship{border:1px solid var(--line);border-radius:14px;padding:20px;background:linear-gradient(180deg,var(--card),var(--card-end));transition:.22s}
.ship:hover{border-color:var(--line-2);transform:translateY(-3px)}
.ship-top{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.ship b{font-size:15.5px;font-weight:600}
.ship p{font-size:13.5px;color:var(--muted)}
.ship-notes{display:flex;flex-direction:column;gap:8px;margin:28px 0 30px;color:var(--muted);font-size:14.5px}
/* ===== ИСТОРИИ ===== */
.story{display:flex;flex-direction:column;gap:14px}
.story-tag{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.story h3{font-size:26px;line-height:1.2}
.story-meta{font-size:12.5px;color:var(--muted-2)}
.story-quote{font-family:var(--serif);font-size:16.5px;font-style:italic;color:#cbb9a5;border-left:2px solid var(--line-2);padding-left:16px;flex:1}
/* ===== ГОСТИНАЯ ===== */
.lounge{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:56px;align-items:center}
.lounge p{color:var(--muted);font-size:16.5px;margin-bottom:16px}
.lounge .accent{color:var(--gold-l);font-family:var(--serif);font-size:21px;font-style:italic}
.lounge-cards{display:flex;flex-direction:column;gap:14px}
.l-card{display:flex;align-items:center;gap:16px;padding:16px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.l-card .veil{width:48px;height:48px;border-radius:50%;flex-shrink:0;background:linear-gradient(140deg,#EDE4D8,#E0D5C5);backdrop-filter:blur(8px);border:1px solid var(--line)}
.l-card b{font-size:15px;display:block}
.l-card span{font-size:13px;color:var(--muted-2)}
.mini-note{font-size:11.5px;color:var(--muted-2);margin-top:18px}
/* ===== ПРИЧИНЫ ===== */
.why{border:1px solid var(--line);border-radius:var(--r);padding:28px;background:linear-gradient(180deg,#EDE4D8,#E0D5C5);transition:.22s}
.why:hover{border-color:var(--line-2);transform:translateY(-4px)}
.why b{display:block;font-family:var(--serif);font-size:30px;color:var(--gold-l);margin-bottom:10px;font-weight:400;line-height:1.1}
.why p{font-size:14.5px;color:var(--muted)}
.why-ico{font-size:22px;margin-bottom:14px;display:block}
/* ===== CTA ===== */
.cta{position:relative;text-align:center;padding:120px 0;overflow:hidden;border-top:1px solid var(--line)}
.cta-bg{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,14,22,.86),rgba(20,14,22,.94)),url('../img/hero.jpg?v=92fc4751') center/cover no-repeat,radial-gradient(circle at 50% 50%,#3A2540,#1F1620)}
.cta-in{position:relative;z-index:1;max-width:760px;margin:0 auto}
.cta h2{font-size:clamp(38px,6.4vw,68px);margin-bottom:26px}
.cta p{color:#cbb9a5;font-size:17px;line-height:2;margin-bottom:12px}
.cta .strong{font-family:var(--serif);font-size:24px;color:var(--gold-l);font-style:italic;margin:28px 0 36px}
.cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
/* ===== ФУТЕР ===== */
.footer{border-top:1px solid var(--line);padding:72px 0 0;background:var(--bg)}
.f-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:36px;padding-bottom:52px}
.f-col h4{font-family:var(--sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:18px;font-weight:600}
.f-col a{display:block;font-family:var(--sans);color:var(--muted);font-size:17px;padding:6px 0;transition:.18s}
.f-col a:hover{color:var(--gold-l);transform:translateX(3px)}
.f-brand b{font-family:var(--serif);font-size:24px;letter-spacing:.16em;color:var(--cream);font-weight:600;display:block}
.f-brand b::before,
.f-brand b::after{
content:"❦";
position:absolute;top:50%;transform:translateY(-52%);
font-size:18px;color:#A87840;font-family:Georgia,serif;opacity:.5;
}
.f-brand b::before{left:-4px}
.f-brand b::after{right:-4px;transform:translateY(-52%) scaleX(-1)}
.f-brand .tag{font-family:var(--sans);font-size:10.5px;letter-spacing:.32em;color:var(--gold);text-transform:uppercase;margin:6px 0 18px;display:block}
.f-brand p{font-family:var(--sans);font-size:17px;color:var(--muted);margin-bottom:16px;line-height:1.5}
.f-ship{font-family:var(--sans);font-size:15px;color:var(--muted-2);line-height:1.9}
.f-bottom{border-top:1px solid var(--line);padding:24px 0;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:var(--sans);font-size:14px;color:var(--muted-2)}
/* ===== ОВЕРЛЕИ ===== */
.overlay{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:rgba(43,38,32,.42);backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:.25s}
.overlay.is-open{opacity:1;visibility:visible}
.modal{width:min(520px,100%);background:linear-gradient(180deg,#F5EFE6,#EDE4D8);border:1px solid var(--line-2);border-radius:22px;padding:38px;text-align:center;box-shadow:var(--shadow);transform:translateY(14px);transition:.25s}
.overlay.is-open .modal{transform:translateY(0)}
.modal h3{font-size:36px;margin-bottom:14px;line-height:1.1}
.modal p{font-family:var(--sans);color:var(--muted);font-size:18px;margin-bottom:28px;line-height:1.5}
.modal-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.modal .warn{font-size:12px;color:var(--muted-2);margin-top:20px;margin-bottom:0}
.search-modal{width:min(640px,100%);text-align:left;padding:0;overflow:hidden}
.search-input{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);padding:26px 28px;color:var(--cream);font-size:22px;outline:none;font-family:var(--sans);letter-spacing:.01em}
.search-input::placeholder{color:var(--muted-2)}
.search-hint{padding:18px 28px 12px;font-family:var(--sans);font-size:16px;color:var(--muted-2)}
.search-tags{display:flex;flex-wrap:wrap;gap:8px;padding:0 28px 26px}
.search-tags button{padding:8px 15px;border-radius:999px;border:1px solid var(--line);font-family:var(--sans);font-size:16px;color:var(--muted);transition:.18s;background:transparent}
.search-tags button:hover{border-color:var(--gold);color:var(--gold-l)}
.search-empty{display:none;padding:34px 28px 40px;text-align:center;color:var(--muted);font-size:15px}
.search-empty.is-on{display:block}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);z-index:100;background:var(--input-bg);border-left:1px solid var(--line);transform:translateX(100%);transition:.3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column}
.drawer.is-open{transform:translateX(0)}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:24px;border-bottom:1px solid var(--line)}
.drawer-head h3{font-size:22px}
.drawer-body{flex:1;display:grid;place-items:center;padding:30px;text-align:center}
.drawer-body .empty-ico{font-size:52px;opacity:.5;margin-bottom:18px}
.drawer-body p{color:var(--muted);font-size:15px;margin-bottom:22px}
.scrim{position:fixed;inset:0;background:rgba(43,38,32,.32);z-index:99;opacity:0;visibility:hidden;transition:.25s}
.scrim.is-open{opacity:1;visibility:visible}
/* ===================== СТРАНИЦА ЗАЛА ===================== */
.hall-hero{padding:36px 0 56px;position:relative}
.hall-hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.6fr);gap:60px;align-items:end}
.hall-hero h1{font-size:clamp(38px,6vw,68px);margin-bottom:20px}
.hall-hero .sub{max-width:620px;margin-bottom:28px}
.hall-hero-stats{display:flex;flex-wrap:wrap;gap:32px;padding-top:24px;border-top:1px solid var(--line);max-width:640px}
.hall-hero-stats .stat b{font-size:26px}
.subnav{padding:0 0 8px;border-bottom:1px solid var(--line);position:sticky;top:78px;background:rgba(18,14,10,.86);backdrop-filter:blur(12px);z-index:40}
.subnav ul{list-style:none;display:flex;gap:4px;padding:14px 0;margin:0;overflow-x:auto;scrollbar-width:none}
.subnav ul::-webkit-scrollbar{display:none}
.subnav a{padding:9px 18px;border-radius:999px;font-size:14px;color:var(--muted);white-space:nowrap;transition:.18s}
.subnav a:hover{color:var(--gold-l);background:rgba(168,120,64,.08)}
.subnav a.is-active{color:#F5EFE6;background:linear-gradient(180deg,#C89860,#A87840);font-weight:600}
.catalog{display:grid;grid-template-columns:280px minmax(0,1fr);gap:36px;align-items:start;padding:56px 0 96px}
.filters{position:sticky;top:150px;max-height:calc(100vh - 170px);overflow-y:auto;padding-right:8px}
.filters::-webkit-scrollbar{width:6px}
.filters::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:3px}
.filters h3{font-size:22px;margin-bottom:22px}
.fgroup{border-top:1px solid var(--line);padding:20px 0}
.fgroup h4{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;font-family:var(--sans);font-weight:600}
.fgroup label{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:14px;color:var(--muted);cursor:pointer;transition:.18s}
.fgroup label:hover{color:var(--gold-l)}
.fgroup input[type=checkbox]{appearance:none;width:16px;height:16px;border-radius:4px;border:1px solid var(--line-2);position:relative;flex-shrink:0;transition:.18s;background:transparent}
.fgroup input[type=checkbox]:checked{background:var(--gold);border-color:var(--gold)}
.fgroup input[type=checkbox]:checked::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#1a1206;font-size:11px;font-weight:700}
.price-range{display:flex;align-items:center;gap:10px}
.price-range input{width:100%;background:transparent;border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--cream);font-size:14px;outline:none;font-family:var(--sans)}
.price-range input:focus{border-color:var(--gold)}
.price-range span{color:var(--muted-2);font-size:13px}
.filters-actions{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.filters-actions .btn{padding:12px 20px;font-size:14px;flex:1;min-width:120px}
.catalog-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.catalog-head .count{font-size:14px;color:var(--muted-2)}
.catalog-head select{background:transparent;border:1px solid var(--line);border-radius:10px;padding:10px 14px;color:var(--cream);font-size:14px;font-family:var(--sans);outline:none}
.catalog-head select:focus{border-color:var(--gold)}
.cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pcard{background:linear-gradient(180deg,var(--card),var(--card-end));border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.25s;display:flex;flex-direction:column;position:relative}
.pcard:hover{transform:translateY(-5px);border-color:var(--line-2);box-shadow:0 22px 50px rgba(0,0,0,.5)}
.pcard-img{aspect-ratio:1/1;display:grid;place-items:center;font-size:64px;background:radial-gradient(circle at 50% 30%,rgba(168,120,64,.20),transparent 65%),linear-gradient(160deg,#EDE4D8,#E0D5C5);border-bottom:1px solid var(--line);position:relative}
.pcard-badges{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;pointer-events:none}
.badge{padding:6px 10px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.02em;pointer-events:auto;background:rgba(10,7,4,.82);backdrop-filter:blur(6px);border:1px solid var(--line);color:var(--cream)}
.badge.new{color:#9ee2c0;border-color:rgba(158,226,192,.35)}
.badge.hit{color:#ffcf7a;border-color:rgba(255,207,122,.4)}
.badge.gift{color:#e3c88e;border-color:rgba(227,200,142,.4)}
.badge.sale{background:linear-gradient(180deg,#C89860,#A87840);color:#F5EFE6;border-color:transparent}
.badge.last{color:#e8a33d}
.badge.out{color:#d98b8b;border-color:rgba(217,139,139,.4)}
.pcard-body{padding:18px;display:flex;flex-direction:column;gap:6px;flex:1}
.pcard-body h4{font-size:20px;font-weight:400;font-family:var(--serif);line-height:1.25}
.pcard-spec{font-size:12.5px;color:var(--muted-2);letter-spacing:.02em}
.pcard-price{font-family:var(--serif);font-size:26px;color:var(--gold-l);margin-top:auto}
.pcard-price small{font-size:13px;color:var(--muted-2);text-decoration:line-through;margin-right:8px;font-family:var(--sans)}
.pcard.is-out{opacity:.55}
.pcard.is-out .pcard-img::after{content:"";position:absolute;inset:0;background:rgba(10,7,4,.55)}
.about-hall{background:linear-gradient(180deg,rgba(24,18,12,.6),rgba(18,14,10,.9));border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:96px 0}
.about-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:60px;align-items:start}
.about-grid h2{font-size:clamp(30px,4.4vw,48px)}
.about-grid p{font-family:var(--sans);color:var(--muted);font-size:20px;margin-bottom:18px;line-height:1.55}
.about-list{list-style:none;padding:0;margin:22px 0 30px;display:flex;flex-direction:column;gap:10px}
.about-list li{position:relative;padding-left:24px;font-family:var(--sans);color:var(--muted);font-size:18px;line-height:1.55}
.about-list li::before{content:"—";position:absolute;left:0;color:var(--gold)}
.custom-block{background:radial-gradient(700px 400px at 20% 0%,rgba(122,47,47,.22),transparent 65%),linear-gradient(180deg,rgba(36,26,18,.9),rgba(20,14,9,.9));border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:96px 0}
.custom-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:60px;align-items:center}
.custom-grid h2{font-size:clamp(32px,5vw,56px)}
.custom-grid p{color:#cbb9a5;font-size:16.5px;margin-bottom:20px}
.custom-list{list-style:none;padding:0;margin:26px 0;display:flex;flex-direction:column;gap:12px}
.custom-list li{padding-left:24px;position:relative;color:var(--muted);font-size:15.5px}
.custom-list li::before{content:"🎨";position:absolute;left:0}
.custom-side{background:linear-gradient(140deg,#2c2216,#1a1209);border:1px solid var(--line-2);border-radius:22px;padding:36px;text-align:center;box-shadow:var(--shadow)}
.custom-side .emoji{font-size:64px;margin-bottom:20px;filter:drop-shadow(0 0 30px rgba(168,120,64,.4))}
.custom-side .mini{font-size:12.5px;color:var(--muted-2);margin-top:18px;line-height:1.9}
/* ===================== СТРАНИЦА ТОВАРА ===================== */
.product-main{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:64px;padding:44px 0 96px;align-items:start}
.gallery{position:sticky;top:110px}
.gallery-main{aspect-ratio:1/1;border-radius:22px;overflow:hidden;border:1px solid var(--line-2);background:radial-gradient(circle at 50% 30%,rgba(168,120,64,.18),transparent 65%),linear-gradient(160deg,#EDE4D8,#E0D5C5);display:grid;place-items:center;font-size:180px;box-shadow:var(--shadow);position:relative}
.gallery-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px}
.gallery-thumb{aspect-ratio:1/1;border-radius:12px;border:1px solid var(--line);background:linear-gradient(160deg,#EDE4D8,#E0D5C5);display:grid;place-items:center;font-size:36px;cursor:pointer;transition:.2s}
.gallery-thumb:hover{border-color:var(--gold)}
.gallery-thumb.is-active{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}
.info-tag{display:inline-block;font-family:var(--sans);font-size:12px;letter-spacing:.30em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:16px}
.info h1{font-size:clamp(38px,5.6vw,64px);margin-bottom:16px;line-height:1.05}
.rating{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--muted);margin-bottom:26px}
.rating .stars{color:#e8bb6a;letter-spacing:2px;font-size:16px}
.rating a{color:var(--muted);border-bottom:1px dashed var(--line-2);transition:.18s}
.rating a:hover{color:var(--gold-l);border-color:var(--gold-l)}
.price-line{display:flex;align-items:baseline;gap:14px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:26px}
.price-line .p{font-family:var(--serif);font-size:54px;color:var(--gold-l);line-height:1;letter-spacing:.01em}
.price-line .old{font-family:var(--sans);font-size:20px;color:var(--muted-2);text-decoration:line-through}
.price-line .tag{background:linear-gradient(180deg,#C89860,#A87840);color:#F5EFE6;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:600}
.product-actions{display:flex;gap:12px;margin-bottom:26px;flex-wrap:wrap}
.product-actions .btn-primary{flex:1;min-width:200px}
.stock{font-size:13.5px;color:var(--muted);padding:12px 16px;background:rgba(168,120,64,.06);border:1px solid var(--line);border-radius:12px;margin-bottom:30px}
.stock b{color:var(--gold-l)}
.specs{display:grid;grid-template-columns:1fr 1fr;gap:0 30px;margin-bottom:30px}
.specs div{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px dashed var(--line);font-family:var(--sans);font-size:17px;gap:12px}
.specs span:first-child{color:var(--muted-2)}
.specs span:last-child{color:var(--cream)}
.aroma{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.aroma span{padding:6px 12px;border-radius:999px;border:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.aroma span.on{color:var(--gold-l);border-color:var(--line-2);background:rgba(168,120,64,.08)}
.master-card{border:1px solid var(--line);border-radius:16px;padding:18px 20px;display:flex;align-items:center;gap:16px;background:rgba(255,255,255,.015);transition:.2s}
.master-card:hover{border-color:var(--line-2);background:rgba(168,120,64,.05)}
.master-card .ava{width:52px;height:52px;font-size:22px}
.master-card b{display:block;font-family:var(--serif);font-size:22px;font-weight:400}
.master-card span{font-family:var(--sans);font-size:15px;color:var(--muted)}
.master-card .go{margin-left:auto;color:var(--gold);font-size:18px}
.desc-section{padding:72px 0;border-top:1px solid var(--line)}
.desc-section h2{font-size:clamp(34px,4.6vw,52px);margin-bottom:22px;line-height:1.1}
.desc-section p{font-family:var(--sans);color:var(--muted);font-size:20px;margin-bottom:16px;max-width:800px;line-height:1.55}
.desc-section .lead{font-family:var(--serif);font-size:30px;color:var(--gold-l);font-style:normal;margin-bottom:24px;line-height:1.3}
.howto{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px}
.howto .step{padding:26px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,var(--card),var(--card-end))}
.howto .step b{display:block;font-family:var(--serif);font-size:48px;color:var(--gold);margin-bottom:10px;line-height:1}
.howto .step h4{font-family:var(--serif);font-size:24px;margin-bottom:8px;font-weight:400;line-height:1.15}
.howto .step p{font-size:14px;color:var(--muted)}
.review{padding:22px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,var(--card),var(--card-end));margin-bottom:16px}
.review-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px}
.review-head b{font-family:var(--serif);font-size:20px;font-weight:400}
.review-head .stars{color:#e8bb6a;font-size:14px;letter-spacing:1px}
.review-head .date{font-size:12px;color:var(--muted-2)}
.review p{font-family:var(--sans);font-size:18px;color:var(--muted);line-height:1.5}
/* ===== АДАПТИВ ===== */
@media(max-width:1080px){
.hero-in,.secret-grid,.lounge,.hall-hero-in,.about-grid,.custom-grid,.product-main{grid-template-columns:1fr;gap:44px}
.hero-visual{justify-content:flex-start}
.hero-frame{max-width:100%;aspect-ratio:16/10}
.g-4,.g-5,.g-6{grid-template-columns:repeat(3,1fr)}
.catalog{grid-template-columns:1fr}
.filters{position:static;max-height:none}
.cards-grid{grid-template-columns:repeat(3,1fr)}
.f-grid{grid-template-columns:1fr 1fr 1fr;gap:30px}
.gallery{position:static}
.subnav{position:static;backdrop-filter:none;background:transparent}
}
@media(max-width:820px){
.nav{display:none !important}.burger{display:grid;place-items:center}.header-act .desk{display:none}
.g-3{grid-template-columns:1fr}.section{padding:72px 0}
.hero{padding:60px 0 50px;min-height:auto}
.cards-grid{grid-template-columns:repeat(2,1fr)}
.howto{grid-template-columns:1fr}
.specs{grid-template-columns:1fr}
}
@media(max-width:620px){
.wrap{width:calc(100% - 28px)}
.g-4,.g-5,.g-6,.g-2{grid-template-columns:1fr}
.f-grid{grid-template-columns:1fr 1fr}
.hero h1{font-size:64px;letter-spacing:.04em}
.stats{gap:22px}.stat b{font-size:24px}
.modal{padding:28px 22px}
.blur-cards{grid-template-columns:1fr}
.cards-grid{grid-template-columns:1fr}
.price-line .p{font-size:34px}
.gallery-main{font-size:120px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
/* ================== КОРЗИНА — ТОВАРЫ ================== */
.drawer-body{align-items:stretch;place-items:stretch;display:block;padding:0;overflow-y:auto}
.cart-empty{display:grid;place-items:center;padding:60px 30px;text-align:center}
.cart-empty .empty-ico{font-size:52px;opacity:.5;margin-bottom:18px}
.cart-empty p{color:var(--muted);font-size:15px;margin-bottom:22px;line-height:1.6}
.cart-filled{padding:20px 24px 24px}
.cart-summary{font-family:var(--sans);font-size:13px;letter-spacing:.08em;color:var(--muted-2);text-transform:uppercase;margin-bottom:16px}
.cart-item{display:flex;gap:14px;padding:16px 0;border-top:1px solid var(--line)}
.cart-item:first-of-type{border-top:0}
.ci-img{width:64px;height:64px;border-radius:12px;flex-shrink:0;display:grid;place-items:center;font-size:28px;background:linear-gradient(140deg,#E0D5C5,#EDE4D8);border:1px solid var(--line)}
.ci-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.ci-info b{font-family:var(--serif);font-size:20px;font-weight:400;display:block;line-height:1.15}
.ci-info>span{font-family:var(--sans);font-size:15px;color:var(--muted-2)}
.ci-controls{display:flex;align-items:center;gap:8px;margin-top:8px}
.qty-btn{width:28px;height:28px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--cream);font-size:15px;display:grid;place-items:center;transition:.18s}
.qty-btn:hover{border-color:var(--gold);color:var(--gold-l)}
.qty{min-width:24px;text-align:center;font-size:14px;font-weight:600}
.ci-remove{margin-left:auto;color:var(--muted-2);font-size:12.5px;transition:.18s;background:transparent}
.ci-remove:hover{color:#d98b8b}
.cart-note{margin:20px 0;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(168,120,64,.05);color:var(--muted);font-size:13px;line-height:1.55}
.cart-totals{padding:22px 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.cart-totals>div{display:flex;justify-content:space-between;font-family:var(--sans);font-size:17px;color:var(--muted)}
.cart-totals b{color:var(--cream);font-weight:600}
.cart-totals .grand{padding-top:12px;border-top:1px dashed var(--line);font-size:16px}
.cart-totals .grand b{font-family:var(--serif);font-size:30px;color:var(--gold-l)}
.cart-actions{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.cart-actions .btn{width:100%}
.cart-empty.is-hidden,.cart-filled.is-hidden{display:none}
/* ================== ОФОРМЛЕНИЕ ЗАКАЗА ================== */
.order-modal{width:min(560px,100%);text-align:left;padding:32px 34px}
.order-modal h3{font-size:30px;margin-bottom:6px;line-height:1.1}
.order-modal .step-sub{font-family:var(--sans);color:var(--muted);font-size:17px;margin-bottom:22px}
.order-steps{display:flex;gap:6px;margin-bottom:26px}
.order-steps .s{flex:1;height:4px;border-radius:2px;background:var(--line)}
.order-steps .s.on{background:var(--gold)}
.order-modal .rlabel{display:flex;align-items:center;gap:12px;padding:13px 16px;border:1px solid var(--line);border-radius:12px;margin-bottom:10px;cursor:pointer;font-family:var(--sans);font-size:17px;transition:.18s;color:var(--cream)}
.order-modal .rlabel:hover{border-color:var(--line-2);background:rgba(168,120,64,.05)}
.order-modal .rlabel input{appearance:none;width:18px;height:18px;border-radius:50%;border:1px solid var(--line-2);position:relative;flex-shrink:0;transition:.15s}
.order-modal .rlabel input:checked{border-color:var(--gold);background:var(--gold);box-shadow:inset 0 0 0 3px #16100a}
.order-modal .input{width:100%;background:var(--input-bg);border:1px solid var(--line);border-radius:12px;padding:14px 16px;color:var(--cream);font-size:15px;outline:none;font-family:var(--sans);margin-bottom:12px;box-sizing:border-box}
.order-modal .input:focus{border-color:var(--gold)}
.order-modal .input::placeholder{color:var(--muted-2)}
.order-actions{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.order-actions .btn{flex:1;min-width:140px}
.order-success{text-align:center;padding:14px 0 4px}
.order-success .ico{font-size:64px;margin-bottom:16px;filter:drop-shadow(0 0 30px rgba(168,120,64,.45))}
.order-success h3{font-size:34px;margin-bottom:16px;line-height:1.1}
.order-success p{font-family:var(--sans);color:var(--muted);font-size:18px;line-height:1.6;margin-bottom:12px}
.order-success .strong{color:var(--gold-l);font-family:var(--serif);font-size:24px;font-style:normal;margin-top:16px}
/* ================== КАРТОЧКА ТОВАРА — ДОП. БЛОКИ ================== */
.tag-cloud{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0}
.tag-cloud a{padding:7px 14px;border-radius:999px;border:1px solid var(--line);font-size:13px;color:var(--muted);transition:.18s}
.tag-cloud a:hover{border-color:var(--gold);color:var(--gold-l);background:rgba(168,120,64,.08)}
.master-card-lg{display:flex;align-items:center;gap:20px;padding:26px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(140deg,rgba(36,28,20,.9),rgba(20,14,9,.9));transition:.22s;margin-top:36px}
.master-card-lg:hover{border-color:var(--line-2);background:linear-gradient(140deg,rgba(48,36,24,.95),rgba(24,17,10,.95))}
.master-card-lg .ava{width:64px;height:64px;font-size:26px}
.master-card-lg .mc-body{flex:1;min-width:0}
.master-card-lg b{font-family:var(--serif);font-size:26px;font-weight:400;display:block;margin-bottom:4px}
.master-card-lg span{font-family:var(--sans);font-size:16px;color:var(--muted-2);display:block;margin-bottom:10px}
.master-card-lg .quote{font-family:var(--serif);font-style:normal;font-size:22px;color:var(--gold-l);line-height:1.4}
.master-card-lg .mc-go{color:var(--gold);font-size:22px;flex-shrink:0}
.reviews-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:32px}
.review-stars{color:#e8bb6a;letter-spacing:2px}
.review-cta{margin-top:32px;text-align:center}
.review-cta .btn-line{opacity:.85}
/* пустые состояния каталога */
.catalog-empty{padding:80px 20px;text-align:center;color:var(--muted);font-size:16px;line-height:1.7}
.catalog-empty b{color:var(--gold-l);font-family:var(--serif);font-size:22px;display:block;margin-bottom:14px}
.catalog-more{margin-top:36px;text-align:center}
.catalog-more .btn{padding:16px 34px;font-size:15px}
/* ===== ЯРМАРКА — широкая карточка с подкатегориями ===== */
.hall-wide{grid-column:span 2}
.hall-subs{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 4px}
.hall-subs a{padding:5px 11px;border-radius:999px;border:1px solid var(--line);font-size:12.5px;color:var(--muted);transition:.18s;white-space:nowrap}
.hall-subs a:hover{border-color:var(--gold);color:var(--gold-l);background:rgba(168,120,64,.08)}
@media(max-width:820px){.hall-wide{grid-column:span 1}}
/* ===== Снежная пыль по всей странице ===== */
/* ================= СНЕЖИНКИ ПО КРАЯМ БЛОКОВ ================= */
/* Светящаяся «рамка» и снежинки в углах каждой карточки.
Убрать — просто удалить весь этот блок до конца файла. */
.card,
.prod, .pcard,
.why, .role, .story,
.master, .master-card, .master-card-lg,
.ship, .review,
.hall-hero-stats,
.filters, .catalog-head,
.cart-item, .order-modal .rlabel,
.modal, .search-modal
{
box-shadow:
0 0 0 1px rgba(168,120,64,.14) inset,
0 0 0 1px rgba(168,120,64,.08),
0 0 40px -10px rgba(168,120,64,.20),
0 18px 45px -30px rgba(43,38,32,.28);
position: relative;
}
/* Сами снежинки — по 4 углам, чуть снаружи рамки */
/* .card::after off */ .no-snow,
.no-snow2,
.no-snow3,
.no-snow4,
.no-snow5 {
content: "";
position: absolute;
inset: -8px;
pointer-events: none;
border-radius: inherit;
background-image:
url("data:image/svg+xml;utf8,"),
url("data:image/svg+xml;utf8,"),
url("data:image/svg+xml;utf8,"),
url("data:image/svg+xml;utf8,");
background-repeat: no-repeat;
background-position:
-8px -8px,
calc(100% + 8px) -8px,
-8px calc(100% + 8px),
calc(100% + 8px) calc(100% + 8px);
background-size: 22px 22px, 22px 22px, 22px 22px, 22px 22px;
opacity: .55;
z-index: 3;
filter: drop-shadow(0 0 6px rgba(168,120,64,.55));
animation: snow-twinkle 4.5s ease-in-out infinite;
}
/* Разная задержка, чтобы мигали вразнобой */
.card:nth-child(2n)::after, .prod:nth-child(2n)::after, .why:nth-child(2n)::after { animation-delay: .8s; }
.card:nth-child(3n)::after, .prod:nth-child(3n)::after, .why:nth-child(3n)::after { animation-delay: 1.6s; }
.card:nth-child(5n)::after, .prod:nth-child(5n)::after, .why:nth-child(5n)::after { animation-delay: 2.4s; }
@keyframes snow-twinkle {
0%,100% { opacity:.45; filter: drop-shadow(0 0 4px rgba(168,120,64,.35)); }
50% { opacity:.85; filter: drop-shadow(0 0 10px rgba(168,120,64,.75)); }
}
@media(prefers-reduced-motion:reduce){
/* .card::after off */ .no-snow, .no-snow2, .no-snow3,
.no-snow4,
.no-snow5 { animation: none; opacity:.55; }
}
/* ====== Адаптация курсива под узкие экраны ====== */
@media(max-width:620px){
body{font-size:18px}
.hero h1{font-size:64px}
.h-sec{font-size:36px}
.prod-body h4,.pcard-body h4{font-size:20px}
.info h1{font-size:34px}
.price-line .p{font-size:38px}
.desc-section .lead{font-size:22px}
.btn{font-size:17px;padding:13px 24px}
}
/* ================== ЗНАКОМСТВА ================== */
.dating-hero{padding:44px 0 32px}
.dating-hero h1{font-size:clamp(38px,6vw,68px);margin-bottom:18px;line-height:1.05}
.dating-hero .sub{max-width:680px}
.dating-hero-stats{display:flex;flex-wrap:wrap;gap:32px;padding-top:22px;border-top:1px solid var(--line);margin-top:26px;max-width:680px}
.dating-wrap{display:grid;grid-template-columns:280px minmax(0,1fr);gap:36px;align-items:start;padding:40px 0 96px}
.dating-filters{position:sticky;top:110px;max-height:calc(100vh - 130px);overflow-y:auto;padding-right:8px}
.dating-filters::-webkit-scrollbar{width:6px}
.dating-filters::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:3px}
.dating-filters h3{font-size:26px;margin-bottom:20px}
.dfgroup{border-top:1px solid var(--line);padding:22px 0}
.dfgroup h4{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;font-family:var(--sans);font-weight:600}
.dfgroup label{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:16px;color:var(--muted);cursor:pointer;transition:.18s;font-family:var(--sans)}
.dfgroup label:hover{color:var(--gold-l)}
.dfgroup input[type=checkbox],
.dfgroup input[type=radio]{appearance:none;width:16px;height:16px;border:1px solid var(--line-2);position:relative;flex-shrink:0;transition:.18s;background:transparent;border-radius:4px}
.dfgroup input[type=radio]{border-radius:50%}
.dfgroup input:checked{background:var(--gold);border-color:var(--gold)}
.dfgroup input[type=checkbox]:checked::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#1a1206;font-size:11px;font-weight:700}
.dfgroup input[type=radio]:checked::after{content:"";position:absolute;inset:3px;border-radius:50%;background:#1a1206}
.dfgroup select,.dfgroup input[type=text],.dfgroup input[type=number]{width:100%;background:transparent;border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--cream);font-size:15px;outline:none;font-family:var(--sans)}
.dfgroup select:focus,.dfgroup input:focus{border-color:var(--gold)}
.age-range{display:flex;align-items:center;gap:10px}
.age-range input{width:100%}
.age-range span{color:var(--muted-2);font-size:14px}
.interests-cloud{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.interests-cloud label{padding:6px 12px;border-radius:999px;border:1px solid var(--line);font-size:14px;color:var(--muted);cursor:pointer;transition:.18s;font-family:var(--sans);display:inline-block}
.interests-cloud label:hover{border-color:var(--gold-l);color:var(--gold-l)}
.interests-cloud input{display:none}
.interests-cloud input:checked + span{color:#1a1206;font-weight:600}
.interests-cloud label:has(input:checked){background:linear-gradient(180deg,#C89860,#A87840);border-color:var(--gold);color:#F5EFE6}
.dating-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.dating-head .count{font-size:16px;color:var(--muted)}
.dating-head .count b{color:var(--gold-l)}
.dating-head select{background:transparent;border:1px solid var(--line);border-radius:10px;padding:10px 14px;color:var(--cream);font-size:15px;font-family:var(--sans);outline:none}
.dating-head select:focus{border-color:var(--gold)}
.profiles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.profile-card{background:linear-gradient(180deg,var(--card),var(--card-end));border:1px solid var(--line);border-radius:20px;overflow:hidden;transition:.25s;position:relative;display:flex;flex-direction:column}
.profile-card:hover{transform:translateY(-5px);border-color:var(--line-2);box-shadow:0 22px 50px rgba(0,0,0,.45)}
.profile-avatar{aspect-ratio:1/1;display:grid;place-items:center;font-size:96px;background:radial-gradient(circle at 50% 30%,rgba(168,120,64,.18),transparent 65%),linear-gradient(160deg,#EDE4D8,#E0D5C5);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.profile-avatar img{width:100%;height:100%;object-fit:cover}
.profile-badge{position:absolute;top:12px;left:12px;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:600;background:rgba(10,7,4,.78);backdrop-filter:blur(6px);border:1px solid var(--line);color:var(--cream);z-index:2;font-family:var(--sans)}
.profile-badge.online{color:#8ee3a0;border-color:rgba(142,227,160,.4)}
.profile-badge.online::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#8ee3a0;margin-right:6px;vertical-align:middle;box-shadow:0 0 8px #8ee3a0}
.profile-body{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}
.profile-body h4{font-family:var(--serif);font-size:26px;font-weight:400;line-height:1.1}
.profile-meta{font-size:14px;color:var(--muted-2);font-family:var(--sans);letter-spacing:.02em}
.profile-bio{font-size:16px;color:var(--muted);line-height:1.45;font-family:var(--sans);flex:1}
.profile-interests{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px}
.profile-interests span{padding:4px 10px;border-radius:999px;background:rgba(168,120,64,.10);border:1px solid var(--line);font-size:13px;color:var(--gold-l);font-family:var(--sans)}
.profile-actions{display:flex;gap:8px;margin-top:12px}
.profile-actions .btn{flex:1;padding:12px 16px;font-size:16px;border-radius:12px}
.like-btn{width:52px;height:48px;border-radius:12px;border:1px solid var(--line-2);background:transparent;color:var(--cream);font-size:20px;transition:.18s;flex:0 0 auto;display:grid;place-items:center}
.like-btn:hover{border-color:var(--gold);color:var(--gold-l)}
.like-btn.is-liked{background:linear-gradient(180deg,#C89860,#A87840);color:#F5EFE6;border-color:var(--gold)}
.dating-empty{grid-column:1/-1;text-align:center;padding:80px 20px;color:var(--muted);font-family:var(--sans);font-size:17px;line-height:1.7}
.dating-empty b{color:var(--gold-l);font-family:var(--serif);font-size:24px;display:block;margin-bottom:12px}
/* Модалка профиля */
.profile-modal{width:min(720px,100%);text-align:left;padding:0;overflow:hidden;max-height:88vh;display:flex;flex-direction:column}
.pm-head{padding:30px 34px 22px;border-bottom:1px solid var(--line);display:flex;gap:22px;align-items:center;position:relative}
.pm-avatar{width:96px;height:96px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-size:48px;background:linear-gradient(140deg,#E0D5C5,#EDE4D8);border:1px solid var(--line-2)}
.pm-name{flex:1;min-width:0}
.pm-name h3{font-size:36px;margin-bottom:4px;line-height:1.05}
.pm-name .role{font-size:16px;color:var(--muted);font-family:var(--sans)}
.pm-close{position:absolute;top:16px;right:16px;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--cream);font-size:18px;display:grid;place-items:center;cursor:pointer}
.pm-close:hover{border-color:var(--gold);color:var(--gold-l)}
.pm-body{padding:24px 34px;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:20px}
.pm-row{display:grid;grid-template-columns:140px 1fr;gap:16px;font-size:16px;font-family:var(--sans)}
.pm-row .lbl{color:var(--muted-2);font-size:14px;letter-spacing:.04em;text-transform:uppercase;padding-top:2px}
.pm-row .val{color:var(--cream)}
.pm-bio{font-family:var(--serif);font-size:22px;color:var(--gold-l);line-height:1.45;padding:18px 22px;border-left:3px solid var(--gold);background:rgba(168,120,64,.05);border-radius:0 14px 14px 0}
.pm-interests{display:flex;flex-wrap:wrap;gap:7px}
.pm-interests span{padding:6px 12px;border-radius:999px;background:rgba(168,120,64,.10);border:1px solid var(--line);font-size:14px;color:var(--gold-l);font-family:var(--sans)}
.pm-foot{padding:20px 34px 26px;border-top:1px solid var(--line);display:flex;gap:12px;flex-wrap:wrap}
.pm-foot .btn{flex:1;min-width:180px}
.pm-msg-form{display:flex;gap:10px;width:100%}
.pm-msg-form input{flex:1;background:var(--input-bg);border:1px solid var(--line);border-radius:999px;padding:14px 20px;color:var(--cream);font-size:16px;outline:none;font-family:var(--sans)}
.pm-msg-form input:focus{border-color:var(--gold)}
.pm-msg-sent{color:#8ee3a0;font-size:15px;font-family:var(--sans);padding:12px 0}
.dating-count-note{padding:20px 0;color:var(--muted-2);font-size:15px;font-family:var(--sans);text-align:center}
@media(max-width:1080px){
.dating-wrap{grid-template-columns:1fr}
.dating-filters{position:static;max-height:none}
.profiles-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
.profiles-grid{grid-template-columns:1fr}
.pm-row{grid-template-columns:1fr;gap:4px}
.pm-head{padding:24px 22px;flex-direction:column;text-align:center;gap:14px}
.pm-body{padding:22px}
.pm-foot{padding:18px 22px 22px}
}
/* ====== ГОСТИНАЯ — подразделы ====== */
.lounge-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:6px}
.hub-tile{
padding:16px 18px;border:1px solid var(--line);border-radius:14px;
background:rgba(255,255,255,.02);transition:.22s;display:flex;flex-direction:column;gap:6px;
}
.hub-tile:hover{border-color:var(--gold);background:rgba(168,120,64,.08);transform:translateY(-3px)}
.hub-tile .ico{font-size:26px}
.hub-tile b{font-family:var(--serif);font-size:22px;font-weight:400;color:var(--cream);line-height:1.1}
.hub-tile span{font-size:14px;color:var(--muted-2);font-family:var(--sans);line-height:1.4}
/* ====== ОБЩИЕ КАРТОЧКИ для каналов/чатов/клипов/стримов ====== */
.channel-card{display:flex;gap:18px;padding:22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,var(--card),var(--card-end));transition:.22s}
.channel-card:hover{border-color:var(--line-2);transform:translateY(-3px)}
.channel-ava{width:70px;height:70px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-size:32px;background:linear-gradient(140deg,#E0D5C5,#EDE4D8);border:1px solid var(--line-2);font-family:var(--serif);color:var(--gold-l)}
.channel-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.channel-body h4{font-family:var(--serif);font-size:26px;font-weight:400;line-height:1.1}
.channel-meta{font-size:14px;color:var(--muted-2);font-family:var(--sans)}
.channel-text{font-size:17px;color:var(--muted);font-family:var(--sans);line-height:1.45}
.channel-foot{display:flex;gap:10px;margin-top:6px;flex-wrap:wrap}
.clip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.clip{aspect-ratio:9/16;border-radius:18px;overflow:hidden;position:relative;background:linear-gradient(160deg,#EDE4D8,#E0D5C5);border:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;padding:14px;transition:.22s;cursor:pointer}
.clip:hover{transform:translateY(-4px);border-color:var(--gold)}
.clip::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 30%,rgba(168,120,64,.22),transparent 60%);pointer-events:none}
.clip-emoji{position:absolute;inset:0;display:grid;place-items:center;font-size:64px;pointer-events:none;opacity:.55}
.clip-top{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start}
.clip-badge{padding:5px 10px;border-radius:999px;font-size:12px;font-weight:600;background:rgba(10,7,4,.75);backdrop-filter:blur(6px);border:1px solid var(--line);font-family:var(--sans);color:var(--cream)}
.clip-info{position:relative;z-index:2}
.clip-info b{display:block;font-family:var(--serif);font-size:22px;font-weight:400;line-height:1.1;margin-bottom:4px}
.clip-info span{font-size:13px;color:var(--muted-2);font-family:var(--sans)}
.stream-card{padding:24px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,var(--card),var(--card-end));transition:.22s;display:flex;flex-direction:column;gap:14px}
.stream-card:hover{border-color:var(--line-2);transform:translateY(-3px)}
.stream-head{display:flex;align-items:center;gap:14px}
.stream-live{padding:5px 10px;border-radius:999px;background:#c0392b;color:#fff;font-size:11px;font-weight:700;letter-spacing:.08em;font-family:var(--sans);text-transform:uppercase;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.55}}
.stream-ava{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-size:24px;background:linear-gradient(140deg,#E0D5C5,#EDE4D8);border:1px solid var(--line-2);color:var(--gold-l);font-family:var(--serif);flex-shrink:0}
.stream-title{font-family:var(--serif);font-size:24px;line-height:1.15;font-weight:400}
.stream-meta{font-size:14px;color:var(--muted-2);font-family:var(--sans)}
.stream-preview{aspect-ratio:16/9;border-radius:14px;background:linear-gradient(140deg,#3a2c1d,#1f160d);display:grid;place-items:center;font-size:52px;position:relative;border:1px solid var(--line)}
.stream-preview::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(168,120,64,.16),transparent 60%)}
.section-tabs{display:flex;gap:8px;padding:14px 0;border-bottom:1px solid var(--line);margin-bottom:32px;overflow-x:auto}
.section-tabs a{padding:10px 20px;border-radius:999px;font-size:16px;color:var(--muted);border:1px solid var(--line);transition:.18s;font-family:var(--sans);white-space:nowrap}
.section-tabs a:hover{border-color:var(--gold-l);color:var(--gold-l)}
.section-tabs a.is-active{background:linear-gradient(180deg,#C89860,#A87840);color:#F5EFE6;border-color:var(--gold);font-weight:600}
/* ================= ТЁМНЫЕ СЕКЦИИ — СВЕТЛЫЙ ТЕКСТ ================= */
/* Hero (главная) */
.hero .hero-kicker {color:#A87840;}
.hero h1 {color:#A87840;}
.hero .hero-sub {color:#F5EFE6;}
.hero .hero-text {color:#E8E2D5;}
.hero .stat b {color:#A87840;}
.hero .stat span {color:#B9AFC0;}
.hero .deliv-line {color:#B9AFC0;}
.hero .stats {border-top-color:rgba(232,226,213,.20);}
.hero .hero .hero .btn-ghost {color:#E8E2D5;border-color:rgba(232,226,213,.35);}
.hero .btn-ghost:hover {color:#F5EFE6;border-color:#A87840;background:rgba(168,120,64,.14);}
/* CTA (финальный призыв) */
.cta h2 {color:#A87840;}
.cta p {color:#E8E2D5;}
.cta .strong {color:#F5EFE6;}
.cta .btn-ghost {color:#E8E2D5;border-color:rgba(232,226,213,.35);}
.cta .btn-ghost:hover {color:#F5EFE6;border-color:#A87840;}
/* Тайная комната */
#secret .kicker {color:#C89860;}
#secret h2 {color:#A87840;}
#secret .secret-text {color:#E8E2D5;}
#secret .mini-note {color:#B9AFC0;}
/* Гостиная */
#lounge .kicker {color:#C89860;}
#lounge h2 {color:#A87840;}
#lounge p {color:#E8E2D5;}
#lounge .accent {color:#A87840;font-family:var(--serif);font-size:21px;font-style:italic;}
#lounge .mini-note {color:#B9AFC0;}
#lounge .hub-tile {border-color:rgba(232,226,213,.15);background:rgba(245,239,230,.05);}
#lounge .hub-tile:hover {border-color:#A87840;background:rgba(168,120,64,.12);}
#lounge .hub-tile b {color:#F5EFE6;}
#lounge .hub-tile span {color:#B9AFC0;}
/* ================= КОМНАТНЫЕ ПОДЛОЖКИ (room-hero) ================= */
/* Адаптив для светлой темы */
@media(max-width:820px){
}
/* ================= ТЁМНАЯ ТЕМА (кнопка) ================= */
html.dark{
--bg:#1A1714;
--bg-2:#241F1A;
--panel:#2B241D;
--card:#231E19;
--card-2:#2F2820;
--card-end:#1F1A15;
--line:rgba(232,226,213,.14);
--line-2:rgba(232,226,213,.32);
--gold:#D4AF7A;
--gold-l:#E8C89A;
--cream:#E8E2D5;
--muted:#B9AFC0;
--muted-2:#8E8298;
--flame:#E8B66A;
--wine:#8B3D59;
--shadow:0 24px 60px rgba(0,0,0,.55);
--header-bg:rgba(26,23,20,.88);
--header-bg-scrolled:rgba(20,17,14,.98);
--overlay-bg:rgba(10,7,4,.86);
--scrim-bg:rgba(10,7,4,.60);
--modal-bg:linear-gradient(180deg,#2B241D,#1F1A15);
--drawer-bg:#231E19;
--input-bg:#2B241D;
}
html.dark body::before{
background:radial-gradient(1000px 700px at 15% -10%,rgba(212,175,122,.14),transparent 62%),
radial-gradient(800px 600px at 90% 8%,rgba(180,140,80,.10),transparent 65%),
radial-gradient(1000px 800px at 50% 110%,rgba(212,175,122,.08),transparent 60%);
}
html.dark
/* Карточки */
html.dark .card,
html.dark .prod, html.dark .pcard,
html.dark .why, html.dark .role, html.dark .story,
html.dark .master, html.dark .master-card, html.dark .master-card-lg,
html.dark .ship, html.dark .review,
html.dark .channel-card, html.dark .stream-card,
html.dark .profile-card, html.dark .clip, html.dark .hub-tile{
background:linear-gradient(180deg,var(--card),var(--card-end));
}
/* Аватары и превью */
html.dark .prod-img,
html.dark .pcard-img,
html.dark .ci-img,
html.dark .channel-ava,
html.dark .stream-ava,
html.dark .ava,
html.dark .pm-avatar,
html.dark .gallery-main,
html.dark .gallery-thumb,
html.dark .stream-preview,
html.dark .master-card .ava{
background:radial-gradient(circle at 50% 30%,rgba(212,175,122,.18),transparent 65%),
linear-gradient(160deg,#2F2820,#1F1A15);
color:var(--gold-l);
}
/* Секции с фото — всегда тёмные, но чуть глубже */
html.dark .hero-bg{
background:linear-gradient(90deg,rgba(10,7,4,.88) 0%,rgba(10,7,4,.66) 45%,rgba(10,7,4,.44) 75%,rgba(10,7,4,.82) 100%),
linear-gradient(180deg,rgba(10,7,4,.58) 0%,transparent 40%,rgba(10,7,4,.88) 100%),
url('../img/hero.jpg?v=92fc4751') center/cover no-repeat,
radial-gradient(circle at 30% 40%,#2B1F2E,#150E18 70%);
}
html.dark .cta-bg{
background:linear-gradient(180deg,rgba(10,7,4,.88),rgba(10,7,4,.96)),url('../img/hero.jpg?v=92fc4751') center/cover no-repeat,radial-gradient(circle at 50% 50%,#2B1F2E,#150E18);
}
/* Кнопки, ссылки */
html.dark .btn-ghost{color:var(--cream);border-color:var(--line-2);background:rgba(255,255,255,.02);}
html.dark .btn-ghost:hover{color:var(--gold-l);border-color:var(--gold);background:rgba(212,175,122,.12);}
html.dark .btn-line{color:var(--gold);border-color:var(--line);}
html.dark .btn-line:hover{background:rgba(212,175,122,.14);border-color:var(--gold);}
html.dark .link-more{color:var(--gold);border-bottom-color:var(--line-2);}
html.dark .link-more:hover{color:var(--gold-l);}
/* Прочее */
html.dark .mobile-nav{display:none;position:fixed;inset:98px 0 0;background:rgba(12,9,6,.98);z-index:55;padding:28px 20px;overflow:auto}
html.dark .subnav{background:rgba(26,23,20,.88);}
html.dark .about-hall{background:linear-gradient(180deg,rgba(36,31,26,.9),rgba(26,23,20,.95));}
html.dark .custom-block{background:radial-gradient(700px 400px at 20% 0%,rgba(140,80,60,.22),transparent 65%),linear-gradient(180deg,rgba(36,31,26,.9),rgba(20,17,14,.95));}
html.dark .custom-side{background:linear-gradient(140deg,#2F2820,#1F1A15);}
html.dark .search-input{color:var(--cream);}
html.dark .order-modal .input,
html.dark .pm-msg-form input{background:var(--input-bg);color:var(--cream);}
html.dark .dfgroup input[type=text],
html.dark .dfgroup input[type=number],
html.dark .dfgroup select,
html.dark .dating-head select,
html.dark .catalog-head select{background:var(--input-bg);color:var(--cream);border-color:var(--line);}
html.dark .f-col a{color:var(--muted);}
html.dark .f-ship,html.dark .f-bottom{color:var(--muted-2);}
html.dark .section-tabs a{color:var(--muted);border-color:var(--line);}
html.dark .section-tabs a:hover{border-color:var(--gold);color:var(--gold-l);}
html.dark .cart-note{background:rgba(212,175,122,.06);border-color:var(--line);}
html.dark .story-quote{color:var(--muted);border-left-color:var(--line-2);}
html.dark .master-card .go,
html.dark .master-card-lg .mc-go{color:var(--gold);}
html.dark .pm-row .lbl,
html.dark .profile-meta,
html.dark .channel-meta,
html.dark .stream-meta,
html.dark .prod-meta,
html.dark .pcard-spec{color:var(--muted-2);}
/* Переключатель темы */
#themeToggle{font-size:18px;line-height:1;transition:transform .25s ease}
#themeToggle:hover{transform:rotate(-12deg)}
/* Тёмная тема — «ЗАМОК» ярче */
html.dark .logo b,
html.dark .f-brand b{
background:linear-gradient(180deg,#F0D9A8 0%,#D8B584 50%,#A87840 100%);
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
filter:drop-shadow(0 2px 8px rgba(240,217,168,.35)) drop-shadow(0 0 22px rgba(200,160,100,.25));
}
html.dark .logo span{font-family:"Philosopher",serif;font-style:italic;font-size:9.5px;letter-spacing:.32em;color:var(--gold,#C89B5A);text-transform:uppercase;margin-top:6px;font-weight:400}
html.dark .hero h1{
background:linear-gradient(180deg,#FFE8BE 0%,#E8C89A 40%,#C89860 75%,#A87840 100%);
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
filter:drop-shadow(0 6px 24px rgba(0,0,0,.75)) drop-shadow(0 0 80px rgba(216,181,132,.40));
}
.btn-primary:active{background:#A87A3A;transform:translateY(0)}
/* ===================== АКЦЕНТЫ 11 КОМНАТ ===================== */
:root{
--room-yarmarka: #C89B5A; /* 🛒 Ярмарка — золото */
--room-masterskaya: #C08878; /* 🛠 Мастерская — тёплый кирпич */
--room-svechi: #E0A87A; /* 🕯 Зал Свечей — тёплый мёд */
--room-mylnya: #A8C0D8; /* 🎁 Мыльня — небесный */
--room-galereya: #C0B8A8; /* 🗿 Галерея — песочный камень */
--room-altar: #D8A878; /* 🔥 Алтарь — тёплая корица */
--room-gostinaya: #C8A878; /* 💌 Гостиная — тёплый янтарь */
--room-bashnya: #A8B0C0; /* 📜 Башня — туманный синий */
--room-sokrov: #B8B0C0; /* 💎 Сокровищница — тёплое серебро */
--room-taynaya: #8A7068; /* 🔞 Тайная — пыльный шоколад */
--room-baraholka: #B8D0B8; /* 🏷️ Барахолка — нежно-зелёный */
}
/* Классы применения: */
body.room-svechi { --accent:#E0A87A; --accent-hover:#E8B88A; --accent-press:#C89868; }
body.room-mylnya { --accent:#A8C0D8; --accent-hover:#B8D0E8; --accent-press:#88A0B8; }
body.room-galereya { --accent:#C0B8A8; --accent-hover:#D0C8B8; --accent-press:#A09888; }
body.room-altar { --accent:#D8A878; --accent-hover:#E8B888; --accent-press:#B88858; }
body.room-sokrov { --accent:#B8B0C0; --accent-hover:#C8C0D0; --accent-press:#9890A0; }
body.room-masterskaya{ --accent:#C08878; --accent-hover:#D09888; --accent-press:#A06858; }
body.room-yarmarka { --accent:#C89B5A; --accent-hover:#D8B078; --accent-press:#A87A3A; }
body.room-baraholka { --accent:#B8D0B8; --accent-hover:#C8E0C8; --accent-press:#98B098; }
body.room-gostinaya { --accent:#C8A878; --accent-hover:#D8B888; --accent-press:#A88858; }
body.room-bashnya { --accent:#A8B0C0; --accent-hover:#B8C0D0; --accent-press:#8890A0; }
body.room-taynaya { --accent:#8A7068; --accent-hover:#9A8078; --accent-press:#6A5058; }
/* Автоматическое применение акцента */
body[class*="room-"] .btn-primary{background:var(--accent);color:#FAF6F0}
body[class*="room-"] .btn-primary:hover{background:var(--accent-hover)}
body[class*="room-"] .kicker{color:var(--accent)}
body[class*="room-"] .link-more{color:var(--accent);border-bottom-color:var(--accent)}
body[class*="room-"] .btn-line{color:var(--accent);border-color:var(--accent)}
body[class*="room-"] .subnav a.is-active{background:var(--accent);color:#FAF6F0}
/* Тёмная тема — исключение для Тайной комнаты */
body.room-taynaya{
--bg:#2A2528; --bg-2:#332D30;
--panel:#3A3030; --card:#3A3030; --card-2:#4A4040;
--line:#4A4040; --line-2:#5A5050;
--cream:#F2EBE0; --muted:#E8DFD0; --muted-2:#B8AFA0; --muted-3:#9A9088;
}
/* ===== КАРТА ЗОН (главная) ===== */
.map-zones{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}
.map-zone{padding:20px 22px;border:1px solid var(--line);border-radius:12px;background:var(--card);
transition:.2s;display:flex;flex-direction:column;gap:6px}
.map-zone:hover{border-color:var(--gold);box-shadow:0 6px 18px rgba(42,37,32,.08)}
.map-zone b{font-family:var(--serif);font-size:18px;color:var(--cream);font-weight:600}
.map-zone span{font-size:13.5px;color:var(--muted-2);font-family:var(--sans)}
@media(max-width:820px){.map-zones{grid-template-columns:1fr}}
/* ===== HUB-TILE (пять/три двери) ===== */
.lounge-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-top:6px}
.hub-tile{padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--card);
transition:.2s;display:flex;flex-direction:column;gap:8px}
.hub-tile:hover{border-color:var(--gold);box-shadow:0 8px 22px rgba(42,37,32,.08);transform:translateY(-2px)}
.hub-tile .ico{font-size:26px}
.hub-tile b{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--cream)}
.hub-tile span{font-size:13.5px;color:var(--muted-2);line-height:1.5;font-family:var(--sans)}
/* ===== CLIP GRID ===== */
.clip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:8px}
.clip{aspect-ratio:9/16;border-radius:12px;overflow:hidden;position:relative;
background:linear-gradient(160deg,#F2EBE0,#E8DFD0);border:1px solid var(--line);
display:flex;flex-direction:column;justify-content:space-between;padding:14px;
transition:.2s;text-decoration:none;color:inherit}
.clip:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 10px 26px rgba(42,37,32,.10)}
.clip-emoji{position:absolute;inset:0;display:grid;place-items:center;font-size:64px;opacity:.35;pointer-events:none}
.clip-top{position:relative;z-index:2;display:flex;justify-content:space-between}
.clip-badge{padding:4px 9px;border-radius:6px;font-size:11.5px;font-weight:600;
background:rgba(42,37,32,.72);color:#FAF6F0;font-family:var(--sans)}
.clip-info{position:relative;z-index:2}
.clip-info b{display:block;font-family:var(--serif);font-size:16px;font-weight:600;
color:var(--cream);line-height:1.25;margin-bottom:4px}
.clip-info span{font-size:12px;color:var(--muted-2);font-family:var(--sans)}
@media(max-width:820px){.clip-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.clip-grid{grid-template-columns:1fr}}
/* ===== HERO — светлая база для фото ===== */
.hero-bg{
background:linear-gradient(90deg,rgba(20,14,10,.72) 0%,rgba(20,14,10,.42) 45%,
rgba(20,14,10,.25) 75%,rgba(20,14,10,.62) 100%),
linear-gradient(180deg,rgba(20,14,10,.40) 0%,transparent 40%,rgba(20,14,10,.78) 100%),
url('../img/hero.jpg?v=92fc4751') center/cover no-repeat,
radial-gradient(circle at 30% 40%,#8B6B44,#FAF6F0 70%);
}
.hero h1{color:#FAF6F0}
.hero-sub{color:#E8DFD0;font-family:var(--serif);font-size:22px;font-style:normal;margin-bottom:18px}
.hero-text{color:#E8DFD0}
.hero .hero .hero .stat b{color:#FAF6F0}
.hero .stat span{color:#D4C8B8}
.hero .deliv-line{color:#D4C8B8}
.hero .stats{border-top-color:rgba(250,246,240,.20)}
.hero .btn-ghost{color:#FAF6F0;border-color:rgba(250,246,240,.45);background:rgba(250,246,240,.06)}
.hero .btn-ghost:hover{border-color:var(--gold);background:rgba(200,155,90,.18);color:#FAF6F0}
/* Тайная комната — приглушённая тёмная база для тизера */
.secret{background:linear-gradient(180deg,#3A3030,#2A2528);color:#E8DFD0}
.secret h2{color:#F2EBE0}
.secret .secret-text{color:#E8DFD0}
.secret .kicker{color:#C08878}
/* CTA */
.cta .cta-bg{background:linear-gradient(180deg,rgba(20,14,10,.72),rgba(20,14,10,.92)),
url('../img/hero.jpg?v=92fc4751') center/cover no-repeat,radial-gradient(circle at 50% 50%,#8B6B44,#2A2520)}
.cta h2{color:#FAF6F0}
.cta p{color:#E8DFD0}
.cta .strong{color:var(--gold-l)}
.cta .kicker{color:var(--gold)}
.cta .btn-ghost{color:#FAF6F0;border-color:rgba(250,246,240,.45)}
.cta .btn-ghost:hover{border-color:var(--gold);color:#FAF6F0;background:rgba(200,155,90,.18)}
/* ================== ФОРМА РЕГИСТРАЦИИ ================== */
.reg-modal{
width:min(560px,100%);text-align:left;padding:0;overflow:hidden;
max-height:92vh;display:flex;flex-direction:column;
background:var(--card);
}
.reg-head{
padding:24px 32px 18px;border-bottom:1px solid var(--line);
display:flex;align-items:center;justify-content:space-between;gap:16px;
position:relative;
}
.reg-head h3{font-family:var(--serif);font-size:24px;font-weight:600;color:var(--cream)}
.reg-head .close{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);
background:transparent;color:var(--cream);font-size:16px;display:grid;place-items:center;cursor:pointer;transition:.18s}
.reg-head .close:hover{border-color:var(--gold);color:var(--gold-l)}
.reg-steps{display:flex;gap:6px;padding:16px 32px 0}
.reg-steps .s{flex:1;height:4px;border-radius:2px;background:var(--line)}
.reg-steps .s.on{background:var(--gold)}
.reg-body{padding:22px 32px 26px;overflow-y:auto;flex:1}
.reg-body h4{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--cream);margin-bottom:6px}
.reg-body .hint{font-size:14px;color:var(--muted-2);margin-bottom:20px;line-height:1.55;font-family:var(--sans)}
.reg-field{margin-bottom:14px}
.reg-field label{display:block;font-family:var(--sans);font-size:13px;font-weight:500;
color:var(--muted);margin-bottom:6px;letter-spacing:.02em}
.reg-field input{
width:100%;background:var(--bg);border:1px solid var(--line);
border-radius:10px;padding:13px 16px;color:var(--cream);
font-family:var(--sans);font-size:15px;outline:none;transition:.18s;
box-sizing:border-box;
}
.reg-field input:focus{border-color:var(--gold);background:#fff}
.reg-field input.is-error{border-color:#C08878;background:rgba(192,136,120,.05)}
.reg-field .err{font-size:12.5px;color:#C08878;margin-top:5px;font-family:var(--sans);display:none}
.reg-field.has-error .err{display:block}
.reg-field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.reg-code{
display:flex;gap:8px;justify-content:center;margin:6px 0 18px;
}
.reg-code input{
width:52px;height:60px;text-align:center;font-family:var(--serif);
font-size:26px;font-weight:600;color:var(--cream);
background:var(--bg);border:1px solid var(--line);border-radius:10px;
outline:none;transition:.18s;padding:0;
}
.reg-code input:focus{border-color:var(--gold);background:#fff}
.reg-resend{font-size:13.5px;color:var(--muted-2);text-align:center;margin-bottom:16px;font-family:var(--sans)}
.reg-resend button{color:var(--gold);background:transparent;border:0;cursor:pointer;
font-family:var(--sans);font-size:13.5px;text-decoration:underline;padding:0}
.reg-resend button:disabled{color:var(--muted-2);cursor:not-allowed;text-decoration:none}
.reg-actions{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.reg-actions .btn{flex:1;min-width:140px}
.reg-success{text-align:center;padding:20px 0 8px}
.reg-success .ico{font-size:56px;margin-bottom:14px}
.reg-success h4{font-size:24px;margin-bottom:10px}
.reg-success p{color:var(--muted-2);font-size:15px;line-height:1.6;margin-bottom:8px;font-family:var(--sans)}
.reg-success .nick{color:var(--gold);font-family:var(--serif);font-size:20px;margin-top:14px}
.reg-footer-link{
text-align:center;padding:14px 32px 22px;font-family:var(--sans);
font-size:14px;color:var(--muted-2);border-top:1px solid var(--line);
}
.reg-footer-link a{color:var(--gold);cursor:pointer;text-decoration:underline}
.reg-footer-link a:hover{color:var(--gold-l)}
/* Индикатор надёжности пароля */
.pwd-meter{display:flex;gap:4px;margin-top:6px}
.pwd-meter .b{flex:1;height:4px;border-radius:2px;background:var(--line);transition:.2s}
.pwd-meter.s1 .b:nth-child(1){background:#C08878}
.pwd-meter.s2 .b:nth-child(-n+2){background:#D8A878}
.pwd-meter.s3 .b:nth-child(-n+3){background:#C89B5A}
.pwd-meter.s4 .b{background:#98B098}
.pwd-hint{font-size:12px;color:var(--muted-2);margin-top:5px;font-family:var(--sans)}
@media(max-width:520px){
.reg-head{padding:18px 22px 14px}
.reg-body{padding:18px 22px 22px}
.reg-steps{padding:14px 22px 0}
.reg-field-row{grid-template-columns:1fr}
.reg-code input{width:44px;height:54px;font-size:22px}
.reg-footer-link{padding:12px 22px 18px}
}
/* ================= ВХОД ================= */
.login-modal{width:min(480px,100%);text-align:left;padding:0;overflow:hidden}
.login-body{padding:26px 32px 28px}
.login-body h4{font-family:var(--serif);font-size:24px;font-weight:600;color:var(--cream);margin-bottom:6px}
.login-body .hint{font-size:14px;color:var(--muted-2);margin-bottom:22px;font-family:var(--sans)}
.login-links{display:flex;justify-content:space-between;gap:12px;margin-top:14px;font-family:var(--sans);font-size:14px;flex-wrap:wrap}
.login-links a{color:var(--gold);cursor:pointer;text-decoration:none;border-bottom:1px solid transparent;transition:.18s}
.login-links a:hover{color:var(--gold-l);border-bottom-color:var(--gold-l)}
.login-error{background:rgba(192,136,120,.10);border:1px solid rgba(192,136,120,.30);border-radius:8px;
padding:10px 14px;font-size:13.5px;color:#C08878;font-family:var(--sans);margin-bottom:16px;display:none}
.login-error.on{display:block}
/* ================= ЛИЧНЫЙ КАБИНЕТ ================= */
.account-modal{width:min(720px,100%);text-align:left;padding:0;overflow:hidden;max-height:92vh;display:flex;flex-direction:column}
.account-head{padding:28px 34px 22px;border-bottom:1px solid var(--line);display:flex;gap:20px;align-items:center;position:relative}
.account-ava{width:72px;height:72px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;
font-family:var(--serif);font-size:28px;font-weight:600;color:#FAF6F0;
background:linear-gradient(140deg,#C89B5A,#A87A3A);border:1px solid var(--line-2)}
.account-head-info{flex:1;min-width:0}
.account-head-info h4{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--cream);margin-bottom:2px}
.account-head-info .nick{color:var(--gold);font-family:var(--sans);font-size:14px}
.account-head-info .since{color:var(--muted-2);font-family:var(--sans);font-size:12.5px;margin-top:4px}
.account-close{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;
border:1px solid var(--line);background:transparent;color:var(--cream);font-size:16px;
display:grid;place-items:center;cursor:pointer;transition:.18s}
.account-close:hover{border-color:var(--gold);color:var(--gold-l)}
.account-body{padding:24px 34px;overflow-y:auto;flex:1}
.account-menu{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:22px}
.account-menu a{padding:14px 16px;border:1px solid var(--line);border-radius:10px;
display:flex;align-items:center;gap:12px;transition:.18s;font-family:var(--sans);
font-size:14.5px;color:var(--cream);text-decoration:none}
.account-menu a:hover{border-color:var(--gold);background:var(--bg-2);transform:translateX(2px)}
.account-menu a .ico{font-size:20px;flex-shrink:0}
.account-menu a .cnt{margin-left:auto;color:var(--muted-2);font-size:12.5px}
.account-logout{margin-top:8px;padding:14px 16px;border:1px solid var(--line);border-radius:10px;
display:flex;align-items:center;gap:12px;width:100%;text-align:left;
font-family:var(--sans);font-size:14.5px;color:#C08878;cursor:pointer;transition:.18s;background:transparent}
.account-logout:hover{border-color:#C08878;background:rgba(192,136,120,.06)}
.account-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:16px 0;
border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:22px}
.account-stats>div{text-align:center}
.account-stats b{display:block;font-family:var(--serif);font-size:22px;color:var(--gold-l);font-weight:600}
.account-stats span{font-size:11.5px;color:var(--muted-2);font-family:var(--sans);letter-spacing:.05em;text-transform:uppercase}
/* ============ Восстановление пароля ============ */
.forgot-modal{width:min(480px,100%);text-align:left;padding:0;overflow:hidden}
.forgot-body{padding:26px 32px 28px}
.forgot-body h4{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--cream);margin-bottom:6px}
.forgot-body .hint{font-size:14px;color:var(--muted-2);margin-bottom:20px;font-family:var(--sans)}
@media(max-width:620px){
.account-head{padding:22px 22px 18px;flex-direction:column;text-align:center;gap:12px}
.account-body{padding:20px 22px}
.account-menu{grid-template-columns:1fr}
.account-stats{grid-template-columns:repeat(2,1fr)}
.login-body,.forgot-body{padding:22px}
}
/* ================= ПРОФИЛЬ ПОЛЬЗОВАТЕЛЯ ================= */
.up-modal{width:min(520px,100%);text-align:left;padding:0;overflow:hidden;display:flex;flex-direction:column;max-height:92vh}
.up-head{padding:26px 30px 20px;border-bottom:1px solid var(--line);display:flex;gap:20px;align-items:center;position:relative}
.up-ava{width:84px;height:84px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;
font-family:var(--serif);font-size:34px;font-weight:600;color:#FAF6F0;
background:linear-gradient(140deg,#C89B5A,#A87A3A);border:2px solid var(--line-2)}
.up-info{flex:1;min-width:0}
.up-info h3{font-family:var(--serif);font-size:26px;font-weight:600;color:var(--cream);margin-bottom:4px}
.up-info .nick{font-family:var(--sans);font-size:15px;color:var(--gold)}
.up-info .since{font-family:var(--sans);font-size:13px;color:var(--muted-2);margin-top:6px}
.up-close{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;
border:1px solid var(--line);background:transparent;color:var(--cream);font-size:16px;
display:grid;place-items:center;cursor:pointer;transition:.18s}
.up-close:hover{border-color:var(--gold);color:var(--gold-l)}
.up-body{padding:22px 30px;overflow-y:auto;flex:1}
.up-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:18px}
.up-stats>div{text-align:center}
.up-stats b{display:block;font-family:var(--serif);font-size:22px;color:var(--gold-l);font-weight:600}
.up-stats span{font-size:11.5px;color:var(--muted-2);font-family:var(--sans);letter-spacing:.05em;text-transform:uppercase}
.up-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px dashed var(--line);font-family:var(--sans);font-size:14.5px}
.up-row span:first-child{color:var(--muted-2)}
.up-row span:last-child{color:var(--cream)}
.up-foot{padding:18px 30px 24px;border-top:1px solid var(--line);display:flex;gap:10px;flex-wrap:wrap}
.up-foot .btn{flex:1;min-width:130px}
/* ================= МЕССЕНДЖЕР ================= */
.mess-modal{
width:min(720px,100%);height:min(720px,92vh);padding:0;overflow:hidden;display:flex;flex-direction:column;
background:var(--card);text-align:left;
}
.mess-head{padding:14px 20px;border-bottom:1px solid var(--line);display:flex;gap:14px;align-items:center;
background:var(--bg-2);flex-shrink:0;position:relative}
.mess-back{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:transparent;
color:var(--cream);font-size:16px;display:grid;place-items:center;cursor:pointer;transition:.18s}
.mess-back:hover{border-color:var(--gold);color:var(--gold-l)}
.mess-peer{display:flex;align-items:center;gap:12px;flex:1;min-width:0;cursor:pointer}
.mess-peer-ava{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
font-family:var(--serif);font-size:18px;color:#FAF6F0;
background:linear-gradient(140deg,#C89B5A,#A87A3A);border:1px solid var(--line-2);flex-shrink:0}
.mess-peer-info b{display:block;font-family:var(--serif);font-size:16px;color:var(--cream);font-weight:600}
.mess-peer-info span{font-size:12px;color:var(--muted-2);font-family:var(--sans)}
.mess-close{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:transparent;
color:var(--cream);font-size:16px;display:grid;place-items:center;cursor:pointer;transition:.18s}
.mess-close:hover{border-color:var(--gold);color:var(--gold-l)}
.mess-body{
flex:1;overflow-y:auto;padding:18px 20px;
background:
radial-gradient(circle at 10% 20%, rgba(200,155,90,.05), transparent 40%),
radial-gradient(circle at 90% 80%, rgba(200,155,90,.05), transparent 40%),
var(--bg);
display:flex;flex-direction:column;gap:8px;
}
.mess-body::-webkit-scrollbar{width:8px}
.mess-body::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:4px}
.mess-day{text-align:center;font-family:var(--sans);font-size:12px;color:var(--muted-2);
padding:8px 0;user-select:none}
.msg{max-width:75%;padding:10px 14px;border-radius:14px;font-family:var(--sans);font-size:15px;
line-height:1.45;word-wrap:break-word;animation:msgin .18s ease-out;position:relative}
@keyframes msgin{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.msg.me{align-self:flex-end;background:#C89B5A;color:#FAF6F0;border-bottom-right-radius:4px}
.msg.peer{align-self:flex-start;background:var(--card);color:var(--cream);border:1px solid var(--line);border-bottom-left-radius:4px}
.msg-time{font-size:10.5px;opacity:.7;margin-top:4px;text-align:right}
.msg.emoji{padding:4px 8px;background:transparent !important;border:0 !important;font-size:44px;line-height:1.1;text-align:center}
.msg.sticker{padding:4px;background:transparent !important;border:0 !important;font-size:80px;line-height:1;text-align:center}
.msg.sticker svg{width:96px;height:96px;display:block}
.msg.photo,.msg.video{padding:6px;background:var(--card) !important;border:1px solid var(--line) !important;max-width:280px}
.msg.photo img,.msg.video video{width:100%;border-radius:10px;display:block;cursor:pointer}
.msg-meta{font-size:10.5px;opacity:.7;margin-top:6px;text-align:right}
/* Поле ввода */
.mess-input{
flex-shrink:0;border-top:1px solid var(--line);background:var(--bg-2);
padding:10px 14px;display:flex;flex-direction:column;gap:8px;
}
.mess-actions-top{display:flex;gap:6px;align-items:center}
.mess-tool{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:transparent;
color:var(--cream);font-size:18px;display:grid;place-items:center;cursor:pointer;transition:.18s}
.mess-tool:hover{border-color:var(--gold);color:var(--gold-l)}
.mess-tool:disabled{opacity:.4;cursor:not-allowed}
.mess-row{display:flex;gap:8px;align-items:flex-end}
.mess-ta{
flex:1;background:var(--card);border:1px solid var(--line);border-radius:14px;
padding:10px 14px;color:var(--cream);font-family:var(--sans);font-size:15px;
outline:none;resize:none;max-height:120px;min-height:42px;line-height:1.4;
}
.mess-ta:focus{border-color:var(--gold)}
.mess-send{width:44px;height:44px;border-radius:50%;background:#C89B5A;color:#FAF6F0;
border:0;cursor:pointer;font-size:18px;display:grid;place-items:center;transition:.18s;flex-shrink:0}
.mess-send:hover{background:#D8B078}
.mess-send:disabled{background:var(--line);cursor:not-allowed}
.mess-upload-preview{display:flex;gap:8px;flex-wrap:wrap;padding-top:4px}
.mess-upload-preview .item{width:56px;height:56px;border-radius:8px;overflow:hidden;position:relative;
border:1px solid var(--line);background:var(--card);display:grid;place-items:center;font-size:20px}
.mess-upload-preview .item img{width:100%;height:100%;object-fit:cover}
.mess-upload-preview .item .x{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;
background:#C08878;color:#FAF6F0;font-size:12px;display:grid;place-items:center;cursor:pointer;border:0}
/* Emoji picker */
.mess-emoji-pop{
position:absolute;bottom:calc(100% + 8px);left:0;right:0;
background:var(--card);border:1px solid var(--line);border-radius:14px;
padding:12px;box-shadow:0 12px 32px rgba(0,0,0,.3);z-index:10;
max-height:280px;overflow-y:auto;display:none;
}
.mess-emoji-pop.on{display:block}
.mess-emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}
.mess-emoji-grid button{
width:36px;height:36px;font-size:22px;background:transparent;border:0;cursor:pointer;
border-radius:8px;transition:.12s;display:grid;place-items:center;
}
.mess-emoji-grid button:hover{background:rgba(200,155,90,.12);transform:scale(1.15)}
.mess-emoji-tabs{display:flex;gap:4px;margin-bottom:8px;border-bottom:1px solid var(--line);padding-bottom:8px}
.mess-emoji-tabs button{padding:5px 10px;border-radius:8px;background:transparent;border:0;
cursor:pointer;font-size:16px;color:var(--muted);transition:.15s}
.mess-emoji-tabs button:hover{background:rgba(200,155,90,.1);color:var(--gold)}
.mess-emoji-tabs button.on{background:rgba(200,155,90,.18);color:var(--gold-l)}
.mess-empty{text-align:center;padding:60px 20px;color:var(--muted-2);font-family:var(--sans);font-size:14.5px;line-height:1.6}
.mess-empty b{color:var(--gold);font-family:var(--serif);font-size:18px;display:block;margin-bottom:8px}
/* Стикеры */
.sticker-item{
width:48px;height:48px;padding:4px;background:transparent;border:0;cursor:pointer;
border-radius:10px;transition:.15s
}
.sticker-item:hover{background:rgba(200,155,90,.12);transform:scale(1.1)}
.sticker-item svg{width:100%;height:100%;display:block}
/* Индикатор непрочитанных на иконке сообщений в шапке */
.mess-badge{position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 4px;
background:#C08878;color:#FAF6F0;border-radius:8px;font-size:10px;font-family:var(--sans);
font-weight:700;display:none;align-items:center;justify-content:center;line-height:1}
@media(max-width:620px){
.up-head{padding:20px 22px}
.up-ava{width:64px;height:64px;font-size:26px}
.up-body{padding:18px 22px}
.up-foot{padding:14px 22px 18px}
.mess-modal{width:100%;height:100vh;border-radius:0}
.msg{max-width:88%}
}
/* ================= REACTIONS / REPLY / VOICE / TYPING ================= */
.msg{position:relative}
.msg-reacts{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.react-chip{padding:2px 7px;border-radius:12px;background:rgba(255,255,255,.2);font-size:12px;
cursor:pointer;user-select:none;transition:.15s;color:inherit}
.react-chip:hover{background:rgba(255,255,255,.35)}
.react-chip.mine{background:rgba(200,155,90,.35);border:1px solid rgba(200,155,90,.6)}
.react-chip b{font-weight:600;font-size:11px}
.msg-actions{position:absolute;top:-8px;display:none;gap:2px;background:var(--card);
border:1px solid var(--line);border-radius:8px;padding:3px;box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:5}
.msg.me .msg-actions{right:100%;margin-right:6px}
.msg.peer .msg-actions{left:100%;margin-left:6px}
.msg:hover .msg-actions{display:flex}
.msg-actions button{width:26px;height:26px;border:0;background:transparent;cursor:pointer;
font-size:14px;border-radius:6px;transition:.15s;display:grid;place-items:center}
.msg-actions button:hover{background:rgba(200,155,90,.15)}
.msg-reply{padding:6px 10px;border-left:3px solid var(--gold);background:rgba(200,155,90,.08);
border-radius:6px;margin-bottom:6px;font-size:13px;line-height:1.35;opacity:.9}
.msg-reply b{color:var(--gold);margin-right:4px;font-weight:600}
.quick-reacts{background:var(--card);border:1px solid var(--line);border-radius:14px;
padding:6px 8px;display:flex;gap:4px;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:100}
.quick-reacts button{width:32px;height:32px;border:0;background:transparent;cursor:pointer;
font-size:20px;border-radius:8px;transition:.15s;display:grid;place-items:center}
.quick-reacts button:hover{background:rgba(200,155,90,.15);transform:scale(1.15)}
.msg.voice{max-width:280px;padding:8px}
.msg.voice audio{width:100%;display:block}
.reply-preview{padding:8px 12px;background:var(--bg-2);border-left:3px solid var(--gold);
border-radius:6px 6px 0 0;display:flex;justify-content:space-between;align-items:center;
font-family:var(--sans);font-size:13px;color:var(--muted)}
.reply-preview b{color:var(--cream);font-weight:500}
.reply-preview button{background:transparent;border:0;color:var(--muted-2);cursor:pointer;font-size:14px;padding:4px}
#messTyping{display:none;color:var(--gold);font-size:12px;font-style:italic;font-family:var(--sans);
padding:0 8px 6px;opacity:.85}
.online-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#7BC97E;
margin-left:6px;vertical-align:middle;box-shadow:0 0 6px rgba(123,201,126,.6)}
.avatar-img{width:100%;height:100%;object-fit:cover;border-radius:50%}
/* ===== Тултипы: белый текст на сером фоне ===== */
[data-tip]{position:relative}
[data-tip]::after{
content:attr(data-tip);
position:absolute;left:50%;top:calc(100% + 10px);
transform:translate(-50%,-4px);
background:#5A5A5A;
color:#FFFFFF;
border:0;
padding:8px 14px;
border-radius:8px;
font-family:var(--sans);
font-size:13px;
font-weight:500;
letter-spacing:.01em;
white-space:nowrap;
opacity:0;pointer-events:none;
transition:opacity .18s, transform .18s;
z-index:80;
box-shadow:0 6px 20px rgba(0,0,0,.22);
}
[data-tip]:hover::after{opacity:1;transform:translate(-50%,0)}
/* Стрелочка сверху тултипа */
[data-tip]::before{
content:"";
position:absolute;left:50%;top:calc(100% + 4px);
transform:translate(-50%,-4px);
border:6px solid transparent;
border-bottom-color:#5A5A5A;
opacity:0;pointer-events:none;
transition:opacity .18s, transform .18s;
z-index:80;
}
[data-tip]:hover::before{opacity:1;transform:translate(-50%,0)}
/* Тултип снизу для кнопок шапки (у них header sticky, тултип снизу) */
.header-act [data-tip]::after,
.header-act [data-tip]::before{z-index:120}
/* ===== Бейдж непрочитанных на кнопке ✉ ===== */
#headerMsgBtn{position:relative}
#headerMsgBadge{
position:absolute;
top:2px;
right:2px;
min-width:16px;
height:16px;
padding:0 4px;
background:#C08878;
color:#FAF6F0;
border-radius:8px;
font-size:10px;
font-family:var(--sans);
font-weight:700;
display:none;
align-items:center;
justify-content:center;
line-height:1;
box-shadow:0 0 0 2px var(--bg);
}
:root{
--bg-light: #FAF6F0; /* утренний свет */
--bg-parchment: #F2EBE0; /* пергамент */
--line-linen: #E8DFD0; /* лён */
--ink-smoke: #2A2520; /* дым */
--ink-coal: #3A342C; /* уголь */
--gold: #C89B5A; /* золото */
--gold-hover: #D8B078;
--gold-press: #A87A3A;
--wine: #6B2434; /* вино */
--wine-hover: #823144;
--wine-deep: #4A1824;
--olive: #6B7A50; /* олива */
--olive-hover: #7C8C5E;
--muted-light: #6A6058;
--muted-soft: #9A9088;
}
/* Секции с чередованием фона */
section.sec-light,
.sec-light{
background-color: var(--bg-light) !important;
background-image: none !important;
color: var(--ink-coal) !important;
}
section.sec-parchment,
.sec-parchment{
background-color: var(--bg-parchment) !important;
background-image: none !important;
color: var(--ink-coal) !important;
}
section.sec-wine,
.sec-wine{
background-color: var(--wine) !important;
background-image: linear-gradient(180deg, var(--wine), var(--wine-deep)) !important;
color: #FAF6F0 !important;
}
section.sec-olive,
.sec-olive{
/* олива только как акцент, фон остаётся палитрой родителя */
}
/* Тексты внутри секций */
.sec-light h1, .sec-light h2, .sec-light h3, .sec-light h4,
.sec-parchment h1, .sec-parchment h2, .sec-parchment h3, .sec-parchment h4{
color: var(--ink-smoke) !important;
}
.sec-light p, .sec-light .sub,
.sec-parchment p, .sec-parchment .sub{
color: var(--ink-coal) !important;
}
.sec-light .kicker,
.sec-parchment .kicker{
color: var(--gold) !important;
}
.sec-light .kicker::after,
.sec-parchment .kicker::after{
background: linear-gradient(90deg, var(--gold), transparent) !important;
}
.sec-light .mini-note,
.sec-parchment .mini-note{
color: var(--muted-soft) !important;
}
/* Винная секция */
.sec-wine h1, .sec-wine h2, .sec-wine h3, .sec-wine h4{ color: #FAF6F0 !important; }
.sec-wine .kicker{ color: var(--gold) !important; }
.sec-wine .kicker::after{ background: linear-gradient(90deg, var(--gold), transparent) !important; }
.sec-wine p, .sec-wine .sub, .sec-wine .secret-text{ color: #F2EBE0 !important; }
.sec-wine .mini-note{ color: rgba(250,246,240,.6) !important; }
.sec-wine .btn-primary{
background: var(--gold) !important;
color: var(--wine) !important;
border-color: var(--gold) !important;
}
.sec-wine .btn-primary:hover{ background: var(--gold-hover) !important; }
.sec-wine .btn-ghost{
color: #FAF6F0 !important;
border-color: rgba(250,246,240,.42) !important;
}
.sec-wine .btn-ghost:hover{
border-color: var(--gold) !important;
color: var(--gold) !important;
background: rgba(200,155,90,.14) !important;
}
/* Кнопки в светлых секциях */
.sec-light .btn-line,
.sec-parchment .btn-line{
color: var(--gold) !important;
border-color: var(--gold) !important;
}
.sec-light .btn-line:hover,
.sec-parchment .btn-line:hover{
background: var(--gold) !important;
color: #FAF6F0 !important;
}
/* Карточки в светлых секциях */
.sec-light .card,
.sec-parchment .card,
.sec-light .hall,
.sec-parchment .hall{
background: var(--bg-parchment) !important;
border-color: var(--line-linen) !important;
color: var(--ink-coal);
}
.sec-parchment .card,
.sec-parchment .hall{
background: var(--bg-light) !important;
}
.sec-light .card:hover,
.sec-parchment .card:hover{
border-color: var(--gold) !important;
box-shadow: 0 14px 32px rgba(42,37,32,.08) !important;
}
.sec-light .card h3,
.sec-parchment .card h3{
color: var(--ink-smoke) !important;
}
.sec-light .card p,
.sec-parchment .card p{
color: var(--ink-coal) !important;
}
.sec-light .hall-ico,
.sec-parchment .hall-ico{
color: var(--gold) !important;
background: rgba(200,155,90,.10) !important;
border-color: rgba(200,155,90,.28) !important;
}
/* Второй этаж: Алтарь — золото, Гостиная — вино */
#floor-2 .hall:nth-child(2) .hall-ico{
color: var(--wine) !important;
background: rgba(107,36,52,.10) !important;
border-color: rgba(107,36,52,.30) !important;
}
/* Подвал: Сокровищница золото, Тайная вино */
#basement .hall:nth-child(2) .hall-ico{
color: var(--wine) !important;
background: rgba(107,36,52,.10) !important;
border-color: rgba(107,36,52,.30) !important;
}
#basement .hall:nth-child(2){
border-color: rgba(107,36,52,.22) !important;
}
/* Барахолка — олива */
#outside .hall-ico{
color: var(--olive) !important;
background: rgba(107,122,80,.10) !important;
border-color: rgba(107,122,80,.30) !important;
}
#outside .btn-line{
color: var(--olive) !important;
border-color: var(--olive) !important;
}
#outside .btn-line:hover{
background: var(--olive) !important;
color: #FAF6F0 !important;
}
/* Цифры ролей — золото */
.role-num{
color: var(--gold) !important;
opacity: .7 !important;
}
/* Hero (Ворота) — кнопки вино+золото */
.hero .btn-primary{
background: var(--wine) !important;
color: var(--gold) !important;
box-shadow: 0 10px 30px rgba(107,36,52,.35) !important;
}
.hero .btn-primary:hover{
background: var(--wine-hover) !important;
color: var(--gold-hover) !important;
}
/* Тайная комната (тизер) — вино */
section#secret,
section.secret{
background-color: var(--wine) !important;
background-image: linear-gradient(180deg, var(--wine), var(--wine-deep)) !important;
color: #FAF6F0 !important;
border-top: 1px solid rgba(200,155,90,.16) !important;
border-bottom: 1px solid rgba(200,155,90,.16) !important;
}
section.secret .kicker{ color: var(--gold) !important; }
section.secret .kicker::after{ background: linear-gradient(90deg, var(--gold), transparent) !important; }
section.secret h2{ color: var(--gold) !important; }
section.secret .secret-text{ color: #F2EBE0 !important; }
section.secret .btn-primary{
background: var(--gold) !important;
color: var(--wine) !important;
}
section.secret .btn-primary:hover{ background: var(--gold-hover) !important; }
section.secret .blur-card{
border-color: rgba(200,155,90,.22) !important;
background: linear-gradient(140deg, #4A1824, #2E0E16) !important;
}
section.secret .blur-card .cap{ color: var(--gold) !important; }
/* Башня-3 и Гостиная — светлые */
#tower-3, #lounge{
background-color: var(--bg-light) !important;
background-image: none !important;
color: var(--ink-coal) !important;
}
#tower-3 h2, #lounge h2{ color: var(--ink-smoke) !important; }
#tower-3 .kicker, #lounge .kicker{ color: var(--gold) !important; }
#tower-3 .sub, #lounge .sub, #lounge p{ color: var(--ink-coal) !important; }
#tower-3 .hub-tile, #lounge .hub-tile{
background: var(--bg-parchment) !important;
border: 1px solid var(--line-linen) !important;
color: var(--ink-coal) !important;
}
#tower-3 .hub-tile b, #lounge .hub-tile b{ color: var(--ink-smoke) !important; }
#tower-3 .hub-tile span, #lounge .hub-tile span{ color: var(--muted-soft) !important; }
#tower-3 .hub-tile .ico, #lounge .hub-tile .ico{ color: var(--gold) !important; }
#tower-3 .hub-tile:hover, #lounge .hub-tile:hover{
border-color: var(--gold) !important;
box-shadow: 0 10px 26px rgba(42,37,32,.10) !important;
}
#tower-3 .mini-note, #lounge .mini-note{ color: var(--muted-soft) !important; }
/* Гостиная — кнопка вино+золото */
#lounge .btn-primary{
background: var(--wine) !important;
color: var(--gold) !important;
}
#lounge .btn-primary:hover{
background: var(--wine-hover) !important;
color: var(--gold-hover) !important;
}
/* Футер — дым + золото */
.footer{
background: linear-gradient(180deg, #201B17, #161210) !important;
color: #FAF6F0 !important;
border-top: 1px solid rgba(200,155,90,.16) !important;
}
.footer .f-brand b{ color: var(--gold) !important; }
.footer .f-brand .tag{ color: var(--gold) !important; opacity: .8; }
.footer .f-brand p{ color: #D8CFC1 !important; }
.footer .f-ship{ color: #B8AF9F !important; }
.footer .f-col h4{ color: var(--gold) !important; }
.footer .f-col a{ color: #E8DFD0 !important; }
.footer .f-col a:hover{ color: var(--gold) !important; }
.footer .f-bottom{ color: #B8AF9F !important; border-top-color: rgba(200,155,90,.12) !important; }
/* ===== Карта замка: схема + список зон ===== */
.map-layout{
display: grid;
grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
gap: 44px;
align-items: center;
margin-top: 32px;
}
.map-schema{
padding: 20px;
background: var(--bg-light, #FAF6F0);
border: 1px solid var(--line-linen, #E8DFD0);
border-radius: 18px;
display: flex;
align-items: center;
justify-content: center;
min-height: 380px;
transition: .25s;
}
.map-schema:hover{
border-color: var(--gold, #C89B5A);
box-shadow: 0 14px 36px rgba(42,37,32,.08);
}
.map-schema img{
width: 100%;
height: auto;
max-width: 620px;
display: block;
}
.map-zones{
display: grid;
grid-template-columns: 1fr;
gap: 10px;
}
.map-zone{
padding: 14px 18px;
border: 1px solid var(--line-linen, #E8DFD0);
border-radius: 12px;
background: var(--bg-light, #FAF6F0);
transition: .2s;
display: flex;
flex-direction: column;
gap: 4px;
}
.map-zone:hover{
border-color: var(--gold, #C89B5A);
transform: translateX(4px);
box-shadow: 0 6px 18px rgba(42,37,32,.06);
}
.map-zone b{
font-family: var(--serif, 'Cinzel', serif);
font-size: 15px;
font-weight: 600;
color: var(--ink-smoke, #2A2520);
}
.map-zone span{
font-size: 13px;
color: var(--muted-soft, #9A9088);
font-family: var(--sans, 'Inter', sans-serif);
line-height: 1.45;
}
.map-cta{
text-align: center;
margin-top: 34px;
}
@media(max-width: 900px){
.map-layout{ grid-template-columns: 1fr; gap: 28px; }
.map-schema{ min-height: 260px; padding: 12px; }
}
/* ================= ГЛАЗОК ПОКАЗАТЬ ПАРОЛЬ ================= */
.pwd-wrap{position:relative;display:block;width:100%}
.pwd-wrap input{padding-right:44px !important}
.pwd-eye{
position:absolute;
right:8px;
top:50%;
transform:translateY(-50%);
width:34px;
height:34px;
border:0;
background:transparent;
cursor:pointer;
border-radius:50%;
display:grid;
place-items:center;
transition:.18s;
color:var(--muted-soft, #9A9088);
font-size:16px;
z-index:2;
padding:0;
}
.pwd-eye:hover{
color:var(--gold, #C89B5A);
background:rgba(200,155,90,.10);
}
.pwd-eye:active{
transform:translateY(-50%) scale(.94);
}
.pwd-eye svg{
width:18px;
height:18px;
stroke:currentColor;
fill:none;
stroke-width:1.8;
stroke-linecap:round;
stroke-linejoin:round;
}
.pwd-eye.is-on svg .eye-slash{display:none}
.pwd-eye:not(.is-on) svg .eye-line{display:none}
/* ================= АРАБСКИЙ КУРСИВ — ПРИМЕНЕНИЕ ================= */
h1, h2, h3, h4, h5, h6{
font-family:'Philosopher','Cinzel',Georgia,serif !important;
font-style:italic !important;
font-weight:700 !important;
letter-spacing:.015em !important;
}
body, p, span, a, li, div, button, input, textarea, select, label{
font-family:'Philosopher','Bad Script',Arial,sans-serif;
font-style:italic;
}
/* Исключения: цифры и очень длинные числа делаем читаемыми */
.tabular, .mono, code, pre{
font-family:'Inter',monospace !important;
font-style:normal !important;
}
/* Кнопки — курсив, но не сильно наклонены */
.btn, .btn-primary, .btn-ghost, .btn-line, .icon-btn, .user-btn{display:flex;align-items:center;gap:9px;padding:9px 18px;border-radius:999px;border:1px solid var(--line);font-family:"Philosopher",serif;font-style:italic;font-weight:700;font-size:15px;transition:.18s;background:transparent;color:var(--cream)}
/* Кикеры — не курсивом, но оставим разрядку */
.kicker{
font-style:normal !important;
font-family:'Philosopher',serif !important;
font-weight:700 !important;
}
/* Меню шапки — курсив */
.nav a, .user-btn, .mobile-nav a, .subnav a{
font-family:'Philosopher',serif !important;
font-style:italic !important;
font-weight:700 !important;
letter-spacing:.02em !important;
}
/* Логотип */
.logo b{font-family:"Philosopher",serif;font-style:italic;font-size:26px;letter-spacing:.14em;color:var(--cream,#2A2520);font-weight:700;line-height:1}
.logo span{font-family:"Philosopher",serif;font-style:italic;font-size:9.5px;letter-spacing:.32em;color:var(--gold,#C89B5A);text-transform:uppercase;margin-top:6px;font-weight:400}
/* ===== Адаптив шапки: не даём меню вылезать за панель ===== */
@media (max-width: 1280px){
.nav a{padding:7px 10px;font-size:13.5px}
.logo b{font-size:22px}
.logo span{font-size:8.5px}
.header-in{gap:14px}
.icon-btn{width:38px;height:38px;font-size:16px}
.user-btn{padding:7px 12px;font-size:13.5px}
}
@media (max-width: 1100px){
.nav a{padding:6px 9px;font-size:13px}
.logo b{font-size:20px}
}
@media (max-width: 820px){
.header-in{min-height:64px;padding:10px 0}
.nav{display:none !important}
}
/* ===== Светлая шапка: ховеры и адаптив ===== */
.header .nav a:hover{
color:#A87A3A;
background:rgba(200,155,90,.14);
}
.header .icon-btn:hover{
background:rgba(200,155,90,.14);
border-color:#E8DFD0;
color:#A87A3A;
}
.header .user-btn:hover{
border-color:#C89B5A;
color:#A87A3A;
background:rgba(200,155,90,.08);
}
.header .burger:hover{
background:rgba(200,155,90,.14);
}
/* Тултип на светлой шапке — оставляем серый с белым текстом (он контрастный) */
/* Мобильное меню — тоже светлое */
.mobile-nav{
background:rgba(250,246,240,.99) !important;
border-right:1px solid #E8DFD0;
}
.mobile-nav a{
color:#3A342C !important;
border-bottom:1px solid #E8DFD0 !important;
}
.mobile-nav a:hover{
color:#A87A3A !important;
background:rgba(200,155,90,.08);
}
/* Тёмная тема — вернуть тёмную шапку */
html.dark .header{
background:rgba(26,23,20,.94) !important;
border-bottom-color:rgba(232,226,213,.14) !important;
}
html.dark .header.is-scrolled{
background:rgba(20,17,14,.98) !important;
}
html.dark .logo b{color:#E8E2D5 !important}
html.dark .logo span{color:#D4AF7A !important}
html.dark .nav a{color:#B9AFC0 !important}
html.dark .nav a:hover{color:#E8C89A !important;background:rgba(212,175,122,.12) !important}
html.dark .icon-btn{color:#E8E2D5 !important}
html.dark .icon-btn:hover{background:rgba(212,175,122,.12) !important;border-color:rgba(232,226,213,.14) !important;color:#E8C89A !important}
html.dark .user-btn{color:#E8E2D5 !important;border-color:rgba(232,226,213,.14) !important}
html.dark .user-btn:hover{border-color:#D4AF7A !important;color:#E8C89A !important}
html.dark .burger{color:#E8E2D5 !important}
html.dark .mobile-nav{background:rgba(20,17,14,.99) !important}
html.dark .mobile-nav a{color:#E8E2D5 !important;border-bottom-color:rgba(232,226,213,.14) !important}
/* Адаптив — сохраняем пропорции светлой шапки */
@media(max-width:1280px){
.header-in{min-height:88px;padding:14px 0;gap:16px}
.nav a{padding:9px 11px;font-size:14px}
.logo b{font-size:24px}
.logo span{font-size:9px}
.icon-btn{width:42px;height:42px;font-size:17px}
.user-btn{padding:9px 14px;font-size:14px}
}
@media(max-width:1100px){
.header-in{min-height:80px}
.nav a{padding:8px 10px;font-size:13.5px}
.logo b{font-size:22px}
}
@media(max-width:820px){
.header-in{min-height:72px;padding:10px 0}
.nav{display:none !important}
.burger{display:grid;place-items:center}
}
/* ===== Тултипы: не обрезаются шапкой, показываются поверх ===== */
[data-tip]{position:relative;z-index:80}
[data-tip]::after,
[data-tip]::before{z-index:9999 !important}
/* Тултипы шапки показываются ПОД кнопкой и не уходят вверх */
.header [data-tip]::after,
.header-act [data-tip]::after{
top:calc(100% + 12px);
z-index:9999;
}
.header [data-tip]::before,
.header-act [data-tip]::before{
top:calc(100% + 6px);
z-index:9999;
}
/* Кнопки шапки — выше обычных элементов, чтобы тултип их не перекрывал */
.header-act .icon-btn,
.header-act .user-btn{
position:relative;
z-index:71;
}
/* ================= БЕГУЩАЯ СТРОКА В ШАПКЕ ================= */
.header-ticker{
width: 100%;
overflow: hidden;
background: linear-gradient(90deg, #A87A3A, #C89B5A, #A87A3A);
border-bottom: 1px solid rgba(255,255,255,.12);
height: 32px;
display: flex;
align-items: center;
}
.header-ticker-track{
display: flex;
align-items: center;
gap: 48px;
white-space: nowrap;
animation: ticker-scroll 60s linear infinite;
padding-left: 100%;
will-change: transform;
}
.header-ticker-track:hover{ animation-play-state: paused }
.header-ticker-item{
display: inline-flex;
align-items: center;
gap: 8px;
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 13px;
color: #2A2520;
font-weight: 700;
letter-spacing: .02em;
}
.header-ticker-item b{ color: #4A1824 }
@keyframes ticker-scroll{
from{ transform: translateX(0) }
to{ transform: translateX(-100%) }
}
/* Мобильная шапка — тоже с бегущей строкой */
@media(max-width:820px){
.header-ticker{ height: 28px }
.header-ticker-item{ font-size: 12px }
}
/* ================= ИКОНКА АЧИВОК ================= */
.icon-btn.has-badge{ position: relative }
.icon-btn .btn-badge{
position: absolute;
top: 2px;
right: 2px;
min-width: 16px;
height: 16px;
padding: 0 4px;
background: #C08878;
color: #FAF6F0;
border-radius: 8px;
font-size: 10px;
font-family: 'Inter', sans-serif;
font-weight: 700;
font-style: normal;
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
box-shadow: 0 0 0 2px rgba(250,246,240,.94);
}
/* ================= ПЕРЕКЛЮЧАТЕЛЬ ЯЗЫКА ================= */
.lang-switch{
display: flex;
align-items: center;
gap: 2px;
padding: 3px;
border-radius: 999px;
background: rgba(200,155,90,.10);
border: 1px solid #E8DFD0;
}
.lang-switch button{
padding: 5px 10px;
border: 0;
background: transparent;
cursor: pointer;
font-family: 'Philosopher', serif;
font-style: italic;
font-weight: 700;
font-size: 12.5px;
color: #3A342C;
border-radius: 999px;
transition: .18s;
}
.lang-switch button.on{ background: #C89B5A; color: #FAF6F0 }
.lang-switch button:hover:not(.on){ color: #A87A3A }
/* ================= НОВЫЕ БЛОКИ ГЛАВНОЙ ================= */
.door-card{
display:flex;flex-direction:column;gap:8px;padding:22px;
background:var(--card,#F2EBE0);border:1px solid var(--line,#E8DFD0);
border-radius:14px;transition:.2s;text-decoration:none;color:inherit;
}
.door-card:hover{border-color:#C89B5A;transform:translateY(-3px);box-shadow:0 12px 28px rgba(42,37,32,.10)}
.door-ico{font-size:32px;line-height:1}
.door-card b{font-family:Philosopher,serif;font-style:italic;font-size:19px;font-weight:700;color:var(--ink-smoke,#2A2520)}
.door-card span:last-child{font-size:14px;color:var(--ink-coal,#3A342C);line-height:1.5}
.thing-card{
padding:26px 24px;background:var(--card,#F2EBE0);border:1px solid var(--line,#E8DFD0);
border-radius:14px;transition:.2s;
}
.thing-card:hover{border-color:#C89B5A;transform:translateY(-3px)}
.thing-ico{font-size:36px;display:block;margin-bottom:14px}
.thing-card p{font-family:Philosopher,serif;font-style:italic;font-size:17px;color:var(--ink-coal,#3A342C);line-height:1.55;margin:0}
.live-card{
padding:18px 20px;background:var(--card,#F2EBE0);border:1px solid var(--line,#E8DFD0);
border-radius:12px;display:flex;flex-direction:column;gap:6px;
}
.live-card span{font-size:22px}
.live-card b{font-family:Philosopher,serif;font-style:italic;font-size:13px;font-weight:700;color:#A87A3A;text-transform:uppercase;letter-spacing:.06em}
.live-card p{font-size:14px;color:var(--ink-coal,#3A342C);margin:0}
.picked-card{
display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px 16px;
background:var(--card,#F2EBE0);border:1px solid var(--line,#E8DFD0);border-radius:14px;
text-align:center;text-decoration:none;color:inherit;transition:.2s;
}
.picked-card:hover{border-color:#C89B5A;transform:translateY(-3px);box-shadow:0 12px 28px rgba(42,37,32,.10)}
.picked-ico{font-size:34px}
.picked-card b{font-family:Philosopher,serif;font-style:italic;font-size:15px;font-weight:700;color:var(--ink-smoke,#2A2520)}
.map-ru{
padding:20px;background:var(--card,#F2EBE0);border:1px solid var(--line,#E8DFD0);
border-radius:18px;overflow:hidden;
}
.map-ru svg{width:100%;height:auto;max-height:420px;display:block}
.sub-card{
padding:26px 20px;background:rgba(250,246,240,.10);border:1px solid rgba(200,155,90,.3);
border-radius:14px;text-align:center;color:#FAF6F0;
}
.sub-card.featured{background:rgba(200,155,90,.22);border-color:#C89B5A}
.sub-emoji{font-size:38px;margin-bottom:10px}
.sub-card b{display:block;font-family:Philosopher,serif;font-style:italic;font-size:16px;font-weight:700;color:#F2EBE0;margin-bottom:8px}
.sub-price{display:block;font-family:Philosopher,serif;font-size:28px;font-weight:700;color:#C89B5A;margin-bottom:4px}
.sub-card small{font-size:12px;color:rgba(250,246,240,.7);font-style:italic}
.book-card{
padding:24px;background:var(--card,#F2EBE0);border:1px solid var(--line,#E8DFD0);border-radius:14px;
}
.book-ico{font-size:32px;display:block;margin-bottom:12px}
.book-card b{display:block;font-family:Philosopher,serif;font-style:italic;font-size:17px;font-weight:700;color:var(--ink-smoke,#2A2520);margin-bottom:8px}
.book-card p{font-size:14px;color:var(--ink-coal,#3A342C);line-height:1.55;margin:0}
.commission-list{
border:1px solid var(--line,#E8DFD0);border-radius:14px;background:var(--card,#F2EBE0);
overflow:hidden;margin-top:20px;
}
.commission-row{
display:flex;justify-content:space-between;padding:16px 22px;
border-bottom:1px solid var(--line,#E8DFD0);
font-family:Philosopher,serif;font-style:italic;font-size:15.5px;
}
.commission-row:last-child{border-bottom:0}
.commission-row span{color:var(--ink-coal,#3A342C)}
.commission-row b{color:#A87A3A;font-weight:700}
.tag-pill{
display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:999px;
background:rgba(200,155,90,.16);border:1px solid rgba(200,155,90,.4);
color:#C89B5A;font-family:Philosopher,serif;font-style:italic;font-weight:700;font-size:13.5px;
}
/* Мобильные оптимизации */
@media(max-width:820px){
.door-card{padding:18px}
.door-ico{font-size:26px}
.door-card b{font-size:17px}
.map-ru svg{max-height:280px}
.sub-card{padding:18px 14px}
.sub-price{font-size:22px}
}
/* ================= ТИКЕТЫ (админка) ================= */
.tickets-wrap{
display: grid;
grid-template-columns: 340px minmax(0, 1fr);
gap: 16px;
height: calc(100vh - 260px);
min-height: 560px;
}
/* ---------- Левая колонка ---------- */
.tickets-side{
display: flex;
flex-direction: column;
background: var(--card);
border: 1px solid var(--line);
border-radius: 14px;
overflow: hidden;
}
.tickets-side-head{
padding: 12px;
border-bottom: 1px solid var(--line);
background: var(--bg-2);
display: flex;
flex-direction: column;
gap: 8px;
}
.tickets-search{
width: 100%;
padding: 9px 12px;
border: 1px solid var(--line);
border-radius: 8px;
background: var(--bg);
color: var(--cream);
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 13.5px;
outline: none;
}
.tickets-search:focus{ border-color: #C89B5A }
.tickets-filters{
display: flex;
gap: 8px;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
}
.tickets-filters select{
padding: 6px 10px;
border: 1px solid var(--line);
border-radius: 6px;
background: var(--card);
color: var(--cream);
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 12.5px;
outline: none;
}
.tickets-unread-toggle{
display: flex;
align-items: center;
gap: 5px;
font-size: 12px;
color: var(--muted);
font-family: 'Inter', sans-serif;
font-style: normal;
cursor: pointer;
}
.tickets-list{
flex: 1;
overflow-y: auto;
padding: 8px;
}
.tickets-list::-webkit-scrollbar{ width: 6px }
.tickets-list::-webkit-scrollbar-thumb{ background: var(--line-2); border-radius: 3px }
.tickets-empty{
text-align: center;
color: var(--muted);
padding: 40px 20px;
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 14px;
}
/* ---------- Карточка тикета ---------- */
.tk-item{
display: flex;
gap: 10px;
padding: 12px 10px;
border-radius: 10px;
cursor: pointer;
transition: background .15s;
border: 1px solid transparent;
margin-bottom: 4px;
}
.tk-item:hover{ background: var(--bg-2) }
.tk-item.is-active{
background: rgba(200,155,90,.12);
border-color: #C89B5A;
}
.tk-ava{
width: 42px;
height: 42px;
border-radius: 50%;
flex-shrink: 0;
display: grid;
place-items: center;
font-family: 'Philosopher', serif;
font-weight: 700;
font-style: italic;
font-size: 18px;
color: #FAF6F0;
background: linear-gradient(140deg, #C89B5A, #A87A3A);
border: 1px solid var(--line-2);
}
.tk-body{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px }
.tk-line1{
display: flex;
justify-content: space-between;
align-items: baseline;
gap: 6px;
}
.tk-nick{
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 14.5px;
font-weight: 700;
color: var(--cream);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.tk-time{
font-family: 'Inter', sans-serif;
font-style: normal;
font-size: 11px;
color: var(--muted-2);
flex-shrink: 0;
}
.tk-line2{
display: flex;
justify-content: space-between;
gap: 6px;
align-items: center;
}
.tk-preview{
font-family: 'Inter', sans-serif;
font-style: normal;
font-size: 12.5px;
color: var(--muted);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.tk-dot{
width: 10px;
height: 10px;
border-radius: 50%;
background: #C08878;
flex-shrink: 0;
box-shadow: 0 0 0 2px rgba(192,136,120,.3);
animation: tk-pulse 2s infinite;
}
@keyframes tk-pulse{
0%,100%{ opacity: 1 }
50%{ opacity: .6 }
}
.tk-line3{
display: flex;
gap: 8px;
align-items: center;
margin-top: 2px;
}
.tk-status{
padding: 2px 8px;
border-radius: 8px;
font-family: 'Inter', sans-serif;
font-style: normal;
font-size: 10.5px;
font-weight: 600;
letter-spacing: .02em;
}
.tk-status.open{ background: rgba(192,136,120,.18); color: #C08878 }
.tk-status.pending{ background: rgba(200,155,90,.2); color: #C89B5A }
.tk-status.closed{ background: rgba(107,122,80,.2); color: #6B7A50 }
.tk-count{
font-family: 'Inter', sans-serif;
font-style: normal;
font-size: 10.5px;
color: var(--muted-2);
}
/* ---------- Правая колонка: чат ---------- */
.tickets-chat{
display: flex;
flex-direction: column;
background: var(--card);
border: 1px solid var(--line);
border-radius: 14px;
overflow: hidden;
}
.tickets-chat-placeholder{
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
padding: 40px 20px;
}
.tk-chat-head{
padding: 12px 18px;
background: var(--bg-2);
border-bottom: 1px solid var(--line);
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
.tk-chat-user{
display: flex;
align-items: center;
gap: 12px;
min-width: 0;
}
.tk-chat-user b{
display: block;
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 16px;
color: var(--cream);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.tk-chat-user span{
display: block;
font-family: 'Inter', sans-serif;
font-style: normal;
font-size: 12px;
color: var(--muted-2);
margin-top: 2px;
}
.tk-chat-actions{
display: flex;
gap: 6px;
flex-shrink: 0;
}
.tk-chat-body{
flex: 1;
overflow-y: auto;
padding: 18px 20px;
display: flex;
flex-direction: column;
gap: 10px;
background: var(--bg);
}
.tk-chat-body::-webkit-scrollbar{ width: 6px }
.tk-chat-body::-webkit-scrollbar-thumb{ background: var(--line-2); border-radius: 3px }
.tk-chat-input{
padding: 12px 16px;
background: var(--bg-2);
border-top: 1px solid var(--line);
display: flex;
flex-direction: column;
gap: 8px;
}
.tk-tools{
display: flex;
gap: 6px;
}
.tk-row{
display: flex;
gap: 8px;
align-items: flex-end;
}
.tk-row textarea{
flex: 1;
padding: 10px 14px;
border: 1px solid var(--line);
border-radius: 10px;
background: var(--card);
color: var(--cream);
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 14.5px;
outline: none;
resize: none;
min-height: 42px;
max-height: 120px;
line-height: 1.4;
}
.tk-row textarea:focus{ border-color: #C89B5A }
.tk-send{
width: 44px;
height: 44px;
border-radius: 50%;
border: 0;
background: linear-gradient(135deg, #C89B5A, #A87A3A);
color: #FAF6F0;
font-size: 18px;
cursor: pointer;
display: grid;
place-items: center;
transition: .18s;
flex-shrink: 0;
}
.tk-send:hover{ transform: scale(1.06) }
.tk-preview{
display: flex;
gap: 6px;
flex-wrap: wrap;
}
.tk-chip{
display: flex;
align-items: center;
gap: 6px;
padding: 4px 8px;
background: var(--card);
border: 1px solid var(--line);
border-radius: 8px;
font-family: 'Inter', sans-serif;
font-style: normal;
font-size: 12px;
color: var(--muted);
max-width: 200px;
}
.tk-chip img{ width: 30px; height: 30px; object-fit: cover; border-radius: 4px }
.tk-chip button{
border: 0;
background: transparent;
color: var(--muted);
cursor: pointer;
font-size: 14px;
padding: 0 2px;
}
.tk-chip button:hover{ color: #C08878 }
/* ---------- Адаптив ---------- */
@media(max-width: 900px){
.tickets-wrap{ grid-template-columns: 1fr; height: auto }
.tickets-side{ max-height: 320px }
.tickets-chat{ min-height: 480px }
.tk-chat-actions{ width: 100% }
}
/* ===== Тикеты: онлайн-индикатор + счётчик в карточке ===== */
.tk-online{
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
background: #7BC97E;
margin-left: 6px;
vertical-align: middle;
box-shadow: 0 0 0 2px rgba(123,201,126,.25);
}
/* Бейдж на табе «Тикеты» */
#ticketsUnreadBadge{
background: #C08878;
color: #FAF6F0;
border-radius: 8px;
padding: 1px 7px;
font-size: 11px;
margin-left: 6px;
font-family: 'Inter', sans-serif;
font-style: normal;
font-weight: 600;
}
/* ========================================================
ЗЕЛЕНО-ГОЛУБАЯ ПАЛИТРА (v2) + ЛИАНА
======================================================== */
:root{
--bg-light: #F0F7F4; /* утренний туман — светло-зелёный */
--bg-parchment: #E4F0EC; /* мята — для карточек */
--line-linen: #C8DFD6; /* лён с зеленцой */
--ink-smoke: #1E3330; /* дым — тёмно-зелёный */
--ink-coal: #2F4A44; /* уголь — глубокий серо-зелёный */
--gold: #4A9E8E; /* акцент — морской изумруд */
--gold-hover: #5FB3A2;
--gold-press: #357A6E;
--wine: #2E5D5A; /* вино → тёмный изумруд */
--wine-hover: #3B7A76;
--wine-deep: #1E4340;
--olive: #6B9E80; /* олива → светло-зелёный */
--olive-hover: #7DB391;
--muted-light: #5A7A74;
--muted-soft: #7A9690;
--leaf: #7FB89C; /* лиана — цвет листьев */
}
/* Заменяем основные переменные темы */
:root{
--bg:#F0F7F4;
--bg-2:#E4F0EC;
--panel:#D6E8E0;
--card:#E4F0EC;
--card-2:#D6E8E0;
--card-end:#D6E8E0;
--line:#C8DFD6;
--line-2:#A8C9BC;
--gold:#4A9E8E;
--gold-l:#5FB3A2;
--cream:#1E3330;
--muted:#2F4A44;
--muted-2:#5A7A74;
--flame:#4A9E8E;
--wine:#2E5D5A;
}
/* ========================================================
ЛИАНА ПО ОБРАМЛЕНИЮ САЙТА (декоративная рамка)
======================================================== */
body::before{
background:
radial-gradient(1200px 800px at 15% -10%, rgba(122,184,156,.20), transparent 62%),
radial-gradient(900px 700px at 90% 8%, rgba(74,158,142,.16), transparent 65%),
radial-gradient(1200px 900px at 50% 110%, rgba(107,158,128,.14), transparent 60%);
}
/* Рамка-лиана слева и справа */
/* Верхняя и нижняя ветви — горизонтальные */
.wrap::before{
content:"";
position:absolute;
top:-8px;
left:0;
right:0;
height:16px;
pointer-events:none;
background: url("data:image/svg+xml;utf8,") repeat-x center;
background-size: 200px 16px;
opacity: 0.5;
z-index: -1;
}
/* Шапка — с зелёным оттенком */
.header{
background: rgba(240,247,244,.94) !important;
border-bottom-color: rgba(200,223,214,.9) !important;
}
.header.is-scrolled{
background: rgba(228,240,236,.98) !important;
box-shadow: 0 6px 24px rgba(30,51,48,.10) !important;
}
/* Кнопки и акценты — изумрудные */
.btn-primary{
background: linear-gradient(180deg, #5FB3A2, #4A9E8E 60%, #357A6E) !important;
color: #F0F7F4 !important;
box-shadow: 0 10px 30px rgba(74,158,142,.30) !important;
}
.btn-primary:hover{
background: linear-gradient(180deg, #7FB89C, #5FB3A2 60%, #4A9E8E) !important;
box-shadow: 0 16px 44px rgba(74,158,142,.42) !important;
}
.btn-line{
color: #357A6E !important;
border-color: #A8C9BC !important;
}
.btn-line:hover{
background: #4A9E8E !important;
color: #F0F7F4 !important;
border-color: #4A9E8E !important;
}
.kicker{ color: #4A9E8E !important }
.kicker::after{ background: linear-gradient(90deg, #4A9E8E, transparent) !important }
/* Секции с фоном */
.sec-wine{
background-color: #2E5D5A !important;
background-image: linear-gradient(180deg, #2E5D5A, #1E4340) !important;
color: #F0F7F4 !important;
}
.sec-wine .kicker{ color: #7FB89C !important }
.sec-wine h2{ color: #7FB89C !important }
.sec-wine .btn-primary{
background: linear-gradient(180deg, #7FB89C, #4A9E8E) !important;
color: #1E4340 !important;
}
/* Секретный блок (тизер) */
section.secret{
background-color: #2E5D5A !important;
background-image: linear-gradient(180deg, #2E5D5A, #1E4340) !important;
}
section.secret .kicker{ color: #7FB89C !important }
section.secret h2{ color: #7FB89C !important }
section.secret .btn-primary{
background: linear-gradient(180deg, #7FB89C, #4A9E8E) !important;
color: #1E4340 !important;
}
/* Футер */
.footer{
background: linear-gradient(180deg, #1E3330, #142421) !important;
}
.footer .f-brand b{ color: #7FB89C !important }
.footer .f-brand .tag{ color: #7FB89C !important }
.footer .f-col h4{ color: #7FB89C !important }
.footer .f-col a:hover{ color: #7FB89C !important }
/* Иконки и ховеры */
.header .nav a:hover{ color: #357A6E !important; background: rgba(74,158,142,.14) !important }
.header .icon-btn:hover{ color: #357A6E !important; background: rgba(74,158,142,.14) !important }
.header .user-btn:hover{ border-color: #4A9E8E !important; color: #357A6E !important }
/* Тёмная тема */
html.dark{
--bg:#0F1F1D;
--bg-2:#152826;
--card:#1A2F2C;
--line:#2A4441;
--gold:#7FB89C;
--gold-l:#9CD4B8;
--cream:#E8F2EE;
--muted:#B8D0C9;
--muted-2:#8FA8A3;
}
html.dark .header{ background: rgba(15,31,29,.94) !important }
html.dark .header.is-scrolled{ background: rgba(15,31,29,.98) !important }
html.dark .logo b{ color: #E8F2EE !important }
html.dark .nav a{ color: #B8D0C9 !important }
html.dark .nav a:hover{ color: #9CD4B8 !important }
html.dark
/* Адаптив: лиана тоньше на мобильном */
@media(max-width:820px){
}
/* Анимация роста лианы */
@keyframes vine-grow{
from{ background-size: 80px 0%, 80px 0%; opacity: 0 }
to{ background-size: 80px 100%, 80px 100%; opacity: 0.55 }
}
/* ================= РАМКА-ЛИАНА (фото) ================= */
/* Рамка слева/справа по краям (дублируем) */
body::before{
z-index: -1;
}
/* ================= РАМКА-ЛИАНА ================= */
@media(max-width:820px){
}
/* ================= РАМКА-ЛИАНА (обесцвеченная, уменьшенная) ================= */
@media(max-width:820px){
}
/* ================= ЖИВОЙ ОГОНЬ + МАНИФЕСТ ================= */
.fire-manifest{
display: grid;
grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
gap: 56px;
align-items: center;
max-width: 1080px;
margin: 0 auto;
}
/* ---- Левая колонка: свеча ---- */
.fire-side{
text-align: center;
padding: 26px 24px;
background: rgba(74,158,142,.06);
border: 1px solid rgba(74,158,142,.18);
border-radius: 18px;
position: relative;
overflow: hidden;
}
.fire-side::before{
content:"";
position:absolute;
top:-40%;
left:50%;
transform:translateX(-50%);
width:200px;
height:200px;
background:radial-gradient(circle,rgba(232,163,61,.20),transparent 70%);
pointer-events:none;
animation: fire-glow 3.2s ease-in-out infinite;
}
@keyframes fire-glow{
0%,100%{ opacity:.7; transform:translateX(-50%) scale(1) }
50%{ opacity:1; transform:translateX(-50%) scale(1.15) }
}
.fire-candle{
font-size: 64px;
line-height: 1;
margin-bottom: 16px;
filter: drop-shadow(0 0 30px rgba(232,163,61,.55));
animation: candle-flicker 2.6s ease-in-out infinite;
}
@keyframes candle-flicker{
0%,100%{ filter: drop-shadow(0 0 30px rgba(232,163,61,.55)) }
30%{ filter: drop-shadow(0 0 40px rgba(232,163,61,.75)) }
60%{ filter: drop-shadow(0 0 24px rgba(232,163,61,.45)) }
}
.fire-line{
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 15.5px;
color: var(--ink-coal, #2F4A44);
line-height: 1.7;
margin: 0;
opacity: .9;
}
.fire-divider{
width: 40px;
height: 1px;
background: linear-gradient(90deg, transparent, #4A9E8E, transparent);
margin: 14px auto;
}
.fire-today{
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 17px;
font-weight: 700;
color: #357A6E;
line-height: 1.55;
margin: 16px 0 0;
padding-top: 14px;
border-top: 1px dashed rgba(74,158,142,.28);
}
/* ---- Правая колонка: манифест ---- */
.manifest-side{
padding-left: 8px;
}
.manifest-title{
font-family: 'Philosopher', serif;
font-style: italic;
font-size: clamp(28px, 3.6vw, 40px);
color: var(--ink-smoke, #1E3330);
margin: 6px 0 22px;
line-height: 1.15;
letter-spacing: .01em;
}
.manifest-p{
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 16.5px;
color: var(--muted, #2F4A44);
line-height: 1.75;
margin: 0 0 16px;
}
.manifest-p b{
color: #357A6E;
font-weight: 700;
}
.manifest-final{
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 19px;
font-weight: 700;
color: #4A9E8E;
line-height: 1.55;
margin: 26px 0 0;
padding-left: 18px;
border-left: 3px solid #4A9E8E;
}
/* ---- Адаптив ---- */
@media(max-width:900px){
.fire-manifest{
grid-template-columns: 1fr;
gap: 32px;
}
.fire-side{
padding: 22px 18px;
max-width: 420px;
margin: 0 auto;
}
.fire-candle{ font-size: 52px }
.manifest-side{ padding-left: 0 }
.manifest-final{ font-size: 17px }
}
/* ================= МЕНЮ ПРОФИЛЯ (dropdown) ================= */
.user-wrap{position:relative}
.user-menu{
position:absolute;
top:calc(100% + 12px);
right:0;
min-width:240px;
background:#F0F7F4;
border:1px solid #C8DFD6;
border-radius:14px;
padding:8px;
box-shadow:0 20px 48px rgba(30,51,48,.18), 0 0 0 1px rgba(200,223,214,.6);
opacity:0;
visibility:hidden;
transform:translateY(-8px);
transition:.2s ease;
z-index:70;
}
.user-wrap.is-open .user-menu{
opacity:1;
visibility:visible;
transform:translateY(0);
}
.user-menu-head{
padding:12px 14px;
border-bottom:1px solid #C8DFD6;
margin-bottom:6px;
}
.user-menu-head b{
display:block;
font-family:'Philosopher',serif;
font-style:italic;
font-size:16px;
font-weight:700;
color:#1E3330;
margin-bottom:2px;
}
.user-menu-head span{
font-size:12.5px;
color:#5A7A74;
font-family:'Inter',sans-serif;
font-style:normal;
}
.user-menu-item{
display:flex;
align-items:center;
gap:12px;
padding:11px 14px;
border-radius:10px;
font-family:'Philosopher',serif;
font-style:italic;
font-size:15px;
color:#2F4A44;
text-decoration:none;
transition:.15s;
cursor:pointer;
border:0;
background:transparent;
width:100%;
text-align:left;
}
.user-menu-item:hover{
background:rgba(74,158,142,.12);
color:#1E3330;
}
.user-menu-item .ico{
font-size:18px;
width:22px;
text-align:center;
flex-shrink:0;
}
.user-menu-item .badge{
margin-left:auto;
padding:2px 8px;
border-radius:8px;
font-size:10.5px;
font-weight:600;
font-family:'Inter',sans-serif;
font-style:normal;
background:rgba(74,158,142,.15);
color:#357A6E;
}
.user-menu hr{
border:0;
border-top:1px solid #C8DFD6;
margin:6px 8px;
}
.user-menu-item.danger{ color:#C08878 }
.user-menu-item.danger:hover{ background:rgba(192,136,120,.10); color:#C08878 }
.user-menu-item .ico-badge{
margin-left:auto;
display:inline-flex;
align-items:center;
justify-content:center;
min-width:18px;
height:18px;
padding:0 5px;
border-radius:9px;
background:#C08878;
color:#F0F7F4;
font-size:10.5px;
font-family:'Inter',sans-serif;
font-style:normal;
font-weight:700;
}
/* Адаптив */
@media(max-width:520px){
.user-menu{ right:-60px; min-width:220px }
}
/* ================= КАРТА ЗАМКА (модалка) ================= */
.castle-map-modal{
width: min(1100px, 100%);
max-height: 92vh;
padding: 0;
overflow: hidden;
display: flex;
flex-direction: column;
background: #F0F7F4;
text-align: left;
}
.castle-map-head{
padding: 22px 32px 18px;
border-bottom: 1px solid var(--line, #C8DFD6);
background: linear-gradient(180deg, #E4F0EC, #F0F7F4);
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 16px;
flex-shrink: 0;
}
.castle-map-head h2{
font-family: 'Philosopher', serif;
font-style: italic;
font-size: clamp(22px, 3vw, 32px);
color: #1E3330;
margin: 0 0 6px;
}
.castle-map-head p{
font-family: 'Philosopher', serif;
font-style: italic;
color: #2F4A44;
font-size: 14.5px;
margin: 0;
line-height: 1.5;
}
.castle-map-close{
width: 38px; height: 38px;
border-radius: 50%;
border: 1px solid var(--line, #C8DFD6);
background: transparent;
color: #2F4A44;
font-size: 16px;
display: grid; place-items: center;
cursor: pointer;
transition: .18s;
flex-shrink: 0;
}
.castle-map-close:hover{ border-color: #4A9E8E; color: #357A6E; background: rgba(74,158,142,.08); }
.castle-map-body{
flex: 1;
overflow-y: auto;
padding: 22px 32px 32px;
background: #F0F7F4;
}
.castle-map-body::-webkit-scrollbar{ width: 8px }
.castle-map-body::-webkit-scrollbar-thumb{ background: #C8DFD6; border-radius: 4px }
/* ---- Зона ---- */
.cm-zone{ margin-bottom: 22px; }
.cm-zone-title{
display: flex;
align-items: center;
gap: 10px;
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 16px;
font-weight: 700;
color: #357A6E;
text-transform: uppercase;
letter-spacing: .08em;
margin-bottom: 14px;
padding-bottom: 8px;
border-bottom: 1px dashed var(--line, #C8DFD6);
}
.cm-zone-title::before{
content: '';
width: 6px; height: 6px;
border-radius: 50%;
background: #4A9E8E;
}
/* ---- Сетка комнат ---- */
.cm-grid{
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 12px;
}
/* ---- Карточка комнаты ---- */
.cm-card{
padding: 16px 18px;
border: 1px solid var(--line, #C8DFD6);
border-radius: 12px;
background: #fff;
transition: .2s;
cursor: pointer;
position: relative;
overflow: hidden;
}
.cm-card:hover{
border-color: #4A9E8E;
box-shadow: 0 8px 22px rgba(74,158,142,.10);
}
.cm-card.is-open{
border-color: #4A9E8E;
background: #F7FBF9;
}
.cm-card-head{
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 0;
transition: margin .25s;
}
.cm-card.is-open .cm-card-head{ margin-bottom: 12px; }
.cm-card-ico{
width: 42px; height: 42px;
border-radius: 12px;
display: grid; place-items: center;
font-size: 22px;
background: rgba(74,158,142,.10);
border: 1px solid rgba(74,158,142,.20);
flex-shrink: 0;
}
.cm-card-name{
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 16px;
font-weight: 700;
color: #1E3330;
line-height: 1.15;
flex: 1;
}
.cm-card-arrow{
color: #7A9690;
font-size: 14px;
transition: transform .25s;
}
.cm-card.is-open .cm-card-arrow{ transform: rotate(180deg); color: #357A6E; }
.cm-card-desc{
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 14px;
color: #2F4A44;
line-height: 1.6;
max-height: 0;
overflow: hidden;
transition: max-height .3s ease;
margin: 0;
}
.cm-card.is-open .cm-card-desc{ max-height: 500px; }
.cm-card-desc p{ margin: 0 0 10px; }
.cm-card-desc p:last-child{ margin-bottom: 14px; }
.cm-card-meta{
display: flex;
flex-wrap: wrap;
gap: 6px;
margin-top: 10px;
padding-top: 10px;
border-top: 1px dashed var(--line, #C8DFD6);
}
.cm-card-meta span{
padding: 3px 10px;
border-radius: 999px;
background: rgba(74,158,142,.10);
border: 1px solid rgba(74,158,142,.18);
font-size: 11.5px;
color: #357A6E;
font-family: 'Inter', sans-serif;
font-style: normal;
}
.cm-card-link{
display: inline-flex;
align-items: center;
gap: 6px;
margin-top: 12px;
padding: 8px 14px;
border-radius: 8px;
background: linear-gradient(135deg, #5FB3A2, #4A9E8E);
color: #F0F7F4;
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 13.5px;
text-decoration: none;
transition: .18s;
}
.cm-card-link:hover{ transform: translateX(3px); box-shadow: 0 6px 16px rgba(74,158,142,.3); }
/* ---- Декоративная SVG-карта сверху ---- */
.cm-schema{
margin-bottom: 26px;
padding: 20px;
background: #fff;
border: 1px solid var(--line, #C8DFD6);
border-radius: 14px;
text-align: center;
}
.cm-schema svg{
max-width: 100%;
height: auto;
max-height: 220px;
}
/* ---- Адаптив ---- */
@media (max-width: 820px){
.castle-map-head{ padding: 18px 20px 14px; }
.castle-map-body{ padding: 18px 20px 24px; }
.cm-grid{ grid-template-columns: 1fr; }
}
/* ================= ROOM-HERO (шапка зала) — светлая ================= */
.room-hero{
padding: 48px 0 36px;
background: #F0F7F4 !important;
color: #2F4A44 !important;
border-bottom: 1px solid #C8DFD6;
position: relative;
}
.room-hero--stone,
.room-hero--purple,
.room-hero--burgundy,
.room-hero--rose{
background: linear-gradient(180deg, #E4F0EC, #F0F7F4) !important;
color: #2F4A44 !important;
}
.room-hero .kicker{ color: #4A9E8E !important; }
.room-hero .kicker::after{ background: linear-gradient(90deg, #4A9E8E, transparent) !important; }
.room-hero h1{
color: #1E3330 !important;
font-family: 'Philosopher', serif;
font-style: italic;
font-size: clamp(28px, 4vw, 44px) !important;
margin: 0 0 16px;
line-height: 1.15;
}
.room-hero .sub{
color: #2F4A44 !important;
font-size: 16.5px;
line-height: 1.6;
max-width: 720px;
}
.room-hero .hall-hero-stats{
display: flex; gap: 32px; flex-wrap: wrap;
padding-top: 22px;
margin-top: 24px;
border-top: 1px solid #C8DFD6;
}
.room-hero .stat b{
display: block;
font-family: 'Philosopher', serif;
font-style: italic;
font-size: 26px;
color: #357A6E !important;
line-height: 1;
}
.room-hero .stat span{
font-size: 12px;
color: #5A7A74 !important;
letter-spacing: .06em;
text-transform: uppercase;
font-family: 'Inter', sans-serif;
font-style: normal;
}
/* Убираем декоративный ::before с тёмной точкой */
.room-hero::before{ display: none !important; }
/* ========================================================
ФОРС-КОНТРАСТ (в самом конце файла, побеждает всё)
======================================================== */
/* Страница — всегда светлая */
html, body{
background: #F0F7F4 !important;
color: #2F4A44 !important;
}
/* Все секции — светлые по умолчанию */
section,
.section,
.sec-light,
.sec-parchment,
.about-hall,
.room-hero,
.custom-block,
.catalog,
.hall-hero,
.section--tight,
.sec-olive{
background-color: #F0F7F4 !important;
color: #2F4A44 !important;
}
/* Чередование: пергамент */
.sec-parchment,
.about-hall{
background-color: #E4F0EC !important;
}
/* Все заголовки — тёмные */
h1, h2, h3, h4, h5, h6{
color: #1E3330 !important;
}
/* Все абзацы и текст */
p, span:not(.badge):not(.tag):not(.kicker),
li, div:not([class]):not(.stat):not(.kicker),
label, small, strong, em, i, b:not(.logo){
color: #2F4A44;
}
/* Кикеры — изумрудные */
.kicker{
color: #4A9E8E !important;
}
/* ЗАМОК и логотип — тёмные */
.logo b{ color: #1E3330 !important; }
.logo span{ color: #4A9E8E !important; }
/* Меню — тёмное */
.nav a{ color: #2F4A44 !important; }
.nav a:hover{ color: #357A6E !important; }
/* Кнопки — оставляем изумрудные, но текст светлый */
.btn-primary{
background: linear-gradient(180deg, #5FB3A2, #4A9E8E) !important;
color: #F0F7F4 !important;
}
/* Иконки шапки — тёмные */
.icon-btn{ color: #2F4A44 !important; }
/* --- Исключения: только винные секции остаются тёмными --- */
.sec-wine,
section.secret,
#secret{
background-color: #2E5D5A !important;
background-image: linear-gradient(180deg, #2E5D5A, #1E4340) !important;
color: #F0F7F4 !important;
}
.sec-wine h1, .sec-wine h2, .sec-wine h3,
section.secret h1, section.secret h2, section.secret h3,
#secret h1, #secret h2, #secret h3{
color: #F0F7F4 !important;
}
.sec-wine p, .sec-wine span,
section.secret p, section.secret .secret-text,
#secret p, #secret .secret-text{
color: #E4F0EC !important;
}
.sec-wine .kicker,
section.secret .kicker,
#secret .kicker{
color: #7FB89C !important;
}
/* Футер — всегда тёмный */
.footer{
background: linear-gradient(180deg, #1E3330, #142421) !important;
color: #E4F0EC !important;
}
.footer .f-brand b{ color: #7FB89C !important; }
.footer .f-brand .tag{ color: #7FB89C !important; }
.footer .f-brand p{ color: #B8D0C9 !important; }
.footer .f-ship{ color: #7A9690 !important; }
.footer .f-col h4{ color: #7FB89C !important; }
.footer .f-col a{ color: #B8D0C9 !important; }
.footer .f-col a:hover{ color: #7FB89C !important; }
.footer .f-bottom{ color: #7A9690 !important; border-top-color: rgba(200,223,214,.15) !important; }
/* ========================================================
МОБИЛЬНЫЙ ФОРС-ФИКС
======================================================== */
@media(max-width: 820px){
html, body{
background: #F0F7F4 !important;
color: #2F4A44 !important;
}
section, .section, .sec-light, .sec-parchment,
.about-hall, .room-hero, .custom-block, .catalog,
.hall-hero, .section--tight{
background-color: #F0F7F4 !important;
}
.sec-parchment, .about-hall{
background-color: #E4F0EC !important;
}
h1, h2, h3, h4, h5, h6{ color: #1E3330 !important; }
p, span, li, label, small, strong, em{ color: #2F4A44; }
.kicker{ color: #4A9E8E !important; }
.room-hero h1{ font-size: 26px !important; }
.room-hero .sub{ font-size: 15px !important; }
.about-hall h2{ font-size: 22px !important; }
}
/* Тёмная тема */
html.dark, html.dark body{
background: #0F1F1D !important;
color: #B8D0C9 !important;
}
html.dark section,
html.dark .section,
html.dark .sec-light,
html.dark .sec-parchment,
html.dark .about-hall,
html.dark .room-hero{
background-color: #152826 !important;
color: #B8D0C9 !important;
}
html.dark h1, html.dark h2, html.dark h3, html.dark h4{
color: #E8F2EE !important;
}
html.dark p, html.dark span, html.dark li{ color: #B8D0C9; }
html.dark .kicker{ color: #7FB89C !important; }