@font-face{font-family:'PT Serif';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/EJRVQgYoZZY2vCFuvAFbzr-tdg.woff2') format('woff2');unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'PT Serif';font-style:italic;font-weight:400;font-display:swap;src:url('/fonts/EJRTQgYoZZY2vCFuvAFT_rm1chb-.woff2') format('woff2');unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/EJRVQgYoZZY2vCFuvAFYzr-tdg.woff2') format('woff2');unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/EJRVQgYoZZY2vCFuvAFWzr8.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:'PT Serif';font-style:italic;font-weight:400;font-display:swap;src:url('/fonts/EJRTQgYoZZY2vCFuvAFT_r21cg.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/EJRSQgYoZZY2vCFuvAnt66qSVys.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
/* ============================ основа ============================ */
*{box-sizing:border-box}
[hidden]{display:none !important}
:root{
  --bg:#14100C; --bg-2:#1A150F; --panel:#221B14; --panel-2:#2A2219;
  --edge:rgba(242,233,217,.11); --edge-2:rgba(242,233,217,.055);
  --ink:#F3EBDB; --ink-2:rgba(243,235,219,.68); --ink-3:rgba(243,235,219,.66);
  --brass:#D9AC61; --brass-d:#A87C3A; --brass-bg:rgba(217,172,97,.13);
  --paper:#F6EEDE; --paper-2:#EBE1CC; --paper-3:#DFD3B9;
  --pink:#2C241A; --paper-ink:#2C241A; --paper-ink-2:#6C6252;
  --green:#33483B; --red:#7C312A;
  --serif:'PT Serif',Georgia,'Iowan Old Style','Times New Roman',serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,'Liberation Mono',monospace;
  --topbar:62px; --rail:292px; --radius:10px;
  --shadow:0 18px 44px rgba(0,0,0,.5);
}
html{scroll-behavior:smooth}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans);
  font-size:15px; line-height:1.5; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility}
body.lock{overflow:hidden}
img{display:block; max-width:100%}
button,input,select,textarea{font:inherit; color:inherit}
button{background:none; border:0; cursor:pointer; padding:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--brass); outline-offset:2px; border-radius:4px}
::selection{background:rgba(217,172,97,.3)}

/* текстура комнаты: тёплый свет сверху и дерево */
body::before{content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(120% 60% at 50% -12%, rgba(255,196,120,.13), rgba(0,0,0,0) 62%),
    radial-gradient(80% 50% at 100% 0%, rgba(255,170,80,.06), rgba(0,0,0,0) 60%),
    linear-gradient(180deg,#181309,#14100C 42%,#100D09)}
body::after{content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.5;
  background-image:repeating-linear-gradient(92deg, rgba(255,255,255,.014) 0 1px, rgba(0,0,0,.03) 1px 3px, rgba(0,0,0,0) 3px 34px)}

.mono{font-family:var(--mono)}
.sc{font-size:12px; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3)}
.hl{background:rgba(217,172,97,.28); border-radius:2px; box-shadow:0 0 0 1px rgba(217,172,97,.2)}

/* ============================ верхняя панель ============================ */
.top{position:sticky; top:0; z-index:60; height:var(--topbar);
  background:linear-gradient(180deg, rgba(20,16,12,.97), rgba(20,16,12,.93));
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--edge); display:flex; align-items:center; gap:14px;
  padding:0 18px}
.brand{display:flex; align-items:center; gap:10px; flex:0 0 auto; text-decoration:none}
.brand .em{width:32px; height:32px; border-radius:7px; display:grid; place-items:center;
  font-family:var(--serif); font-size:17px; color:#241A0C; font-weight:700;
  background:linear-gradient(160deg,#F0CE8C,#C89442 62%,#8E6526);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 2px 8px rgba(0,0,0,.5)}
.brand b{font-family:var(--serif); font-size:15px; font-weight:600; letter-spacing:.01em; white-space:nowrap}
.brand span{display:block; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3)}

/* поиск */
.searchbox{position:relative; flex:1 1 auto; min-width:0; max-width:760px}
.sfield{display:flex; align-items:center; gap:9px; height:40px; padding:0 10px 0 13px;
  background:var(--panel); border:1px solid var(--edge); border-radius:9px;
  transition:border-color .15s, background .15s, box-shadow .15s}
.sfield:focus-within{border-color:rgba(217,172,97,.55); background:#2A2118;
  box-shadow:0 0 0 4px rgba(217,172,97,.1)}
.sfield .ic{width:15px; height:15px; flex:0 0 auto; opacity:.6}
#q{flex:1; min-width:0; background:none; border:0; outline:none; font-size:14.5px; color:var(--ink)}
#q::placeholder{color:var(--ink-3)}
.kbd{font-family:var(--mono); font-size:12px; color:var(--ink-3); border:1px solid var(--edge);
  border-radius:4px; padding:1px 5px; background:rgba(0,0,0,.25)}
.iconbtn{width:26px; height:26px; border-radius:6px; display:grid; place-items:center;
  color:var(--ink-3); flex:0 0 auto}
.iconbtn:hover{background:rgba(255,255,255,.07); color:var(--ink)}
#qclr[hidden]{display:none}

/* подсказки поиска */
.sugg{position:absolute; left:0; right:0; top:46px; z-index:70; padding:6px;
  background:#1E1810; border:1px solid var(--edge); border-radius:11px;
  box-shadow:var(--shadow); max-height:min(60vh,460px); overflow:auto}
.sugg[hidden]{display:none}
.sugg .sg{padding:7px 10px 3px; font-size:12px; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3)}
.sugg button{display:flex; width:100%; align-items:center; gap:10px; padding:7px 10px;
  border-radius:7px; text-align:left; font-size:13.5px; color:var(--ink-2)}
.sugg button .t{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink)}
.sugg button .m{font-family:var(--mono); font-size:12px; color:var(--ink-3); flex:0 0 auto}
.sugg button .tag{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--brass);
  background:var(--brass-bg); border-radius:4px; padding:2px 6px; flex:0 0 auto}
.sugg button.on,.sugg button:hover{background:rgba(217,172,97,.14)}

