/* keiba-i.net — правится вручную (build.py этот файл не трогает).
   Оформление воспроизводит оригинал (табличный сайт 2000-х): узкая полоса #333388, шапка, полоса меню, слева боксы
   .menuheader (синий) + .menucontent (#f8f8f8), справа .menuheader2 (серый), шрифт Osaka / MS PGothic, мелкий кегль.
   Цвета оригинала: #333388, #000088, #8888dd, #ee4400, #f8f8f8, #dddddd, #cccccc, #fffff0, #008000. */
:root{
  --navy:#333388; --navy-d:#000088; --navy-l:#8888dd; --orange:#ee4400; --green:#008000; --ivory:#fffff0;
  --g1:#f8f8f8; --g2:#dddddd; --g3:#cccccc; --link:#0000dd; --ink:#222;
  --font:Osaka,"MS PGothic","ＭＳ Ｐゴシック","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic UI",Meiryo,"Noto Sans JP",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--ink);font:400 14.5px/1.8 var(--font);overflow-wrap:anywhere}
img,svg{max-width:100%;height:auto}
a{color:var(--link)}
a:hover{color:var(--orange)}
:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--orange);color:#fff;padding:8px 14px;z-index:100}
.skip:focus{left:0}
.page{max-width:1160px;margin:0 auto;padding:0 10px}
p{margin:0 0 .9em}
.lead{font-size:1.02em}
.fine{font-size:.86em;color:#666}
.meta{color:#666;font-size:.86em;margin-top:18px}

/* верхняя полоса и шапка */
.topbar{background:var(--navy);border-bottom:2px solid #aaa;font-size:.7em;line-height:1.5;color:#fff}
.topbar .page{padding-top:2px;padding-bottom:2px}
.head{background:#fff}
.head-in{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:10px;padding-bottom:10px;min-height:74px}
.logo{text-decoration:none;display:inline-block;line-height:1.1}
.logo small{display:block;font-size:.8em;font-weight:700;color:var(--navy);letter-spacing:.2em}
.logo strong{display:block;font-size:2.15em;font-weight:900;color:var(--navy-d);letter-spacing:.02em;text-shadow:1px 1px 0 var(--navy-l)}
.logo strong span{color:var(--orange);text-shadow:1px 1px 0 #ffb899}
.head-r{font-size:.82em;color:#555;text-align:right}

/* полоса меню (в оригинале — bar.gif) */
.navwrap{background:linear-gradient(180deg,#5a5ab4 0%,#333388 50%,#262670 100%);border-top:1px solid #8888dd;border-bottom:2px solid #1a1a55}
.navbar ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap}
.navbar a{display:block;color:#fff;text-decoration:none;font-size:.88em;padding:6px 14px;white-space:nowrap;border-right:1px solid rgba(255,255,255,.18)}
.navbar a:hover,.navbar a[aria-current=page]{background:rgba(255,255,255,.18);color:#fff;font-weight:700}
.nav-toggle{display:none;background:none;border:0;color:#fff;font:inherit;padding:8px 10px;cursor:pointer}

/* строка в самом начале страницы: текст + одна ссылка */
.topline{margin:0;background:#fffbe6;border-bottom:1px solid #e8d99a;padding:8px 14px;font-size:.84em;line-height:1.7;color:#4d4220;text-align:center}
.topline span{font-weight:700}
.topline a{color:var(--navy-d);font-weight:700}

/* три колонки */
.cols{display:grid;grid-template-columns:210px minmax(0,1fr) 190px;gap:12px;padding-top:12px;padding-bottom:20px;align-items:start}
.left,.right{min-width:0}
.menu{margin-bottom:10px}
.menuheader{background:linear-gradient(180deg,#6a6ac0,#333388);color:#fff;font-weight:700;font-size:.92em;padding:4px 8px;border:2px solid;border-color:#fff var(--navy-l) var(--navy-l) #fff;white-space:nowrap}
.menuheader .sub{font-size:.82em;color:#00ffff;font-weight:400;margin-left:6px}
.menucontent{list-style:none;margin:0;padding:6px 8px;background:var(--g1);border:2px solid;border-color:#fff var(--g2) var(--g2) #fff;font-size:.92em}
.menucontent li{padding:3px 0 3px 14px;position:relative;line-height:1.5}
.menucontent li::before{content:"\25A0";position:absolute;left:0;top:4px;font-size:.6em;color:var(--navy)}
.menucontent li.hand::before{content:""}
.menucontent li.hand{padding-left:0}
.menucontent .h{color:var(--orange)}
.menucontent li.hand a{color:var(--orange)}
.menuheader2{background:var(--g2);font-size:.86em;font-weight:700;padding:3px 8px;border:2px solid;border-color:#eee var(--g3) var(--g3) #eee}
.menuheader2 .sq{color:var(--navy-d);margin-right:3px}
.sidebody{padding:6px 8px;font-size:.84em;line-height:1.7;border:1px solid var(--g2);border-top:0}
.sidebody.small{font-size:.8em}
.sidebody .fine{font-size:.9em}
.mini{border-collapse:collapse;width:100%;font-size:.95em}
.mini th,.mini td{border:1px solid var(--g3);padding:2px 5px;text-align:left}
.mini th{background:var(--g1);width:3em;white-space:nowrap}
.log{max-height:11em;overflow:auto;font-size:.76em}
.log div{padding:2px 0;border-bottom:1px dotted var(--g3)}

/* центральная колонка: «коробки» */
.center{min-width:0}
.box{margin-bottom:12px;border:1px solid var(--g3);background:#fff}
.boxhead{margin:0;background:linear-gradient(180deg,#6a6ac0,#333388);color:#fff;font-size:1em;font-weight:700;padding:5px 10px;border:2px solid;border-color:#fff var(--navy-l) var(--navy-l) #fff;line-height:1.5}
h1.boxhead{font-size:1.2em}
.boxbody{padding:10px 14px;background:var(--ivory)}
.box .crumbs{padding:4px 10px;font-size:.78em;background:var(--g1);border-bottom:1px solid var(--g3);color:#666}
.box .crumbs a{color:var(--navy-d)}
.boxbody h3{font-size:1em;margin:0 0 .3em;color:var(--green)}
.boxbody ul,.boxbody ol{padding-left:1.4em}
.boxbody li{margin-bottom:.3em}

/* ячейки и таблицы */
.cells{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.cells-2{grid-template-columns:repeat(2,1fr)}.cells-3{grid-template-columns:repeat(3,1fr)}
.cell{border:1px solid var(--g3);background:#fff;padding:8px 10px}
.cell h3{margin-bottom:.2em}
.cell p{margin:0;font-size:.92em;color:#444}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.steps li{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid var(--g3);padding:8px 10px;margin:0}
.steps .num{flex:none;display:grid;place-items:center;width:26px;height:26px;background:var(--navy);color:#fff;font-weight:700;font-size:.9em}
.steps h3{margin:0 0 .15em;color:var(--navy-d)}.steps p{margin:0;font-size:.93em;color:#444}
.checklist{list-style:none;margin:0;padding:0}
.checklist li{position:relative;padding:4px 0 4px 18px;border-bottom:1px dotted var(--g3);margin:0}
.checklist li::before{content:"\25A0";position:absolute;left:2px;top:6px;font-size:.7em;color:var(--green)}
.checklist.warn li::before{color:var(--orange)}
.table-wrap{overflow-x:auto;margin:10px 0}
.cmp{width:100%;border-collapse:collapse;min-width:520px;font-size:.92em;background:#fff}
.cmp th,.cmp td{border:1px solid var(--g3);padding:5px 8px;text-align:left;vertical-align:top}
.cmp thead th{background:var(--navy);color:#fff;white-space:nowrap}
.cmp tbody th{background:var(--g1);color:var(--navy-d)}
.faq{background:#fff;border:1px solid var(--g3);margin:0 0 8px}
.faq summary{cursor:pointer;font-weight:700;padding:7px 10px;color:var(--navy-d);background:var(--g1)}
.faq-a{padding:6px 12px 2px}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.btn{display:inline-block;background:var(--navy);color:#fff;text-decoration:none;padding:6px 18px;border:2px solid;border-color:#8888dd #1a1a55 #1a1a55 #8888dd;font-weight:700}
.btn:hover{color:#fff;background:var(--orange)}
.btn-ghost{background:#fff;color:var(--navy-d)}
.btn-ghost:hover{color:#fff}

/* подвал */
.notice-bar{border-top:2px solid var(--g3);background:var(--g1);font-size:.8em;color:#555}
.notice-bar .page{padding-top:8px;padding-bottom:8px}
.notice-bar strong{color:var(--navy-d)}
.foot{background:var(--navy);color:#fff;font-size:.78em;padding:12px 0 14px}
.foot a{color:#cfcfff}
.foot p{margin:0 0 6px}
.foot-copy{color:#bbf}

@media (max-width:980px){
  .cols{grid-template-columns:minmax(0,1fr)}
  .center{order:1}.left{order:2}.right{order:3}
  .head-r{display:none}
}
@media (max-width:760px){
  .nav-toggle{display:block}
  .navbar{display:none}
  .navbar.open{display:block}
  .navbar ul{flex-direction:column}
  .navbar a{border-right:0;border-top:1px solid rgba(255,255,255,.18);padding:10px 14px;white-space:normal}
  .cells-2,.cells-3{grid-template-columns:1fr}
  .logo strong{font-size:1.7em}
  .topline{text-align:left}
}