/* ═══ css/theme.css · LIGHT / DARK (9 Oct 2026) ═══════════════════════════════
   GENERATED by build/academia-platform/board/sunset-sites/make_theme_css.py
   from sunset-base.css + sunset-shop.css + theme-layout-shop.css + theme-extra-shop.css.
   Edit THOSE files and run the script; edits made here are lost on the next run.
   Purple stays the default. Everything under html[data-theme="light"] is the
   light version (the brand book's sunset law, board frame N0). js/theme.js sets
   the attribute before the first paint and remembers the visitor's choice.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1 · the switch button, at the top of the page (both themes) ───────────── */
.themebtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:none;min-height:44px;min-width:44px;
  padding:0 16px;border-radius:999px;border:1.5px solid rgba(255,255,255,.28);background:rgba(255,255,255,.04);
  color:#F4EAE6;font:600 14px/1 var(--sans);letter-spacing:.01em;white-space:nowrap;cursor:pointer;
  -webkit-tap-highlight-color:transparent;transition:background-color .2s,border-color .2s,color .2s,transform .15s}
.themebtn[hidden]{display:none}
.themebtn:hover{border-color:rgba(240,183,96,.65);background:rgba(255,255,255,.08)}
.themebtn:active{transform:scale(.97)}
.themebtn:focus-visible{outline:3px solid #F0B760;outline-offset:2px}
.themebtn__ic{display:block;width:20px;height:20px;flex:none}
@media (max-width:760px){
  .themebtn{width:44px;padding:0}
  .themebtn__t{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
}
html[data-theme="light"] .themebtn{border-color:#4E213E;background:transparent;color:#4E213E}
html[data-theme="light"] .themebtn:hover{background:rgba(76,31,60,.06);border-color:#3A1E2F;color:#3A1E2F}
html[data-theme="light"] .themebtn:focus-visible{outline-color:#DD5A5F}
@media (prefers-reduced-motion:reduce){.themebtn{transition:none}.themebtn:active{transform:none}}

/* ── 1b · this site: where the button sits (both themes, theme-layout-shop.css) ── */
/* ── 1b · SHOP header, both themes (9 Oct 2026) ─────────────────────────────
   Measured at 320-1440 in both themes: the lockup, the five links, the switch
   and the sun «К турам» never overlap and never leave the screen, so the
   switch needs no new position. What was short is the size of three touch
   areas (rule: 44×44). Each is enlarged with an invisible layer only:
   nothing moves, nothing changes colour, the focus ring keeps its shape.
     sun «К турам», phones ≤430   91×38  → 91×44
     the lockup (home link)        112×31 / 141×38 → 45 / 52 tall
     the five links, ≥981px        «Автор» 43×24 → 45×45, the rest 45 tall
   ═══════════════════════════════════════════════════════════════════════ */
.sunbtn::before{content:"";position:absolute;left:0;right:0;top:-3px;bottom:-3px;border-radius:999px}
.nav__brand{position:relative}
.nav__brand::after{content:"";position:absolute;left:-2px;right:-2px;top:-7px;bottom:-7px}
.nav__links a{position:relative}
.nav__links a::after{content:"";position:absolute;left:-1px;right:-1px;top:-10.5px;bottom:-10.5px}

/* ── the switch is in the bar from the FIRST paint (9 Oct 2026, review DARK-1) ──
   It used to wait for js/theme.js to un-hide it on DOMContentLoaded. Coming back from
   privacy or 404 there is no plane loader, so the bar was painted without it and the five
   links then jumped 199px left (1280, Fast 3G: 2.6 s later; layout shift 0.004).
   The markup keeps its hidden attribute, so a browser with JavaScript OFF still never shows
   a switch that cannot work. (scripting:enabled) is the browser saying JS runs; browsers
   too old to know it keep the old behaviour. The second rule is ready for the proposed
   js/theme.js line root.classList.add('tg-theme-js'), which would also cover those. */
@media (scripting:enabled){.themebtn[hidden]{display:inline-flex}}
html.tg-theme-js .themebtn[hidden]{display:inline-flex}

/* ── 981-1010px: the switch is the round icon, as on phones (review F2) ──────────
   With a normal Windows scrollbar the page is 15px narrower than the media query
   thinks. At 981 the switch then sat 2.7px from «К ТУРАМ» and its focus ring reached the
   label. Round, it keeps the bar's normal 18.4px gap before the sun at every width
   (measured 981-1010 with a 15px scrollbar). From 1011px the words come back: the gap
   is 18.4px there too, even with a scrollbar up to 28px. */
@media (min-width:981px) and (max-width:1010px){
  .themebtn{width:44px;min-width:44px;padding:0}
  .themebtn__t{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
}

/* ── a phone has no hover: after a tap the switch must not keep the hover look (review F6) ── */
@media (hover:none){
  .themebtn:hover{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.04)}
  html[data-theme="light"] .themebtn:hover{background:transparent;border-color:#4E213E;color:#4E213E}
}

/* ── 2 · the light version: the sunset law, scoped ─────────────────────── */
html[data-theme="light"]{--bg-d:#FEF0E7; --panel-d:#FFFFFF; --band-d:#FFFFFF; --facts-d:#FFFFFF; --txt-d:#3A1E2F; --txt-d-mut:#6E4B55; --line-d:rgba(76,31,60,.14); --lift-d:0 2px 4px rgba(76,31,60,.05),0 16px 40px rgba(76,31,60,.10); --gold-lt:#8A5A2B; --sun-soft:linear-gradient(90deg,#8D6496,#E3878A 52%,#F3C27B);}
html[data-theme="light"]{color-scheme:light}
html[data-theme="light"] body{background:#FEF0E7;color:#6E4B55}
html[data-theme="light"] .btn--gold{color:#3A1E2F}
html[data-theme="light"] .btn--gold:hover{background:#E9A94E}
html[data-theme="light"] .btn--ghost,
html[data-theme="light"] .btn--ghost-light{background:transparent;color:#4E213E;border-color:#4E213E;box-shadow:none}
html[data-theme="light"] .btn--ghost:hover,
html[data-theme="light"] .btn--ghost-light:hover{background:rgba(76,31,60,.06);color:#3A1E2F;border-color:#3A1E2F;box-shadow:none}
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .eyebrow--d{color:#8A5A2B}
html[data-theme="light"] .glow::before{background: radial-gradient(52% 44% at 16% 10%,rgba(243,194,123,.22),rgba(243,194,123,0) 66%), radial-gradient(44% 40% at 88% 90%,rgba(227,135,138,.12),rgba(227,135,138,0) 68%)}
html[data-theme="light"] .glow--gold::before{background: radial-gradient(46% 42% at 80% 12%,rgba(243,194,123,.26),rgba(243,194,123,0) 64%), radial-gradient(56% 48% at 12% 92%,rgba(227,135,138,.12),rgba(227,135,138,0) 68%)}
html[data-theme="light"] .cons{background: radial-gradient(58% 46% at 50% 30%,rgba(243,194,123,.30),rgba(243,194,123,0) 72%), radial-gradient(70% 50% at 50% 112%,rgba(227,135,138,.16),rgba(227,135,138,0) 70%), #FCEADF}
html[data-theme="light"] .cons::before{opacity:.035}
html[data-theme="light"] .tk__pill::before,
html[data-theme="light"] .tk__pill::after{background:var(--sun-soft)}
html[data-theme="light"] .ftr{position:relative;background:#FFFFFF;color:#6E4B55}
html[data-theme="light"] .ftr::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--sun-soft)}
html[data-theme="light"] .ftr h3,
html[data-theme="light"] .ftr h4,
html[data-theme="light"] .ftr__brand span,
html[data-theme="light"] .ftr__motto{color:#8A5A2B}
html[data-theme="light"] .ftr a{color:#4E213E}
html[data-theme="light"] .ftr a:hover,
html[data-theme="light"] .ftr__legal a:hover{color:#3A1E2F}
html[data-theme="light"] .ftr .cc-reopen{color:#4E213E}
html[data-theme="light"] .nav{background:linear-gradient(90deg,#8D6496,#E3878A 52%,#F3C27B) top/100% 3px no-repeat,rgba(255,255,255,.97)}
html[data-theme="light"] .lockup__a{color:#8A5A2B}
html[data-theme="light"] .hero{background:#FEF0E7}
html[data-theme="light"] .hero::after{background:linear-gradient(0deg,#FFFFFF,rgba(255,255,255,0))}
html[data-theme="light"] .hero__scrim{background:linear-gradient(94deg,rgba(254,240,231,.96) 0%,rgba(254,240,231,.88) 40%,rgba(254,240,231,.5) 74%,rgba(254,240,231,.4) 100%)}
html[data-theme="light"] .hero--class .hero__scrim{background:linear-gradient(90deg,rgba(254,240,231,0) 0%,rgba(254,240,231,0) 40%,rgba(254,240,231,.88) 51%,#FEF0E7 57%,#FEF0E7 100%)}
@media (min-width:861px) and (max-width:1199px){
  html[data-theme="light"] .hero--class .hero__scrim{background:linear-gradient(90deg,rgba(254,240,231,0) 0%,rgba(254,240,231,0) 34%,rgba(254,240,231,.9) 46%,#FEF0E7 51%,#FEF0E7 100%)}
}
@media (max-width:860px){
  html[data-theme="light"] .hero--class .hero__scrim{background:linear-gradient(0deg,#FEF0E7,rgba(254,240,231,0))}
}
html[data-theme="light"] .facts__n{color:#C2454B}
html[data-theme="light"] .path b{color:#3A1E2F}
html[data-theme="light"] .mods__i{background:#FFFFFF}
html[data-theme="light"] .mods__i:hover{background:#FFF8F1}
html[data-theme="light"] .mods__n{color:#C2454B;opacity:.7}
html[data-theme="light"] .incl li{background:#FFFFFF;border-color:rgba(76,31,60,.12)}
html[data-theme="light"] .prac__scrim{background:linear-gradient(92deg,rgba(254,240,231,.97) 0%,rgba(254,240,231,.9) 44%,rgba(254,240,231,.4) 100%)}
html[data-theme="light"] .prac .h2,
html[data-theme="light"] .prac .h3{color:#3A1E2F}
html[data-theme="light"] .quote{background:#FFFFFF;border:1px solid rgba(76,31,60,.12); box-shadow:0 2px 4px rgba(76,31,60,.05),0 20px 50px rgba(76,31,60,.10)}
html[data-theme="light"] .quote::before{left:0;right:0;height:3px;border-radius:16px 16px 0 0;background:var(--sun-soft)}
html[data-theme="light"] .tar__i{background:#FFFFFF;border:1px solid rgba(76,31,60,.12);box-shadow:0 2px 4px rgba(76,31,60,.05),0 16px 40px rgba(76,31,60,.08)}
html[data-theme="light"] .tar__i::before{background:none}
html[data-theme="light"] .tar__i:hover{border-color:rgba(76,31,60,.24);box-shadow:0 2px 4px rgba(76,31,60,.06),0 20px 50px rgba(76,31,60,.12)}
html[data-theme="light"] .tar__i--hero{background:#FFFFFF;border-color:#F0B760;box-shadow:0 2px 4px rgba(76,31,60,.05),0 24px 60px rgba(76,31,60,.14)}
html[data-theme="light"] .tar__i--hero::before{left:0;right:0;height:4px;background:var(--sun-soft)}
html[data-theme="light"] .tar__i--hero .tar__name,
html[data-theme="light"] .tar__i--hero .tar__price,
html[data-theme="light"] .tar__i--hero .tar__list b{color:#3A1E2F}
html[data-theme="light"] .tar__name{color:#8A5A2B}
html[data-theme="light"] .docs__i{background:#FFFFFF;border-color:rgba(76,31,60,.12)}
html[data-theme="light"] .docs__who{color:#8A5A2B}
html[data-theme="light"] .held{background:#FEF0E7}
html[data-theme="light"] .held__motto{color:#4C1F3C}
html[data-theme="light"] .held__ru{color:#6E4B55}
html[data-theme="light"] .held__mark{filter:none}
html[data-theme="light"] .held::before{background: radial-gradient(58% 52% at 50% 112%,rgba(243,194,123,.34),rgba(243,194,123,0) 62%), radial-gradient(52% 46% at 16% -8%,rgba(141,100,150,.16),rgba(141,100,150,0) 64%), radial-gradient(48% 44% at 86% 4%,rgba(227,135,138,.18),rgba(227,135,138,0) 62%)}
html[data-theme="light"] .cons__kicker{color:#8A5A2B}
html[data-theme="light"] .ftr{background:#FFFFFF}
html[data-theme="light"] .hero h1{color:#3A1E2F}
html[data-theme="light"] .hero__lede{color:#6E4B55}
html[data-theme="light"] .hero__note{color:#7E5F67}
html[data-theme="light"] .hero__motto{color:#8A5A2B}
html[data-theme="light"] .quote__t,
html[data-theme="light"] .h2--onphoto{color:#3A1E2F}
html[data-theme="light"] .path b,
html[data-theme="light"] .sec--dark .path b,
html[data-theme="light"] .sec--plum .path b{color:#3A1E2F}
html[data-theme="light"] .tar__slog,
html[data-theme="light"] .tar__price,
html[data-theme="light"] .tar__note b{color:#3A1E2F}
html[data-theme="light"] .sunbtn__label{color:#6E4B55}
html[data-theme="light"] .sunbtn:hover .sunbtn__label,
html[data-theme="light"] .sunbtn:focus-visible .sunbtn__label{color:#3A1E2F}
html[data-theme="light"] .tally__label{color:#6E4B55}
html[data-theme="light"] .sec--lit{background:#FFFFFF}
html[data-theme="light"] .prac__scrim{background:linear-gradient(92deg,rgba(254,240,231,.97) 0%,rgba(254,240,231,.88) 46%,rgba(254,240,231,.2) 100%)}
@media (max-width:760px){
  html[data-theme="light"] .prac__scrim{background:linear-gradient(180deg,rgba(254,240,231,.93),rgba(254,240,231,.86))}
}

/* ── 3 · light-mode extras (states the board screenshots did not show) ───── */
html[data-theme="light"] :focus-visible{outline-color:#DD5A5F}
html[data-theme="light"] .ccard :focus-visible{outline-color:#9A630F}
html[data-theme="light"] .sunbtn:focus-visible .sunbtn__disc{box-shadow:0 0 0 2px #FFFFFF,0 0 0 5px #DD5A5F,0 0 22px rgba(243,194,123,.9),0 0 54px rgba(240,183,96,.55)}
html[data-theme="light"] ::selection{background:#F1D087;color:#3A1E2F}
@media (min-width:761px) and (max-width:980px),(min-width:1011px){
  html[data-theme="light"] .themebtn{min-width:172.5px}
}
html[data-theme="light"] .themebtn[hidden] .themebtn__t{font-size:0}
html[data-theme="light"] .themebtn[hidden] .themebtn__t::after{content:"\0422\0451\043C\043D\0430\044F\0020\0432\0435\0440\0441\0438\044F";font-size:14px}
@media (max-width:860px){
  html[data-theme="light"] .hero--class .hero__in{z-index:2}
}
html[data-theme="light"] .split__fig .mplane--light{--mp-ink:#2E1128;--mp-trail:#9A630F;--mp-guide:rgba(46,17,40,.16);--mp-txt:#5A4453}
html[data-theme="light"] .split__fig .mplane--light .mplane__plane{filter:drop-shadow(0 3px 3px rgba(46,17,40,.22))}
html[data-theme="light"] .mods__n{opacity:.8}
html[data-theme="light"] .faq__i summary::after{border-color:#8A5A2B}
html[data-theme="light"] .event::before{background:linear-gradient(135deg,#8D6496 0%,#E3878A 52%,#F3C27B 100%)}
html[data-theme="light"] .event::after{background:linear-gradient(135deg,#8D6496 0%,#E3878A 52%,#F3C27B 100%);opacity:.3}
html[data-theme="light"] .event:hover::after{opacity:.5}
html[data-theme="light"] .held__gift .mk__note{opacity:1;color:#7E5F67}
html[data-theme="light"] .ccard__face{box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -40px 60px -50px rgba(110,60,30,.16), 0 1px 0 #EAD9C9,0 2px 0 #E2CEBC,0 3px 0 #D9C3AF,0 4px 0 #CFB7A1,0 5px 0 #C4AA92, 0 6px 2px rgba(76,31,60,.16),0 24px 34px -14px rgba(76,31,60,.22),0 70px 100px -40px rgba(76,31,60,.26)}
html[data-theme="light"] .tk__lbl em{opacity:1}
@media (min-width:761px){
  html[data-theme="light"] .prac__scrim{background:linear-gradient(92deg,rgba(254,240,231,.97) 0,rgba(254,240,231,.9) max(740px,calc(50% + 150px)),rgba(254,240,231,.3) 100%)}
}