:root{font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#102247;background:#e9f2fb;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html{min-width:300px}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #2586fa;outline-offset:2px}[hidden]{display:none!important}
.app-shell{position:relative;min-height:100svh;max-width:580px;margin:0 auto;background:radial-gradient(ellipse at 60% 4%,#b3daf8 0,#d9eafb 34%,#edf4fc 80%);box-shadow:0 0 65px #7597c028;overflow:hidden}
.brand-head{width:100%;overflow:hidden}.brand-head img{display:block;width:100%;height:auto}
.main{padding:0 15px 0}.glass,.category-tile,.ad-card,.ad-slot{background:linear-gradient(127deg,rgba(255,255,255,.74),rgba(242,248,255,.66));border:1.2px solid rgba(255,255,255,.94);box-shadow:0 4px 18px rgba(59,111,166,.07),inset 0 1px 0 rgba(255,255,255,.7);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.search{display:flex;align-items:center;min-height:56px;border-radius:21px;gap:12px;padding:0 15px;margin:10px 0 13px;box-shadow:0 4px 16px #7eacd02a}.search svg{width:24px;height:24px;flex:none;color:#56779e}.search input{outline:0;min-width:0;width:100%;border:0;background:none;color:#18345a;font-size:18px}.search input::placeholder{color:#58759b;opacity:1}.search-go{border:0;border-radius:12px;padding:7px 10px;background:#2c83f0;color:#fff;font-size:12px;font-weight:650}
.category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.category-tile{text-align:left;display:flex;align-items:center;gap:9px;border-radius:19px;min-height:75px;padding:8px 10px;color:#122348}.category-tile:active,.ad-card:active{transform:scale(.99)}.cat-icon{width:49px;height:49px;min-width:49px;display:flex;align-items:center;justify-content:center;border-radius:15px;background:linear-gradient(145deg,#f9fdff,#dbedfc);border:1px solid white}.cat-icon svg{width:30px;height:30px;stroke:#287ee1;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}.cat-name{font-size:14px;line-height:1.18;font-weight:760;flex:1}.tile-arrow{font-size:25px;color:#879bb4;font-weight:250;margin-left:auto}
.feed-area{margin-top:19px}.feed-head{display:flex;align-items:center;gap:5px;justify-content:space-between;margin:8px 2px 10px}.feed-title-area{display:flex;gap:6px;align-items:center;min-width:0}.feed-head h2{font-size:21px;line-height:1.2;letter-spacing:-.5px;margin:0;font-weight:810}.text-link{border:0;background:none;color:#166fec;white-space:nowrap;font-size:13px;padding:4px 0}.text-link span{font-size:19px}.back-btn{border:0;background:#ffffffb3;color:#0c65d6;border-radius:12px;width:32px;height:32px;font-size:29px;line-height:28px;flex:none}.crumb{font-size:13px;color:#60738d;margin:6px 0 9px}.branch-buttons{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0}.branch-buttons button,.action-chips button{padding:9px 12px;border-radius:13px;background:#ffffffb6;color:#284563;border:1px solid #fff;font-size:13px;font-weight:600}.branch-buttons button.active,.action-chips button.active{background:#1b7cf1;color:#fff;border-color:#1b7cf1}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:8px 0 12px}.action-chips{display:flex;gap:4px;flex-wrap:wrap}.action-chips button{padding:7px 9px}.filter-open{border:0;background:#fff9;border-radius:12px;padding:8px;font-size:13px;color:#276bcc;white-space:nowrap}.cards{display:flex;flex-direction:column;gap:9px}.ad-card{width:100%;display:flex;gap:12px;border-radius:19px;text-align:left;padding:9px;text-decoration:none;min-height:121px;overflow:hidden}.ad-photo{width:38%;max-width:155px;min-width:104px;align-self:stretch;object-fit:cover;border-radius:14px;aspect-ratio:1/1;background:#d5e6f9}.ad-no-photo{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:2px;background:linear-gradient(140deg,#bfe0ff,#deedfa);color:#1d6bc9;text-align:center;font-weight:750}.ad-no-photo small{font-size:11px;font-weight:500}.ad-data{display:flex;min-width:0;flex:1;flex-direction:column;gap:5px}.ad-data h3{margin:2px 0 0;font-weight:750;font-size:16px;line-height:1.23;color:#10203d;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.ad-price{font-size:18px;line-height:1.1;font-weight:780;color:#1678ec}.ad-desc{color:#657c9e;font-size:13px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.ad-meta{font-size:12px;color:#68809b;margin-top:auto;white-space:normal}.state{text-align:center;border:1px solid #fff;border-radius:18px;background:#ffffff9e;padding:27px 15px;color:#566b88}.state b{display:block;color:#203c62;font-size:16px;margin-bottom:7px}.state button{margin-top:12px;background:#217ffa;color:#fff;border:0;border-radius:12px;padding:11px 16px}.load-more{display:block;margin:12px auto;padding:11px 24px;color:#1874e3;border-radius:15px;font-weight:670}.bottom-spacer{height:100px}.bottom-bar{position:fixed;bottom:0;left:0;right:0;z-index:15;margin:0 auto;max-width:580px;padding:9px 15px calc(9px + env(safe-area-inset-bottom));background:linear-gradient(0deg,#dceafd 67%,#dceafd00)}.submit-ad{height:54px;display:flex;align-items:center;justify-content:center;gap:13px;background:linear-gradient(110deg,#2e97ff,#0871f0);color:#fff;border:1px solid #9bdbff;box-shadow:0 4px 14px #1478ee58,inset 0 1px 0 #def4ffab;border-radius:20px;text-decoration:none;font-size:17px;font-weight:750}.plus{font-size:28px;line-height:1;font-weight:300}.demo-banner{margin:10px 0;border:1px dashed #8aaed4;border-radius:11px;font-size:12px;padding:8px;color:#496381;background:#ffffffc0}
.sheet-backdrop{position:fixed;inset:0;background:#18365680;z-index:30}.sheet{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:min(100%,580px);z-index:31;border-radius:25px 25px 0 0;background:#f3f8fe;box-shadow:0 -10px 45px #0b2c5a44;padding:7px 18px calc(20px + env(safe-area-inset-bottom));max-height:85svh;overflow:auto}.sheet-handle{height:4px;width:48px;background:#b6c9dd;border-radius:10px;margin:0 auto 12px}.sheet-top{display:flex;justify-content:space-between;align-items:center}.sheet-top h2{margin:5px 0 14px;font-size:22px}.sheet-top button{border:0;background:none;font-size:30px;color:#52749d}.field{display:flex;flex-direction:column;gap:6px;font-size:14px;color:#5a7291;font-weight:650;margin:11px 0}.field input:not([type=checkbox]),.field select{height:46px;border:1px solid #c9d9ed;border-radius:13px;padding:0 12px;background:#fff;color:#142f56;width:100%}.check-field{flex-direction:row;align-items:center;gap:11px}.check-field input{width:18px;height:18px}.sheet-actions{display:flex;gap:9px;margin-top:20px}.sheet-actions button{border-radius:14px;padding:13px;flex:1;border:0;font-weight:700}.secondary-btn{background:#e2ebf7;color:#315a88}.primary-btn{background:#217cf1;color:white}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(max-width:390px){.cat-icon{width:42px;height:42px;min-width:42px}.cat-icon svg{width:25px;height:25px}.cat-name{font-size:12.7px}.category-tile{padding:7px;min-height:70px;gap:6px}.feed-head h2{font-size:19px}.text-link{font-size:12px}.ad-photo{min-width:91px}.ad-data h3{font-size:15px}.ad-desc{font-size:12px}}
@media(prefers-reduced-motion:no-preference){.category-tile,.ad-card{transition:transform .12s ease}.sheet{animation:up .17s ease-out}@keyframes up{from{transform:translate(-50%,20px);opacity:.6}to{transform:translate(-50%,0);opacity:1}}}


/* === VISUAL-ONLY RESTORATION: glass + header transition + theme ===
   No dimensions, radii, font families/sizes, SVGs or button geometry changed. */
:root {
  color-scheme: light;
  --kc-app-bg:
    radial-gradient(ellipse 70% 24% at 1% 22%, rgba(92,166,248,.29), transparent 74%),
    radial-gradient(ellipse 70% 30% at 101% 45%, rgba(155,173,244,.22), transparent 72%),
    radial-gradient(ellipse 65% 21% at 3% 76%, rgba(105,195,243,.17), transparent 75%),
    linear-gradient(180deg,#b3dcf6 0px,#cde7f7 210px,#e0ecfa 440px,#edf4fa 100%);
  --kc-header-fade: linear-gradient(to bottom,
    rgba(207,230,248,0) 0%,
    rgba(207,230,248,.08) 24%,
    rgba(207,230,248,.55) 68%,
    rgba(207,230,248,.94) 100%);
  --kc-glass-fill: linear-gradient(125deg,
    rgba(255,255,255,.53) 0%,
    rgba(249,253,255,.34) 43%,
    rgba(239,248,255,.46) 100%);
  --kc-glass-border: rgba(255,255,255,.83);
  --kc-glass-shadow: 0 7px 24px rgba(42,91,148,.13),
    inset 0 1px 1px rgba(255,255,255,.91),
    inset 1px 0 0 rgba(255,255,255,.44);
  --kc-primary-text:#102247;
  --kc-title-text:#10203d;
  --kc-soft-text:#657c9e;
  --kc-meta-text:#68809b;
  --kc-link:#166fec;
  --kc-price:#1678ec;
  --kc-icon-fill:linear-gradient(145deg,rgba(255,255,255,.70),rgba(214,236,254,.54));
  --kc-icon-stroke:#287ee1;
  --kc-arrow:#879bb4;
  --kc-input:#18345a;
  --kc-placeholder:#58759b;
  --kc-chip-bg:rgba(255,255,255,.65);
  --kc-chip-text:#284563;
  --kc-back-bg:rgba(255,255,255,.65);
  --kc-no-photo:linear-gradient(140deg,#bfe0ff,#deedfa);
  --kc-state-text:#566b88;
  --kc-sheet-bg:rgba(238,248,255,.96);
  --kc-field-bg:rgba(255,255,255,.82);
  --kc-field-border:#c9d9ed;
  --kc-bottombar:linear-gradient(0deg,rgba(220,234,253,.95) 64%,rgba(220,234,253,0));
}
.app-shell { background: var(--kc-app-bg); }
.brand-head { position:relative; }
.brand-head::after {
  content:"";
  pointer-events:none;
  position:absolute;
  z-index:1;
  left:0;right:0;bottom:-1px;
  height:clamp(50px,12vw,105px);
  background:var(--kc-header-fade);
}
.main { position:relative; }
.glass,.category-tile,.ad-card,.ad-slot {
  background:var(--kc-glass-fill);
  border-color:var(--kc-glass-border);
  box-shadow:var(--kc-glass-shadow);
  -webkit-backdrop-filter:blur(23px) saturate(1.40);
  backdrop-filter:blur(23px) saturate(1.40);
}
/* Text/background palette follows the theme. Shapes/sizes stay untouched. */
body,.category-tile { color:var(--kc-primary-text); }
.ad-data h3 { color:var(--kc-title-text); }
.ad-desc,.crumb { color:var(--kc-soft-text); }
.ad-meta { color:var(--kc-meta-text); }
.ad-price { color:var(--kc-price); }
.text-link { color:var(--kc-link); }
.cat-icon { background:var(--kc-icon-fill);border-color:var(--kc-glass-border); }
.cat-icon svg { stroke:var(--kc-icon-stroke); }
.tile-arrow { color:var(--kc-arrow); }
.search input { color:var(--kc-input); }
.search input::placeholder { color:var(--kc-placeholder); }
.search svg { color:var(--kc-placeholder); }
.branch-buttons button,.action-chips button { background:var(--kc-chip-bg);border-color:var(--kc-glass-border);color:var(--kc-chip-text); }
.branch-buttons button.active,.action-chips button.active {background:#1b7cf1;color:#fff;border-color:#1b7cf1;}
.back-btn,.filter-open { background:var(--kc-back-bg);color:var(--kc-link); }
.ad-no-photo { background:var(--kc-no-photo); }
.state { background:var(--kc-glass-fill);border-color:var(--kc-glass-border);color:var(--kc-state-text);-webkit-backdrop-filter:blur(23px);backdrop-filter:blur(23px); }
.state b { color:var(--kc-title-text); }
.demo-banner { background:var(--kc-chip-bg);color:var(--kc-chip-text); }
.bottom-bar { background:var(--kc-bottombar); }
.sheet {background:var(--kc-sheet-bg);-webkit-backdrop-filter:blur(23px);backdrop-filter:blur(23px);color:var(--kc-primary-text);}
.field {color:var(--kc-soft-text);}
.field input:not([type=checkbox]),.field select {background:var(--kc-field-bg);border-color:var(--kc-field-border);color:var(--kc-primary-text);}
.load-more {color:var(--kc-link);}

/* Dark mode: palette only; all existing layout / typography / icons unchanged. */
html.theme-dark {
  color-scheme:dark;
  --kc-app-bg:
    radial-gradient(ellipse 75% 24% at 0% 21%,rgba(31,122,204,.25),transparent 75%),
    radial-gradient(ellipse 80% 25% at 101% 46%,rgba(64,94,183,.24),transparent 74%),
    radial-gradient(ellipse 65% 18% at 4% 81%,rgba(36,125,181,.15),transparent 75%),
    linear-gradient(180deg,#254d76 0px,#183854 230px,#132a43 440px,#0c192b 100%);
  --kc-header-fade: linear-gradient(to bottom,
    rgba(29,60,88,0) 0%,
    rgba(29,60,88,.15) 26%,
    rgba(29,60,88,.70) 72%,
    rgba(29,60,88,.99) 100%);
  --kc-glass-fill:linear-gradient(125deg,
    rgba(104,142,181,.29) 0%,
    rgba(56,88,130,.31) 48%,
    rgba(26,55,91,.39) 100%);
  --kc-glass-border:rgba(207,231,255,.34);
  --kc-glass-shadow:0 9px 27px rgba(0,8,23,.22),inset 0 1px 1px rgba(222,244,255,.20),inset 1px 0 0 rgba(222,244,255,.09);
  --kc-primary-text:#e9f2ff;
  --kc-title-text:#f5f8ff;
  --kc-soft-text:#bbcee6;
  --kc-meta-text:#a8bfdc;
  --kc-link:#8dc4ff;
  --kc-price:#7dbbff;
  --kc-icon-fill:linear-gradient(145deg,rgba(114,162,210,.20),rgba(45,93,147,.32));
  --kc-icon-stroke:#94c9ff;
  --kc-arrow:#a0b9d4;
  --kc-input:#f0f7ff;
  --kc-placeholder:#b5cce4;
  --kc-chip-bg:rgba(108,148,192,.21);
  --kc-chip-text:#e3f0ff;
  --kc-back-bg:rgba(108,148,192,.24);
  --kc-no-photo:linear-gradient(140deg,#1b4e80,#21466c);
  --kc-state-text:#b9cee5;
  --kc-sheet-bg:rgba(20,40,65,.96);
  --kc-field-bg:rgba(71,105,148,.23);
  --kc-field-border:rgba(177,216,255,.32);
  --kc-bottombar:linear-gradient(0deg,rgba(13,29,49,.96) 64%,rgba(13,29,49,0));
}
@media(prefers-color-scheme:dark) {
  html:not(.theme-light):not(.theme-dark) {
    color-scheme:dark;
    --kc-app-bg:
      radial-gradient(ellipse 75% 24% at 0% 21%,rgba(31,122,204,.25),transparent 75%),
      radial-gradient(ellipse 80% 25% at 101% 46%,rgba(64,94,183,.24),transparent 74%),
      radial-gradient(ellipse 65% 18% at 4% 81%,rgba(36,125,181,.15),transparent 75%),
      linear-gradient(180deg,#254d76 0px,#183854 230px,#132a43 440px,#0c192b 100%);
    --kc-header-fade: linear-gradient(to bottom,rgba(29,60,88,0) 0%,rgba(29,60,88,.15) 26%,rgba(29,60,88,.70) 72%,rgba(29,60,88,.99) 100%);
    --kc-glass-fill:linear-gradient(125deg,rgba(104,142,181,.29),rgba(56,88,130,.31) 48%,rgba(26,55,91,.39));
    --kc-glass-border:rgba(207,231,255,.34);
    --kc-glass-shadow:0 9px 27px rgba(0,8,23,.22),inset 0 1px 1px rgba(222,244,255,.20),inset 1px 0 0 rgba(222,244,255,.09);
    --kc-primary-text:#e9f2ff;--kc-title-text:#f5f8ff;--kc-soft-text:#bbcee6;--kc-meta-text:#a8bfdc;
    --kc-link:#8dc4ff;--kc-price:#7dbbff;
    --kc-icon-fill:linear-gradient(145deg,rgba(114,162,210,.20),rgba(45,93,147,.32));
    --kc-icon-stroke:#94c9ff;--kc-arrow:#a0b9d4;
    --kc-input:#f0f7ff;--kc-placeholder:#b5cce4;
    --kc-chip-bg:rgba(108,148,192,.21);--kc-chip-text:#e3f0ff;--kc-back-bg:rgba(108,148,192,.24);
    --kc-no-photo:linear-gradient(140deg,#1b4e80,#21466c);
    --kc-state-text:#b9cee5;--kc-sheet-bg:rgba(20,40,65,.96);
    --kc-field-bg:rgba(71,105,148,.23);--kc-field-border:rgba(177,216,255,.32);
    --kc-bottombar:linear-gradient(0deg,rgba(13,29,49,.96) 64%,rgba(13,29,49,0));
  }
}
html.theme-dark .sheet-backdrop {background:rgba(4,16,31,.67)}
@media(prefers-color-scheme:dark){html:not(.theme-light) .sheet-backdrop {background:rgba(4,16,31,.67)}}
html.theme-dark .sheet-handle {background:#597493}
html.theme-dark .sheet-top button {color:#a8c9ec}
html.theme-dark .secondary-btn {background:rgba(134,171,211,.22);color:#d4eaff}
html.theme-dark .ad-no-photo {color:#c4e1ff}
html.theme-dark .search-go {background:#2c83f0;color:white}
html.theme-dark .state button {background:#217ffa;color:white}
@media(prefers-color-scheme:dark) {
 html:not(.theme-light) .sheet-handle {background:#597493}
 html:not(.theme-light) .sheet-top button {color:#a8c9ec}
 html:not(.theme-light) .secondary-btn {background:rgba(134,171,211,.22);color:#d4eaff}
 html:not(.theme-light) .ad-no-photo {color:#c4e1ff}
}


/* v0.3: light theme only — softly blurred fragment of the unchanged approved header
   behind existing glass surfaces. Does not touch dimensions, buttons, icons or dark theme. */
html.theme-light .app-shell::before {
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  left:-17%;
  right:-17%;
  top:clamp(105px,34.75vw,202px);
  height:870px;
  background: url("./assets/header-approved.webp") center 66% / cover no-repeat;
  opacity:.43;
  filter:blur(54px) saturate(1.18);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 15%,black 74%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,black 15%,black 74%,transparent 100%);
}
@media (prefers-color-scheme:light) {
  html:not(.theme-dark) .app-shell::before {
    content:"";
    position:absolute;
    z-index:0;
    pointer-events:none;
    left:-17%;
    right:-17%;
    top:clamp(105px,34.75vw,202px);
    height:870px;
    background: url("./assets/header-approved.webp") center 66% / cover no-repeat;
    opacity:.43;
    filter:blur(54px) saturate(1.18);
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 15%,black 74%,transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 0%,black 15%,black 74%,transparent 100%);
  }
}


/* KanevCity mobile text fit v1 */
@media (max-width: 600px) {
  .category-tile {
    min-width: 0;
    gap: 6px;
    padding: 7px;
  }

  .cat-icon {
    width: 40px;
    height: 40px;
    min-width: 40px;
  }

  .cat-icon svg {
    width: 25px;
    height: 25px;
  }

  .cat-name {
    min-width: 0;
    font-size: 12.5px;
    line-height: 1.2;
    overflow-wrap: anywhere;
    hyphens: auto;
  }

  .tile-arrow {
    flex: 0 0 12px;
    margin-left: 0;
    font-size: 20px;
    text-align: right;
  }

  .search input {
    font-size: 16px;
  }

  .submit-ad {
    font-size: 15px;
    gap: 8px;
    padding: 0 8px;
  }

  .submit-ad .plus {
    font-size: 24px;
  }
}

@media (max-width: 390px) {
  .category-tile {
    gap: 5px;
    padding: 6px;
  }

  .cat-icon {
    width: 37px;
    height: 37px;
    min-width: 37px;
  }

  .cat-name {
    font-size: 12px;
  }

  .search input {
    font-size: 15px;
  }
}