/* кнопки верхней панели */
.tbtn{height:34px; padding:0 12px; border-radius:8px; border:1px solid var(--edge);
  color:var(--ink-2); font-size:13px; white-space:nowrap; display:inline-flex;
  align-items:center; gap:7px; background:rgba(255,255,255,.02)}
.tbtn:hover{border-color:rgba(217,172,97,.4); color:var(--ink)}
.tbtn.on{background:var(--brass-bg); border-color:rgba(217,172,97,.5); color:var(--brass)}
.tbtn small{font-family:var(--mono); font-size:12px; opacity:.65}
.seg{display:flex; gap:2px; padding:2px; background:rgba(0,0,0,.3);
  border:1px solid var(--edge); border-radius:9px; flex:0 0 auto}
.seg button{height:30px; padding:0 11px; border-radius:7px; font-size:13px; color:var(--ink-3);
  display:inline-flex; align-items:center; gap:6px}
.seg button:hover{color:var(--ink)}
.seg button[aria-pressed="true"]{background:var(--panel-2); color:var(--brass);
  box-shadow:inset 0 0 0 1px rgba(217,172,97,.28)}
.only-wide{display:inline-flex}
#menu{display:none}

/* ============================ каркас ============================ */
.layout{display:grid; grid-template-columns:var(--rail) minmax(0,1fr); gap:0;
  max-width:1680px; margin:0 auto}
.rail{position:sticky; top:var(--topbar); height:calc(100vh - var(--topbar));
  height:calc(100dvh - var(--topbar));
  overflow:auto; padding:18px 16px 40px; border-right:1px solid var(--edge-2);
  scrollbar-width:thin}
.rail::-webkit-scrollbar{width:9px}
.rail::-webkit-scrollbar-thumb{background:rgba(243,235,219,.13); border-radius:9px; border:3px solid transparent; background-clip:content-box}
.main{min-width:0; padding:0 26px 90px}

/* ============================ заголовок зала ============================ */
.hero{position:relative; margin:0 -26px 26px; padding:52px 26px 30px; overflow:hidden;
  border-bottom:1px solid var(--edge-2)}
.hero::before{content:""; position:absolute; inset:-40% -10% auto; height:340px; pointer-events:none;
  background:radial-gradient(60% 100% at 50% 0%, rgba(255,198,124,.22), rgba(0,0,0,0) 70%)}
.hero-in{position:relative; max-width:1180px}
.hero h1, .hero .hero-h1{font-family:var(--serif); font-weight:400; font-size:clamp(30px,4.2vw,50px);
  line-height:1.04; letter-spacing:-.02em; margin:10px 0 12px}
.hero h1 i, .hero .hero-h1 i{font-style:italic; color:var(--brass)}
.hero p{max-width:70ch; color:var(--ink-2); font-size:15.5px; margin:0 0 20px}
.stats{display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0}
.stats li{display:flex; align-items:baseline; gap:7px; padding:7px 13px; border-radius:8px;
  background:rgba(255,255,255,.035); border:1px solid var(--edge-2)}
.stats b{font-family:var(--serif); font-size:17px; font-weight:600}
.stats span{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3)}

/* ============================ боковой каталог ============================ */
.fgroup{margin-bottom:6px; border-bottom:1px solid var(--edge-2); padding-bottom:10px}
.fgroup:last-child{border-bottom:0}
.fhead{display:flex; align-items:center; gap:8px; width:100%; padding:9px 6px; border-radius:7px;
  font-size:12px; letter-spacing:.11em; text-transform:uppercase; color:var(--ink-3)}
.fhead:hover{background:rgba(255,255,255,.04); color:var(--ink-2)}
.fhead .ar{margin-left:auto; transition:transform .18s; opacity:.7; font-size:12px}
.fgroup.closed .ar{transform:rotate(-90deg)}
.fgroup.closed .fbody{display:none}
.fbody{padding:2px 4px 8px}
.fcount{font-family:var(--mono); font-size:12px; color:var(--brass); background:var(--brass-bg);
  border-radius:20px; padding:1px 7px}

.chk{display:flex; align-items:center; gap:9px; width:100%; padding:6px 7px; border-radius:7px;
  font-size:13.5px; color:var(--ink-2); text-align:left; line-height:1.25}
