:root{
    --ink:#16233A;
    --ink-soft:#2B3A54;
    --paper:#EDF0EA;
    --card:#FFFFFF;
    --amber:#E8A23D;
    --amber-dark:#C97F1E;
    --moss:#3F6B52;
    --moss-soft:#E3EEE7;
    --steel:#5C6B73;
    --steel-soft:#EEF1F1;
    --line:#DBDED3;
    --danger:#B34A3C;
    --danger-soft:#F6E7E4;
    --radius:16px;
    --radius-sm:10px;
    --shadow:0 3px 14px rgba(22,35,58,.09);
    --font-display:'Oswald',sans-serif;
    --font-body:'PT Sans',sans-serif;
    --font-mono:'PT Mono',monospace;
    --container:1240px;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:var(--font-body);
    -webkit-font-smoothing:antialiased;
  }
  button,input,select{font-family:inherit;}
  button{cursor:pointer;}
  ul{list-style:none;margin:0;padding:0;}
  a{color:inherit;}
  :focus-visible{outline:3px solid var(--amber-dark); outline-offset:2px;}
  .wrap{max-width:var(--container); margin:0 auto; padding:0 20px;}

  /* ---------- Header ---------- */
  .site-header{background:var(--ink); color:#fff;}
  .header-top{
    display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding:18px 0 14px;
    flex-wrap:wrap;
  }
  .brand{display:flex; align-items:center; gap:12px;}
  .brand .seal{
    width:40px;height:40px;flex:none;border-radius:50%;
    border:2px dashed rgba(232,162,61,.85);
    display:flex;align-items:center;justify-content:center;
    transform:rotate(-8deg);
  }
  .brand .seal svg{width:21px;height:21px;}
  .brand h1{font-family:var(--font-display); font-size:22px; margin:0; text-transform:uppercase; letter-spacing:.3px;}
  .brand .tag{display:block; font-size:12px; color:rgba(255,255,255,.62); font-weight:400; margin-top:1px;}
  .locate-btn{
    background:var(--amber); color:var(--ink); border:none; border-radius:999px;
    padding:10px 18px; font-family:var(--font-display); font-weight:600; font-size:14px;
    display:flex; align-items:center; gap:7px; white-space:nowrap;
  }
  .locate-btn:active{transform:scale(.97);}
  .locate-btn.busy .pin{animation:pulse 1s ease-in-out infinite;}
  @media (prefers-reduced-motion:no-preference){
    @keyframes pulse{0%,100%{opacity:1;}50%{opacity:.35;}}
  }

  .header-nav{display:flex; gap:4px; border-top:1px solid rgba(255,255,255,.12); flex-wrap:wrap;}
  .header-nav button{
    background:none;border:none;color:rgba(255,255,255,.65);
    padding:13px 16px; font-family:var(--font-display); font-size:13.5px;
    text-transform:uppercase; letter-spacing:.3px;
    border-bottom:3px solid transparent;
  }
  .header-nav button.active{color:#fff; border-bottom-color:var(--amber);}
  .header-nav button .count{
    background:rgba(255,255,255,.14); border-radius:999px; padding:1px 7px; margin-left:6px; font-size:11px;
  }

  .geo-banner{
    background:var(--ink-soft); color:#fff; font-size:13.5px;
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    padding:9px 0;
  }
  .geo-banner .wrap{display:flex; align-items:center; justify-content:space-between; width:100%; gap:10px;}
  .geo-banner button{
    background:none;border:1px solid rgba(255,255,255,.4);color:#fff;
    border-radius:999px;padding:4px 12px;font-size:12px;
  }

  /* ---------- Layout ---------- */
  .layout{
    max-width:var(--container); margin:0 auto; padding:22px 20px 60px;
    display:grid; grid-template-columns:1fr; gap:22px;
  }
  @media (min-width:900px){
    .layout{grid-template-columns:300px 1fr; align-items:start;}
  }

  /* ---------- Filters panel ---------- */
  .filters-toggle{
    display:flex; align-items:center; justify-content:space-between;
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius-sm);
    padding:12px 16px; font-weight:700; font-size:14px; color:var(--ink-soft);
    width:100%;
  }
  .filters-toggle .badge{
    background:var(--amber-dark); color:#fff; border-radius:999px; padding:1px 8px; font-size:11.5px; margin-left:8px;
  }
  @media (min-width:900px){ .filters-toggle{display:none;} }

  .filters-panel{
    background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow);
    padding:18px; display:none; flex-direction:column; gap:18px;
  }
  .filters-panel.open{display:flex;}
  @media (min-width:900px){
    .filters-panel{display:flex; position:sticky; top:20px;}
  }

  .field-group h3{
    font-family:var(--font-display); font-size:12px; text-transform:uppercase; letter-spacing:.4px;
    color:var(--steel); margin:0 0 10px;
  }
  .search-field{display:flex; gap:8px;}
  .search-field input{
    flex:1; min-width:0; border:1px solid var(--line); border-radius:var(--radius-sm);
    padding:10px 12px; font-size:14px;
  }
  .search-field button{
    background:var(--amber); color:var(--ink); border:none; border-radius:var(--radius-sm);
    padding:0 16px; font-family:var(--font-display); font-weight:600; font-size:13px; text-transform:uppercase;
  }
  .field-group select, .field-full-input{
    width:100%; border:1px solid var(--line); border-radius:var(--radius-sm);
    padding:9px 12px; font-size:13.5px; color:var(--ink-soft); background:var(--card);
  }
  .range-row{display:flex; align-items:center; gap:8px;}
  .range-row input{
    width:0; flex:1; border:1px solid var(--line); border-radius:var(--radius-sm);
    padding:9px 10px; font-size:13.5px; font-family:var(--font-mono);
  }
  .range-row input::-webkit-outer-spin-button, .range-row input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
  .range-row span{font-size:12.5px; color:var(--steel); flex:none;}

  .checkbox-list{display:flex; flex-direction:column; gap:7px; max-height:200px; overflow-y:auto;}
  .checkbox-row{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--ink-soft);}
  .checkbox-row input{accent-color:var(--amber-dark); width:16px; height:16px; flex:none;}
  .checkbox-row .cnt{color:var(--steel); font-size:12px; margin-left:auto; font-family:var(--font-mono);}
  .checkbox-row.empty-hint{color:var(--steel); font-style:normal; font-size:12.5px;}

  .toggle-row{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--ink-soft);}
  .toggle-row input{accent-color:var(--amber-dark); width:16px; height:16px;}

  .filters-actions{display:flex; gap:8px;}
  .filters-actions button{
    flex:1; border-radius:var(--radius-sm); padding:10px; font-size:13px; font-weight:700;
  }
  .btn-reset{background:var(--steel-soft); border:none; color:var(--ink-soft);}
  .btn-apply-filters{background:var(--ink); border:none; color:#fff;}

  /* ---------- Results area ---------- */
  .results-area{min-width:0;}
  .statusbar{font-size:13.5px; color:var(--steel); margin-bottom:14px; min-height:18px;}
  .statusbar strong{color:var(--ink);}

  .cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px;}

  /* Рекламный слот РСЯ внутри ленты вакансий — занимает всю ширину сетки,
     вставляется через JS после каждых двух рядов (см. insertInFeedAdSlots) */
  .ad-slot-card{
    grid-column:1/-1; border-left:none !important; padding:0 !important;
    background:none; box-shadow:none;
  }
  .ad-slot-placeholder{
    min-height:90px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
    border:1px dashed var(--amber-dark); border-radius:var(--radius);
    background:repeating-linear-gradient(45deg,var(--steel-soft),var(--steel-soft) 10px,var(--card) 10px,var(--card) 20px);
    color:var(--steel); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; text-align:center;
  }
  .ad-slot-placeholder span{font-size:11px; font-weight:400; text-transform:none; letter-spacing:0;}

  .card{
    background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow);
    padding:16px 16px 14px; position:relative; border-left:4px solid var(--line);
    display:flex; flex-direction:column;
  }
  .card.fresh-today{border-left-color:var(--moss);}
  .card.fresh-week{border-left-color:var(--amber);}
  .card-top{display:flex; justify-content:space-between; gap:10px; align-items:flex-start;}
  .card-title{font-family:var(--font-display); font-weight:600; font-size:17px; line-height:1.25; margin:0 0 4px;}
  .card-company{font-size:13.5px; color:var(--steel); margin:0 0 10px;}
  .fav-btn{background:none;border:none;font-size:21px;line-height:1;color:var(--line);flex:none;padding:2px;}
  .fav-btn.active{color:var(--amber-dark);}
  .card-meta{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px;}
  .chip{font-size:11.5px; padding:3px 9px; border-radius:999px; background:var(--steel-soft); color:var(--steel); white-space:nowrap;}
  .chip.region{background:var(--moss-soft); color:var(--moss);}
  .chip.date{font-family:var(--font-mono);}
  .card-salary{font-family:var(--font-mono); font-size:16px; color:var(--ink); font-weight:700; margin-bottom:12px;}
  .card-salary .unit{font-family:var(--font-body); font-weight:400; font-size:12.5px; color:var(--steel);}
  .card-actions{display:flex; gap:8px; margin-top:auto;}
  .btn-more{flex:1; background:var(--steel-soft); color:var(--ink-soft); border:none; border-radius:var(--radius-sm); padding:9px; font-size:13px; font-weight:700;}
  .btn-apply{flex:1; background:var(--ink); color:#fff; border:none; border-radius:var(--radius-sm); padding:9px; font-size:13px; font-weight:700; text-align:center; text-decoration:none; display:block;}

  .loadmore{display:block; width:100%; margin-top:18px; background:var(--card); border:1px solid var(--line); color:var(--ink-soft); border-radius:var(--radius-sm); padding:13px; font-weight:700; font-size:13.5px;}
  .hidden{display:none !important;}

  .skeleton{background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); padding:16px; height:150px; position:relative; overflow:hidden;}
  .skeleton::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(22,35,58,.06),transparent);transform:translateX(-100%);}
  @media (prefers-reduced-motion:no-preference){
    .skeleton::after{animation:shimmer 1.3s infinite;}
    @keyframes shimmer{100%{transform:translateX(100%);}}
  }

  .state-block{grid-column:1/-1; text-align:center; padding:44px 18px; color:var(--steel);}
  .state-block .emoji{font-size:36px;display:block;margin-bottom:10px;}
  .state-block h3{font-family:var(--font-display); color:var(--ink); margin:0 0 6px; font-size:18px;}
  .state-block p{font-size:13.5px; line-height:1.5; margin:0 0 14px; max-width:440px; margin-left:auto; margin-right:auto;}
  .state-block.error{background:var(--danger-soft); border-radius:var(--radius);}
  .state-block.error h3{color:var(--danger);}
  .state-block .btn-row{display:flex; gap:8px; justify-content:center; flex-wrap:wrap;}
  .state-block button{border:1px solid var(--line); background:var(--card); border-radius:999px; padding:9px 16px; font-size:13px; font-weight:700; color:var(--ink-soft);}
  .state-block button.primary{background:var(--ink); color:#fff; border-color:var(--ink);}

  /* ---------- Favorites / About ---------- */
  .view{display:none;}
  .view.active{display:block;}

  .about-hero{display:flex; align-items:center; gap:16px; margin-bottom:20px;}
  .about-hero .seal-big{width:64px;height:64px;flex:none;border-radius:50%;border:2px dashed var(--amber-dark);display:flex;align-items:center;justify-content:center;transform:rotate(-6deg);}
  .about-hero .seal-big svg{width:32px;height:32px;}
  .about-hero h2{font-family:var(--font-display); font-size:21px; margin:0 0 3px;}
  .about-hero p{margin:0; font-size:13px; color:var(--steel);}
  .about-block{background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px; margin-bottom:14px; font-size:14px; line-height:1.6; color:var(--ink-soft); max-width:720px;}
  .about-block h4{font-family:var(--font-display); font-size:13px; text-transform:uppercase; letter-spacing:.4px; color:var(--steel); margin:0 0 8px;}
  .about-block a{color:var(--amber-dark); font-weight:700; text-decoration:none;}

  footer.site-footer{border-top:1px solid var(--line); padding:22px 0 40px; color:var(--steel); font-size:12.5px; text-align:center;}
  .footer-links{display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:10px;}
  .footer-links button{background:none;border:none;color:var(--steel);font-size:12.5px;text-decoration:underline;padding:0;}
  .footer-links button:hover{color:var(--ink-soft);}

  .rsya-slot{margin:16px auto 0; min-height:0;}
  .rsya-slot:not(:empty){padding:12px 20px; background:var(--card); border-radius:var(--radius-sm); box-shadow:var(--shadow);}

  .legal-page{max-width:760px;}
  .legal-page .back-link{background:none;border:none;color:var(--steel);font-size:13px;font-weight:700;padding:0;margin-bottom:16px;display:inline-flex;align-items:center;gap:6px;}
  .legal-page .legal-note{
    background:var(--danger-soft); border-radius:var(--radius-sm); padding:12px 14px; font-size:13px;
    color:var(--ink-soft); margin-bottom:18px; line-height:1.5;
  }
  .legal-page h2{font-family:var(--font-display); font-size:22px; margin:0 0 16px;}
  .legal-page section{margin-bottom:18px;}
  .legal-page h4{font-family:var(--font-display); font-size:14px; margin:0 0 8px; color:var(--ink-soft);}
  .legal-page p, .legal-page li{font-size:13.5px; line-height:1.65; color:var(--ink-soft);}
  .legal-page ul{list-style:disc; padding-left:20px;}
  .legal-page table{width:100%; border-collapse:collapse; font-size:13px; margin-top:6px;}
  .legal-page th, .legal-page td{text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:top;}
  .legal-page th{font-family:var(--font-display); font-size:11.5px; text-transform:uppercase; color:var(--steel);}
  .legal-page .placeholder{color:var(--amber-dark); font-weight:700;}

  /* ---------- Detail modal ---------- */
  .modal-overlay{position:fixed; inset:0; background:rgba(22,35,58,.45); z-index:50; display:flex; align-items:center; justify-content:center; padding:20px;}
  .modal-box{background:var(--paper); width:100%; max-width:560px; max-height:88vh; overflow-y:auto; border-radius:20px; padding:20px; position:relative;}
  #closeSheet{position:absolute; top:14px; right:14px; background:var(--steel-soft); border:none; border-radius:50%; width:32px; height:32px; font-size:15px; color:var(--ink-soft);}
  .detail-title{font-family:var(--font-display); font-size:21px; margin:6px 36px 4px 0;}
  .detail-company{color:var(--steel); font-size:14px; margin-bottom:14px;}
  .detail-section{background:var(--card); border-radius:var(--radius-sm); padding:13px; margin-bottom:10px; font-size:13.5px; line-height:1.55;}
  .detail-section h5{font-family:var(--font-display); font-size:11.5px; text-transform:uppercase; letter-spacing:.4px; color:var(--steel); margin:0 0 6px;}
  .detail-actions{display:flex; gap:8px; margin-top:8px;}

  .toast{position:fixed; left:50%; bottom:26px; transform:translateX(-50%); background:var(--ink); color:#fff; padding:11px 18px; border-radius:999px; font-size:13.5px; box-shadow:var(--shadow); z-index:60;}
  body.cookie-banner-visible .toast{bottom:112px;}

  /* ---------- Согласие на использование cookie ---------- */
  .cookie-banner{
    position:fixed; left:0; right:0; bottom:0; z-index:70;
    background:var(--ink); color:#fff;
    box-shadow:0 -4px 18px rgba(22,35,58,.25);
  }
  .cookie-banner .wrap{
    display:flex; align-items:center; gap:18px; flex-wrap:wrap;
    padding:16px 20px;
  }
  .cookie-text{flex:1; min-width:240px; font-size:13.5px; line-height:1.5; color:rgba(255,255,255,.88);}
  .cookie-text a{color:var(--amber); font-weight:700; text-decoration:none;}
  .cookie-actions{display:flex; gap:8px; flex:none; flex-wrap:wrap; align-items:center;}
  .cookie-actions button{
    border-radius:999px; padding:10px 18px; font-size:13px; font-weight:700; border:none; white-space:nowrap;
  }
  .btn-cookie-accept{background:var(--amber); color:var(--ink);}
  .btn-cookie-necessary{background:none; border:1px solid rgba(255,255,255,.35) !important; color:#fff;}
  .btn-cookie-reject{background:none !important; border:none !important; color:rgba(255,255,255,.6) !important; text-decoration:underline; padding:10px 4px !important; font-weight:400 !important;}
  @media (max-width:560px){
    .cookie-actions{width:100%;}
    .cookie-actions .btn-cookie-necessary, .cookie-actions .btn-cookie-accept{flex:1;}
    .btn-cookie-reject{width:100%; text-align:center;}
  }

  @media (max-width:899px){
    .header-top{padding:16px 0 10px;}
  }

  #yandex_rtb_R-A-19670444-1{ min-height:90px; display:block; }
#yandex_rtb_R-A-19670444-2{ min-height:90px; display:block; }
#yandex_rtb_R-A-19670444-3{ min-height:90px; display:block; }