/* CSS folio OmniSkin. Вынесен из <style> в _folio_base.html 09-08 — та же причина, что у
   вики: инлайн не кэшируется между переходами, телефон парсит его на каждой странице.
   Крючок {% block style %} для постраничных стилей ОСТАЛСЯ в шаблоне: он несёт Jinja и в
   статику уехать не может. При правке этого файла — ПОДНЯТЬ ?v= в _folio_base.html. */
  :root, [data-theme="light"]{
    --bg-grad: radial-gradient(1200px 600px at 80% -10%, #e8edf7 0%, rgba(232,237,247,0) 60%),
               linear-gradient(170deg, #fbfbfd 0%, #eceef3 100%);
    --text:#1d1d1f; --muted:#6e6e73;
    --panel: rgba(255,255,255,.62); --panel-solid: rgba(247,248,250,.94);
    --border: rgba(0,0,0,.09); --hair: rgba(0,0,0,.06); --hover: rgba(0,0,0,.04);
    --accent:#0a9aac; --on-accent:#fff; --ring:rgba(10,154,172,.30);
    --field: rgba(255,255,255,.78); --shadow:0 10px 34px rgba(15,23,42,.12);
    --up:#138a37; --up-bg:rgba(52,199,89,.16); --down:#c4271d; --down-bg:rgba(255,59,48,.12);
    --brand:#10b981; --brand2:#34d399; --popup:#fff; color-scheme:light;
  }
  [data-theme="dark"]{
    --bg-grad: radial-gradient(1200px 600px at 80% -10%, #16302b 0%, rgba(22,48,43,0) 60%),
               linear-gradient(170deg, #12211d 0%, #0e1614 100%);
    --text:#f2f7f5; --muted:#94a8a1;
    --panel: rgba(20,32,29,.55); --panel-solid: rgba(16,26,23,.92);
    --border: rgba(255,255,255,.12); --hair: rgba(255,255,255,.07); --hover: rgba(255,255,255,.05);
    --accent:#2dd4bf; --on-accent:#052e28; --ring:rgba(45,212,191,.34);
    --field: rgba(255,255,255,.06); --shadow:0 10px 34px rgba(0,0,0,.45);
    --up:#34d35e; --up-bg:rgba(48,209,88,.18); --down:#ff6b60; --down-bg:rgba(255,69,58,.16);
    --brand:#10b981; --brand2:#5eead4; --popup:#132420; color-scheme:dark;
  }
  [data-theme="neon"]{
    --bg-grad: radial-gradient(1100px 620px at 82% -12%, rgba(16,255,180,.10) 0%, rgba(16,255,180,0) 58%),
               radial-gradient(900px 560px at 8% 110%, rgba(0,224,255,.10) 0%, rgba(0,224,255,0) 55%),
               linear-gradient(165deg, #06120f 0%, #04100c 100%);
    --text:#e6fff5; --muted:#8ec0b2;
    --panel: rgba(10,26,22,.55); --panel-solid: rgba(8,20,17,.92);
    --border: rgba(16,255,180,.22); --hair: rgba(16,255,180,.12); --hover: rgba(16,255,180,.07);
    --accent:#10ffb4; --on-accent:#02120c; --ring:rgba(16,255,180,.40);
    --field: rgba(16,255,180,.06); --shadow:0 0 34px rgba(16,255,180,.14), 0 12px 40px rgba(0,0,0,.55);
    --up:#39ff9e; --up-bg:rgba(57,255,158,.16); --down:#ff5da0; --down-bg:rgba(255,93,160,.16);
    --brand:#10ffb4; --brand2:#57ffd0; --popup:#0a1a16; color-scheme:dark;
  }
  /* --card: алиас на активный сплошной фон панели (карточки/KPI). Раньше был не определён ->
     var(--card) резолвился в прозрачность (folio_public/вики market/tradeup/inventory). Резолвится
     лениво по теме через --panel-solid каждого блока. */
  :root{ --card: var(--panel-solid); }
  *{ box-sizing:border-box; }
  body{ margin:0; font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    color:var(--text); background:var(--bg-grad) fixed; min-height:100vh; padding-top:var(--bar-h); }
  a{ color:inherit; text-decoration:none; }
  .wrap{ max-width:1200px; margin:0 auto; padding:0 18px; }
  .bar{ position:fixed; top:0; left:0; right:0; z-index:60; backdrop-filter:blur(14px);
    background:var(--panel); border-bottom:1px solid var(--border); }
  .bar .row{ display:flex; align-items:center; gap:12px; height:60px; }
  .brand{ display:flex; align-items:center; gap:9px; font-weight:800; font-size:18px; letter-spacing:.2px; }
  .brand .dot{ width:26px; height:26px; border-radius:8px; display:grid; place-items:center;
    background:linear-gradient(135deg,var(--brand),var(--brand2)); color:#04120c; font-weight:900; }
  .brand b{ background:linear-gradient(90deg,var(--brand),var(--brand2));
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
  .grow{ flex:1; }
  .btn{ display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:11px;
    border:1px solid var(--border); background:var(--field); color:var(--text); font-weight:600;
    cursor:pointer; font-size:14px; transition:.15s; }
  .btn:hover{ border-color:var(--accent); }
  .btn.pri{ background:linear-gradient(135deg,var(--brand),var(--brand2)); color:#04120c; border:0; }
  .btn.pri:hover{ filter:brightness(1.06); }
  .btn.sm{ padding:5px 9px; font-size:12.5px; border-radius:9px; }
  .ghost{ background:transparent; }
  .themes{ display:inline-flex; border:1px solid var(--border); border-radius:10px; overflow:hidden; }
  /* аккаунт в правом верхнем углу шапки (владелец 08-18) */
  .facct{ display:inline-flex; align-items:center; gap:7px; flex:none; white-space:nowrap;
    font-size:12.5px; font-weight:600; color:var(--text); text-decoration:none;
    padding:5px 11px 5px 6px; border:1px solid var(--border); border-radius:999px; background:var(--field); }
  .facct:hover{ background:var(--hover); text-decoration:none; }
  .facct img{ width:20px; height:20px; border-radius:50%; display:block; flex:none; }
  .facct svg{ width:15px; height:15px; display:block; flex:none; }
  .facct-in{ padding:6px 12px; color:var(--muted); }
  .facct-in:hover{ color:var(--accent); }
  .facct-n{ max-width:120px; overflow:hidden; text-overflow:ellipsis; }
  .themes button{ background:transparent; border:0; color:var(--muted); padding:6px 9px; cursor:pointer; font-size:14px; }
  .themes button.on{ background:var(--hover); color:var(--accent); }
  .muted{ color:var(--muted); }
  .up{ color:var(--up); } .down{ color:var(--down); }
  .card{ background:var(--panel); border:1px solid var(--border); border-radius:16px;
    box-shadow:var(--shadow); }
  main{ padding:26px 0 60px; }
  h1{ font-size:30px; margin:0 0 4px; letter-spacing:-.5px; }
  .foot{ border-top:1px solid var(--border); color:var(--muted); font-size:13px; padding:22px 0; margin-top:30px; }
  .ftools{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin-bottom:14px; font-size:13px; }
  .ftools .ftl{ color:var(--muted); font-weight:600; }
  .ftools a{ color:var(--accent); font-weight:600; }
  .ftools a:hover{ text-decoration:underline; }
  /* селекторы валюты и языка */
  .loc{ display:inline-flex; align-items:center; gap:8px; }
  .lsel{ background:var(--field); border:1px solid var(--border); border-radius:8px;
    color:var(--text); font-size:12.5px; padding:5px 8px; cursor:pointer; max-width:110px; }
  .lsel:focus, .lsel:hover{ outline:none; border-color:var(--accent); }
  /* нативная выпадашка наследует color-scheme активной темы (dark на neon/dark) -> попап под тему;
     опции с фоном --popup/текстом --text как запас для браузеров, что их стилизуют (08-04) */
  .lsel option{ background:var(--popup); color:var(--text); }
  .seg{ display:inline-flex; border:1px solid var(--border); border-radius:9px; overflow:hidden; }
  .seg a, .seg button{ display:inline-flex; align-items:center; padding:5px 9px; font-size:12.5px;
    color:var(--muted); text-decoration:none; border:0; background:transparent; cursor:pointer;
    font-weight:600; transition:.12s; }
  .seg a.on, .seg button.on{ background:var(--hover); color:var(--accent); }
  /* вкладки folio */
  .fnav{ background:var(--panel-solid); border-bottom:1px solid var(--border); }
  .fnav .row{ display:flex; align-items:center; gap:2px; height:44px;
    overflow-x:auto; scrollbar-width:none; }
  .fnav .row::-webkit-scrollbar{ display:none; }
  /* пока открыт дропдаун портфелей — снимаем overflow-клип со скролл-строки,
     иначе меню (position:absolute) обрезается контейнером и «уходит за интерфейс» */
  .fnav .row.fpdd-open{ overflow:visible; }
  .fntab{ display:inline-flex; align-items:center; padding:6px 12px; border-radius:9px; font-size:14px;
    font-weight:600; color:var(--muted); transition:.15s; white-space:nowrap; }
  .fntab:hover{ color:var(--text); background:var(--hover); }
  .fntab.on{ color:var(--accent); background:var(--hover); }
  /* дропдаун портфелей */
  .fpdd{ position:relative; }
  .fpdd-btn{ display:inline-flex; align-items:center; gap:4px; padding:6px 12px; border-radius:9px;
    font-size:14px; font-weight:600; color:var(--muted); cursor:pointer;
    background:transparent; border:0; transition:.15s; white-space:nowrap; }
  .fpdd-btn:hover, .fpdd.open > .fpdd-btn{ color:var(--text); background:var(--hover); }
  .fpdd-btn.on{ color:var(--accent); background:var(--hover); }
  .fpdd-btn .car{ font-size:10px; opacity:.7; transition:.15s; }
  .fpdd.open > .fpdd-btn .car{ transform:rotate(180deg); }
  .fpdd-menu{ position:absolute; top:calc(100% + 6px); left:0; min-width:210px; z-index:50;
    background:var(--popup); border:1px solid var(--border); border-radius:12px;
    box-shadow:var(--shadow); display:none; overflow:hidden; }
  .fpdd.open > .fpdd-menu{ display:block; }
  .fpdd-menu a, .fpdd-menu button{ display:flex; align-items:center; gap:8px; padding:9px 14px;
    font-size:14px; color:var(--text); border:0; background:transparent; cursor:pointer;
    width:100%; text-align:left; border-bottom:1px solid var(--hair); text-decoration:none; }
  .fpdd-menu a:last-child, .fpdd-menu button:last-child{ border-bottom:0; }
  .fpdd-menu a:hover, .fpdd-menu button:hover{ background:var(--hover); }
  .fpdd-menu a.on{ color:var(--accent); font-weight:700; }
  .fpdd-sep{ height:0; border-top:1px solid var(--border); margin:3px 0; }
  .fpdd-create{ color:var(--accent) !important; font-weight:600 !important; }
  .fpdd-pval{ margin-left:auto; font-size:12px; color:var(--muted); }
  /* реклама */
  .adslot{ margin:18px 0; text-align:center; }
  /* ── Левый нав-рейл (десктоп, как на Таблице): разгружает верхнюю панель ── */
  /* Реальная высота шапки по замеру (Playwright 08-11). При статичных 60px на телефоне
     (шапка там 91px) верх контента уезжал ПОД фикс-шапку. */
  :root{ --rail-w:74px; --bar-h:61px; }
  @media (max-width:767px){ :root{ --bar-h:52px; } }
  @media (max-width:479px){ :root{ --bar-h:91px; } }
  .frail{ position:fixed; left:0; top:var(--bar-h); bottom:0; width:var(--rail-w); z-index:45;
    display:flex; flex-direction:column; gap:3px; padding:12px 8px;
    background:var(--panel); border-right:1px solid var(--border);
    backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); overflow-y:auto; }
  .frail::-webkit-scrollbar{ width:0; }
  .frail a{ display:flex; flex-direction:column; align-items:center; gap:4px;
    padding:9px 4px; border-radius:12px; color:var(--muted); font-size:10.5px; font-weight:600;
    line-height:1.1; text-align:center; transition:.12s; }
  .frail a:hover{ background:var(--hover); color:var(--text); }
  .frail a.on{ background:var(--hover); color:var(--accent); }
  .frail a .ic{ font-size:18px; line-height:1; }
  .frail a .ic svg{ width:20px; height:20px; display:block; }
  .frail .rdiv{ height:1px; background:var(--border); margin:5px 6px; flex:none; }
  @media(min-width:721px){
    body{ padding-left:var(--rail-w); }
    /* Table/Wiki-ссылки и вкладки Обзор/Инвентарь ушли в рейл */
    .bar .eco-lnk{ display:none; }
    .fnav .fntab-sec{ display:none; }
    /* верхний бар выравниваем по колонке контента (сдвиг на рейл): правые переключатели встают
       ровно над правым краём контента/кнопок ниже. Лого выносим абсолютом в самый левый край. */
    .bar{ padding-left:var(--rail-w); }
    .bar .brand{ position:absolute; top:50%; transform:translateY(-50%);
      left:16px; margin:0; }
  }
  @media(max-width:720px){ .frail{ display:none; } }
  @media(max-width:640px){
    .bar .row{ height:auto; flex-wrap:wrap; padding:9px 0; gap:8px; }
    /* КРОСС-ССЫЛКИ НА ТАБЛИЦУ И ВИКИ ОСТАЮТСЯ (08-25): единственный переход между тремя нашими
       сервисами на телефоне. Левый рейл, где они дублировались, ниже 720px скрыт, и до правки
       мобильный посетитель folio не мог уйти ни в таблицу, ни в вики иначе как руками в адресной
       строке. Строка шапки здесь уже wrap+height:auto, поэтому ссылки просто переносятся. */
    .hide-sm:not(.eco-lnk){ display:none; }
    .loc{ display:none; }
  }

    /* Видимый фокус с клавиатуры. У input/select стоит outline:none (свой стиль рамки),
       из-за чего при табуляции не было видно, где курсор. :where() = нулевая специфичность
       у списка, сам :focus-visible перебивает outline:none. Мышью не появляется. */
    :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
      outline:2px solid var(--accent); outline-offset:2px; border-radius:6px; }