.chk:hover{background:rgba(255,255,255,.05); color:var(--ink)}
.chk .box{width:15px; height:15px; flex:0 0 auto; border-radius:4px; border:1px solid rgba(243,235,219,.28);
  display:grid; place-items:center; font-size:12px; color:#20180C}
.chk[aria-pressed="true"]{color:var(--ink)}
.chk[aria-pressed="true"] .box{background:linear-gradient(160deg,#EDC076,#C08F3F); border-color:transparent}
.chk[aria-pressed="true"] .box::after{content:"✓"}
.chk .n{margin-left:auto; font-family:var(--mono); font-size:12px; color:var(--ink-3)}
.chk.sub{padding-left:22px; font-size:13px}
.morebtn{font-size:12.5px; color:var(--brass); padding:6px 7px; border-radius:6px}
.morebtn:hover{background:var(--brass-bg)}
.fsearch{width:100%; height:32px; padding:0 10px; margin:2px 0 8px; border-radius:7px;
  background:rgba(0,0,0,.28); border:1px solid var(--edge); color:var(--ink); font-size:13px; outline:none}
.fsearch:focus{border-color:rgba(217,172,97,.5)}
.years{display:flex; align-items:center; gap:8px; padding:2px 4px}
.years input{width:100%; height:32px; text-align:center; border-radius:7px; background:rgba(0,0,0,.28);
  border:1px solid var(--edge); color:var(--ink); font-family:var(--mono); font-size:13px; outline:none}
.years input:focus{border-color:rgba(217,172,97,.5)}
.years em{color:var(--ink-3); font-style:normal}
.hist{display:flex; align-items:flex-end; gap:1px; height:34px; margin:10px 4px 2px}
.hist i{flex:1; background:linear-gradient(180deg,rgba(217,172,97,.65),rgba(217,172,97,.2));
  border-radius:1px 1px 0 0; min-height:1px}
.hist i.off{background:rgba(243,235,219,.1)}

.railtop{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px}
.railtop b{font-family:var(--serif); font-size:15px; font-weight:600}
#reset{font-size:12.5px; color:var(--brass); padding:5px 9px; border-radius:7px; border:1px solid transparent}
#reset:hover{background:var(--brass-bg); border-color:rgba(217,172,97,.3)}

/* ============================ шапка результатов ============================ */
.rhead{position:sticky; top:var(--topbar); z-index:40; display:flex; align-items:center;
  gap:12px; flex-wrap:wrap; padding:13px 0 12px; margin-bottom:4px;
  background:linear-gradient(180deg, var(--bg) 72%, rgba(20,16,12,0));
  border-bottom:1px solid transparent}
.rhead .cnt{font-family:var(--serif); font-size:17px}
.rhead .cnt b{color:var(--brass)}
.rhead .sp{flex:1; min-width:8px}
.pills{display:flex; flex-wrap:wrap; gap:6px}
.pill{display:inline-flex; align-items:center; gap:6px; height:27px; padding:0 6px 0 10px;
  border-radius:20px; font-size:12.5px; background:var(--brass-bg); color:var(--brass);
  border:1px solid rgba(217,172,97,.3)}
.pill .px{appearance:none; -webkit-appearance:none; background:none; border:0; color:inherit;
  font:inherit; font-size:15px; line-height:1; opacity:.75; padding:4px 6px; margin:0 -2px 0 0;
  min-width:24px; min-height:24px; cursor:pointer; border-radius:6px}
.pill .px:hover{opacity:1; background:rgba(255,255,255,.09)}
.sort{height:34px; padding:0 8px; border-radius:8px; background:var(--panel);
  border:1px solid var(--edge); color:var(--ink-2); font-size:13px; outline:none; cursor:pointer}

/* ============================ сетка обложек ============================ */
.grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(178px,1fr)); gap:30px 22px;
  padding:14px 0 0}
.bk{position:relative; display:flex; flex-direction:column; gap:9px; text-align:left;
  border-radius:8px; padding:6px; margin:-6px}
.bk:hover{background:rgba(255,255,255,.035)}
.bk:hover .cov{transform:translateY(-3px); box-shadow:0 20px 34px rgba(0,0,0,.6), 0 0 0 1px rgba(217,172,97,.35)}
.cov{position:relative; width:100%; aspect-ratio:var(--r,.66); border-radius:3px 5px 5px 3px;
  overflow:hidden; background:linear-gradient(150deg,var(--c1,#3A2C21),var(--c2,#241B14));
  box-shadow:0 12px 24px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.07);
  transition:transform .18s ease, box-shadow .18s ease}
.cov img{width:100%; height:100%; object-fit:cover; background:#1A130D}
.cov .ph{position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between;
  padding:13px 12px; color:var(--pp,#F2E7D2)}
.cov .ph i{font-style:normal; font-size:12px; letter-spacing:.08em; text-transform:uppercase; opacity:.72}
.cov .ph b{font-family:var(--serif); font-size:14.5px; font-weight:600; line-height:1.22;
  display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; overflow:hidden}
.cov::after{content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg, rgba(0,0,0,.34) 0 4px, rgba(255,255,255,.11) 5px, rgba(0,0,0,0) 12px),
    linear-gradient(200deg, rgba(255,238,210,.13), rgba(0,0,0,0) 42%)}
.bk .id{position:absolute; top:12px; right:12px; z-index:2; font-family:var(--mono); font-size:12px;
  letter-spacing:.04em; color:#F4E9D4; background:rgba(12,9,6,.72); border-radius:4px;
  padding:2px 5px; opacity:0; transition:opacity .15s}
.bk:hover .id{opacity:1}
.bk .au{font-size:12px; letter-spacing:.03em; color:var(--brass); overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap}
.bk .ti{font-family:var(--serif); font-size:14.5px; line-height:1.3; color:var(--ink);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.bk .mt{font-size:12px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.gline{display:flex; flex-wrap:wrap; gap:4px}
/* без min-width:0 кнопка-карточка тянется по длине имени автора */
/* и выводит разметку за край экрана на телефоне */
.grid > *, .bk{min-width:0}
.bk .au, .bk .ti, .bk .mt, .bk .gline{min-width:0; max-width:100%}
/* заголовок маршрута для читалок экрана */
.h1route{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}

.gtag{font-size:12px; letter-spacing:.02em; color:var(--ink-2); background:rgba(255,255,255,.055);
  border:1px solid var(--edge-2); border-radius:5px; padding:1px 6px}
.gtag.g{color:var(--brass); background:var(--brass-bg); border-color:rgba(217,172,97,.22)}

/* ============================ список ============================ */
.tbl{width:100%; border-collapse:collapse; font-size:13.5px; margin-top:8px}
.tbl th{position:sticky; top:calc(var(--topbar) + 58px); z-index:20; text-align:left; padding:9px 12px;
  font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3);
  background:var(--bg); border-bottom:1px solid var(--edge); cursor:pointer; white-space:nowrap}
.tbl th:hover{color:var(--brass)}
.tbl th .ar{opacity:.55; font-size:12px}
.tbl td{padding:9px 12px; border-bottom:1px solid var(--edge-2); vertical-align:top}
.tbl tr{cursor:pointer}
.tbl tbody tr:hover td{background:rgba(217,172,97,.07)}
.tbl .c-id{font-family:var(--mono); font-size:12px; color:var(--ink-3); white-space:nowrap}
.tbl .c-t{font-family:var(--serif); font-size:14.5px}
.tbl .c-a{color:var(--ink-2); white-space:nowrap; max-width:190px; overflow:hidden; text-overflow:ellipsis}
.tbl .c-p{color:var(--ink-3); max-width:210px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.tbl .c-y{font-family:var(--mono); font-size:12px; color:var(--ink-3)}
.tbl .c-g{max-width:230px}

/* ============================ полки ============================ */
.shelves{padding:10px 0 0; display:flex; flex-direction:column; gap:26px}
.unit{border:1px solid var(--edge-2); border-radius:12px; overflow:hidden;
  background:linear-gradient(180deg,#1D1710,#171209)}
.unit-h{display:flex; align-items:center; gap:12px; padding:13px 16px; border-bottom:1px solid var(--edge-2)}
.unit-h .k{width:30px; height:30px; border-radius:7px; display:grid; place-items:center;
  font-family:var(--serif); color:var(--brass); background:var(--brass-bg);
  border:1px solid rgba(217,172,97,.3); font-size:15px}
.unit-h h3{margin:0; font-family:var(--serif); font-weight:600; font-size:16px}
.unit-h p{margin:0; font-size:12px; color:var(--ink-3); font-family:var(--mono)}
.unit-h .desc{margin:0; font-size:12.5px; color:var(--ink-3); flex:1 1 100%; max-width:78ch}
.board{position:relative; padding:0 14px 16px}
.row{position:relative; padding:13px 0 13px; border-bottom:1px solid rgba(0,0,0,.5)}
.row::after{content:""; position:absolute; left:0; right:0; bottom:0; height:9px;
  background:linear-gradient(180deg,#E8C48F 0 1px,#B98D53 1px 4px,#6E4C29 4px 7px,#241708 7px 9px);
  box-shadow:0 7px 14px rgba(0,0,0,.65); border-radius:1px}
.row:last-child{border-bottom:0}
.rowh{display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; padding:2px 2px 10px}
.rowh b{font-family:var(--mono); font-size:12px; letter-spacing:.09em; color:var(--brass);
  background:var(--brass-bg); border:1px solid rgba(217,172,97,.28); border-radius:5px; padding:2px 6px}
.rowh .rname{font-family:var(--serif); font-size:14.5px; color:var(--ink)}
.rowh .rn{font-size:12px; color:var(--ink-3)}
.rowh .rdesc{flex:1 1 100%; font-size:12.5px; line-height:1.5; color:var(--ink-3); max-width:92ch}
.gh{padding:8px 2px 0}
.gh h2{margin:0 0 5px; font-family:var(--serif); font-weight:600; font-size:21px}
.gh p{margin:0; font-size:12.5px; color:var(--ink-3); max-width:80ch}
.spines{display:flex; align-items:flex-end; gap:2px; overflow-x:auto; overflow-y:hidden;
  padding:0 2px 11px; scrollbar-width:thin; scroll-behavior:smooth}
.spines::-webkit-scrollbar{height:7px}
.spines::-webkit-scrollbar-thumb{background:rgba(243,235,219,.16); border-radius:7px}
.spines button.sp{appearance:none; -webkit-appearance:none; border:0; margin:0; padding:0;
  font:inherit; color:inherit; text-align:left; cursor:pointer}
.spines .sp{position:relative; flex:0 0 auto; width:calc(var(--w,34) * 1px); height:calc(var(--h,1) * 168px);
  border-radius:2px 3px 3px 2px; cursor:pointer; overflow:hidden; display:flex;
  align-items:stretch; justify-content:center; padding:11px 2px 15px;
  background:linear-gradient(90deg, rgba(0,0,0,.42) 0 3px, rgba(255,255,255,.13) 4px, rgba(255,255,255,.02) 40%, rgba(0,0,0,.4)),
    linear-gradient(180deg,var(--c1,#4A3626),var(--c2,#33241A) 55%,var(--c3,#241A12));
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.4), 1px 0 3px rgba(0,0,0,.5);
  transition:transform .12s ease, box-shadow .12s}
.spines .sp:hover{transform:translateY(-7px); box-shadow:0 0 0 2px var(--brass), 0 12px 20px rgba(0,0,0,.6); z-index:2}
.spines .sp.dim{opacity:.13; filter:grayscale(1)}
.spines .sp.hit{box-shadow:0 0 0 2px var(--brass), 0 10px 18px rgba(0,0,0,.5)}
.spines .sp .txt{writing-mode:vertical-rl; text-orientation:mixed; transform:rotate(180deg);
  font-family:var(--serif); font-size:12px; line-height:1.05; color:var(--sc,#F4EBD8);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin:0 auto;
  text-shadow:0 1px 2px rgba(0,0,0,.4)}
.spines .sp .txt i{font-style:normal; font-weight:700; opacity:.95}
.spines .sp .txt em{font-style:normal; opacity:.5; padding:0 3px}
.spines .sp .num{position:absolute; left:0; right:0; bottom:2px; text-align:center; font-family:var(--mono);
  font-size:12px; color:var(--sc,#F4EBD8); opacity:.5}

/* ============================ служебное ============================ */
#more{display:flex; justify-content:center; padding:30px 0 10px}
#more button{padding:11px 22px; border-radius:9px; border:1px solid var(--edge);
  color:var(--ink-2); font-size:13.5px; background:rgba(255,255,255,.03)}
#more button:hover{border-color:var(--brass); color:var(--brass)}
.empty{padding:70px 10px; text-align:center; color:var(--ink-3)}
.empty b{display:block; font-family:var(--serif); font-size:22px; color:var(--ink); margin-bottom:8px}
.empty .ex{display:inline-flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-top:18px}
.empty .ex button{font-family:var(--mono); font-size:12px; color:var(--brass);
  border:1px solid rgba(217,172,97,.3); border-radius:7px; padding:6px 10px}
footer{border-top:1px solid var(--edge-2); margin-top:40px; padding:26px 0 40px;
  color:var(--ink-3); font-size:12.5px; max-width:80ch}
footer a{color:var(--brass)}

/* ======================= шифры описи и тома ======================= */
.rowh .rcode{font-family:var(--mono); font-size:12px; letter-spacing:.05em; color:var(--ink-3);
  border:1px solid var(--edge); border-radius:5px; padding:1px 6px}
.bk{position:relative}
.bk .vb{position:absolute; top:9px; right:9px; z-index:2; font-family:var(--mono); font-size:12px;
  letter-spacing:.03em; padding:2px 7px; border-radius:20px; color:#F4EBD8;
  background:rgba(18,14,10,.68); border:1px solid rgba(242,233,217,.2)}
.bk .vb.gap{color:#FBDCA8; background:rgba(105,38,32,.82); border-color:rgba(217,172,97,.45)}
.rowh .rgen{flex:1 1 100%; margin-top:-3px; font-size:12px; color:var(--brass); opacity:.92}
.spines .sp.vsp .num{opacity:.92}

/* ============================ карточка книги ============================ */
#scrim{position:fixed; inset:0; z-index:80; background:rgba(6,4,2,.74);
  backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px);
  display:flex; align-items:flex-start; justify-content:center; padding:34px 20px;
  overflow:auto; opacity:0; transition:opacity .16s}
#scrim[hidden]{display:none}
#scrim.in{opacity:1}
.sheet{position:relative; width:min(1060px,100%); border-radius:14px; overflow:hidden;
  background:linear-gradient(180deg,var(--paper),var(--paper-2));
  color:var(--paper-ink); box-shadow:0 40px 90px rgba(0,0,0,.7);
  transform:translateY(10px); transition:transform .18s ease}
#scrim.in .sheet{transform:none}
.sheet::before{content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:radial-gradient(rgba(120,100,70,.09) 1px, rgba(0,0,0,0) 1px); background-size:4px 4px}
.sh-top{display:flex; align-items:center; gap:10px; padding:11px 14px 11px 18px;
  border-bottom:1px solid rgba(70,58,40,.16); background:rgba(255,255,255,.35)}
.sh-top .id{font-family:var(--mono); font-size:12px; color:var(--paper-ink-2);
  background:rgba(70,58,40,.09); border-radius:5px; padding:3px 8px}
.sh-top .sp{flex:1}
.navb{width:32px; height:32px; border-radius:8px; display:grid; place-items:center;
  color:var(--paper-ink-2); border:1px solid rgba(70,58,40,.18); font-size:14px}
.navb:hover{background:rgba(70,58,40,.09); color:var(--paper-ink)}
.sh-body{display:grid; grid-template-columns:340px minmax(0,1fr); gap:0}
.sh-cov{position:relative; padding:26px; background:linear-gradient(160deg,rgba(70,58,40,.09),rgba(70,58,40,.03));
  border-right:1px solid rgba(70,58,40,.14)}
.sh-cov .fr{position:relative; width:100%; border-radius:4px; overflow:hidden; cursor:zoom-in;
  background:linear-gradient(150deg,var(--c1,#3A2C21),var(--c2,#241B14));
  aspect-ratio:var(--r,.66); box-shadow:0 16px 34px rgba(40,28,10,.4), 0 0 0 1px rgba(70,58,40,.2)}
.sh-cov .fr img{width:100%; height:100%; object-fit:cover}
.sh-cov .ph{position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between;
  padding:22px 18px; color:var(--pp,#F2E7D2)}
.sh-cov .ph i{font-style:normal; font-size:12px; letter-spacing:.08em; text-transform:uppercase; opacity:.75}
.sh-cov .ph b{font-family:var(--serif); font-size:21px; font-weight:600; line-height:1.2}
.sh-cov .zoom{margin-top:12px; width:100%; height:34px; border-radius:8px; font-size:12.5px;
  border:1px solid rgba(70,58,40,.22); color:var(--paper-ink-2); display:flex;
  align-items:center; justify-content:center; gap:7px}
.sh-cov .zoom:hover{background:rgba(70,58,40,.09); color:var(--paper-ink)}
.sh-cov .zoom[hidden]{display:none}
.sh-cov .nocov{margin-top:12px; font-size:12px; color:var(--paper-ink-2); text-align:center; line-height:1.45}
.sh-main{padding:26px 28px 30px; min-width:0}
.sh-main .au{font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:#8A5A22; margin-bottom:7px}
.sh-main h2{font-family:var(--serif); font-weight:400; font-size:31px; line-height:1.2; max-width:22ch; margin:0 0 16px}
.facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:8px}
.facts div{background:var(--paper); padding:10px 12px; border:1px solid rgba(70,58,40,.16); border-radius:9px}
.facts dt{font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--paper-ink-2); margin-bottom:3px}
.facts dd{margin:0; font-size:14px; line-height:1.35}
.facts dd.mono{font-family:var(--mono); font-size:13px}
.sh-main .secd{margin:-2px 0 12px; font-size:12.5px; line-height:1.5; color:var(--paper-ink-2)}
.sh-main .vol{margin:-2px 0 15px}
.sh-main .vol .vnote{margin:0 0 9px; padding:9px 11px; border-radius:8px; font-size:12.5px; line-height:1.55;
  background:rgba(124,49,42,.07); border:1px solid rgba(124,49,42,.2); color:#5E2B23}
.sh-main .vol .vnote.vderiv{background:rgba(70,58,40,.05); border-color:rgba(70,58,40,.16); color:var(--paper-ink-2)}
.sh-main .vol .vlist{margin:0 0 9px}
.sh-main .vol .vrow{display:flex; align-items:baseline; gap:10px; padding:5px 0;
  border-bottom:1px solid rgba(70,58,40,.1)}
.sh-main .vol .vrow b{flex:0 0 42px; font-size:12px; letter-spacing:.04em; color:#8A6524}
.sh-main .vol .vrow .vt{flex:1 1 auto; font-size:12.5px; line-height:1.45; color:var(--paper-ink)}
.sh-main .vol .vrow .vi{font-size:12px; color:var(--paper-ink-2); white-space:nowrap}
.sh-main .vol .vmiss{margin:0 0 8px; font-size:12.5px; color:#7C312A}
.sh-main .vol .vmiss.vok2{color:#3D5A46}
.sh-main .vol .vmeta{font-size:12px; line-height:1.5; color:var(--paper-ink-2); margin-bottom:3px}
.sh-main .vol .vmeta a{color:#8A6524; text-decoration:underline}
.sh-main .vol .vx{margin-top:8px; font-size:12.5px; color:var(--paper-ink-2)}
.sh-main .vol .vx button{font-family:var(--mono); font-size:12px; color:#8A6524; margin-left:5px;
  border:1px solid rgba(217,172,97,.5); border-radius:6px; padding:3px 8px; background:rgba(217,172,97,.12)}
.sh-main .vol .vx button:hover{background:rgba(217,172,97,.26)}
.facts .vgap,.facts .vok{font-family:var(--sans); font-size:12px; letter-spacing:.05em; text-transform:uppercase;
  border-radius:20px; padding:1px 6px; margin-left:5px; white-space:nowrap}
.facts .vgap{color:#7C312A; background:rgba(124,49,42,.1); border:1px solid rgba(124,49,42,.25)}
.facts .vok{color:#3D5A46; background:rgba(51,72,59,.1); border:1px solid rgba(51,72,59,.25)}
.sh-main h4{font-size:12px; letter-spacing:.13em; text-transform:uppercase; color:var(--paper-ink-2);
  margin:22px 0 9px; display:flex; align-items:center; gap:8px}
.sh-main h4::after{content:""; flex:1; height:1px; background:rgba(70,58,40,.16)}
.gch{display:flex; flex-wrap:wrap; gap:6px}
.gch button{font-size:12.5px; padding:5px 11px; border-radius:20px; color:#6A4718;
  background:rgba(190,140,60,.15); border:1px solid rgba(150,110,50,.28)}
.gch button:hover{background:rgba(190,140,60,.3)}
.links{display:flex; flex-wrap:wrap; gap:7px}
.links a{font-size:12.5px; padding:6px 11px; border-radius:8px; text-decoration:none;
  color:var(--paper-ink); background:rgba(255,255,255,.6); border:1px solid rgba(70,58,40,.18)}
.links a:hover{background:#fff; border-color:rgba(70,58,40,.4)}
.links a b{color:#8A5A22; font-weight:600}
.near{display:flex; gap:9px; overflow-x:auto; padding-bottom:6px; scrollbar-width:thin}
.near button{flex:0 0 auto; width:74px; text-align:left}
.near .m{width:74px; aspect-ratio:var(--r,.66); border-radius:3px; overflow:hidden;
  background:linear-gradient(150deg,var(--c1,#3A2C21),var(--c2,#241B14));
  box-shadow:0 5px 12px rgba(40,28,10,.3)}
.near .m img{width:100%; height:100%; object-fit:cover}
.near .cap{font-size:12px; line-height:1.25; color:var(--paper-ink-2); margin-top:5px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.near button:hover .cap{color:var(--paper-ink)}
.near button.cur .m{outline:2px solid #B98232; outline-offset:2px}

/* ============================ просмотр фото ============================ */
#viewer{position:fixed; inset:0; z-index:95; background:#070603; display:flex;
  flex-direction:column; opacity:0; transition:opacity .15s}
#viewer[hidden]{display:none}
#viewer.in{opacity:1}
.vtop{display:flex; align-items:center; gap:10px; padding:10px 14px; color:var(--ink-2);
  border-bottom:1px solid rgba(255,255,255,.08); background:rgba(12,9,6,.9); z-index:2}
.vtop .ti{font-family:var(--serif); font-size:14px; color:var(--ink); overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap}
.vtop .sp{flex:1}
.vtop .zl{font-family:var(--mono); font-size:12px; color:var(--brass); min-width:52px; text-align:center}
.vstage{position:relative; flex:1; overflow:hidden; display:grid; place-items:center;
  cursor:grab; touch-action:none}
.vstage.grab{cursor:grabbing}
.vstage img{position:absolute; top:0; left:0; transform-origin:0 0; image-rendering:auto;
  box-shadow:0 30px 80px rgba(0,0,0,.8); background:#100C08}
.vhint{position:absolute; left:50%; bottom:16px; transform:translateX(-50%); z-index:3;
  font-size:12px; color:var(--ink-3); background:rgba(12,9,6,.8); border:1px solid var(--edge);
  border-radius:20px; padding:6px 14px; pointer-events:none; transition:opacity .3s}
.vhint[hidden]{display:none}
.vload{position:absolute; z-index:1; font-size:13px; color:var(--ink-3)}

/* ============================ мобильное ============================ */
@media (max-width:1180px){ :root{--rail:262px} .grid{grid-template-columns:repeat(auto-fill,minmax(158px,1fr))} }
@media (max-width:940px){
  :root{--topbar:58px}
  .layout{grid-template-columns:minmax(0,1fr)}
  .rail{position:fixed; top:var(--topbar); left:0; bottom:0; width:min(340px,88vw); z-index:75;
    background:#171208; border-right:1px solid var(--edge); box-shadow:0 0 60px rgba(0,0,0,.7);
    transform:translateX(-102%); transition:transform .2s ease; height:auto}
  body.rail-open .rail{transform:none}
  body.rail-open::after{content:""; position:fixed; inset:0; z-index:74; background:rgba(0,0,0,.55)}
  #menu{display:inline-flex}
  .only-wide{display:none}
  .main{padding:0 15px 80px}
  .hero{margin:0 -15px 20px; padding:34px 15px 24px}
  .searchbox{max-width:none}
  .sh-body{grid-template-columns:minmax(0,1fr)}
  .sh-cov{border-right:0; border-bottom:1px solid rgba(70,58,40,.14); padding:20px 20px 18px}
  .sh-cov .fr{max-width:240px; margin:0 auto}
  .sh-cov .zoom{max-width:240px; margin:12px auto 0}
  .sh-main{padding:20px}
  .sh-main h2{font-size:23px}
  #scrim{padding:10px 8px 30px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(136px,1fr)); gap:22px 14px}
  .tbl .c-p,.tbl .c-g{display:none}
}
@media (max-width:940px){
  body.dark .rail{background:#1E1B16}
  .facts{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
  .dpannot p{font-size:14.5px;line-height:1.65}
}@media (max-width:560px){
  .brand span{display:none}
  .brand b{display:none}
  .rhead{gap:8px}
}
@media print{ .top,.rail,.rhead,#more,#viewer{display:none} body{background:#fff; color:#000} }

.about{margin:0 0 18px;border:1px solid var(--edge);border-radius:12px;background:var(--panel);overflow:hidden}
.about>summary{cursor:pointer;padding:13px 16px;font-weight:600;font-size:14.5px;list-style:none;color:var(--ink);
  display:flex;align-items:center;gap:8px}
.about>summary::-webkit-details-marker{display:none}
.about>summary::before{content:"\25B8";color:var(--brass);transition:transform .15s}
.about[open]>summary::before{transform:rotate(90deg)}
.about>summary:hover{color:var(--brass)}
.about-in{padding:0 16px 14px;font-size:13.5px;line-height:1.7;color:var(--ink-2);max-width:78ch}
.about-in p{margin:0 0 10px}
.about-in b.mono{color:var(--brass);font-weight:600}

/* ===================== телефоны и планшеты ===================== */
@media (max-width:940px){
  .iconbtn{width:38px; height:38px; border-radius:8px}
  .sfield{height:44px}
  #q{font-size:16px}
  .tbtn{height:38px}
  .sort{height:38px}
  .chk{padding:9px 7px}
  .morebtn{padding:10px 7px}
  .fsearch{height:38px}
  footer a{display:inline-block; padding:6px 0}
  .about>summary{padding:15px 16px}
  .rail{padding-bottom:80px}
  .rail-view{display:flex; flex-direction:column; gap:8px; margin:0 0 14px}
  .rail .seg{display:flex; width:100%; padding:3px}
  .rail .seg button{flex:1 1 0; height:40px; justify-content:center; font-size:13.5px}
  .rail #strict{display:inline-flex; width:100%; height:40px; justify-content:center}
}

/* ======================= Фантлаб ======================= */
.facts.fl.sub{margin:8px 0 6px}
.fled{margin:2px 0 10px;font-size:13px;color:var(--paper-ink-2)}
.flweak{font-size:12px;color:#8a5a2a;background:rgba(217,172,97,.2);padding:1px 6px;border-radius:20px;vertical-align:middle}
.flannot{margin:12px 0;padding:11px 13px;border-left:3px solid var(--brass);background:rgba(217,172,97,.09);border-radius:0 8px 8px 0}
.flannot b{display:block;font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:#8a5a2a;margin-bottom:5px}
.flannot p{margin:0;font-size:14px;line-height:1.6}
.flnote2{margin:6px 0;font-size:12.5px;color:var(--paper-ink-2)}
.flnone{margin:4px 0 12px;font-size:13px;color:var(--paper-ink-2)}
.flist{border-top:1px solid rgba(44,36,26,.14);margin:6px 0}
.fi,.fh{display:flex;gap:9px;align-items:baseline;padding:5px 3px;border-bottom:1px solid rgba(44,36,26,.09);font-size:13.5px;line-height:1.4}
.fh{font-weight:600;font-size:12.5px;background:rgba(44,36,26,.05);letter-spacing:.02em;color:#6b5a44}
.fi.lv1,.fh.lv1{padding-left:15px}
.fi.lv2,.fh.lv2{padding-left:29px}
.fi.lv3,.fh.lv3{padding-left:43px}
.fw{flex:0 0 auto;max-width:32%;color:var(--paper-ink-2);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fn{flex:1 1 auto;min-width:0}
.fn a{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(44,36,26,.32)}
.fn a:hover{color:#8a5a2a;border-bottom-color:#8a5a2a}
.fk{flex:0 0 auto;font-size:12px;color:var(--paper-ink-2);white-space:nowrap}
.ft{flex:0 1 auto;font-size:12px;color:rgba(44,36,26,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:24%}
.fp{flex:0 0 auto;font-size:12px;color:rgba(44,36,26,.55);white-space:nowrap}
.flmore{margin:8px 0 2px;padding:7px 13px;border:1px solid rgba(44,36,26,.2);background:rgba(255,255,255,.4);
  border-radius:20px;font:inherit;font-size:12.5px;color:var(--paper-ink);cursor:pointer}
.flmore:hover{border-color:var(--brass-d);color:#8a5a2a}
.flvols{margin:6px 0}
.flvol{margin:6px 0;border:1px solid rgba(44,36,26,.15);border-radius:9px;padding:7px 11px;background:rgba(255,255,255,.42)}
.flvol summary{cursor:pointer;font-size:13.5px;line-height:1.45}
.flvol summary b{margin-right:5px}
.flvol[open]{background:rgba(255,255,255,.62)}
.flvol .fi,.flvol .fh{font-size:13px}
.fllink{display:inline-block;margin:7px 0 2px;font-size:12.5px}
.gtag.fl{background:rgba(217,172,97,.2);color:var(--brass);border-color:rgba(217,172,97,.35)}
.flnote{padding:7px 9px 2px;font-size:12px;line-height:1.5;color:rgba(243,235,219,.5)}

/* ======================= другие источники ======================= */
.dpline{margin:2px 0 10px;font-size:12.5px;color:var(--paper-ink-2)}
.dpst{font-size:12px;letter-spacing:.05em;text-transform:uppercase;border-radius:20px;
  padding:2px 7px;margin-left:6px;vertical-align:middle;white-space:nowrap}
.dpst.ok{color:#6E655A;background:rgba(110,101,90,.10);border:1px solid rgba(110,101,90,.25)}
.dpst.sl{color:#8A7F6E;background:rgba(138,127,110,.10);border:1px solid rgba(138,127,110,.28)}
.dpannot{margin:14px 0;padding:2px 0 2px 16px;border-left:3px solid rgba(94,112,72,.45);
  background:rgba(94,112,72,.08);border-radius:0 8px 8px 0}
.dpannot b{display:block;font-size:12px;letter-spacing:.09em;text-transform:uppercase;
  color:#4C5B3B;margin-bottom:5px}
.dpannot{max-width:68ch}.dpannot p{margin:0;font-family:var(--serif);font-size:15.5px;line-height:1.7}
.dpnote{margin:8px 0 4px;padding:8px 10px;font-size:12px;line-height:1.55;
  color:var(--paper-ink-2);background:rgba(70,58,40,.05);border-radius:8px}
.dpnote b{color:#4C5B3B}
.dpnone{margin:4px 0 12px;font-size:13px;color:var(--paper-ink-2)}
.dptoc{border-top:1px solid rgba(44,36,26,.14);margin:6px 0}
.dpi{display:flex;gap:9px;align-items:baseline;padding:5px 3px;
  border-bottom:1px solid rgba(44,36,26,.09);font-size:13.5px;line-height:1.45}
.dpi .dn{flex:1 1 auto;min-width:0}
.dpi .dp{flex:0 0 auto;font-size:12px;color:rgba(44,36,26,.55);white-space:nowrap}
.gtag.dp{background:rgba(94,112,72,.22);color:#8fae74;border-color:rgba(94,112,72,.4)}
.dpsrc{padding:7px 9px 2px;font-size:12px;line-height:1.5;color:rgba(243,235,219,.5)}

.cvr{float:right;width:118px;margin:0 0 12px 14px;border-radius:8px;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.28);background:rgba(0,0,0,.06)}
.cvr img{width:100%;display:block}
.ppl{margin:4px 0 12px;font-size:13.5px;line-height:1.55;color:var(--paper-ink-2)}
.ppl b{color:var(--paper-ink)}
.srcs{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 14px}
.srcs a{font-size:12px;padding:4px 11px;border-radius:16px;border:1px solid var(--edge-2);color:var(--brass);background:var(--brass-bg);text-decoration:none}
.srcs a:hover{filter:brightness(1.12)}

.srcs a[data-open]{cursor:pointer}

body.dark{--chip-ok:#9A9184;--chip-sl:#B0A693;
  --brass:#C9A44C; --brass-bg:rgba(201,164,76,.12);
  --paper:#1E1B16; --paper-2:#282420; --paper-3:#322D26;
  --pink:#E8DFD0; --paper-ink:#E8DFD0; --paper-ink-2:#A69880;
  --green:#8FB89A; --red:#C47870;
  --edge-2:rgba(232,223,208,.12);
}
#darkBtn{background:none;border:none;font-size:17px;cursor:pointer;
  color:var(--paper-ink-2);padding:4px 8px}

body.dark .dpst.ok{color:var(--chip-ok);background:rgba(154,145,132,.12);border-color:rgba(154,145,132,.3)} body.dark .dpst.sl{color:var(--chip-sl);background:rgba(176,166,147,.12);border-color:rgba(176,166,147,.32)}


/* ==================================================================
   Этап 3 — доступность, мобильное удобство, печать
   ================================================================== */

/* видимый фокус только для клавиатуры */
:focus-visible{outline:2px solid var(--brass); outline-offset:2px; border-radius:4px}
:focus:not(:focus-visible){outline:none}

/* служебный текст для скринридеров */
.vh{position:absolute!important; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}

/* «К содержанию» */
.skip{position:absolute; left:8px; top:-60px; z-index:200; background:var(--panel-2);
  color:var(--ink); border:1px solid var(--brass); border-radius:9px; padding:10px 14px;
  font-size:13px; transition:top .12s}
.skip:focus{top:8px}

/* скелетон карточки, пока грузится описание */
.skel{display:grid; gap:9px; margin:14px 0 6px; max-width:520px}
.skel span{display:block; height:13px; border-radius:6px;
  background:linear-gradient(90deg, rgba(243,235,219,.07), rgba(243,235,219,.16), rgba(243,235,219,.07));
  background-size:200% 100%; animation:sk 1.1s linear infinite}
.skel span:nth-child(2){width:86%}
.skel span:nth-child(3){width:72%}
.skel span:nth-child(4){width:54%}
@keyframes sk{0%{background-position:100% 0}100%{background-position:-100% 0}}
.skelnote{font-size:12px; color:var(--ink-3); margin:2px 0 0}

/* метка неточного места */
.puflag{font-family:var(--mono); font-size:12px; color:var(--brass); opacity:.85; white-space:nowrap}

/* подсказка при пустом результате */
.didyou{margin-top:12px; font-size:13.5px; color:var(--ink-2)}
.didyou button{appearance:none; background:var(--brass-bg); border:1px solid var(--brass);
  color:var(--brass); border-radius:8px; padding:6px 10px; margin:0 4px; font:inherit;
  font-size:13px; cursor:pointer; min-height:32px}

/* загадки собрания */
.mystery{max-width:860px; margin:22px auto; padding:0 16px}
.mystery h2{font-family:var(--serif); font-size:23px; margin:0 0 8px}
.mystery p{font-size:14px; color:var(--ink-2); line-height:1.62; margin:0 0 12px; max-width:72ch}
.mystery .mcontact a{color:var(--brass)}
.mystery .tbl{margin-top:6px}

/* мобильная полоса действий над каталогом фильтров */
.mbar{position:fixed; left:0; right:0; bottom:0; z-index:120; display:none; gap:8px;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg, rgba(15,12,8,.72), rgba(15,12,8,.97));
  border-top:1px solid var(--edge); backdrop-filter:blur(8px)}
.mbar button{flex:1 1 auto; min-height:44px; border-radius:11px; font:inherit; font-size:14px;
  background:var(--brass); color:#20180C; border:0; cursor:pointer; font-weight:600}
.mbar button.sec{flex:0 0 auto; background:transparent; color:var(--ink);
  border:1px solid var(--edge); padding:0 16px; font-weight:400}
body.rail-open .mbar:not([hidden]){display:flex}

/* ссылка в списке не выглядит чужеродно */
.tbl .c-t a{color:inherit; text-decoration:none}
.tbl .c-t a:hover{text-decoration:underline; text-decoration-color:var(--brass)}
.tbl thead th{background:var(--panel)}

/* пальцы: минимальная цель 44px на узких экранах */
@media (max-width:940px){
  .iconbtn, .tbtn, .navb, .seg button, .sort{min-height:44px}
  .chk{min-height:44px; align-items:center}
  .hero-in h1{font-size:clamp(24px, 7vw, 34px)}
  .hero-in p{font-size:14px; max-width:none}
  .hero .stats{gap:10px 18px}
  .hero .stats li b{font-size:19px}
  .about summary{min-height:44px; display:flex; align-items:center}
  .sh-body{display:block}
  .sh-cov{max-width:min(72vw, 320px); margin:0 auto 14px}
  .rhead{gap:8px}
  footer{padding-bottom:78px}
}
@media (max-width:520px){
  .hero-in h1{font-size:clamp(22px, 8vw, 28px)}
  .hero .stats li:nth-child(n+7){display:none}
  .tbl .c-p, .tbl .c-g{display:none}
}

/* системная просьба о покое */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{animation-duration:.001ms!important; animation-iteration-count:1!important;
    transition-duration:.001ms!important; scroll-behavior:auto!important}
  .spines .sp:hover{transform:none}
  .bk:hover{transform:none}
}

/* печать карточки и списка */
@media print{
  header.top, .rail, .mbar, #more, .pills, .seg, .sort, #rnd, .skip, .vtop, #viewer{display:none!important}
  body{background:#fff; color:#111}
  .layout, .main{display:block; margin:0; padding:0}
  .hero, .about{display:none}
  #scrim{position:static; background:none; display:block!important}
  .sheet{box-shadow:none; border:0; max-width:none; width:auto}
  .sh-cov{max-width:52mm}
  .tbl{font-size:10pt}
  .tbl th{position:static; color:#111}
  a[href^="http"]::after{content:" (" attr(href) ")"; font-size:8pt; color:#555}
  .bk, .tbl tr{page-break-inside:avoid}
}