/* Страница одного букета: /katalog/<каталог>/<дата>/<файл> */

.bk-hero{ padding:28px 0 8px; }
.bk-grid{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:44px; align-items:start; }
@media (max-width:860px){ .bk-grid{ grid-template-columns:minmax(0,1fr); gap:24px; } }

.bk-main{ position:relative; margin:0; border-radius:var(--radius-m); overflow:hidden; background:var(--paper-2); aspect-ratio:1; }
.bk-main img{ width:100%; height:100%; object-fit:cover; }
.bk-angle{ position:absolute; top:12px; right:12px; background:rgba(255,255,255,.9); color:var(--text-ink);
  font-size:12.5px; font-weight:600; padding:5px 10px; border-radius:999px; }
.bk-file{ position:absolute; left:12px; bottom:12px; background:rgba(27,23,38,.72); color:#fff;
  font:12.5px ui-monospace,"SF Mono",Menlo,Consolas,monospace; padding:5px 9px; border-radius:6px; }

.bk-thumbs{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px; margin-top:10px; }
.bk-thumbs button{ padding:0; border:0; cursor:pointer; border-radius:8px; overflow:hidden; aspect-ratio:1;
  background:var(--paper-2); outline:2px solid transparent; outline-offset:2px; transition:outline-color .15s; }
.bk-thumbs button[aria-current="true"]{ outline-color:var(--rose); }
.bk-thumbs button:focus-visible{ outline-color:var(--text-ink); }
.bk-thumbs img{ width:100%; height:100%; object-fit:cover; }

.bk-info h1{ font-size:clamp(24px,3.2vw,34px); margin:10px 0 18px; }
.bk-meta{ display:grid; grid-template-columns:auto 1fr; gap:6px 16px; font-size:14.5px; margin:0 0 22px; }
.bk-meta dt{ color:var(--text-ink-muted); }
.bk-meta dd{ margin:0; font-variant-numeric:tabular-nums; min-width:0; overflow-wrap:anywhere; }
.bk-h2{ font-size:18px; margin:0 0 12px; }
.bk-spec{ list-style:none; margin:0 0 22px; padding:0; border-top:1px solid var(--line-ink); }
.bk-spec li{ padding:10px 0; border-bottom:1px solid var(--line-ink); }

.bk-addr{ background:#fff; border:1px solid var(--line-ink); border-radius:var(--radius-m); padding:16px; }
.bk-addr p, .bk-muted{ font-size:13.5px; color:var(--text-ink-muted); margin:0 0 10px; }
.bk-copy{ display:flex; gap:8px; align-items:center; }
.bk-copy code{ flex:1; min-width:0; font:13px ui-monospace,"SF Mono",Menlo,Consolas,monospace; background:var(--paper-2);
  padding:10px; border-radius:8px; overflow-x:auto; white-space:nowrap; }
.bk-copy .btn{ flex:none; }

.bk-pn{ display:flex; justify-content:space-between; gap:16px; margin-top:26px; font-size:14px; }
.bk-pn a{ display:flex; align-items:center; gap:6px; color:var(--text-ink-muted); text-decoration:none; min-width:0; }
.bk-pn a span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bk-pn a:hover{ color:var(--rose); }
.bk-pn svg{ width:16px; height:16px; flex:none; }

.bk-block{ padding:40px 0 0; }
.bk-block > .container{ border-top:1px solid var(--line-ink); padding-top:32px; }
.bk-block:last-of-type{ padding-bottom:64px; }
.bk-video{ display:grid; grid-template-columns:minmax(0,320px) minmax(0,1fr); gap:32px; align-items:start; }
.bk-video video{ width:100%; aspect-ratio:9/16; border-radius:var(--radius-m); background:var(--ink); object-fit:cover; }
@media (max-width:700px){ .bk-video{ grid-template-columns:minmax(0,1fr); } .bk-video video{ max-width:360px; } }

.bk-table{ overflow-x:auto; border:1px solid var(--line-ink); border-radius:12px; background:#fff; }
.bk-table table{ border-collapse:collapse; width:100%; min-width:560px; font-size:14px; }
.bk-table th, .bk-table td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--line-ink); vertical-align:top; }
.bk-table th{ font-size:12.5px; font-weight:600; color:var(--text-ink-muted); background:var(--paper-2); }
.bk-table tr:last-child td{ border-bottom:0; }
.bk-table td:first-child{ width:40px; color:var(--text-ink-muted); font-variant-numeric:tabular-nums; }
.bk-table code{ font:13px ui-monospace,"SF Mono",Menlo,Consolas,monospace; word-break:break-all; }
.bk-table a{ text-decoration:none; } .bk-table a:hover code{ color:var(--rose); }

.bk-legal p{ max-width:68ch; color:var(--text-ink-muted); line-height:1.6; }
.bk-legal b{ color:var(--text-ink); }

.bk-toast{ position:fixed; left:50%; bottom:calc(20px + env(safe-area-inset-bottom,0px)); translate:-50% 0; z-index:50;
  background:var(--ink); color:var(--text-paper); padding:9px 16px; border-radius:999px; font-size:14px; }
