/* Starikov Journal — публичная часть и общие элементы. Тёмная строгая тема, стекло, без неона. */
:root{--bg:#08080C;--bg2:#0D0D13;--ink:#F3F2F7;--mute:#9A9BAE;--dim:#5F6074;--line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.2);--glass:rgba(255,255,255,.035);--glass2:rgba(255,255,255,.07);--ac:#8583FF;--ac-soft:rgba(133,131,255,.16);--ok:#7CD9A6;--warn:#E3B86B;--err:#FF7A88;--r:6px;--r2:14px;--fd:'Unbounded',system-ui,sans-serif;--fb:'Manrope',system-ui,sans-serif;--fm:'JetBrains Mono',ui-monospace,Menlo,monospace;--wrap:1240px}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);-webkit-text-size-adjust:100%}
body{min-height:100vh;background:var(--bg);color:var(--ink);font:16px/1.55 var(--fb);-webkit-font-smoothing:antialiased;overflow-x:hidden;display:flex;flex-direction:column}
img{max-width:100%;display:block}
a{color:var(--ink);text-decoration:none;transition:color .2s}a:hover{color:var(--ac)}
::selection{background:var(--ac);color:#fff}
[hidden]{display:none!important}
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(1200px 600px at 15% -10%,rgba(133,131,255,.14),transparent 60%),radial-gradient(ellipse 450px 250px at 85% 65%,rgba(133,131,255,.07),transparent 100%)}
.bg::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1.2px);background-size:36px 36px;mask-image:radial-gradient(ellipse at 50% 0%,#000 20%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse at 50% 0%,#000 20%,transparent 75%)}
main,.masthead,.site-foot,.topbar{position:relative;z-index:1}
main{flex:1;width:100%}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 32px}
.k{font-family:var(--fm);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.k.ac{color:var(--ac)}.k.ink{color:var(--mute)}
.muted{color:var(--mute)}
.glass{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));border:1px solid var(--line);border-radius:var(--r2);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 30px 60px -40px rgba(0,0,0,.9)}
/* Типографика */
h1,h2,h3,h4{font-family:var(--fd);font-weight:500;letter-spacing:-.03em;line-height:1.08;text-wrap:balance}
h1{font-size:clamp(30px,4.2vw,52px)}h2{font-size:clamp(22px,2.4vw,30px)}h3{font-size:19px}h4{font-size:15px;letter-spacing:-.01em}
/* Кнопки — общий вид всех <button> и .btn */
button,.btn{font:inherit;font-weight:600;font-size:14px;color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:0 22px;border-radius:999px;border:1px solid var(--line2);background:rgba(255,255,255,.03);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);white-space:nowrap;text-decoration:none;transition:background .22s,border-color .22s,color .22s,transform .22s,opacity .22s}
button:hover:not(:disabled),.btn:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.07)}
button:disabled{cursor:default;opacity:.4}
.solid,button.solid{background:#fff;color:#0B0B10;border-color:#fff}
.solid:hover:not(:disabled),button.solid:hover:not(:disabled){background:var(--ac);border-color:var(--ac);color:#fff}
.sm,button.sm{min-height:36px;padding:0 14px;font-size:13px}
.danger,button.danger{color:var(--err);border-color:rgba(255,122,136,.35)}
.danger:hover:not(:disabled),button.danger:hover:not(:disabled){border-color:var(--err);background:rgba(255,122,136,.1);color:var(--err)}
.quiet,button.quiet{border-color:transparent;background:transparent;color:var(--mute)}
.quiet:hover:not(:disabled),button.quiet:hover:not(:disabled){background:rgba(255,255,255,.05);color:var(--ink);border-color:transparent}
.btn .ar,button .ar{font-family:var(--fm);font-size:13px;opacity:.8}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[contenteditable]:focus-visible{outline:2px solid var(--ac);outline-offset:3px}
/* Поля */
input:not([type=file]):not([type=hidden]),select,textarea{font:inherit;color:var(--ink);width:100%;min-height:46px;padding:10px 14px;background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:var(--r);transition:border-color .2s,background .2s}
input:not([type=file]):focus,select:focus,textarea:focus{outline:0;border-color:var(--ac);background:rgba(0,0,0,.4)}
input::placeholder,textarea::placeholder{color:var(--dim)}
input:read-only:not([type=file]){color:var(--mute);background:rgba(255,255,255,.02)}
select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--mute) 50%),linear-gradient(135deg,var(--mute) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
select option{background:#14141C;color:var(--ink)}
textarea{resize:vertical;line-height:1.55}
label{display:grid;gap:8px;font-size:13px;font-weight:600;color:var(--mute)}
input[type=file]{font:inherit;font-size:13px;color:var(--mute);max-width:100%}
input[type=file]::file-selector-button{font:inherit;font-weight:600;font-size:13px;color:var(--ink);background:rgba(255,255,255,.04);border:1px solid var(--line2);border-radius:999px;padding:8px 14px;margin-right:12px;cursor:pointer}
input[type=file]::file-selector-button:hover{border-color:#fff}
/* Прогресс-бар */
progress{appearance:none;-webkit-appearance:none;width:100%;height:3px;border:0;border-radius:2px;background:rgba(255,255,255,.12);overflow:hidden;display:block;color:var(--ac);accent-color:var(--ac)}
progress::-webkit-progress-bar{background:rgba(255,255,255,.12);border-radius:2px}
progress::-webkit-progress-value{background:var(--ac);border-radius:2px;transition:width .5s cubic-bezier(.16,1,.3,1)}
progress::-moz-progress-bar{background:var(--ac);border-radius:2px}
/* Шапка публичной части (скрыта внутри Tilda-iframe — там шапка сайта) */
.masthead{border-bottom:1px solid var(--line);background:rgba(8,8,12,.6);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.masthead .wrap{height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:inline-flex;align-items:center;gap:16px;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand .logo{width:150px;height:38px;background:url("logo.svg") left center/contain no-repeat;filter:brightness(0) invert(1);flex-shrink:0}
.brand .sep{width:1px;height:22px;background:var(--line2)}
.brand .k{color:var(--mute)}
.masthead nav{display:flex;align-items:center;gap:8px}
.site-foot{border-top:1px solid var(--line);margin-top:96px}
.site-foot .wrap{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.site-foot .k a{color:var(--mute)}.site-foot .k a:hover{color:var(--ink)}
/* Журнал */
.j-head{padding:56px 0 40px;display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end}
.j-head h1{font-size:clamp(44px,7vw,96px);font-weight:700;letter-spacing:-.045em;line-height:.92}
.j-head p{color:var(--mute);max-width:44ch;margin-top:18px;font-size:16px;text-wrap:pretty}
.seg{display:inline-flex;gap:2px;padding:4px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03);backdrop-filter:blur(10px)}
.seg a{padding:10px 18px;border-radius:999px;font-size:13px;font-weight:600;color:var(--mute);white-space:nowrap}
.seg a:hover{color:var(--ink)}.seg a.on{background:#fff;color:#0B0B10}
.j-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:8px 0 24px}
.card{display:flex;flex-direction:column;overflow:hidden;position:relative;transition:border-color .25s,transform .25s}
.card:hover{border-color:var(--line2);transform:translateY(-2px)}
.card .cover{position:relative;aspect-ratio:16/10;flex:none;background:#000;overflow:hidden;border-bottom:1px solid var(--line)}
.card .cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.card:hover .cover img{transform:scale(1.03)}
.card .cover.none{display:grid;place-items:center;background:linear-gradient(135deg,rgba(255,255,255,.04),transparent)}
.card .cover.none span{font-family:var(--fd);font-size:36px;color:rgba(255,255,255,.12);letter-spacing:-.04em}
.card .body{padding:20px 22px 22px;display:grid;gap:12px;align-content:start;flex:1}
.card .meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.card .meta .closed{color:var(--warn)}
.card h2{font-size:20px;line-height:1.2}
.card h2 a::after{content:"";position:absolute;inset:0}
.card p{color:var(--mute);font-size:14.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .foot{margin-top:auto;padding-top:8px;display:flex;justify-content:space-between;align-items:center}
.card .foot .go{font-family:var(--fm);font-size:12px;color:var(--mute);transition:color .2s,transform .2s}
.card:hover .foot .go{color:var(--ink);transform:translateX(4px)}
.card.is-poll .cover::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,8,12,.5),transparent 50%);pointer-events:none}
.pager{display:flex;justify-content:center;align-items:center;gap:14px;padding:40px 0 8px}
.pager .k{padding:0 8px}
.empty{padding:72px 32px;text-align:center;display:grid;gap:14px;justify-items:center}
.empty .mark{width:64px;height:64px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;font-family:var(--fd);color:var(--mute);font-size:22px}
.empty h2{font-size:24px}.empty p{color:var(--mute);max-width:40ch;text-wrap:pretty}
/* Статья */
.a-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:28px 0 0}
.a-top a.back{font-family:var(--fm);font-size:12px;letter-spacing:.06em;color:var(--mute)}.a-top a.back:hover{color:var(--ink)}
.notice{display:flex;gap:14px;align-items:center;padding:14px 18px;border:1px solid rgba(227,184,107,.35);background:rgba(227,184,107,.07);border-radius:var(--r);color:var(--ink);font-size:14px;margin:28px 0 0}
.notice::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--warn);flex-shrink:0}
.article{max-width:760px;margin:0 auto;padding:48px 0 0}
.article .meta{display:flex;gap:14px;align-items:center;margin-bottom:22px}
.article h1{font-size:clamp(32px,4.6vw,56px);font-weight:700;letter-spacing:-.04em;line-height:1}
.article .lead{font-size:clamp(17px,1.6vw,21px);line-height:1.5;color:var(--mute);margin-top:22px;text-wrap:pretty}
.article .cover{margin:40px 0 0;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:#000;box-shadow:0 40px 80px -40px rgba(0,0,0,.9)}
.article .cover img{width:100%;height:auto}
.prose{margin-top:44px;font-size:17.5px;line-height:1.72;color:#D6D6DF;overflow-wrap:anywhere}
.prose>*+*{margin-top:1.2em}
.prose h2{font-size:clamp(24px,2.4vw,32px);color:var(--ink);margin-top:2.2em;padding-top:1.1em;border-top:1px solid var(--line)}
.prose h3{color:var(--ink);font-size:21px;margin-top:1.8em}
.prose p b,.prose p strong{color:var(--ink);font-weight:600}
.prose a{color:var(--ink);border-bottom:1px solid var(--line2)}.prose a:hover{color:var(--ac);border-color:var(--ac)}
.prose ul,.prose ol{padding-left:0;list-style:none;display:grid;gap:10px}
.prose li{position:relative;padding-left:32px}
.prose ul li::before{content:"—";position:absolute;left:0;color:var(--dim)}
.prose ol{counter-reset:li}.prose ol li::before{counter-increment:li;content:counter(li,decimal-leading-zero);position:absolute;left:0;top:.2em;font-family:var(--fm);font-size:12px;color:var(--ac)}
.prose img{border-radius:var(--r);border:1px solid var(--line);margin:1.6em 0;background:#000}
.prose blockquote{border-left:2px solid var(--ac);padding:4px 0 4px 24px;color:var(--ink);font-family:var(--fd);font-weight:500;font-size:20px;line-height:1.35;letter-spacing:-.02em}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}
.a-end{max-width:760px;margin:64px auto 0;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
/* Опрос */
.poll{max-width:1120px;margin:0 auto;padding-top:40px;display:grid;gap:26px}
.poll-top{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:end}
.poll-top h1{font-size:clamp(26px,3.4vw,42px);max-width:26ch}
.poll-top .desc{color:var(--mute);margin-top:12px;max-width:60ch;text-wrap:pretty}
.poll-top .k{white-space:nowrap}
#progress{font-family:var(--fm);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);white-space:nowrap;text-align:right}
#progress:empty{display:none}
.poll-track{display:grid;gap:12px}
.poll-track .hint{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.choices:empty{display:none}
.choice{display:grid;gap:14px;padding:12px;border-radius:var(--r2);opacity:0;transform:translateY(10px);animation:in .5s cubic-bezier(.16,1,.3,1) forwards}
.choice:nth-child(2){animation-delay:.08s}
@keyframes in{to{opacity:1;transform:none}}
.choice-frame{position:relative;aspect-ratio:4/3;background:#000;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:block}
.choice-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .45s}
.choice-frame img.ok{opacity:1}
.choice-frame::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.05) 50%,transparent 70%);background-size:220% 100%;animation:sh 1.6s linear infinite}
.choice-frame.ok::before{display:none}
@keyframes sh{from{background-position:120% 0}to{background-position:-120% 0}}
.choice-frame .zoom{position:absolute;right:10px;bottom:10px;font-family:var(--fm);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:rgba(8,8,12,.7);border:1px solid var(--line);padding:5px 8px;border-radius:3px;opacity:0;transition:opacity .25s}
.choice-frame:hover .zoom{opacity:1}
.choice:hover .choice-frame{border-color:var(--line2)}
.choice>button{width:100%;min-height:52px}
.choice .n{font-family:var(--fm);font-size:11px;letter-spacing:.14em;color:var(--dim);position:absolute;left:10px;top:10px;background:rgba(8,8,12,.7);padding:5px 8px;border-radius:3px;border:1px solid var(--line);z-index:1;white-space:nowrap}
#message{font-size:14.5px;color:var(--mute);min-height:1.5em;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#message:empty{display:none}
.poll .row{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
#standalone{font-size:13.5px;color:var(--mute)}#standalone a{color:var(--ink);border-bottom:1px solid var(--line2)}
#poll[data-state=error] #message{color:var(--err)}
#poll[data-state=error] .choice-frame::before{display:none}
#poll[data-state=done] .poll-track,#poll[data-state=closed] .poll-track{display:none}
.final{display:none;padding:64px 40px;text-align:center;justify-items:center;gap:18px}
#poll[data-state=done] .final,#poll[data-state=closed] .final{display:grid}
.final .ring{width:72px;height:72px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;font-family:var(--fm);color:var(--ac);font-size:22px;animation:pop .6s cubic-bezier(.16,1,.3,1)}
@keyframes pop{from{transform:scale(.7);opacity:0}}
.final h2{font-size:clamp(26px,3vw,36px)}
.final p{color:var(--mute);max-width:44ch;text-wrap:pretty}
#poll[data-state=done] .final .closed-only,#poll[data-state=closed] .final .done-only{display:none}
.poll-foot{text-align:center}
/* Вход, ошибка */
.center{min-height:calc(100vh - 148px);display:grid;place-items:center;padding-top:40px;padding-bottom:40px}
.auth{width:100%;max-width:420px;padding:40px;display:grid;gap:24px}
.auth .brand{justify-content:flex-start}
.auth h1{font-size:26px}
.auth form{display:grid;gap:16px}
.auth [role=alert]{color:var(--err);font-size:14px;display:flex;gap:10px;align-items:center}
.auth [role=alert]::before{content:"!";font-family:var(--fm);width:20px;height:20px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;font-size:12px;flex-shrink:0}
.auth .k{text-align:center}
.err{text-align:center;display:grid;gap:18px;justify-items:center;max-width:520px;padding:0 20px}
.err .code{font-family:var(--fd);font-weight:700;font-size:clamp(72px,12vw,140px);line-height:.85;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.55)}
.err h1{font-size:26px}.err p{color:var(--mute);text-wrap:pretty}
/* Встраивание в Tilda: шапку сайта рисует Tilda, свою не дублируем */
html.embedded,html.embedded body{background:var(--bg)}
html.embedded .masthead,html.embedded .site-foot{display:none}
html.embedded .j-head{padding-top:24px}
html.embedded .poll,html.embedded .article{padding-top:12px}
html.embedded body{min-height:0}html.embedded .center{min-height:0}
html.embedded.embedded-synced{overflow:hidden}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media (max-width:980px){.j-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){
.wrap{padding:0 18px}
.masthead .wrap{height:64px}.brand .logo{width:120px;height:32px}.brand .sep,.masthead nav .hide-m{display:none}
.j-head{grid-template-columns:1fr;padding:40px 0 24px;gap:22px}.j-head h1{font-size:44px}
.seg{width:100%;overflow-x:auto}.seg a{flex:1;text-align:center;padding:10px 12px}
.j-grid{grid-template-columns:1fr;gap:14px}
.article{padding-top:28px}.prose{font-size:16.5px}
.poll{padding-top:20px;gap:18px}.poll-top{grid-template-columns:1fr;align-items:start}#progress{text-align:left}
.choices{grid-template-columns:1fr;gap:14px}.choice{padding:8px}.choice-frame{aspect-ratio:4/3}
.final{padding:44px 20px}
.auth{padding:28px 22px}
.site-foot{margin-top:56px}
}

/* Embedded pages size to content, including long-to-short navigation. */
html.embedded body{display:block;min-height:0}
html.embedded main{display:flow-root}
html.embedded .bg{display:block}
h1,h2,h3,.entry-title{overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Public typography stays the same before and after font downloads. */
body:has(.j-head),body:has(article.article),body:has(#poll){
  --fd:Arial,Helvetica,sans-serif;
  --fb:Arial,Helvetica,sans-serif;
  --fm:ui-monospace,Consolas,monospace;
}

.choice-description{padding:16px 18px;color:var(--ink);font-size:15px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;text-align:left}
.choice > button{margin-top:auto}

/* Keep media geometry stable; reveal decoded images without layout shifts. */
#message:empty{display:none}
.choice{animation-duration:.22s}
.choice-frame img{transition:opacity .25s ease}
@media(prefers-reduced-motion:reduce){.choice{animation:none;opacity:1;transform:none}.choice-frame img{transition:none}}

/* Fade lighting inside the iframe before its lower edge. */
.bg{mask-image:linear-gradient(to bottom,#000 0%,#000 55%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 55%,transparent 100%)}
.stats-video{width:200px;min-width:200px;aspect-ratio:16/9;overflow:hidden;border-radius:8px}
.stats-video .sp-video{width:100%;height:100%;min-height:0}
.stats-video .sp-video .big .ring{width:40px;height:40px}
.stats-video .sp-video .tm{display:none}
