/* Книжный Городок — палитра из логотипа */
:root{--bg:#f3ead6;--paper:#fffaf0;--ink:#2e2418;--br:#4a3a28;--br2:#7a5f3e;--line:#d9c7a1;
--tq:#2f8fb8;--mg:#b0216a;--rd:#c3392b;--gn:#3d8b3d;--ms:#d39a1c;--nv:#2b3f7e;--r:14px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 "PT Serif",Georgia,serif}
a{color:var(--nv)}a:hover{color:var(--mg)}
img{max-width:100%;height:auto}
h1,h2,h3,.brand-name,.sec-h,.btn,.menu a,.rb-badge,.t-name{font-family:Kurale,"PT Serif",Georgia,serif;font-weight:400}
h1{font-size:1.9rem;line-height:1.2;margin:.2em 0 .4em}h2{font-size:1.45rem;line-height:1.25}
.wrap{max-width:1180px;margin:0 auto;padding:0 14px}
.skip{position:absolute;left:-9999px}.skip:focus{left:8px;top:8px;background:#fff;padding:6px;z-index:9}
/* орнаментальная полоса: ромбы с крестом, как на рамке логотипа */
.orn{height:18px;background-color:var(--br);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='18' viewBox='0 0 36 18'%3E%3Cg fill='none' stroke='%23e9d9b4' stroke-width='1.4'%3E%3Cpath d='M0 9 9 2l9 7-9 7z M18 9l9-7 9 7-9 7z'/%3E%3Cpath d='M9 6v6M6 9h6M27 6v6M24 9h6'/%3E%3C/g%3E%3C/svg%3E");background-repeat:repeat-x;background-position:center}
.site-head{background:var(--paper);border-bottom:3px solid var(--br)}
.head-in{display:flex;align-items:center;gap:14px;padding:10px 14px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--br);flex:1 1 320px;min-width:0}
.brand img{width:72px;height:auto;flex:none}
.brand-txt{display:flex;flex-direction:column;min-width:0}
.brand-name{font-family:"Ruslan Display",Kurale,serif;font-size:1.75rem;line-height:1.1;letter-spacing:.02em;color:var(--br)}
.brand-tag{font-size:.82rem;color:var(--br2);font-style:italic;line-height:1.3}
.hsearch{display:flex;flex:1 1 260px;max-width:380px}
.hsearch input{flex:1;min-width:0;border:2px solid var(--br);border-right:0;border-radius:10px 0 0 10px;padding:8px 10px;font:inherit;font-size:.95rem;background:#fff}
.hsearch button{border:2px solid var(--br);background:var(--br);color:#fff;border-radius:0 10px 10px 0;padding:0 12px;cursor:pointer}
.menu{background:var(--br)}
.menu-in{display:flex;gap:6px;overflow-x:auto;padding:8px 14px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.menu a{flex:none;color:#fff;text-decoration:none;padding:5px 12px;border-radius:999px;border:1.5px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);font-size:.95rem;white-space:nowrap;box-shadow:inset 0 -3px 0 var(--c,#e9d9b4)}
.menu a:hover,.menu a[aria-current]{background:var(--c,#e9d9b4);border-color:var(--c,#e9d9b4);color:#fff}
.m-about{--c:#e9d9b4}.menu a.m-about:hover,.menu a.m-about[aria-current]{color:var(--br)}
main{padding-top:18px;padding-bottom:30px}
.frame{background:var(--paper);border:2px solid var(--br);border-radius:var(--r);box-shadow:0 0 0 4px var(--bg),0 0 0 6px var(--br2);padding:18px;margin:10px 6px 26px}
.hero{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.hero-logo{width:200px;flex:none;margin:0 auto}
.hero-txt{flex:1 1 360px}.lead{font-size:1.1rem}
.btn{display:inline-block;background:var(--br);color:#fff;border:2px solid var(--br);border-radius:10px;padding:8px 16px;text-decoration:none;cursor:pointer;font-size:1rem;margin:3px 2px}
.btn:hover{background:var(--mg);border-color:var(--mg);color:#fff}
.btn.sec{background:transparent;color:var(--br)}.btn.sec:hover{background:var(--br);color:#fff}
.btn.red{background:var(--rd);border-color:var(--rd)}.btn.sm{padding:3px 10px;font-size:.9rem}
.sec-h{font-size:1.5rem;color:var(--br);margin:26px 6px 12px;display:flex;align-items:center;gap:10px}
.sec-h::after{content:"";flex:1;height:10px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='10'%3E%3Cpath d='M0 5 5 1l5 4-5 4zM10 5l5-4 5 4-5 4z' fill='none' stroke='%237a5f3e' stroke-width='1.2'/%3E%3C/svg%3E");opacity:.7}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin:0 6px}
.tile{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:var(--ink);background:var(--paper);border:2px solid var(--br);border-top:10px solid var(--c);border-radius:var(--r);padding:12px 14px;transition:transform .15s}
.tile:hover{transform:translateY(-2px);color:var(--ink);box-shadow:0 6px 14px rgba(74,58,40,.18)}
.t-emo{font-size:1.6rem}.t-name{font-size:1.3rem;color:var(--c)}.t-age{font-weight:700;font-size:.9rem}
.t-desc{font-size:.92rem;color:#5b4a35}.t-cnt{margin-top:auto;padding-top:6px;font-size:.85rem;color:var(--br2)}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:0 6px}
@media(min-width:640px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:960px){.grid{grid-template-columns:repeat(4,1fr);gap:16px}}
.card{background:var(--paper);border:2px solid var(--br);border-radius:var(--r);overflow:hidden;display:flex}
.card-link{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);width:100%}
.card:hover{box-shadow:0 6px 14px rgba(74,58,40,.2)}
.cover{width:100%;aspect-ratio:3/4;object-fit:cover;background:#e9dcc0;border-bottom:4px solid var(--c);display:block}
.nocover{display:flex;align-items:center;justify-content:center;font-size:3rem}
.card-b{padding:8px 10px 10px;display:flex;flex-direction:column;gap:2px;flex:1}
.card h3{font-size:1.05rem;line-height:1.25;margin:2px 0;overflow-wrap:anywhere}
.au{margin:0;color:var(--br2);font-style:italic;font-size:.92rem}
.dt{margin:auto 0 0;font-size:.8rem;color:#8a7a62}
.rb-badge{display:inline-block;align-self:flex-start;background:var(--c);color:#fff;border-radius:999px;padding:1px 10px;font-size:.8rem;text-decoration:none}
a.rb-badge:hover{color:#fff;opacity:.9}
.wk{display:flex;gap:18px;text-decoration:none;color:var(--ink);flex-wrap:wrap;border-top:10px solid var(--c)}
.wk img{width:220px;flex:none;border-radius:10px;border:2px solid var(--br);margin:0 auto}
.wk>div{flex:1 1 300px}.wk h3{font-size:1.5rem;margin:6px 0}.more{color:var(--mg);font-family:Kurale,serif}
.list-head{border-top:10px solid var(--c,var(--br))}.list-head small{font-size:1rem;color:var(--br2)}
.muted{color:#7d6c55;font-size:.92rem}
.pager{display:flex;justify-content:center;gap:16px;align-items:center;margin:24px 0;font-family:Kurale,serif}
.crumbs{font-size:.9rem;margin:0 6px 6px}
.post{border-top:10px solid var(--c)}
.post-h h1{font-size:2rem;margin:.3em 0 .1em}
.post-grid{display:grid;gap:20px;margin-top:12px}
@media(min-width:860px){.post-grid{grid-template-columns:minmax(260px,360px) 1fr;align-items:start}.post-cover{position:sticky;top:12px}}
.post-cover{margin:0}.post-cover img{width:100%;border-radius:10px;border:2px solid var(--br)}
.post-body{white-space:pre-line;font-size:1.06rem;overflow-wrap:anywhere;max-width:72ch}
.post-body b,.post-body strong{color:#3a2b1a}
.post-body blockquote{border-left:4px solid var(--c);margin:.5em 0;padding:.2em 1em;background:#f7efdc}
.spoiler{background:#3a2b1a;color:transparent;border-radius:3px;cursor:pointer}.spoiler:hover{color:inherit;background:transparent}
.ht{display:inline-block;margin:2px 4px 2px 0;font-size:.92rem;text-decoration:none;background:#efe3c6;border-radius:999px;padding:0 8px;color:var(--nv)}
.post-body .ht{background:none;padding:0}
.post-f{border-top:1px dashed var(--line);margin-top:16px;padding-top:10px}
.prevnext{display:flex;justify-content:space-between;gap:10px;margin:0 6px;font-size:.95rem;flex-wrap:wrap}
.subbox{text-align:center;border-top:10px solid var(--tq)}
.subform{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:560px;margin:0 auto}
.subform input[type=email]{flex:1 1 240px;padding:10px 12px;border:2px solid var(--br);border-radius:10px;font:inherit;background:#fff}
.agree{flex-basis:100%;font-size:.85rem;color:#5b4a35}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.err{color:var(--rd);font-weight:700}
.prose{max-width:820px;margin-left:auto;margin-right:auto}.about-logo{float:right;width:180px;margin:0 0 10px 14px}
.links{list-style:none;padding:0}.links li{margin:6px 0}
.bigsearch{display:flex;gap:8px;flex-wrap:wrap}.bigsearch input{flex:1 1 240px;padding:10px;border:2px solid var(--br);border-radius:10px;font:inherit}
.flash{background:#e6f1df;border:1px solid var(--gn);padding:8px 12px;border-radius:10px;margin:0 6px 12px}
.site-foot{background:var(--br);color:#efe3c6;margin-top:30px}
.site-foot a{color:#fff}
.foot-in{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:20px 14px;font-size:.95rem}
.copy{font-size:.8rem;opacity:.7;padding-bottom:16px}
.admin .tbl{width:100%;border-collapse:collapse;background:var(--paper);margin:0 0 20px}
.tbl td,.tbl th{border-bottom:1px solid var(--line);padding:6px;text-align:left;font-size:.95rem;vertical-align:top}
.admform label{display:block;margin:10px 0}.admform input,.admform textarea{display:block;width:100%;padding:8px;border:2px solid var(--br);border-radius:8px;font:inherit;margin-top:4px;background:#fff}
.preview{width:100%;height:640px;border:2px solid var(--br);border-radius:10px;background:#fff}
.pre{white-space:pre-wrap;background:#fff;padding:10px;border-radius:8px}
.linkbtn{background:none;border:0;color:var(--nv);text-decoration:underline;cursor:pointer;font:inherit}
@media(max-width:600px){body{font-size:16px}h1{font-size:1.5rem}.post-h h1{font-size:1.6rem}.brand img{width:56px}.brand-name{font-size:1.35rem}.brand-tag{font-size:.75rem}.frame{padding:14px;margin:8px 4px 20px}.hero-logo{width:150px}.wk img{width:160px}.hsearch{max-width:none}}
@media(min-width:1000px){.menu-in{flex-wrap:wrap;justify-content:center;overflow:visible}}
@media(max-width:600px){.tiles{grid-template-columns:repeat(2,1fr);gap:10px}.tile{padding:10px}.t-desc{display:none}.t-name{font-size:1.1rem}.hero-logo{display:none}}
.consent{position:fixed;left:10px;right:10px;bottom:10px;z-index:50;max-width:720px;margin:0 auto;background:var(--paper);border:2px solid var(--br);border-top:8px solid var(--ms);border-radius:var(--r);box-shadow:0 0 0 3px var(--bg),0 8px 24px rgba(46,36,24,.35);padding:12px 16px;font-size:.92rem}
.consent p{margin:.3em 0}.consent-btns{text-align:right}
@media(max-width:600px){.consent{font-size:.85rem}.consent-btns{text-align:center}}
