/* Generated from config/runtime-assets.v5.3.210-rc2.json. Do not edit directly. */ /* ===== BEGIN app-bundle-v5.3.117.css sha256=f4721806f3e2d4431b57df7d81d5377e49036fcc5aba9a453c12ed6aae26c30a ===== */ /* ===== SOURCE: assets/css/app.css ===== */ /* ===== extracted style block 1 from v3.6 ===== */ :root { --bg: #F7FAFE; --card: #FFFFFF; --primary: #5AA9E6; --primary-600: #3F8FCE; --muted: #DDECF8; --text: #1E293B; --border: #CCE0F5; --warn: #F59E0B; --danger: #EF4444; --ok: #22C55E; --shadow: 0 6px 16px rgba(20, 80, 120, 0.12); --radius: 14px; --gap: 16px; } * { box-sizing: border-box; } body { margin: 0; padding: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, 'Noto Sans', sans-serif; color: var(--text); background: var(--bg); } .container { max-width: 1040px; margin: 0 auto; padding: 24px 16px 64px; } header { display: flex; gap: 12px; align-items: center; justify-content: space-between; margin-bottom: 16px; } .title { font-size: 24px; font-weight: 700; letter-spacing: .2px; } .toolbar { display: flex; gap: 8px; flex-wrap: wrap; align-items:center; } .card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; } section { display: block; margin: 16px 0; } h2 { font-size: 18px; margin: 0 0 10px; } h3 { font-size: 16px; margin: 0 0 8px; } label { display: block; font-size: 12px; margin-bottom: 4px; opacity: .8; } input[type="number"], input[type="text"], select, textarea { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--border); background: #fff; } button { appearance: none; border: 1px solid var(--primary); background: var(--primary); color: #fff; padding: 10px 14px; border-radius: 12px; cursor: pointer; font-weight: 600; } button.secondary { background: #fff; color: var(--primary-600); border-color: var(--primary-600); } button.ghost { background: transparent; color: var(--primary-600); border-color: transparent; } button.danger { background: var(--danger); border-color: var(--danger); } .muted { color: #486581; opacity: .9; } .row { display: grid; grid-template-columns: 1fr; gap: var(--gap); } .accordion-item { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; } .accordion-head { background: var(--muted); padding: 12px 14px; cursor: pointer; font-weight: 600; } .accordion-body { padding: 12px 14px; background: #fff; display: none; } .accordion-item.open .accordion-body { display: block; } .inline { display: grid; grid-template-columns: 1.4fr 1fr 110px 120px; gap: 8px; align-items: end; } .inline .actions { display: flex; gap: 8px; } .ration-table { width: 100%; border-collapse: collapse; } .ration-table th, .ration-table td { padding: 8px 6px; border-bottom: 1px solid var(--border); text-align: left; } .ration-table td input[type="number"] { width: 100px; } .totals-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; } .total-card { border: 1px solid var(--border); border-radius: 12px; padding: 12px; background: #fff; position: relative; } .total-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; } .progress { position: relative; height: 10px; border-radius: 999px; background: #e9f2fb; overflow: hidden; } .bar { height: 100%; background: var(--primary); width: 0%; transition: width .25s ease; } .bar.warn { background: var(--warn); } .bar.danger { background: var(--danger); } .ticks { position:absolute; inset:0; pointer-events:none; } .tick { position:absolute; top:-4px; width:2px; height:18px; background: #94B9DA; } .tick-label { position:absolute; top:14px; transform: translateX(-50%); font-size:11px; color:#577592; } .pill { display: inline-block; padding: 2px 8px; border-radius: 999px; background: var(--muted); font-size: 11px; } .footer-note { font-size: 12px; opacity: .8; } .dev-panel { position: fixed; right: 16px; bottom: 16px; width: 380px; max-height: 70vh; overflow: auto; z-index: 9999; display: none; } .dev-panel.open { display: block; } .dev-panel pre { white-space: pre-wrap; font-size: 12px; background: #0b1220; color: #d1e9ff; padding: 12px; border-radius: 10px; } details.norms { margin-top: 8px; } .chips { display:flex; gap:6px; flex-wrap:wrap; } .chip { background:#fff; border:1px solid var(--border); padding:4px 8px; border-radius:999px; font-size:12px; } .micro-group-title { margin-top: 12px; font-weight: 700; } .legend { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:8px; } .legend .item { background:#fff; border:1px solid var(--border); border-radius:999px; padding:6px 10px; font-size:12px; } .seg { display:flex; border:1px solid var(--border); border-radius:999px; padding:2px; gap:2px; } .seg button { background:#fff; color:var(--primary-600); border-color:transparent; } .seg button.active { background:var(--primary); color:#fff; } .badge { display:inline-block; padding:2px 6px; border:1px solid var(--border); border-radius:6px; font-size:11px; background:#fff; color:#355e7b; } .hint { font-size: 15px; line-height: 1.5; } /* --- Needs calculator styles --- */ .kpi{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:10px; } .kpi .tile{ padding:12px; border:1px solid var(--border); border-radius:12px; background:#fff; } .kpi .title{ font-size:12px; color:#577592; } .kpi .value{ font-size:18px; font-weight:800; margin-top:2px; } .hr{ height:1px; background:var(--border); margin:16px 0; } .section h2{ font-size:1.05rem; margin:0 0 6px 0; color:#0b61d6; } .section h3{ font-size:0.95rem; margin:10px 0 6px; color:#123b64; } .tbl{ width:100%; border-collapse:collapse; margin:8px 0; } .tbl th, .tbl td{ border-bottom:1px solid var(--border); padding:8px 6px; text-align:left; } .tbl th{ background:#f4f8ff; color:#214b78; font-weight:700; } .badge{ display:inline-block; padding:3px 8px; border-radius:999px; font-weight:700; font-size:12px; } .badge.blue{ background:#e7f0ff; color:#0b61d6; } .badge.green{ background:#e6fbf3; color:#0f7b57; } .badge.orange{ background:#fff2e0; color:#a15d08; } .small{ font-size:12px; color:#5a6e80; } .alert{ padding:12px; border:1px solid var(--border); border-radius:12px; margin:12px 0; } .alert-danger{ border-color: var(--danger); background:#fff5f5; } details.fold{ border:1px solid var(--border); border-radius:12px; background:#fff; margin:10px 0; } details.fold > summary{ list-style:none; cursor:pointer; padding:10px 12px; border-radius:12px; font-weight:800; color:#0b61d6; } details.fold[open] > summary{ background:#f4f8ff; } details.fold > div{ padding:10px 12px; } /* Editable norm inputs */ .norm-input-wrap{ display:flex; align-items:center; gap:6px; } .norm-input{ width:100px; height:32px; padding:0 8px; border:1px solid var(--border); border-radius:8px; text-align:right; } .unit-tag{ color:var(--muted-text,#64748b); font-size:12px; } /* Preset controls */ #presetSelect:disabled, #applyPresetBtn:disabled { opacity: .6; cursor: not-allowed; } #fitModeSeg button { min-width: 110px; } /* Align catalog/HEI toggle next to header */ #catHeaderRow .seg button { min-width: 90px; } @media (max-width: 640px){ #catHeaderRow { gap:8px; } } /* Meals (slots) view */ #mealsSection .meal-slot{ margin-top:12px; } #mealsSection .meal-item{ display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px dashed var(--muted-border,#ddd); } #mealsSection .meal-item:last-child{ border-bottom:none; } #mealsSection .totline{ display:flex; justify-content:flex-end; gap:12px; font-size:12px; color:#6b7280; padding-top:6px; } .explain{margin:6px 0 0 18px; line-height:1.5;} .explain li{margin:4px 0;} /* utility/print block */ #globalActions{ margin:20px auto 32px auto; max-width:900px; background:#f1f5f9; border:1px dashed rgba(90,169,230,.45); box-shadow:none; } @media (max-width: 960px){ #globalActions{max-width:100%;margin:20px 0 32px 0;} } #globalActions h2{ font-size:16px; letter-spacing:.02em; text-transform:uppercase; display:flex; gap:6px; align-items:center; } #globalActions h2::before{ content:"⎘"; font-size:14px; opacity:.6; } #globalActions .muted{ max-width:720px; } #globalActions .toolbar{ display:flex; gap:8px; flex-wrap:wrap; } #legal-note{ max-width:900px; margin:0 auto 40px auto; font-size:12px; line-height:1.5; color:rgba(17,24,39,.55); } #legal-note h3{ margin:0 0 6px 0; font-size:12px; letter-spacing:.02em; text-transform:uppercase; color:rgba(15,23,42,.7); } #legal-note small{ display:block; margin-top:8px; font-size:11px; color:rgba(15,23,42,.5); } /* mini nutrient panel */ .ration-details td { background:#f8fafc; } .mini-nutrients { padding:10px 8px; } .mini-grid { display:grid; grid-template-columns: 1fr auto; gap:6px 10px; } .mini-row { display: contents; } .mini-left { color:#334155; } .mini-right { text-align:right; } .ration-name { display:flex; align-items:center; gap:6px; cursor:pointer; } .expander { color:#64748b; } .expander:hover { color:#0f172a; } /* ===== extracted style block 2 from v3.6 ===== */ /* Hide legacy norms controls */ #editNormsBtn, #normProfile { display: none !important; } /* ===== extracted style block 3 from v3.6 ===== */ :root{ --bg:#f7fbff; --card:#ffffff; --text:#0b2b44; --muted:#5b6b7b; --primary:#0b61d6; --primary-weak:#e6f0ff; --accent:#1ea97c; --warn:#f59e0b; --danger:#ef4444; --border:#e6eef8; --radius:14px; } *{box-sizing:border-box} body{ margin:0; padding:18px; font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color:var(--text); background:linear-gradient(180deg,#ffffff, var(--bg)); } h1{ margin:0 0 4px 0; font-size:1.35rem; color:var(--primary); } p.muted{ color:var(--muted-text,#64748b); margin:0 0 14px 0; } .card{ max-width:1040px; margin:0 auto; background:var(--card); border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 10px 30px rgba(6,28,60,.06); padding:18px; } .grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; } @media (max-width:900px){ .grid{ grid-template-columns:repeat(2, 1fr);} } @media (max-width:640px){ .grid{ grid-template-columns:1fr;} } label{ display:block; font-weight:700; margin-bottom:6px; } input[type="number"], select{ width:100%; height:44px; padding:0 12px; border-radius:12px; border:1px solid var(--border); background:#fff; } input[readonly]{ background:#f5f7fa; color:#444; } .row{ margin-top:8px; } .btn{ display:inline-block; padding:11px 14px; border-radius:12px; border:none; font-weight:700; cursor:pointer; margin-right:10px; background:var(--primary); color:#fff; } .btn.secondary{ background:#edf3ff; color:#0b61d6; border:1px solid #cfe1ff; } .btn.ghost{ background:transparent; border:1px dashed var(--border); color:var(--muted-text,#64748b); } .result{ margin-top:16px; padding:14px; background:#fff; border:1px solid var(--border); border-radius:12px; } .kpi{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:10px; } .kpi .tile{ padding:12px; border:1px solid var(--border); border-radius:12px; background:#fff; } .kpi .title{ font-size:12px; color:var(--muted-text,#64748b); } .kpi .value{ font-size:18px; font-weight:800; margin-top:2px; } .hr{ height:1px; background:var(--border); margin:16px 0; } .section h2{ font-size:1.05rem; margin:0 0 6px 0; color:#0b61d6; } .section h3{ font-size:0.95rem; margin:10px 0 6px; color:#123b64; } .tbl{ width:100%; border-collapse:collapse; margin:8px 0; } .tbl th, .tbl td{ border-bottom:1px solid var(--border); padding:8px 6px; text-align:left; } .tbl th{ background:#f4f8ff; color:#214b78; font-weight:700; } details.fold{ border:1px solid var(--border); border-radius:12px; background:#fff; margin:10px 0; } details.fold > summary{ list-style:none; cursor:pointer; padding:10px 12px; border-radius:12px; font-weight:800; color:#0b61d6; } details.fold[open] > summary{ background:#f4f8ff; } details.fold > div{ padding:10px 12px; } .badge{ display:inline-block; padding:3px 8px; border-radius:999px; font-weight:700; font-size:12px; } .badge.blue{ background:#e7f0ff; color:#0b61d6; } .badge.green{ background:#e6fbf3; color:#0f7b57; } .badge.orange{ background:#fff2e0; color:#a15d08; } .note{ color:var(--muted-text,#64748b); font-size:13px; } .alert{ padding:12px; border:1px solid var(--border); border-radius:12px; margin:12px 0; } .alert-danger{ border-color: var(--danger); background:#fff5f5; } .small{ font-size:12px; color:#5a6e80; } code.inline{ background:var(--primary-weak); padding:1px 6px; border-radius:6px; } /* ===== extracted style block 4 from v3.6 ===== */ body{font-family:Arial,Helvetica,sans-serif;padding:18px;color:#12263a} h2{color:#0b61d6} .print-btn{display:inline-block;margin:8px 0;padding:8px 10px;border-radius:8px;background:#0b61d6;color:#fff;border:none;cursor:pointer;font-weight:700} table{width:100%;border-collapse:collapse} th,td{border-bottom:1px solid #e0e7f1;padding:6px;text-align:left} th{background:#f4f8ff} /* ===== extracted style block 5 from v3.6 ===== */ #normProfile{display:none !important;} /* ===== extracted style block 6 from v3.6 ===== */ /* White text on dark (muted) backgrounds for category headers and pills */ .accordion-head { color: #fff !important; } .pill { color: #fff !important; } /* ===== extracted style block 7 from v3.6 ===== */ .section-title-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; } dialog#needsHelpNeeds{padding:24px 20px;border:none;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.2);} dialog::backdrop{background:rgba(0,0,0,0.35);} /* ===== extracted style block 8 from v3.6 ===== */ @media print { * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; } } /* ===== extracted style block 9 from v3.6 ===== */ /* v3.4: search-first UX */ #globalSearchSection.search-hero { border: 2px solid rgba(90,169,230,.55); background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%); position: relative; } .search-hero-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; } .search-hero h2 { margin: 0 0 6px 0; font-size: 22px; color: #0b61d6; } .search-lead { margin: 0; max-width: 760px; color: #486581; line-height: 1.5; } .search-db-count { min-width: 150px; border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 10px 12px; text-align: center; color: #214b78; } .search-db-count strong { display: block; font-size: 24px; line-height: 1.1; } .search-main-grid { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 12px; align-items: stretch; } .search-field-card, .search-grams-card { border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 12px; } .search-line { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; } #globalSearchInput.search-input-main { min-height: 50px; font-size: 18px; border-width: 2px; } #globalSearchInput.search-input-main:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 4px rgba(90,169,230,.18); } .search-field-hint { margin-top: 8px; font-size: 13px; line-height: 1.45; color: #486581; } .quick-searches, .quick-grams { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; } .quick-searches button, .quick-grams button { border-radius: 999px; padding: 7px 10px; font-size: 13px; background: #fff; color: var(--primary-600); border-color: var(--border); } .quick-searches button:hover, .quick-grams button:hover { border-color: var(--primary); } .search-status { margin-top: 12px; padding: 10px 12px; border-radius: 12px; background: #eef6ff; color: #214b78; font-size: 14px; } .search-empty-state { margin-top: 12px; border: 1px dashed rgba(90,169,230,.7); border-radius: 14px; background: #fff; padding: 14px; color: #486581; line-height: 1.5; } #globalResults.search-results-enhanced { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 12px; } .search-result-card { border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 12px; display: grid; grid-template-columns: minmax(0, 1fr) 132px; gap: 12px; align-items: center; } .search-result-title { font-weight: 800; line-height: 1.3; margin-bottom: 6px; } .search-result-nutrients { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; color: #486581; font-size: 12px; } .search-result-nutrients span { border: 1px solid var(--border); border-radius: 999px; padding: 3px 7px; background: #f8fbff; } .search-result-actions { display: grid; gap: 7px; } .search-result-actions input { height: 38px; } .search-result-actions button { padding: 9px 10px; } .catalog-drawer { padding: 0 !important; overflow: hidden; } .catalog-drawer > summary { list-style: none; cursor: pointer; padding: 16px; display: flex; justify-content: space-between; align-items: center; gap: 12px; } .catalog-drawer > summary::-webkit-details-marker { display: none; } .catalog-drawer-title { display: grid; gap: 4px; } .catalog-drawer-title strong { font-size: 18px; color: #0b61d6; } .catalog-drawer-title span { color: #486581; font-size: 13px; line-height: 1.45; } .catalog-drawer-indicator { white-space: nowrap; color: var(--primary-600); font-weight: 700; } .catalog-drawer[open] .catalog-drawer-indicator::after { content: ' ▲'; } .catalog-drawer:not([open]) .catalog-drawer-indicator::after { content: ' ▼'; } .catalog-drawer-body { border-top: 1px solid var(--border); padding: 16px; background: #fff; } .catalog-mode-help { margin: 10px 0 12px; color: #486581; line-height: 1.5; } @media (max-width: 840px) { .search-hero-head, .catalog-drawer > summary { flex-direction: column; align-items: stretch; } .search-db-count { text-align: left; } .search-main-grid, .search-result-card, #globalResults.search-results-enhanced { grid-template-columns: 1fr; } .search-line { grid-template-columns: 1fr; } } /* ===== extracted style block 10 from v3.6 ===== */ :root { --primary:#0b61d6; --primary-600:#0a55bd; --muted:#e7f0ff;--muted-text:#5d7086; } button { background:#0b61d6; border-color:#0b61d6; } button.secondary, .btn.secondary { background:#fff; color:#0b61d6; border-color:#0b61d6; } button.ghost { color:#0b61d6; } .pill { background:#e7f0ff !important; color:#123b64 !important; border:1px solid #cfe1ff; } #globalSearchSection.search-hero { border-color:rgba(11,97,214,.45); box-shadow:0 12px 32px rgba(11,97,214,.08); } #globalSearchInput.search-input-main:focus { border-color:#0b61d6; box-shadow:0 0 0 4px rgba(11,97,214,.14); } .search-added-toast { display:none; margin-top:12px; padding:10px 12px; border-radius:12px; background:#e6fbf3; color:#0f7b57; border:1px solid #b8ead8; font-weight:700; } .search-added-toast.show { display:block; } .search-result-card { align-items:stretch; } .search-result-title { color:#0b2b44; } .search-result-meta { color:#486581; font-size:12px; line-height:1.45; } .search-result-trust { margin-top:8px; font-size:11px; color:#5a6e80; } .search-more-wrap { grid-column:1 / -1; display:flex; justify-content:center; margin-top:2px; } .search-more-wrap button { min-width:180px; } .ration-head-enhanced { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; flex-wrap:wrap; margin-bottom:12px; } .ration-head-enhanced h2 { margin:0 0 4px; color:#0b61d6; } .ration-subtitle { margin:0; color:#486581; line-height:1.45; max-width:720px; } .ration-kpi-strip { border:1px solid var(--border); border-radius:14px; background:#f7fbff; padding:10px 12px; color:#123b64; font-weight:700; min-width:220px; } #rationSection { border:2px solid rgba(11,97,214,.18); } #rationSection .toolbar button.danger { background:#fff; color:#b42318; border-color:#f3b4ae; } #rationSection .toolbar { gap:8px; } .additional-tools { padding:0 !important; overflow:hidden; } .additional-tools > summary { list-style:none; cursor:pointer; padding:16px; display:flex; justify-content:space-between; align-items:center; gap:12px; } .additional-tools > summary::-webkit-details-marker { display:none; } .additional-title { display:grid; gap:4px; } .additional-title strong { color:#0b61d6; font-size:18px; } .additional-title span { color:#486581; font-size:13px; line-height:1.45; } .additional-indicator { white-space:nowrap; color:#0b61d6; font-weight:700; } .additional-tools[open] .additional-indicator { font-size:0; } .additional-tools[open] .additional-indicator::before { content:'Скрыть дополнительные инструменты ▲'; font-size:14px; } .additional-tools:not([open]) .additional-indicator::after { content:' ▼'; } .additional-body { border-top:1px solid var(--border); padding:16px; background:#fff; display:grid; gap:14px; } .additional-body #selectSection.catalog-drawer { box-shadow:none; margin:0; } .additional-body #presetsPanel { box-shadow:none; margin:0 !important; } .catalog-drawer[open] .catalog-drawer-indicator { font-size:0; } .catalog-drawer[open] .catalog-drawer-indicator::before { content:'Скрыть разделы ▲'; font-size:14px; } .catalog-drawer[open] .catalog-drawer-indicator::after { content:'' !important; } .catalog-drawer:not([open]) .catalog-drawer-indicator { font-size:0; } .catalog-drawer:not([open]) .catalog-drawer-indicator::before { content:'Показать разделы'; font-size:14px; } .dev-panel { display:none !important; } body.dev-mode .dev-panel.open { display:block !important; } @media (max-width: 760px) { .ration-head-enhanced, .additional-tools > summary { flex-direction:column; align-items:stretch; } .ration-kpi-strip { min-width:0; } #rationSection .toolbar { justify-content:stretch !important; } #rationSection .toolbar button { flex:1 1 auto; } } /* ===== extracted style block 11 from v3.6 ===== */ /* v3.5.1: on mobile, product search results are shown directly under the input. */ .mobile-results-anchor { display: none; } @media (max-width: 760px) { #globalSearchSection.search-hero { padding: 14px; } .search-hero-head { gap: 8px; margin-bottom: 10px; } .search-lead { font-size: 13px; line-height: 1.4; } .search-db-count { display: none; } .mobile-results-anchor { display: block; } .mobile-results-anchor #globalResults.search-results-enhanced { display: block; margin-top: 8px; padding: 6px; max-height: 56vh; overflow: auto; -webkit-overflow-scrolling: touch; border: 1px solid #cfe1ff; border-radius: 14px; background: #fff; box-shadow: 0 14px 36px rgba(15, 23, 42, .16); } .mobile-results-anchor #globalResults.search-results-enhanced:not(.has-query) { display: none; } .mobile-results-anchor .search-empty-state { margin: 0; padding: 10px; font-size: 13px; border-radius: 12px; } .mobile-results-anchor .search-result-card { display: grid; grid-template-columns: 1fr; gap: 8px; padding: 10px; margin: 0 0 6px 0; border: 1px solid #e6eef8; border-radius: 12px; box-shadow: none; background: #fff; } .mobile-results-anchor .search-result-card:last-child { margin-bottom: 0; } .mobile-results-anchor .search-result-title { font-size: 14px; line-height: 1.28; font-weight: 800; } .mobile-results-anchor .search-result-meta { font-size: 11px; } .mobile-results-anchor .search-result-nutrients { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; } .mobile-results-anchor .search-result-nutrients span { font-size: 11px; padding: 3px 6px; border-radius: 999px; background: #f4f8ff; color: #123b64; } .mobile-results-anchor .search-result-trust { display: none; } .mobile-results-anchor .search-result-actions { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 6px 8px; align-items: end; } .mobile-results-anchor .search-result-actions label { grid-column: 1; margin: 0; font-size: 11px; } .mobile-results-anchor .search-result-actions input { grid-column: 1; min-height: 40px; } .mobile-results-anchor .search-result-actions button { grid-column: 2; min-height: 40px; padding: 8px 10px; font-size: 13px; white-space: nowrap; } .mobile-results-anchor .search-more-wrap { margin-top: 6px; } .mobile-results-anchor .search-more-wrap button { width: 100%; min-width: 0; } .search-field-hint { font-size: 12px; } .quick-searches { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; } .quick-searches button { flex: 0 0 auto; } } /* ===== extracted style block 12 from v3.6 ===== */ /* v3.5.2: when the mobile input is low on the screen, keep results visible as a fixed panel. */ @media (max-width: 760px) { .mobile-results-anchor #globalResults.search-results-enhanced.has-query { position: fixed; left: 12px; right: 12px; top: var(--mobile-search-results-top, 132px); max-height: var(--mobile-search-results-height, 56vh); z-index: 10050; } .mobile-results-anchor #globalResults.search-results-enhanced.has-query::before { content: 'Найденные продукты'; display: block; position: sticky; top: 0; z-index: 1; margin: -6px -6px 6px -6px; padding: 8px 10px; background: #f4f8ff; border-bottom: 1px solid #dbeafe; color: #123b64; font-size: 12px; font-weight: 800; border-radius: 14px 14px 0 0; } } /* ===== extracted style block 13 from v3.6 ===== */ .icon-btn { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; border:1px solid currentColor; background:transparent; cursor:pointer; font-weight:700; line-height:1; user-select:none; } dialog { border: 1px solid #e5e7eb; border-radius:12px; padding:16px 16px 14px; box-shadow: 0 10px 30px rgba(0,0,0,.15); max-width:min(560px, 90vw); } dialog::backdrop { background: rgba(0,0,0,.3); } .close-btn { border:none; background:transparent; cursor:pointer; font-size:16px; line-height:1; } /* ===== extracted style block 14 from v3.6 ===== */ #mealsSection > summary { list-style: none; cursor: pointer; padding: 10px 12px; border-radius: 12px; } #mealsSection[open] > summary { background: #f4f8ff; } #mealsSection[open] .chev { transform: rotate(90deg); } /* ===== extracted style block 15 from v3.6 ===== */ .chip{display:inline-block;padding:2px 8px;border-radius:9999px;background:#eef2ff;color:#1d4ed8;font-size:12px;margin-left:8px} .alert{padding:10px;border-radius:10px;background:#f6f7f9} .alert.good{background:#e8f7ee;color:#0a5} .alert.neutral{background:#fff8e6;color:#a56a00} .alert.bad{background:#ffeded;color:#a00} .whatif{margin-top:6px;display:flex;flex-wrap:wrap;gap:6px;align-items:center} .btn-mini{border:1px solid #e5e7eb;border-radius:999px;padding:4px 8px;background:#f8fafc;color:#111;cursor:pointer;font-size:12px} .btn-mini:hover{background:#eef2ff} .lever{border:1px dashed #e5e7eb;border-radius:10px;padding:8px 10px;margin:6px 0;background:#fcfcff} tr.ok{background:#f3fbf6} tr.warn{background:#fff9ed} tr.bad{background:#fff2f2} #heiRecs .rec{margin:10px 0;padding:10px 12px;border-radius:10px;background:#f7f9fb} #heiRecs .rec.ok{background:#eef8f1} #heiRecs .rec.warn{background:#fff6e9} #heiRecs .rec.bad{background:#ffefef} .inline{display:inline-flex;gap:6px;align-items:center} /* ===== extracted style block 16 from v3.6 ===== */ .icon-btn { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; border:1px solid currentColor; background:transparent; cursor:pointer; font-weight:700; line-height:1; user-select:none; } .icon-btn--small { width:24px; height:24px; font-size:14px; } dialog { border: 1px solid #e5e7eb; border-radius:12px; padding:16px 16px 14px; box-shadow: 0 10px 30px rgba(0,0,0,.15); max-width:min(680px, 92vw); } dialog::backdrop { background: rgba(0,0,0,.3); } .close-btn { border:none; background:transparent; cursor:pointer; font-size:16px; line-height:1; } .help-pre { white-space: pre-wrap; margin: 0; font-family: inherit; } /* ===== extracted style block 17 from v3.6 ===== */ /* Скрываем мини-кнопки быстрых действий HEI */ .btn-mini { display: none !important; } /* ===== extracted style block 18 from v3.6 ===== */ #heiRecs .rec { padding:10px 12px; border:1px solid #e5e7eb; border-radius:10px; margin:8px 0; } #heiRecs .rec-head { display:flex; align-items:center; gap:8px; margin-bottom:6px; } #heiRecs .tag { font-size:12px; padding:2px 6px; border-radius:999px; border:1px solid #e2e8f0; } #heiRecs .tag.ok { background:#f0fdf4; border-color:#bbf7d0; } #heiRecs .tag.mild { background:#fff7ed; border-color:#fed7aa; } #heiRecs .tag.severe { background:#fef2f2; border-color:#fecaca; } #heiRecs .rec-top { padding:10px; background:#f8fafc; border:1px dashed #e2e8f0; border-radius:10px; margin-bottom:10px; } #heiRecs ul.play { margin:6px 0 0 18px; } #heiRecs .micro { color:#64748b; } /* ===== extracted style block 19 from v3.6 ===== */ /* hei-accordion styles */ .hei-help details > summary.btn-link { display:inline-block; padding:4px 8px; border:1px dashed #CBD5E1; border-radius:8px; font-size: 13px; color:#0f172a; background:#F8FAFC; } .hei-help details[open] > summary.btn-link { background:#EEF2FF; border-color:#C7D2FE; } .hei-help .help-body p { margin: 6px 0; } .hei-help code { background:#F1F5F9; padding:2px 6px; border-radius:6px; } /* ===== extracted style block 20 from v3.6 ===== */ #heiTargetKcal, label[for="heiTargetKcal"], #heiEnergyTarget, label[for="heiEnergyTarget"] { display: none !important; } /* ===== extracted style block 21 from v3.6 ===== */ /* Emphasize the plan corridor line in step-by-step energy */ .explain li.callout-corridor{ border: 2px solid #0b3d91 !important; /* dark blue */ border-radius: 10px; padding: 8px 12px; background: #f5f9ff !important; /* subtle tint */ font-weight: 700; margin: 10px 0; } .explain li.callout-corridor b{ font-weight: 700; } /* v5.3.60 — Personal nutrient actions integration */ .needs-personal-profile{border:1px solid #d7e5f2;border-radius:14px;background:#f8fbff;padding:12px;margin:12px 0;} .needs-personal-profile h2{margin-top:0;} .needs-personal-tags,.needs-personal-focus div{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0;} .needs-personal-tags span,.needs-personal-focus span{display:inline-flex;align-items:center;border:1px solid #d7e5f2;border-radius:999px;background:#fff;padding:3px 8px;font-size:12px;font-weight:700;color:#334155;} .needs-personal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px;} .needs-personal-child-norm{display:grid;gap:4px;border:1px solid #c7d2fe;border-radius:12px;background:#eef2ff;padding:9px 10px;margin:8px 0;color:#1e1b4b;} .needs-personal-child-norm strong{font-size:13px;color:#312e81;} .needs-personal-child-norm span{font-size:12px;line-height:1.35;} .needs-personal-card{border:1px solid #dbe7f3;border-radius:12px;background:#fff;padding:10px;} .needs-personal-card[data-level="главный"]{border-left:4px solid #2563eb;background:#f8fbff;} .needs-personal-card[data-level="важный"]{border-left:4px solid #0ea5e9;} .needs-personal-card[data-level="осторожно"]{border-left:4px solid #f59e0b;background:#fffaf0;} .needs-personal-card span{display:inline-block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#386fa4;font-weight:800;} .needs-personal-card strong{display:block;margin-top:3px;color:#0f172a;} .needs-personal-card p{margin:5px 0;color:#334155;} .needs-personal-card em{display:block;font-style:normal;color:#475569;font-size:13px;} .needs-personal-focus{border-top:1px solid #e3edf7;margin-top:10px;padding-top:9px;} .needs-personal-caution{border:1px solid #fed7aa;border-radius:10px;background:#fff7ed;color:#7c2d12;padding:8px 10px;margin-top:8px;font-size:13px;} @media(max-width:720px){.needs-personal-grid{grid-template-columns:1fr}.needs-personal-profile{padding:10px}} @media print{.needs-personal-profile,.needs-personal-card{break-inside:avoid}.needs-personal-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.needs-personal-card{padding:8px}} /* v5.3.60 — screen layer for personal nutrient actions */ .personal-nutrient-actions-panel{margin:14px 0 12px;border:1px solid #d7e5f2;border-radius:16px;background:#f8fbff;padding:12px;} .personal-nutrient-actions-title{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;} .personal-nutrient-actions-title h3{margin:4px 0 4px;color:#172033;} .personal-nutrient-actions-title p{margin:0;color:#64748b;font-size:13px;} .personal-nutrient-actions-tags,.personal-nutrient-focus div{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0;} .personal-nutrient-actions-tags span,.personal-nutrient-focus span{display:inline-flex;align-items:center;border:1px solid #d7e5f2;border-radius:999px;background:#fff;padding:3px 8px;font-size:12px;font-weight:800;color:#334155;} .personal-nutrient-focus{border-top:1px solid #e3edf7;margin-top:10px;padding-top:9px;} .personal-nutrient-priority{border:1px solid #dbe7f3;border-radius:12px;background:#fff;margin:10px 0;padding:8px 10px;} .personal-nutrient-priority summary{cursor:pointer;font-weight:800;color:#172033;} .personal-nutrient-priority ul{margin:8px 0 0;padding-left:18px;color:#334155;} .personal-nutrient-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px;} .personal-nutrient-action-card{border:1px solid #dbe7f3;border-radius:14px;background:#fff;padding:11px;box-shadow:0 6px 16px rgba(15,23,42,.035);} .personal-nutrient-action-card[data-level="добрать"]{border-left:4px solid #2563eb;background:#f8fbff;} .personal-nutrient-action-card[data-level="сократить"]{border-left:4px solid #f59e0b;background:#fffaf0;} .personal-nutrient-action-card[data-level="проверить"]{border-left:4px solid #64748b;} .personal-nutrient-action-head span{display:inline-block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#386fa4;font-weight:900;} .personal-nutrient-action-head strong{display:block;margin-top:2px;color:#0f172a;} .personal-nutrient-action-head em{display:block;margin-top:2px;color:#475569;font-size:12px;font-style:normal;} .personal-nutrient-action-card p{margin:7px 0;color:#334155;} .personal-nutrient-action-do{border:1px solid #bfdbfe;border-radius:11px;background:#eff6ff;padding:8px;margin-top:8px;} .personal-nutrient-action-do span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#1e40af;font-weight:900;} .personal-nutrient-action-do p{margin:3px 0 0;color:#172033;} .personal-nutrient-action-card small{display:block;margin-top:8px;color:#64748b;} .personal-nutrient-route{border:1px solid #dbeafe;border-radius:13px;background:#fff;padding:9px 10px;margin:10px 0;} .personal-nutrient-route strong{display:block;color:#172033;margin-bottom:6px;} .personal-nutrient-route div{display:flex;flex-wrap:wrap;gap:6px;} .personal-nutrient-route span{display:inline-flex;gap:4px;align-items:center;border:1px solid #bfdbfe;border-radius:999px;background:#eff6ff;color:#1e3a8a;padding:4px 8px;font-size:12px;font-weight:800;} .personal-nutrient-route b{font-weight:900;} .personal-nutrient-action-meta{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0 6px;} .personal-nutrient-action-meta span{display:inline-flex;border:1px solid #d7e5f2;border-radius:999px;background:#fbfdff;color:#334155;padding:3px 7px;font-size:11.5px;font-weight:800;} .personal-nutrient-action-why{border-left:3px solid #bfdbfe;background:#f8fbff;border-radius:8px;padding:7px 8px;} .personal-nutrient-caution{border:1px solid #fed7aa;border-radius:11px;background:#fff7ed;color:#7c2d12;padding:9px 10px;margin-top:10px;font-size:13px;} @media(max-width:720px){.personal-nutrient-actions-panel{padding:10px}.personal-nutrient-action-grid{grid-template-columns:1fr}.personal-nutrient-actions-title{display:block}.personal-nutrient-action-card{padding:10px}.personal-nutrient-route span,.personal-nutrient-action-meta span{font-size:11px}.personal-nutrient-route{padding:8px}} @media print{.personal-nutrient-actions-panel,.personal-nutrient-action-card,.personal-nutrient-priority{break-inside:avoid;page-break-inside:avoid}.personal-nutrient-action-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.personal-nutrient-actions-panel{box-shadow:none}} /* v5.3.65 — personal priority router pass */ .personal-target-strip{border:1px dashed #bed3e6;background:#fbfdff;border-radius:12px;padding:9px 10px;margin:8px 0 10px;} .personal-target-strip>strong{display:block;font-size:12px;letter-spacing:.02em;text-transform:uppercase;color:#475569;margin-bottom:6px;} .personal-target-strip>div{display:flex;flex-wrap:wrap;gap:6px;align-items:center;} .personal-target-strip span{display:inline-flex;gap:4px;align-items:baseline;border:1px solid #d7e5f2;background:#fff;border-radius:999px;padding:4px 8px;font-size:12px;color:#334155;} .personal-target-strip b{color:#0f172a;font-weight:750;} .nr-personal-target-note{display:block;margin-top:2px;color:#64748b;font-size:10.5px;line-height:1.2;} @media(max-width:720px){.personal-target-strip{padding:8px}.personal-target-strip>div{gap:5px}.personal-target-strip span{font-size:11.5px;padding:4px 7px}} @media print{.personal-target-strip{break-inside:avoid;border-color:#ccd6e1;background:#fff}.personal-target-strip span{border-color:#d7dde7}.nr-personal-target-note{font-size:9.5px}} /* v5.3.65 — live age profile indicator in the needs calculator */ .needs-age-profile-indicator{ margin-top:7px; padding:9px 10px; border:1px solid #d7e5f2; border-radius:12px; background:#f8fbff; color:#0f172a; box-shadow:0 1px 0 rgba(15,23,42,.03); } .needs-age-profile-indicator[hidden]{display:none!important;} .needs-age-profile-indicator.is-applied{border-color:#bfdbfe;background:#eff6ff;} .needs-age-profile-indicator.is-child{border-color:#c7d2fe;background:#eef2ff;} .needs-age-profile-indicator.is-older{border-color:#fde68a;background:#fffbeb;} .needs-age-profile-head{display:flex;align-items:center;gap:7px;flex-wrap:wrap;line-height:1.25;} .needs-age-profile-head span{display:inline-flex;align-items:center;border-radius:999px;background:#e0ecff;color:#1d4ed8;font-size:10px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;padding:3px 7px;} .needs-age-profile-head b{font-size:13px;color:#0f172a;} .needs-age-profile-head em{font-style:normal;border:1px solid rgba(37,99,235,.22);border-radius:999px;background:#fff;color:#334155;font-size:11px;font-weight:800;padding:2px 7px;} .needs-age-profile-indicator p{margin:6px 0 0;color:#475569;font-size:12px;line-height:1.35;} .needs-age-profile-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px;} .needs-age-profile-chips span{display:inline-flex;align-items:center;border:1px solid rgba(148,163,184,.35);border-radius:999px;background:#fff;padding:3px 7px;font-size:11px;font-weight:750;color:#334155;} @media(max-width:720px){ .needs-age-profile-indicator{padding:8px 9px;margin-top:6px;} .needs-age-profile-head{gap:5px;} .needs-age-profile-head span{font-size:9.5px;padding:3px 6px;} .needs-age-profile-head b{font-size:12.5px;} .needs-age-profile-indicator p{font-size:11.5px;} .needs-age-profile-chips span{font-size:10.5px;padding:2px 6px;} } @media print{.needs-age-profile-indicator{break-inside:avoid;box-shadow:none;}} /* v5.3.65 — scenario router for personal needs profile */ .needs-scenario-router{border:1px solid #dbeafe;border-radius:14px;background:#fff;margin:10px 0 12px;padding:10px;} .needs-scenario-title{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;border-bottom:1px solid #e6eef8;padding-bottom:7px;margin-bottom:8px;} .needs-scenario-title strong{color:#0f172a;font-size:13px;} .needs-scenario-title span{color:#64748b;font-size:11px;text-align:right;} .needs-scenario-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;} .needs-scenario-factor{border:1px solid #e2e8f0;border-radius:12px;background:#fbfdff;padding:8px 9px;} .needs-scenario-factor span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;font-weight:900;color:#386fa4;} .needs-scenario-factor strong{display:block;margin-top:2px;font-size:13px;color:#0f172a;} .needs-scenario-factor p{margin:4px 0 0;color:#475569;font-size:12px;line-height:1.32;} .needs-age-profile-indicator.is-special{border-color:#fed7aa;background:#fff7ed;} @media(max-width:720px){ .needs-scenario-grid{grid-template-columns:1fr;gap:6px;} .needs-scenario-title{display:block;} .needs-scenario-title span{display:block;text-align:left;margin-top:3px;} .needs-scenario-factor{padding:7px 8px;} } @media print{.needs-scenario-router,.needs-scenario-factor{break-inside:avoid;box-shadow:none}.needs-scenario-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}} /* v5.3.77 Composite food folder UI */ .composite-folder-row .ration-title { font-weight: 700; } .composite-badge { display:inline-flex; align-items:center; margin-left:8px; padding:2px 8px; border:1px solid rgba(15,23,42,.14); border-radius:999px; font-size:.78rem; color:#334155; background:rgba(148,163,184,.12); } .composite-folder-details { padding:10px 4px 2px; } .composite-folder-note { margin-bottom:10px; color:#475569; line-height:1.45; } .composite-child-table { width:100%; border-collapse:collapse; font-size:.92rem; margin:8px 0 10px; } .composite-child-table th, .composite-child-table td { padding:8px 6px; border-bottom:1px solid rgba(148,163,184,.28); vertical-align:middle; } .composite-child-table th { text-align:left; color:#475569; font-weight:700; } .composite-child-table input[type="number"] { max-width:110px; } .composite-child-name { font-weight:600; } .composite-confidence { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0; } .warn-text { color:#92400e; font-weight:700; } @media (max-width: 720px){ .composite-child-table, .composite-child-table thead, .composite-child-table tbody, .composite-child-table tr, .composite-child-table th, .composite-child-table td { display:block; width:100%; } .composite-child-table thead { display:none; } .composite-child-table tr { padding:8px 0; border-bottom:1px solid rgba(148,163,184,.28); } .composite-child-table td { border:0; padding:4px 0; } .composite-child-table input[type="number"] { width:100%; max-width:none; } } /* v5.3.88 composite ingredient editor */ .composite-folder-actions{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 12px;align-items:center}.composite-child-actions{display:flex;gap:6px;flex-wrap:wrap}.composite-child-actions .secondary{padding:5px 8px;font-size:.88rem}.composite-child-flags{font-size:.78rem;color:var(--muted-text,#6b7280);margin-top:2px}.composite-inner-editor{border:1px solid rgba(0,0,0,.12);border-radius:12px;padding:12px;margin:12px 0;background:rgba(255,255,255,.72);box-shadow:0 1px 2px rgba(0,0,0,.04)}.composite-inner-editor-title{font-weight:700;margin-bottom:8px}.composite-inner-editor-grid{display:grid;grid-template-columns:minmax(180px,1.2fr) minmax(220px,1.6fr) minmax(90px,.6fr);gap:8px;align-items:end}.composite-inner-editor-grid label{display:flex;flex-direction:column;gap:4px;font-size:.9rem}.composite-inner-editor-grid input,.composite-inner-editor-grid select{width:100%;box-sizing:border-box}.composite-inner-editor-help{font-size:.86rem;color:var(--muted-text,#6b7280);margin:8px 0}.composite-inner-editor-actions{display:flex;gap:8px;flex-wrap:wrap}.composite-badge+.composite-custom-badge{margin-left:6px}.warn-text{color:#9a3412;font-weight:600}@media(max-width:760px){.composite-inner-editor-grid{grid-template-columns:1fr}.composite-child-actions{flex-direction:column}.composite-child-actions .secondary{width:100%}.composite-folder-actions button{width:100%}} /* v5.3.90 composite search preview UX polish */ .search-result-card.composite-search-card{align-items:start;border-color:rgba(37,99,235,.24);background:linear-gradient(180deg,#fff,#fbfdff)} .composite-search-badge{display:inline-flex;vertical-align:middle;margin-left:6px;padding:2px 7px;border-radius:999px;background:#eef6ff;border:1px solid #bfdbfe;color:#1d4ed8;font-size:.72rem;font-weight:700}.composite-search-preview{margin-top:9px;border:1px solid rgba(148,163,184,.34);border-radius:12px;background:#f8fafc;padding:9px}.composite-search-preview-head{font-size:.88rem;line-height:1.35;color:#334155}.composite-search-flags{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.composite-search-flags span{font-size:.76rem;border:1px solid rgba(99,102,241,.22);background:#eef2ff;color:#3730a3;border-radius:999px;padding:2px 7px}.composite-search-details{margin-top:7px}.composite-search-details summary{cursor:pointer;font-weight:700;color:#1d4ed8;font-size:.86rem}.composite-search-details table{width:100%;border-collapse:collapse;margin-top:8px;font-size:.82rem}.composite-search-details th,.composite-search-details td{border-bottom:1px solid rgba(148,163,184,.28);padding:5px 4px;text-align:left;vertical-align:top}.composite-search-note,.composite-search-model-meta{font-size:.8rem;color:#64748b;margin-top:7px}.search-result-actions [data-role="add-search-edit"]{font-size:.88rem;line-height:1.2}@media(max-width:720px){.search-result-card.composite-search-card{grid-template-columns:1fr}.composite-search-details table,.composite-search-details thead,.composite-search-details tbody,.composite-search-details tr,.composite-search-details th,.composite-search-details td{display:block}.composite-search-details thead{display:none}.composite-search-details tr{border-bottom:1px solid rgba(148,163,184,.28);padding:5px 0}.composite-search-details td{border:0;padding:2px 0}.search-result-actions [data-role="add-search-edit"]{width:100%}} /* v5.3.90 composite search preview polishing */ .composite-search-kind{font-size:.8rem;color:#475569;margin-top:5px;line-height:1.35}.composite-search-fit-prompts{margin:7px 0 8px 18px;padding:0;color:#475569;font-size:.82rem;line-height:1.35}.composite-search-table-wrap{max-height:260px;overflow:auto;border:1px solid rgba(148,163,184,.22);border-radius:10px;background:#fff;margin-top:8px}.composite-search-table-wrap table{margin-top:0}.composite-open-after-add-highlight{outline:2px solid rgba(59,130,246,.55);outline-offset:2px;background:rgba(239,246,255,.75)}.needs-review-highlight{box-shadow:0 0 0 3px rgba(245,158,11,.28)!important;border-color:rgba(245,158,11,.65)!important}@media(max-width:720px){.composite-search-table-wrap{max-height:320px}.composite-search-fit-prompts{margin-left:16px}} /* ===== SOURCE: assets/css/ui-polish.css ===== */ /* v4.0 UI polish: user-facing layout and mobile ergonomics. */ :root{ --primary:#0b61d6; --primary-600:#084a9f; --focus-ring:0 0 0 4px rgba(11,97,214,.18); } button{ background:var(--primary); border-color:var(--primary); } button.secondary{ color:var(--primary); border-color:rgba(11,97,214,.55); } .seg button.active{ background:var(--primary); } .bar{ background:var(--primary); } button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible{ outline:none; box-shadow:var(--focus-ring); } .dev-only{ display:none !important; } body.dev-enabled .dev-only{ display:inline-flex !important; } body:not(.dev-enabled) #devPanel{ display:none !important; } #devPanel h3::before{ content:'Диагностика'; } #devPanel h3{ font-size:0; } #devPanel h3::before{ font-size:16px; } .v40-needs-summary{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; border:1px solid rgba(11,97,214,.18); border-radius:14px; background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%); } .v40-needs-summary-title{ font-weight:800; color:#123b64; } .v40-needs-summary-text{ margin-top:3px; font-size:13px; color:#486581; line-height:1.35; } .v40-needs-toggle{ white-space:nowrap; } #needsCompact.v40-needs-collapsed > .small, #needsCompact.v40-needs-collapsed > #needs-method-notice, #needsCompact.v40-needs-collapsed > #needs{ display:none !important; } #needsCompact.v40-needs-collapsed{ margin-bottom:10px !important; } #globalSearchSection.search-hero{ margin-top:12px; border-color:rgba(11,97,214,.45); } .search-lead{ max-width:720px; } .search-result-card{ transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease; } .search-result-card:hover{ border-color:rgba(11,97,214,.42); box-shadow:0 10px 28px rgba(15,23,42,.08); } .search-added-toast:not(:empty){ margin-top:10px; padding:10px 12px; border-radius:12px; background:#e8f7ee; color:#075c3b; font-weight:700; } .ration-head-enhanced{ align-items:center; } #clearRationBtn{ background:#fff; color:#b91c1c; border-color:#fecaca; } #clearRationBtn:hover{ background:#fff5f5; } #totalsSection details.norms:not([open]){ padding-bottom:0; } #totalsSection details.norms > summary{ cursor:pointer; } .v40-mini-cart{ display:none; position:fixed; left:10px; right:10px; bottom:10px; z-index:10060; border:1px solid rgba(11,97,214,.28); border-radius:16px; background:#ffffff; box-shadow:0 14px 40px rgba(15,23,42,.18); padding:9px 10px; gap:8px; align-items:center; justify-content:space-between; } .v40-mini-cart.is-visible{ display:flex; } .v40-mini-cart-text{ font-size:12px; color:#123b64; line-height:1.25; font-weight:700; } .v40-mini-cart button{ padding:8px 10px; border-radius:12px; white-space:nowrap; } .v40-top-note{ margin:0 0 12px 0; font-size:13px; color:#486581; line-height:1.45; } @media (max-width:760px){ .container{ padding:14px 10px 92px; } header{ align-items:flex-start; } .title{ font-size:20px; } .toolbar{ width:100%; } header .toolbar select, header .toolbar button{ flex:1 1 auto; min-width:calc(50% - 6px); } .v40-needs-summary{ align-items:stretch; flex-direction:column; padding:11px; } .v40-needs-toggle{ width:100%; } #globalSearchSection.search-hero{ margin-top:10px; } .search-main-grid{ grid-template-columns:1fr; } .search-grams-card{ display:grid; grid-template-columns:1fr; } .search-line{ grid-template-columns:minmax(0,1fr) auto; } #globalSearchClear{ padding-left:10px; padding-right:10px; } .mobile-results-anchor #globalResults.search-results-enhanced.has-query{ left:8px; right:8px; border-radius:16px; } .mobile-results-anchor #globalResults.search-results-enhanced.has-query::before{ content:'Найденные продукты — выберите строку и добавьте в рацион'; } #rationSection .ration-table, #rationSection .ration-table thead, #rationSection .ration-table tbody, #rationSection .ration-table th, #rationSection .ration-table td, #rationSection .ration-table tr{ display:block; } #rationSection .ration-table thead{ display:none; } #rationSection .ration-table tr{ border:1px solid var(--border); border-radius:14px; padding:10px; margin:8px 0; background:#fff; } #rationSection .ration-table td{ border-bottom:0; padding:5px 0; } #rationSection .ration-table td:nth-child(1){ font-weight:800; } #rationSection .ration-table td:nth-child(2)::before{ content:'Группы: '; font-weight:700; color:#486581; } #rationSection .ration-table td:nth-child(3)::before{ content:'Граммы: '; font-weight:700; color:#486581; } #rationSection .ration-table td:nth-child(3) input{ width:120px; display:inline-block; } #rationSection .toolbar{ display:grid !important; grid-template-columns:1fr 1fr; gap:8px; } #rationSection .toolbar button{ width:100%; } .totals-grid{ grid-template-columns:1fr; } #heiPanel .row{ display:flex; flex-direction:column; align-items:stretch !important; } #heiPanel input[type="number"]{ width:100% !important; } .table-wrap{ overflow-x:auto; } .v40-mini-cart.is-visible{ display:flex; } } @media (min-width:761px){ .v40-mini-cart{ display:none !important; } } /* ===== SOURCE: assets/css/hosting-test.css ===== */ /* nutrition calculator v4.1_hosting_test */ .hosting-test-panel{position:fixed;right:16px;bottom:16px;z-index:9999;width:min(520px,calc(100vw - 24px));max-height:min(76vh,720px);overflow:auto;background:#fff;border:1px solid #cbd5e1;border-radius:16px;box-shadow:0 18px 45px rgba(15,23,42,.22);font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#0f172a}.hosting-test-panel header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid #e2e8f0}.hosting-test-panel h2{font-size:16px;margin:0}.hosting-test-panel .hosting-test-body{padding:12px 14px}.hosting-test-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 10px}.hosting-test-metric{border:1px solid #e2e8f0;border-radius:12px;padding:8px;background:#f8fafc}.hosting-test-metric strong{display:block;font-size:18px}.hosting-test-list{display:grid;gap:6px;margin-top:10px}.hosting-test-row{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:start;border:1px solid #e2e8f0;border-radius:10px;padding:8px;background:#fff}.hosting-test-row.pass{border-color:#86efac;background:#f0fdf4}.hosting-test-row.warn{border-color:#fde68a;background:#fffbeb}.hosting-test-row.fail{border-color:#fca5a5;background:#fef2f2}.hosting-test-dot{width:10px;height:10px;border-radius:50%;margin-top:5px;background:#94a3b8}.hosting-test-row.pass .hosting-test-dot{background:#16a34a}.hosting-test-row.warn .hosting-test-dot{background:#d97706}.hosting-test-row.fail .hosting-test-dot{background:#dc2626}.hosting-test-row-title{font-weight:700}.hosting-test-row-detail{font-size:12px;color:#475569;margin-top:2px;overflow-wrap:anywhere}.hosting-test-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.hosting-test-actions button,.hosting-test-close{border:1px solid #cbd5e1;background:#fff;color:#0f172a;border-radius:10px;padding:7px 10px;cursor:pointer}.hosting-test-actions .primary{background:#0b61d6;border-color:#0b61d6;color:#fff}.hosting-test-close{font-size:13px}.hosting-test-hidden{display:none!important}.hosting-test-page{max-width:980px;margin:0 auto;padding:24px}.hosting-test-page h1{font-size:28px;margin:0 0 8px}.hosting-test-page .lead{color:#475569;margin:0 0 18px}.hosting-test-page-card{border:1px solid #e2e8f0;border-radius:16px;background:#fff;padding:16px;margin:14px 0}.hosting-test-page .hosting-test-list{margin-top:14px}@media(max-width:760px){.hosting-test-panel{left:8px;right:8px;bottom:8px;width:auto;max-height:72vh;border-radius:14px}.hosting-test-summary{grid-template-columns:1fr 1fr}.hosting-test-panel header{padding:10px 12px}.hosting-test-panel .hosting-test-body{padding:10px 12px}} /* ===== SOURCE: assets/css/accessibility-readability.css ===== */ /* v4.2 accessibility/readability pass: contrast, hit targets, focus, mobile readability. */ :root{ --a11y-primary:#0b61d6; --a11y-primary-dark:#084a9f; --a11y-text:#0f172a; --a11y-muted:#334155; --a11y-border:#b9d2ef; --a11y-soft:#f8fbff; --a11y-focus:0 0 0 4px rgba(11,97,214,.22); --a11y-danger:#b91c1c; --a11y-success:#166534; } html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; text-size-adjust:100%; } body{ color:var(--a11y-text); line-height:1.55; } .skip-link{ position:absolute; left:12px; top:12px; z-index:20000; transform:translateY(-160%); padding:10px 14px; border-radius:12px; background:#ffffff; color:var(--a11y-primary-dark); border:2px solid var(--a11y-primary); box-shadow:0 12px 28px rgba(15,23,42,.18); font-weight:800; text-decoration:none; } .skip-link:focus{ transform:translateY(0); outline:none; box-shadow:var(--a11y-focus),0 12px 28px rgba(15,23,42,.18); } .card{ border-color:var(--a11y-border); } .muted,.small,.search-lead,.search-field-hint,.ration-subtitle,.catalog-mode-help,.additional-title span,.catalog-drawer-title span,.v40-needs-summary-text{ color:var(--a11y-muted) !important; opacity:1 !important; } .small{ font-size:13px; line-height:1.5; } label{ color:#1f3349; opacity:1; font-size:13px; font-weight:700; } button, .btn, input[type="button"], input[type="submit"], select, input[type="text"], input[type="number"], input[type="search"], textarea{ min-height:44px; font-size:16px; } button,.btn{ line-height:1.2; } button:not(.ghost),.btn:not(.ghost){ min-width:44px; } button.secondary,.btn.secondary{ background:#fff; color:var(--a11y-primary-dark); border-color:var(--a11y-primary); } button.ghost,.btn.ghost{ color:var(--a11y-primary-dark); } button.danger,#clearRationBtn{ color:var(--a11y-danger); border-color:#f0b4b4; } button:focus-visible, .btn:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible{ outline:3px solid transparent; box-shadow:var(--a11y-focus); } button:disabled,select:disabled,input:disabled{ opacity:.65; cursor:not-allowed; } .chip,.pill,.badge{ color:#123b64 !important; background:#e9f2ff !important; border-color:#b9d2ef !important; opacity:1 !important; } .search-status{ color:#123b64; background:#e9f2ff; border:1px solid #b9d2ef; } .search-empty-state{ color:var(--a11y-muted); border-color:#9ec3ef; } #globalSearchInput.search-input-main{ font-size:18px; min-height:52px; } #globalSearchClear{ white-space:nowrap; } .quick-searches button,.quick-grams button{ min-height:40px; color:var(--a11y-primary-dark); border-color:#b9d2ef; } .search-result-card{ border-color:#c5d9f1; } .search-result-card:focus-within{ border-color:var(--a11y-primary); box-shadow:var(--a11y-focus); } .search-result-title{ color:#0b2037; } .search-result-meta,.search-result-trust{ color:var(--a11y-muted) !important; } .search-result-nutrients span{ color:#1f3349; border-color:#c5d9f1; } .search-result-actions label{ color:#1f3349; } .ration-kpi-strip,.v40-mini-cart{ border-color:#b9d2ef; } #rationSection .ration-table th{ color:#15395c; } #rationSection .ration-table td{ color:#0f172a; } #globalActions,#legal-note{ color:#334155; } #legal-note p,#legal-note small{ color:#334155; opacity:1; } dialog{ color:#0f172a; } .help-pre{ white-space:pre-wrap; line-height:1.55; font-size:14px; } .a11y-live-region{ position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; } .a11y-audit-panel{ position:fixed; right:12px; bottom:12px; z-index:12000; width:min(520px, calc(100vw - 24px)); max-height:78vh; overflow:auto; background:#fff; color:#0f172a; border:1px solid #b9d2ef; border-radius:16px; box-shadow:0 18px 48px rgba(15,23,42,.22); } .a11y-audit-panel header{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid #dbe8f7; margin:0; } .a11y-audit-panel h2{ margin:0; font-size:17px; color:#0b61d6; } .a11y-audit-panel .a11y-audit-body{ padding:12px 14px; display:grid; gap:8px; } .a11y-audit-row{ border:1px solid #e2e8f0; border-radius:12px; padding:9px 10px; } .a11y-audit-row.pass{ border-color:#bbf7d0; background:#f0fdf4; } .a11y-audit-row.warn{ border-color:#fde68a; background:#fffbeb; } .a11y-audit-row.fail{ border-color:#fecaca; background:#fff5f5; } .a11y-audit-row strong{ display:block; font-size:14px; } .a11y-audit-row span{ display:block; margin-top:2px; font-size:12px; color:#475569; } .a11y-audit-actions{ display:flex; gap:8px; flex-wrap:wrap; margin:8px 0 0; } .a11y-audit-actions button{ min-height:38px; padding:8px 10px; } @media (max-width:760px){ body{ font-size:16px; } .container{ padding-left:10px; padding-right:10px; } header{ gap:10px; } .title{ line-height:1.2; } .toolbar{ gap:8px; } header .toolbar select, header .toolbar button{ min-width:100%; } .card{ padding:14px; } h1{ font-size:1.28rem; line-height:1.25; } h2{ font-size:1.18rem; line-height:1.3; } h3{ font-size:1rem; line-height:1.35; } .search-line{ grid-template-columns:1fr auto !important; } #globalSearchInput.search-input-main{ min-width:0; font-size:17px; } .mobile-results-anchor #globalResults.search-results-enhanced.has-query{ max-height:min(62vh, 520px); border-width:2px; } .mobile-results-anchor #globalResults.search-results-enhanced.has-query::before{ color:#123b64; background:#e9f2ff; border:1px solid #b9d2ef; } .mobile-results-anchor .search-result-card{ padding:11px; border-radius:14px; gap:8px; } .mobile-results-anchor .search-result-title{ font-size:15px; line-height:1.35; } .mobile-results-anchor .search-result-meta{ font-size:12px; } .mobile-results-anchor .search-result-actions{ grid-template-columns:92px 1fr; align-items:end; } .mobile-results-anchor .search-result-actions label{ grid-column:1 / -1; margin-bottom:-2px; } .mobile-results-anchor .search-result-actions input{ width:92px; min-height:44px; font-size:16px; } .mobile-results-anchor .search-result-actions button{ min-height:44px; } .quick-searches{ gap:7px; } .quick-searches button,.quick-grams button{ min-height:40px; padding:8px 10px; } .ration-table td input[type="number"]{ min-height:44px; font-size:16px; } #rationSection .toolbar{ grid-template-columns:1fr !important; } #globalActions .toolbar{ display:grid; grid-template-columns:1fr; } .v40-mini-cart{ left:8px; right:8px; bottom:8px; } } @media (prefers-reduced-motion: reduce){ *,*::before,*::after{ scroll-behavior:auto !important; transition-duration:0.01ms !important; animation-duration:0.01ms !important; animation-iteration-count:1 !important; } } @media (prefers-contrast: more){ :root{ --a11y-border:#7ba9df; } .card,.search-result-card,input,select,textarea,button{ border-width:2px; } } /* v5.3.15 Scroll Neutrality Lock */ @media (max-width:760px){ html{ scroll-behavior:auto !important; } #globalResults, #heiMobileDashboard, #harvardPlatePanel, #harvardSmartRebalance, #harvardWhatIfSimulator, #harvardApplyPlan, #harvardHeiBridge, #rationSection, #totals, #needs_out, .search-results-enhanced, .harvard-plate-v5, .hp-visual-layout, .hp-outside-summary, .hp-mobile-diagnosis{ overflow-anchor:none !important; } } /* v5.3.19 Browser Native Interaction Reset */ @media (max-width:760px){ html, body, main, section, article, #app, #needsCompact, #needsPanel, #needs_out, #globalSearchSection, #globalResults, #rationSection, #totals, #heiPanel, #heiMobileDashboard, #harvardPlatePanel, #harvardPlateAccordions, #harvardSmartRebalance, #harvardWhatIfSimulator, #harvardApplyPlan{ overflow-anchor:none !important; } } /* ===== SOURCE: assets/css/needs-first-step-v5.2.46.css ===== */ /* v4.4 needs-first-step: keep calculator of needs visible as step 1 and add mobile start hint. */ :root{ --needs-step-blue:#0b61d6; --needs-step-blue-dark:#084a9f; --needs-step-bg:#eff6ff; --needs-step-border:#bfdbfe; } .skip-link--second{ left:180px; } #needsCompact{ border:2px solid var(--needs-step-border); box-shadow:0 10px 30px rgba(15, 23, 42, .08); } #needsCompact::before{ content:'Шаг 1'; display:inline-flex; align-items:center; gap:6px; margin:0 0 10px 0; padding:6px 10px; border-radius:999px; background:var(--needs-step-blue); color:#fff; font-weight:800; font-size:13px; letter-spacing:.02em; } #v40NeedsSummary{ background:linear-gradient(180deg,#ffffff 0%, var(--needs-step-bg) 100%); border:1px solid var(--needs-step-border); } #v40NeedsSummary .v40-needs-summary-title{ font-size:18px; font-weight:800; color:#0f172a; } #v40NeedsSummary .v40-needs-summary-text{ color:#334155; } #needs h1{ color:#0f172a; } #needs_state option[value="normal"]{ font-weight:700; } .needs-first-toast{ position:fixed; z-index:9999; inset:0; display:flex; align-items:center; justify-content:center; padding:18px; background:rgba(248,250,252,.86); backdrop-filter:blur(3px); color:#0f172a; line-height:1.45; font-size:15px; } .needs-first-toast-card{ position:relative; width:min(780px,calc(100vw - 28px)); min-height:260px; display:grid; grid-template-columns:228px minmax(0,1fr); gap:18px; align-items:center; padding:16px 54px 16px 16px; border:3px solid #111; border-radius:20px; background:#fff; box-shadow:0 18px 48px rgba(15, 23, 42, .18); } .needs-first-toast-figure{ width:228px; height:228px; border:2px solid #111; border-radius:14px; background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%); box-shadow:inset 0 0 0 2px #fff; display:flex; align-items:center; justify-content:center; overflow:hidden; } .needs-first-step-icon{ width:172px; height:172px; display:grid; grid-template-columns:repeat(5,1fr); grid-template-rows:repeat(5,1fr); gap:6px; } .needs-first-step-icon span{ display:block; border:2px solid #111; background:#d1d5db; } .needs-first-step-icon span:nth-child(1){ grid-column:2 / 5; grid-row:1 / 3; background:#fff; } .needs-first-step-icon span:nth-child(2){ grid-column:1 / 4; grid-row:3 / 6; background:#d1d5db; } .needs-first-step-icon span:nth-child(3){ grid-column:4 / 6; grid-row:3 / 6; background:#6b7280; } .needs-first-toast-main{ min-width:0; } .needs-first-toast-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:7px; } .needs-first-toast-kicker{ font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:#0f172a; } .needs-first-toast-badge{ display:inline-flex; align-items:center; justify-content:center; min-height:24px; padding:2px 8px; border:1px solid #111; border-radius:999px; background:#f8fafc; color:#111; font-size:11px; font-weight:900; white-space:nowrap; } .needs-first-toast strong{ display:block; margin-bottom:6px; color:#111; font-size:17px; line-height:1.25; } .needs-first-toast div:not(.needs-first-toast-card):not(.needs-first-toast-figure):not(.needs-first-step-icon):not(.needs-first-toast-main):not(.needs-first-toast-top){ color:#475569; font-size:13px; line-height:1.35; } .needs-first-toast button{ position:absolute; right:12px; top:12px; width:34px; height:34px; min-width:34px; border-radius:999px; border:1px solid #111; background:#fff; color:#0f172a; font-weight:900; } .needs-first-toast.is-hiding{ opacity:0; transform:translateY(-6px); transition:opacity .18s ease, transform .18s ease; } @media (min-width: 761px){ .needs-first-toast{ display:none; } } @media (max-width: 760px){ .needs-first-toast{ padding:18px 11px; } .needs-first-toast-card{ width:min(580px,calc(100vw - 22px)); min-height:unset; grid-template-columns:156px minmax(0,1fr); gap:12px; padding:12px 46px 12px 12px; border-radius:16px; } .needs-first-toast-figure{ width:156px; height:156px; } .needs-first-step-icon{ width:118px; height:118px; gap:5px; } .needs-first-toast strong{ font-size:14px; } .needs-first-toast div:not(.needs-first-toast-card):not(.needs-first-toast-figure):not(.needs-first-step-icon):not(.needs-first-toast-main):not(.needs-first-toast-top){ font-size:12px; } .skip-link--second{ left:12px; top:52px; } #needsCompact{ margin-top:8px; } #needsCompact::before{ margin-left:2px; } #needsCompact.v40-needs-collapsed #needs{ display:block; } #needsCompact.v40-needs-collapsed #v40NeedsSummary .v40-needs-toggle::after{ content:' · первый шаг'; font-weight:600; } } @media (max-width:420px){ .needs-first-toast-card{ width:min(360px,calc(100vw - 18px)); grid-template-columns:1fr; } .needs-first-toast-figure{ margin:0 auto; } } /* v5.2.46 cache-safe loader handoff overrides */ .needs-first-toast.is-loader-handoff{ position:fixed !important; z-index:9999 !important; inset:0 !important; left:0 !important; right:0 !important; top:0 !important; max-width:none !important; margin:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; padding:18px !important; background:rgba(248,250,252,.86) !important; backdrop-filter:blur(3px) !important; box-shadow:none !important; border:0 !important; border-radius:0 !important; } .needs-first-toast.is-loader-handoff .needs-first-toast-card{ width:min(780px,calc(100vw - 28px)) !important; min-height:260px !important; display:grid !important; grid-template-columns:228px minmax(0,1fr) !important; gap:18px !important; align-items:center !important; padding:16px 54px 16px 16px !important; border:3px solid #111 !important; border-radius:20px !important; background:#fff !important; box-shadow:0 18px 48px rgba(15,23,42,.18) !important; } @media (max-width:760px){ .needs-first-toast.is-loader-handoff .needs-first-toast-card{ width:min(580px,calc(100vw - 22px)) !important; min-height:unset !important; grid-template-columns:156px minmax(0,1fr) !important; gap:12px !important; padding:12px 46px 12px 12px !important; border-radius:16px !important; } } @media (max-width:420px){ .needs-first-toast.is-loader-handoff .needs-first-toast-card{ width:min(360px,calc(100vw - 18px)) !important; grid-template-columns:1fr !important; } } /* ===== SOURCE: assets/css/search-usability-tuning.css ===== */ /* v4.5_search_usability_tuning Search UX layer: mobile scrollable result panel, compact product cards, local add feedback. Safe overlay: does not change nutrition data or calculation logic. */ :root{ --search-v45-blue:#0b61d6; --search-v45-blue-dark:#084a9f; --search-v45-soft:#eff6ff; --search-v45-border:#bfdbfe; --search-v45-text:#0f172a; --search-v45-muted:#334155; } .v45-search-panel-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 10px; border:1px solid var(--search-v45-border); border-radius:14px; background:var(--search-v45-soft); color:#123b64; font-size:13px; line-height:1.35; margin:8px 0 8px; } .v45-search-panel-head strong{color:var(--search-v45-blue-dark);} .v45-search-panel-head .v45-search-hint{color:var(--search-v45-muted);} .search-result-card.v45-just-added, .search-result-card.v45-card-added{ border-color:#86efac !important; background:#f0fdf4 !important; } .search-result-card [data-role="add-search"].v45-added, .search-result-card button.v45-added{ background:#166534 !important; border-color:#166534 !important; color:#fff !important; } .v45-scroll-note{ display:none; padding:8px 10px; color:#475569; font-size:12px; text-align:center; } @media (max-width:760px){ #globalSearchSection{ scroll-margin-top:8px; } #globalSearchSection .inline, #globalSearchSection .search-line{ gap:8px !important; } #globalResults, #globalResults.search-results-enhanced, .mobile-results-anchor #globalResults, .mobile-results-anchor #globalResults.search-results-enhanced.has-query{ max-height:min(62vh, 560px) !important; overflow-y:auto !important; overscroll-behavior:contain !important; -webkit-overflow-scrolling:touch !important; border:2px solid var(--search-v45-border) !important; border-radius:16px !important; background:#fff !important; padding:8px !important; box-shadow:0 14px 36px rgba(15,23,42,.14) !important; } #globalResults:empty, #globalResults:not(.has-query):empty{ max-height:none !important; overflow:visible !important; border:none !important; box-shadow:none !important; padding:0 !important; } #globalResults .v45-search-panel-head, .mobile-results-anchor #globalResults .v45-search-panel-head{ position:sticky; top:0; z-index:3; margin:0 0 8px; } #globalResults .search-result-card, .mobile-results-anchor #globalResults .search-result-card{ padding:10px !important; gap:7px !important; border-radius:14px !important; margin-bottom:8px !important; } #globalResults .search-result-title, .mobile-results-anchor #globalResults .search-result-title{ font-size:15px !important; line-height:1.28 !important; margin-bottom:2px !important; } #globalResults .search-result-meta, #globalResults .search-result-trust, .mobile-results-anchor #globalResults .search-result-meta, .mobile-results-anchor #globalResults .search-result-trust{ font-size:12px !important; line-height:1.3 !important; color:var(--search-v45-muted) !important; } #globalResults .search-result-trust, .mobile-results-anchor #globalResults .search-result-trust{ display:none !important; } #globalResults .search-result-nutrients, .mobile-results-anchor #globalResults .search-result-nutrients{ display:flex !important; gap:5px !important; flex-wrap:wrap !important; margin:4px 0 !important; } #globalResults .search-result-nutrients span, .mobile-results-anchor #globalResults .search-result-nutrients span{ padding:3px 6px !important; font-size:12px !important; border-radius:999px !important; background:#f8fafc !important; } #globalResults .search-result-actions, .mobile-results-anchor #globalResults .search-result-actions{ display:grid !important; grid-template-columns:88px 1fr !important; gap:8px !important; align-items:end !important; margin-top:6px !important; } #globalResults .search-result-actions label, .mobile-results-anchor #globalResults .search-result-actions label{ grid-column:1 / -1 !important; margin-bottom:-3px !important; font-size:12px !important; } #globalResults .search-result-actions input, .mobile-results-anchor #globalResults .search-result-actions input{ width:88px !important; min-height:42px !important; font-size:16px !important; } #globalResults .search-result-actions button, .mobile-results-anchor #globalResults .search-result-actions button{ min-height:42px !important; padding:9px 10px !important; white-space:nowrap !important; } #globalResults button.v45-show-more, .mobile-results-anchor #globalResults button.v45-show-more, #globalResults button[data-role="show-more"], .mobile-results-anchor #globalResults button[data-role="show-more"]{ display:none !important; } #globalResults .v45-scroll-note, .mobile-results-anchor #globalResults .v45-scroll-note{ display:block; } } @media (min-width:761px){ .v45-search-panel-head{ max-width:100%; } #globalResults button.v45-show-more, #globalResults button[data-role="show-more"]{ margin-top:10px; } } /* ===== SOURCE: assets/css/visual-cleanup.css ===== */ /* v4.5.1 visual cleanup: contrast, JSON load placement, remove bottom noise. */ :root{ --v451-text:#0f172a; --v451-muted:#334155; --v451-soft:#475569; --v451-border:#bfd7f5; } body{ color:var(--v451-text); } #needsCompact > .small, #needs-method-notice, #needs .small, #needs .note, #needs_out .small, #needs_out .note, .kpi .title, .kpi .tile .title, .total-card .title, .muted, .footer-note, .search-field-hint, .search-lead, .ration-subtitle, .catalog-mode-help, .additional-title span, .catalog-drawer-title span, #legal-note, #legal-note p, #legal-note small{ color:var(--v451-muted) !important; opacity:1 !important; } #needsCompact > .small, #needs-method-notice{ color:#1e293b !important; } #needs-method-notice{ background:#f8fbff !important; border-color:var(--v451-border) !important; } #needs .kpi .tile, #needs_out .kpi .tile{ border-color:#cfe2f8 !important; background:#fff !important; } #needs .kpi .value, #needs_out .kpi .value{ color:#020617 !important; } #needs label, #globalSearchSection label, #rationSection label{ color:#152238 !important; } #loadRationJsonBtn{ white-space:nowrap; } #rationSection .toolbar{ gap:8px; align-items:center; } #additionalToolsSection #presetsPanel{ opacity:.96; } #additionalToolsSection #loadPresetJsonBtn{ display:none !important; } #additionalToolsSection .preset-actions{ grid-template-columns:1fr 1fr !important; } #additionalToolsSection .preset-actions::before{ content:'Загрузка сохранённого JSON теперь находится выше — в блоке «Итоговый рацион».'; grid-column:1 / -1; color:var(--v451-muted); font-size:13px; line-height:1.45; } #globalActions{ margin-top:18px !important; } @media (max-width:760px){ #rationSection .toolbar{ display:grid !important; grid-template-columns:1fr; } #rationSection .toolbar button{ width:100%; } #needsCompact > .small, #needs-method-notice{ font-size:13px !important; line-height:1.5 !important; } .kpi{ grid-template-columns:1fr !important; } } /* ===== SOURCE: assets/css/readability-catalog-fix.css ===== */ /* v4.5.2 readability/catalog fix: final contrast pass and raw-category label readability. */ :root{ --v452-text:#0f172a; --v452-muted:#334155; --v452-heading:#0b4fc4; --v452-soft-bg:#eff6ff; --v452-border:#b9d2ef; } body{ color:var(--v452-text); } #heiFpedApproxNotice, #needsWeightMethodNotice, #needsCompact > .small, #needs-method-notice, #needs .small, #needs .note, #needs_out .small, #needs_out .note, #heiPanel .note, #heiPanel .muted, #heiPanel p.muted, #heiPanel .small, .total-card .title, .kpi .title, .kpi .tile .title, .search-lead, .search-field-hint, .ration-subtitle, .catalog-mode-help, .additional-title span, .catalog-drawer-title span, .footer-note{ color:var(--v452-muted) !important; opacity:1 !important; } #heiFpedApproxNotice, #needsWeightMethodNotice{ margin:0 0 10px 0 !important; padding:10px 12px !important; border:1px solid var(--v452-border) !important; border-radius:12px !important; background:#f8fbff !important; line-height:1.45 !important; } #heiPanel h2, #totalsSection h2, #rationSection h2, #globalSearchSection h2, #needs h1{ color:#0055d6 !important; } /* The old base style forced white text on a very pale accordion background; keep the pale background but restore readable text. */ #categories .accordion-head, .accordion-head{ color:#123b64 !important; background:#e9f2ff !important; border:1px solid var(--v452-border) !important; border-radius:12px !important; min-height:48px; display:flex; align-items:center; justify-content:space-between; gap:10px; } #categories .accordion-item{ border:0 !important; background:transparent !important; } #categories .accordion-body{ border:1px solid var(--v452-border) !important; border-top:0 !important; border-radius:0 0 12px 12px !important; } #categories .cat-count{ display:inline-flex; align-items:center; justify-content:center; min-width:32px; padding:2px 8px; border:1px solid var(--v452-border); border-radius:999px; background:#fff; color:#084a9f !important; font-weight:800; } .pill,.chip,.badge{ color:#123b64 !important; background:#e9f2ff !important; border-color:var(--v452-border) !important; } @media (max-width:760px){ #heiFpedApproxNotice, #needsWeightMethodNotice{ font-size:13px !important; } #categories .accordion-head{ padding:12px 14px !important; } } /* ===== SOURCE: assets/css/serving-units.css ===== */ /* v4.6 serving units: advisory piece/portion weights for selected products only. */ .serving-unit-hint{ display:flex; align-items:flex-start; gap:6px; width:fit-content; max-width:100%; margin-top:8px; padding:6px 9px; border:1px solid #b9d2ef; border-radius:10px; background:#f8fbff; color:#17324d; font-size:12.5px; line-height:1.35; font-weight:600; } .serving-unit-hint strong{ color:#084a9f; font-weight:800; white-space:nowrap; } .serving-unit-hint .serving-unit-note{ color:#334155; font-weight:500; } .serving-unit-hint[data-priority="P2"]{ border-color:#d8c690; background:#fffdf4; } .serving-unit-hint[data-priority="P2"] strong{ color:#854d0e; } .catalog-serving-hint{ margin-top:8px; max-width:680px; } @media (max-width:760px){ .search-result-card .serving-unit-hint{ font-size:12px; line-height:1.32; margin-top:6px; padding:6px 8px; } .search-result-card .serving-unit-hint strong{ white-space:normal; } } /* v4.6.6: show piece/portion weight hints inside Итоговый рацион rows as well. */ .ration-title-stack{ display:flex; flex-direction:column; align-items:flex-start; min-width:0; gap:3px; } .ration-title-stack .ration-title{ display:block; } .ration-serving-hint{ margin-top:2px; padding:4px 7px; font-size:11.5px; line-height:1.28; font-weight:600; max-width:360px; } .ration-serving-hint strong{ font-size:11.5px; } @media (max-width:760px){ .ration-title-stack{ max-width:100%; } .ration-serving-hint{ font-size:11px; line-height:1.25; max-width:220px; padding:4px 6px; } .ration-serving-hint strong{ font-size:11px; white-space:normal; } } /* ===== SOURCE: assets/css/meal-planner.css ===== */ /* nutrition calculator v4.6.3_meal_planner_intelligence */ #mealsSection.meal-planner-drawer { border-color: rgba(59,130,246,.20); background: #ffffff; } #mealsSection .meal-planner-title { display: grid; gap: 4px; } #mealsSection .meal-planner-title span, #mealsSection .meal-planner-intro, #mealsSection .meal-muted, #mealsSection .meal-footnote, #mealsSection .meal-target-line, #mealsSection .meal-item-meta, #mealsSection .meal-item-note { color: #475569; } #mealsSection .meal-planner-title span, #mealsSection .meal-planner-intro, #mealsSection .meal-footnote { font-size: 13px; line-height: 1.5; } #mealsSection .meal-planner-intro { margin: 10px 0 12px 0; padding: 10px 12px; border-radius: 12px; background: #f8fafc; border: 1px solid #e2e8f0; } #mealsSection .meal-planner-controls { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; } #mealsSection .meal-planner-controls select, #mealsSection .meal-move-controls select, #mealsSection .meal-split-controls select, #mealsSection .meal-split-controls input { min-height: 34px; border: 1px solid #cbd5e1; border-radius: 10px; padding: 0 10px; background: #fff; color: #0f172a; } #mealsSection .meal-auto-label { display: inline-flex; align-items: center; gap: 6px; margin-left: 4px; font-size: 13px; } #mealsSection .meal-stale-badge { align-items: center; padding: 4px 8px; border-radius: 999px; background: #fff7ed; color: #9a3412; border: 1px solid #fed7aa; font-size: 12px; } #mealsSection .meal-empty-state { padding: 14px; border-radius: 12px; background: #f8fafc; border: 1px dashed #cbd5e1; color: #334155; font-size: 14px; } #mealsSection .meal-stale-box { margin-bottom: 12px; padding: 12px; border-radius: 12px; border: 1px solid #fed7aa; background: #fff7ed; color: #7c2d12; } #mealsSection .meal-stale-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; } #mealsSection .meal-day-summary { margin: 12px 0; padding: 12px; border-radius: 14px; background: #f8fafc; border: 1px solid #e2e8f0; } #mealsSection .meal-day-summary-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; } #mealsSection .meal-day-summary-head span { color: #475569; font-size: 13px; } #mealsSection .meal-day-summary ul, #mealsSection .meal-warnings, #mealsSection .meal-info { margin: 6px 0 0 18px; padding: 0; line-height: 1.45; } #mealsSection .meal-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } #mealsSection .meal-slot { margin-top: 0; border: 1px solid #e2e8f0; box-shadow: none; } #mealsSection .meal-slot--ok { border-color: rgba(22,163,74,.28); } #mealsSection .meal-slot--warn { border-color: rgba(245,158,11,.40); } #mealsSection .meal-slot--bad { border-color: rgba(239,68,68,.35); } #mealsSection .meal-slot-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 8px; } #mealsSection .meal-slot-head h3 { margin: 0 0 4px 0; } #mealsSection .meal-slot-kpi { display: grid; justify-items: end; gap: 6px; min-width: 170px; font-size: 13px; } #mealsSection .meal-status { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; } #mealsSection .meal-status--ok { background: #ecfdf5; color: #166534; } #mealsSection .meal-status--warn { background: #fffbeb; color: #92400e; } #mealsSection .meal-status--bad { background: #fef2f2; color: #991b1b; } #mealsSection .meal-warnings li { color: #991b1b; } #mealsSection .meal-info li { color: #475569; } #mealsSection .meal-items-list { display: grid; gap: 8px; margin-top: 10px; } #mealsSection .meal-planner-item { display: grid; gap: 6px; padding: 9px 10px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; } #mealsSection .meal-item-main { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; } #mealsSection .meal-item-name { font-weight: 600; color: #0f172a; } #mealsSection .meal-item-meta, #mealsSection .meal-item-note { font-size: 12px; line-height: 1.45; } #mealsSection .meal-move-controls { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; justify-content: flex-end; } #mealsSection .meal-action-btn { white-space: nowrap; } #mealsSection .meal-split-box summary { cursor: pointer; color: #1d4ed8; font-size: 12px; width: fit-content; } #mealsSection .meal-split-controls { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; } #mealsSection .meal-split-grams { width: 90px; } #mealsSection .meal-unassigned { margin-top: 12px; border: 1px dashed #cbd5e1; background: #fbfdff; } #mealsSection .meal-empty { color: #64748b; font-size: 13px; padding: 8px 0; } #mealsSection .meal-footnote { margin: 12px 0 0 0; } @media (max-width: 860px){ #mealsSection .meal-grid { grid-template-columns: 1fr; } #mealsSection .meal-slot-head, #mealsSection .meal-item-main { display: grid; } #mealsSection .meal-slot-kpi { justify-items: start; min-width: 0; } #mealsSection .meal-move-controls { justify-content: start; } #mealsSection .meal-planner-controls select { width: 100%; } } @media (max-width: 540px){ #mealsSection .meal-planner-controls > button, #mealsSection .meal-move-controls select, #mealsSection .meal-move-controls button, #mealsSection .meal-split-controls select, #mealsSection .meal-split-controls button { width: 100%; } #mealsSection .meal-auto-label { align-items: flex-start; } } /* v4.6.3 meal planner intelligence */ #mealsSection .meal-suggestions { margin: 12px 0; padding: 12px; border-radius: 14px; background: #f0f9ff; border: 1px solid #bae6fd; color: #0f172a; } #mealsSection .meal-suggestions ul { margin: 6px 0 0 18px; padding: 0; line-height: 1.45; } #mealsSection .meal-role-badge { display: inline-flex; align-items: center; padding: 2px 6px; border-radius: 999px; background: #f1f5f9; border: 1px solid #e2e8f0; color: #334155; font-size: 11px; line-height: 1.2; margin-left: 2px; } #mealsSection .meal-why { font-size: 12px; line-height: 1.45; color: #475569; } #mealsSection .meal-why summary { cursor: pointer; color: #1d4ed8; width: fit-content; } #mealsSection .meal-why div { margin-top: 4px; } /* ===== SOURCE: assets/css/mobile-ration-cards.css ===== */ /* nutrition calculator v4.6.7_stability_mobile_packaging Mobile-only ration card presentation. Data and calculations are unchanged. */ @media (max-width: 760px){ #rationSection{ padding:14px; } #rationSection .ration-head-enhanced{ gap:10px; } #rationSection .ration-subtitle{ font-size:13px; line-height:1.4; } #rationSection .ration-kpi-strip{ width:100%; font-size:12px; line-height:1.35; } #rationSection .ration-table{ display:block; width:100%; border-collapse:separate; } #rationSection .ration-table thead{ display:none !important; } #rationSection .ration-table tbody{ display:block; width:100%; } #rationSection .ration-table tr.ration-row{ display:grid !important; grid-template-columns:1fr auto; grid-template-areas: "name name" "groups groups" "grams action"; gap:8px 10px; width:100%; margin:10px 0; padding:12px; border:1px solid #cbdff3; border-radius:16px; background:#ffffff; box-shadow:0 6px 18px rgba(15,23,42,.06); } #rationSection .ration-table tr.ration-row td{ display:block !important; width:100%; border:0; padding:0; min-width:0; } #rationSection .ration-table tr.ration-row td:nth-child(1){ grid-area:name; } #rationSection .ration-table tr.ration-row td:nth-child(2){ grid-area:groups; } #rationSection .ration-table tr.ration-row td:nth-child(3){ grid-area:grams; align-self:end; } #rationSection .ration-table tr.ration-row td:nth-child(4){ grid-area:action; align-self:end; width:auto; } #rationSection .ration-name{ display:flex; align-items:flex-start; gap:8px; cursor:pointer; } #rationSection .ration-name .expander{ flex:0 0 auto; margin-top:2px; font-size:15px; } #rationSection .ration-title-stack{ gap:5px; width:100%; min-width:0; } #rationSection .ration-title-stack .ration-title{ font-size:15px; line-height:1.28; overflow-wrap:anywhere; } #rationSection .ration-serving-hint{ width:100%; max-width:100%; margin-top:2px; padding:6px 8px; font-size:11.5px; line-height:1.3; } #rationSection .ration-serving-hint strong{ white-space:normal; } #rationSection .mobile-ration-summary{ display:block; width:100%; margin-top:2px; color:#334155; font-size:12px; line-height:1.35; font-weight:600; } #rationSection .ration-table td:nth-child(2)::before{ content:'Категория: '; display:inline; margin-right:4px; color:#486581; font-weight:700; font-size:12px; } #rationSection .ration-table td:nth-child(2) .meta{ display:inline-flex; flex-wrap:wrap; gap:5px; vertical-align:middle; } #rationSection .ration-table td:nth-child(2) .pill{ margin:0; padding:3px 8px; font-size:11px; line-height:1.25; max-width:100%; white-space:normal; overflow-wrap:anywhere; } #rationSection .ration-table td:nth-child(2) .pill:first-child:not(:last-child){ display:none; } #rationSection .ration-table td:nth-child(3){ display:flex !important; align-items:center; gap:8px; } #rationSection .ration-table td:nth-child(3)::before{ content:'Граммы:'; color:#486581; font-weight:700; font-size:12px; flex:0 0 auto; } #rationSection .ration-table td:nth-child(3) input[type="number"]{ width:112px; min-width:112px; min-height:44px; padding:0 10px; font-size:16px; text-align:right; } #rationSection .ration-table td:nth-child(4) button{ width:auto; min-width:86px; min-height:44px; padding:0 12px; border-radius:12px; font-size:13px; } #rationSection .ration-table tr.ration-details{ display:block !important; margin:-4px 0 10px; padding:0; border:0; background:transparent; } #rationSection .ration-table tr.ration-details[style*="none"]{ display:none !important; } #rationSection .ration-table tr.ration-details td{ display:block !important; padding:10px 12px; border:1px solid #dbeafe; border-radius:14px; background:#f8fbff; } #rationSection .mini-grid{ grid-template-columns:minmax(0,1fr) auto; gap:5px 8px; } #rationSection .mini-left, #rationSection .mini-right{ font-size:12px; } #rationSection .toolbar{ grid-template-columns:1fr; } #rationSection .toolbar button{ min-height:42px; } } @media (min-width: 761px){ #rationSection .mobile-ration-summary{ display:none !important; } } /* ===== SOURCE: assets/css/unit-quick-input.css ===== */ /* nutrition calculator v4.6.9_p0_p1_hardening Quick gram input from structured serving_units. Calculations remain gram-based. */ .unit-quick-input{ margin-top:7px; padding:7px 8px; border:1px solid #dbeafe; border-radius:12px; background:#f8fbff; display:flex; flex-wrap:wrap; align-items:center; gap:6px 7px; font-size:12px; line-height:1.25; } .unit-quick-input-label{ color:#486581; font-weight:700; margin-right:1px; } .unit-quick-input-actions{ display:flex; flex-wrap:wrap; gap:5px; align-items:center; } .unit-quick-input-btn, .unit-quick-input-variant{ border:1px solid #b8d3ef; background:#ffffff; color:#0f3f73; border-radius:999px; min-height:30px; padding:5px 9px; font:inherit; font-weight:700; cursor:pointer; box-shadow:0 1px 0 rgba(15,23,42,.03); } .unit-quick-input-btn:hover, .unit-quick-input-variant:hover{ background:#eef6ff; border-color:#86b7e6; } .unit-quick-input-btn:focus-visible, .unit-quick-input-variant:focus-visible{ outline:2px solid #0b61d6; outline-offset:2px; } .unit-quick-input-btn.is-applied{ background:#dcfce7; border-color:#86efac; color:#14532d; } .unit-quick-input-variant.is-selected{ background:#e0f2fe; border-color:#7dd3fc; color:#075985; } .unit-quick-input-btn--approx::after{ content:'≈'; display:inline-block; margin-left:3px; color:#64748b; font-weight:700; } .unit-quick-input-note{ color:#64748b; font-size:11.5px; flex-basis:100%; line-height:1.3; } .search-result-card > .unit-quick-input, .search-result-card .search-serving-hint + .unit-quick-input, .search-result-card .serving-unit-hint + .unit-quick-input{ margin:8px 0 0; } .search-result-actions .unit-quick-input{ width:100%; justify-content:flex-start; } .accordion-body .unit-quick-input, .unit-quick-catalog-host .unit-quick-input{ margin-top:8px; } .ration-title-stack .unit-quick-input{ max-width:360px; margin-top:4px; } #rationSection .ration-table td:nth-child(3) .unit-quick-input{ max-width:260px; } @media (max-width:760px){ .unit-quick-input{ width:100%; padding:7px; gap:6px; font-size:12px; } .unit-quick-input-btn, .unit-quick-input-variant{ min-height:36px; padding:7px 10px; font-size:12px; } .ration-title-stack .unit-quick-input, #rationSection .ration-table td:nth-child(3) .unit-quick-input{ max-width:100%; width:100%; flex-basis:100%; margin-top:4px; } #rationSection .ration-table td:nth-child(3){ flex-wrap:wrap; } } /* ===== SOURCE: assets/css/harvard-plate-v5-final.css ===== */ /* Harvard Plate v5.2.23 — final polish, QA hardening, mobile and accessibility */ .harvard-plate-card{overflow:hidden;scroll-margin-top:14px} .harvard-plate-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:14px} .harvard-plate-title{margin:0 0 4px 0} .harvard-plate-subtitle{margin:0;color:#486581;font-size:14px;line-height:1.5;max-width:920px} .harvard-plate-badge{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:999px;background:#fff;color:#355e7b;padding:5px 10px;font-size:12px;font-weight:700} .harvard-plate-layout{display:grid;grid-template-columns:minmax(330px,1.04fr) minmax(340px,.96fr);gap:16px;align-items:start} .harvard-plate-visual-wrap,.harvard-plate-status{border:1px solid var(--border);border-radius:20px;background:linear-gradient(180deg,#fff,#f9fbff);padding:14px;min-width:0} .harvard-plate-visual{position:relative;min-height:390px;border-radius:18px;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.99) 0%,rgba(248,252,255,.96) 63%,rgba(236,244,255,.92) 100%);box-shadow:inset 0 0 0 1px rgba(217,231,245,.65)} .harvard-plate-visual svg{display:block;width:100%;height:auto;aspect-ratio:4/3} .harvard-plate-svg-shell{position:relative;max-width:760px;margin:0 auto} .harvard-plate-stage-empty{display:grid;place-items:center;gap:8px;min-height:340px;padding:22px;color:#486581;text-align:center;line-height:1.5} .harvard-plate-stage-empty strong{display:block;color:#123b64;font-size:16px} .hp-sector-click{cursor:pointer;outline:none} .hp-sector-click:hover{fill:rgba(37,99,235,.045)} .hp-sector-click:focus{fill:rgba(37,99,235,.075)} .hp-active-outline{pointer-events:none;filter:drop-shadow(0 2px 4px rgba(15,23,42,.12))} .hp-overfill-arc{pointer-events:none;filter:drop-shadow(0 2px 4px rgba(217,119,6,.14))} .harvard-plate-caption{margin:10px 0 0 0;font-size:12px;line-height:1.5;color:#64748b} .harvard-plate-companions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px} .harvard-plate-companion{border:1px solid #e2eefb;border-radius:16px;background:#fff;overflow:hidden;display:grid;grid-template-rows:auto 1fr;min-width:0} .harvard-plate-companion-visual{aspect-ratio:1/1;background:linear-gradient(180deg,#fbfdff,#f4f9ff);display:grid;place-items:center;position:relative;min-height:86px} .harvard-plate-companion-visual img{max-width:74%;max-height:74%;object-fit:contain;display:block} .harvard-plate-companion-visual[data-kind="water"] img{max-width:68%;max-height:68%} .harvard-plate-companion-visual[data-kind="dairy"] img:first-child{display:none} .harvard-plate-companion-visual .hp-companion-state{position:absolute;right:8px;top:8px;width:26px;height:26px;display:block} .harvard-plate-companion-body{padding:9px 10px 10px} .harvard-plate-companion-body strong{display:block;font-size:12px;color:#123b64;line-height:1.15;margin-bottom:3px} .harvard-plate-companion-body .hp-companion-value{font-size:12px;font-weight:800;color:#0f3d6b;margin-bottom:2px} .harvard-plate-companion-body .hp-companion-note{font-size:11px;color:#64748b;line-height:1.32} .harvard-plate-score{display:grid;grid-template-columns:auto 1fr;gap:10px 12px;align-items:center;margin-bottom:12px} .harvard-plate-score-ring{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--primary) calc(var(--plate-score,0)*1%),#e8f2fb 0);box-shadow:inset 0 0 0 8px #fff,0 0 0 1px var(--border);font-weight:800;color:#123b64} .harvard-plate-score-text strong{display:block;font-size:16px;margin-bottom:3px} .harvard-plate-score-text span{display:block;font-size:13px;color:#486581;line-height:1.4} .harvard-plate-metrics{display:grid;gap:12px} .hp-active-panel{border:1px solid #dbeafe;border-radius:18px;background:linear-gradient(180deg,#fff,#fbfdff);padding:13px 14px;box-shadow:0 10px 26px rgba(15,23,42,.04)} .hp-active-panel[data-state="over"],.hp-active-panel[data-state="strong-over"]{border-color:#f6d8a8;background:linear-gradient(180deg,#fff,#fffaf1)} .hp-active-panel[data-state="target"]{border-color:#bbf7d0;background:linear-gradient(180deg,#fff,#f7fff9)} .hp-empty-panel{background:#f8fbff;color:#486581} .hp-active-kicker{font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b;margin-bottom:5px} .hp-active-panel h3{margin:0 0 9px 0;display:flex;align-items:center;gap:8px;color:#123b64;font-size:18px;line-height:1.2} .hp-dot{width:12px;height:12px;border-radius:50%;display:inline-block;background:var(--hp-dot);box-shadow:0 0 0 4px rgba(37,99,235,.06)} .hp-active-numbers{display:grid;grid-template-columns:1fr;gap:2px;margin-bottom:8px;color:#486581;font-size:13px;line-height:1.35} .hp-active-numbers strong{font-size:22px;line-height:1.1;color:#123b64} .hp-active-bar{height:13px;background:#e9f2fb;border-radius:999px;overflow:hidden;margin:8px 0 7px} .hp-active-bar span{display:block;height:100%;width:min(calc(var(--hp-progress,0)*100%),100%);border-radius:inherit;background:var(--primary);transition:width .22s ease} .hp-active-panel[data-state="target"] .hp-active-bar span{background:#22c55e} .hp-active-panel[data-state="over"] .hp-active-bar span,.hp-active-panel[data-state="strong-over"] .hp-active-bar span{background:#f59e0b} .hp-active-note{font-size:13px;line-height:1.45;color:#486581;margin:0 0 10px} .hp-active-list{border-top:1px solid #e2eefb;padding-top:10px} .hp-active-list>strong{display:block;color:#123b64;font-size:13px;margin-bottom:7px} .hp-items-list{list-style:none;margin:0;padding:0;display:grid;gap:5px} .hp-items-list li{display:flex;justify-content:space-between;gap:10px;align-items:baseline;font-size:12px;color:#486581;border-bottom:1px dashed #e2eefb;padding-bottom:5px} .hp-items-list li:last-child{border-bottom:none;padding-bottom:0} .hp-items-list strong{color:#123b64;white-space:nowrap} .hp-mini-empty{margin:0;color:#64748b;font-size:12px;line-height:1.4} .hp-sector-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px} .hp-sector-card{appearance:none;border:1px solid #e2eefb;background:#fff;border-radius:16px;padding:10px 11px;text-align:left;cursor:pointer;display:grid;gap:5px;min-width:0;color:#123b64;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease} .hp-sector-card:hover{border-color:#bfdbfe;box-shadow:0 8px 20px rgba(15,23,42,.07);transform:translateY(-1px)} .hp-sector-card.is-active{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.11)} .hp-sector-card[data-tone="over"]{background:#fffdf8;border-color:#f6d8a8} .hp-sector-card[data-tone="ok"]{background:#f7fff9;border-color:#bbf7d0} .hp-sector-card-head{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:13px;font-weight:800} .hp-sector-card-head span{display:flex;align-items:center;gap:7px;min-width:0} .hp-sector-card-head i{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--hp-dot);flex:0 0 auto} .hp-sector-card-head b{white-space:nowrap} .hp-sector-card-meta,.hp-sector-card-status{font-size:11px;color:#64748b;line-height:1.25} .hp-sector-card-status{font-weight:800;color:#355e7b} .harvard-plate-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px} .harvard-plate-actions button{font-size:13px;padding:8px 10px;border-radius:10px} .harvard-plate-actions .ghost{opacity:.78} .harvard-plate-empty{border:1px dashed #b9d7f4;border-radius:16px;background:#f8fbff;color:#486581;padding:11px 12px;font-size:13px;line-height:1.5} @media(max-width:1120px){.harvard-plate-layout{grid-template-columns:1fr}.harvard-plate-visual{min-height:330px}.harvard-plate-companions{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:640px){.harvard-plate-visual-wrap,.harvard-plate-status{padding:10px;border-radius:16px}.harvard-plate-visual{min-height:250px;border-radius:14px}.harvard-plate-score{grid-template-columns:1fr}.harvard-plate-score-ring{width:66px;height:66px}.harvard-plate-head{display:grid;grid-template-columns:1fr;gap:8px}.harvard-plate-subtitle{font-size:13px}.hp-sector-cards{grid-template-columns:1fr}.harvard-plate-companions{grid-template-columns:1fr 1fr;gap:8px}.harvard-plate-actions{display:grid;grid-template-columns:1fr}.harvard-plate-actions button{width:100%;min-height:42px}.hp-active-panel h3{font-size:16px}.hp-active-numbers strong{font-size:19px}.harvard-plate-caption{font-size:11.5px}} /* v5.2.23 semantic explainability and final polish additions */ .hp-active-list-separate{margin-top:10px;background:#fffdf8;border:1px solid #f6d8a8;border-radius:14px;padding:9px 10px} .hp-items-list-reason li span{display:grid;gap:2px;min-width:0} .hp-items-list-reason small{font-size:11px;color:#64748b;line-height:1.25;font-weight:500} .harvard-plate-explain{margin-top:14px;border:1px solid #dbeafe;border-radius:18px;background:#fbfdff;padding:0;overflow:hidden} .harvard-plate-explain summary{list-style:none;cursor:pointer;padding:13px 15px;display:flex;justify-content:space-between;gap:12px;align-items:flex-start;background:linear-gradient(180deg,#fff,#f8fbff)} .harvard-plate-explain summary::-webkit-details-marker{display:none} .harvard-plate-explain summary strong{display:block;color:#123b64;font-size:14px;line-height:1.2} .harvard-plate-explain summary span{display:block;color:#64748b;font-size:12px;line-height:1.35;text-align:right;max-width:460px} .harvard-plate-explain-body{padding:12px 14px 14px;border-top:1px solid #e2eefb} .hp-explain-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .hp-explain-group{border:1px solid #e2eefb;border-radius:14px;background:#fff;padding:10px 11px;min-width:0} .hp-explain-group h4{margin:0 0 8px 0;color:#123b64;font-size:13px;line-height:1.2} @media(max-width:760px){.hp-explain-grid{grid-template-columns:1fr}.harvard-plate-explain summary{display:grid;grid-template-columns:1fr}.harvard-plate-explain summary span{text-align:left;max-width:none}} /* v5.2.23 final polish */ .harvard-plate-card{contain:layout paint;} .harvard-plate-visual{isolation:isolate;} .harvard-plate-svg-shell svg{max-height:620px;} .harvard-plate-svg-shell image.hp-food-image{filter:saturate(.92) contrast(.98);} .hp-sector-click:focus-visible{fill:rgba(37,99,235,.10);outline:none;} .hp-sector-card:focus-visible,.harvard-plate-actions button:focus-visible,.harvard-plate-diagnostics summary:focus-visible,.harvard-plate-explain summary:focus-visible{outline:3px solid rgba(37,99,235,.35);outline-offset:3px;} .hp-active-outline{stroke-width:7;opacity:.42;} .hp-overfill-arc{stroke-width:11;opacity:.42;} .harvard-plate-diagnostics{margin-top:10px;border:1px dashed #c9ddf3;border-radius:14px;background:#fbfdff;overflow:hidden;} .harvard-plate-diagnostics summary{cursor:pointer;padding:9px 11px;color:#486581;font-size:12px;font-weight:800;list-style:none;} .harvard-plate-diagnostics summary::-webkit-details-marker{display:none;} .harvard-plate-diagnostics-body{border-top:1px solid #e2eefb;padding:10px 11px;display:grid;gap:8px;} .harvard-plate-diagnostics-body p{margin:0;color:#64748b;font-size:12px;line-height:1.4;} .harvard-plate-diagnostics-body button{justify-self:start;} .hp-active-panel{scroll-margin-top:14px;} .hp-active-panel[data-state="very-low"],.hp-active-panel[data-state="low"],.hp-active-panel[data-state="below-target"]{border-color:#bfdbfe;background:linear-gradient(180deg,#fff,#f8fbff);} .hp-sector-card[data-tone="low"]{background:#f8fbff;border-color:#bfdbfe;} .hp-sector-card[data-tone="empty"]{background:#f8fafc;color:#64748b;} .hp-sector-card-status{letter-spacing:.005em;} .hp-items-list li span{min-width:0;overflow-wrap:anywhere;} .harvard-plate-companion{box-shadow:0 6px 18px rgba(15,23,42,.035);} .harvard-plate-companion-visual{min-height:78px;} .harvard-plate-companion-visual img{opacity:.92;} .harvard-plate-companion-visual .hp-companion-state{opacity:1;} .harvard-plate-explain summary:hover,.harvard-plate-diagnostics summary:hover{background:#f8fbff;} @media(max-width:1120px){.harvard-plate-layout{gap:14px}.harvard-plate-svg-shell{max-width:680px}.harvard-plate-visual{min-height:320px}} @media(max-width:760px){.harvard-plate-companions{grid-template-columns:1fr 1fr}.hp-sector-cards{grid-template-columns:1fr 1fr}.hp-active-panel{padding:12px}.harvard-plate-score-text strong{font-size:15px}.harvard-plate-score-text span{font-size:12.5px}} @media(max-width:520px){.harvard-plate-visual{min-height:220px}.harvard-plate-svg-shell svg{max-height:300px}.harvard-plate-companions{grid-template-columns:1fr}.hp-sector-cards{grid-template-columns:1fr}.harvard-plate-companion{grid-template-columns:76px 1fr;grid-template-rows:1fr}.harvard-plate-companion-visual{aspect-ratio:auto;min-height:76px}.harvard-plate-companion-body{padding:9px}.hp-active-numbers strong{font-size:18px}.hp-active-note{font-size:12.5px}.hp-items-list li{font-size:11.5px}.harvard-plate-explain summary{padding:11px 12px}.harvard-plate-explain-body{padding:10px}} @media(max-width:380px){.harvard-plate-visual{min-height:200px}.harvard-plate-visual-wrap,.harvard-plate-status{padding:8px}.harvard-plate-title{font-size:20px}.harvard-plate-subtitle{font-size:12.5px}.harvard-plate-caption{font-size:11px}.harvard-plate-score-ring{width:60px;height:60px;font-size:13px}.hp-sector-card{padding:9px}.hp-active-panel h3{font-size:15px}} @media(prefers-reduced-motion:reduce){.hp-sector-card,.hp-active-bar span,.harvard-plate-score-ring{transition:none!important}.hp-sector-card:hover{transform:none}} @media print{.harvard-plate-diagnostics,.harvard-plate-actions{display:none!important}.harvard-plate-layout{grid-template-columns:1fr}.harvard-plate-visual-wrap,.harvard-plate-status,.harvard-plate-explain{break-inside:avoid}} /* v5.2.23 final QA hardening */ .harvard-plate-auto-note{align-self:center;display:inline-flex;align-items:center;gap:6px;color:#486581;background:#f8fbff;border:1px solid #dbeafe;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:800;line-height:1} .harvard-plate-auto-note::before{content:"";width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.11)} .hp-plate-summary-line{border:1px solid #e2eefb;border-radius:16px;background:#fbfdff;padding:10px 12px;color:#486581;line-height:1.4;display:grid;gap:3px} .hp-plate-summary-line strong{color:#123b64;font-size:13px} .hp-plate-summary-line span{font-size:12px} .hp-quality-card{border:1px solid #e2eefb;border-radius:16px;background:#fff;padding:11px 12px;color:#486581;display:grid;gap:7px} .hp-quality-card>strong{display:block;color:#123b64;font-size:13px} .hp-quality-card p{margin:0;font-size:12px;line-height:1.4;color:#64748b} .hp-quality-card ul{list-style:none;margin:0;padding:0;display:grid;gap:6px} .hp-quality-card li{position:relative;padding-left:16px;font-size:12px;line-height:1.35;color:#486581} .hp-quality-card li::before{content:"";position:absolute;left:0;top:.45em;width:7px;height:7px;border-radius:50%;background:#60a5fa} .hp-quality-card li[data-severity="warn"]::before{background:#f59e0b} .hp-quality-card[data-empty="true"]{background:#f8fbff} .harvard-plate-svg-shell svg{shape-rendering:geometricPrecision} .hp-sector-click{touch-action:manipulation} @media(max-width:640px){.harvard-plate-auto-note{justify-content:center}.hp-quality-card,.hp-plate-summary-line{padding:10px}.hp-quality-card li{font-size:11.8px}} @media(prefers-contrast:more){.hp-sector-card.is-active{outline:3px solid #1d4ed8}.hp-active-outline{opacity:.72}.hp-overfill-arc{opacity:.68}.harvard-plate-auto-note{border-color:#1d4ed8}} /* v5.2.6 asset-safe visual fallback: sectors stay visible even when PNG files fail to load */ .harvard-plate-svg-shell svg[data-hp-image-safe="true"] .hp-plate-base-fallback{filter:drop-shadow(0 14px 30px rgba(15,23,42,.10));} .harvard-plate-svg-shell svg[data-hp-image-safe="true"] .hp-sector-fill-fallback{mix-blend-mode:multiply;} .harvard-plate-svg-shell svg[data-hp-image-safe="true"] .hp-sector-ghost-fallback{mix-blend-mode:multiply;} .harvard-plate-svg-shell svg[data-hp-image-safe="true"] .hp-food-image{filter:saturate(.9) contrast(.98);} .harvard-plate-svg-shell svg[data-hp-image-safe="true"] .hp-food-ghost-image{filter:saturate(.75) contrast(.95);} @media(prefers-contrast:more){.harvard-plate-svg-shell svg[data-hp-image-safe="true"] .hp-sector-fill-fallback{opacity:.48}.harvard-plate-svg-shell svg[data-hp-image-safe="true"] .hp-sector-ghost-fallback{opacity:.16}} /* v5.2.23 fast clear plate: diagram-first view for readability and responsiveness */ .harvard-plate-svg-shell svg[data-hp-fast-clear="true"] .hp-plate-base-fallback{filter:drop-shadow(0 12px 24px rgba(15,23,42,.10));} .harvard-plate-svg-shell svg[data-hp-fast-clear="true"] .hp-sector-fill-fallback{mix-blend-mode:multiply;transition:opacity .14s ease;} .harvard-plate-svg-shell svg[data-hp-fast-clear="true"] .hp-sector-ghost-fallback{mix-blend-mode:multiply;} .harvard-plate-svg-shell svg[data-hp-fast-clear="true"] .hp-sector-separators{pointer-events:none;} .harvard-plate-svg-shell svg[data-hp-fast-clear="true"] .hp-sector-low-cue{pointer-events:none;} .harvard-plate-svg-shell svg[data-hp-fast-clear="true"] .hp-active-outline{stroke-width:10;opacity:.62;} .harvard-plate-svg-shell svg[data-hp-fast-clear="true"] .hp-overfill-arc{stroke-width:15;opacity:.58;} @media(prefers-reduced-motion:reduce){.harvard-plate-svg-shell svg[data-hp-fast-clear="true"] .hp-sector-fill-fallback{transition:none!important}} .harvard-plate-companion-visual.hp-companion-inline img{display:none!important} .hp-companion-inline-icon{width:58%;height:58%;display:block;filter:drop-shadow(0 5px 10px rgba(15,23,42,.08))} .hp-companion-state-dot{position:absolute;right:9px;top:9px;width:14px;height:14px;border-radius:50%;background:#60a5fa;box-shadow:0 0 0 4px rgba(96,165,250,.14)} .harvard-plate-companion-visual[data-kind="healthyFats"] .hp-companion-state-dot{background:#f59e0b;box-shadow:0 0 0 4px rgba(245,158,11,.14)} .harvard-plate-companion-visual[data-kind="dairy"] .hp-companion-state-dot{background:#64748b;box-shadow:0 0 0 4px rgba(100,116,139,.14)} /* v5.2.23 Harvard Plate diagram remaster: fixed target sectors + live fill */ .hp-diagram-remaster-shell{max-width:820px;margin:0 auto;padding:4px 0} .harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"]{display:block;width:100%;height:auto;filter:drop-shadow(0 12px 28px rgba(15,23,42,.08))} .harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-target{transition:opacity .14s ease} .harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-fill{transition:opacity .14s ease,filter .14s ease;filter:saturate(1.02)} .harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-low-cue{pointer-events:none} .harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-over-arc{pointer-events:none;filter:drop-shadow(0 2px 5px rgba(217,119,6,.16))} .harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-active-outline{pointer-events:none;filter:drop-shadow(0 4px 10px rgba(15,23,42,.12))} .harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-click{cursor:pointer;outline:none;touch-action:manipulation} .harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-click:hover{fill:rgba(37,99,235,.045)} .harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-click:focus-visible{fill:rgba(37,99,235,.085);stroke:#2563eb;stroke-width:3} .hp-diagram-label-title{font:800 16px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;fill:#123b64} .hp-diagram-label-value{font:800 17px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;fill:#0f172a} .hp-diagram-label-note{font:700 13px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;fill:#64748b} .hp-diagram-center-kicker{font:800 13px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;fill:#64748b;text-transform:uppercase;letter-spacing:.04em} .hp-diagram-center-value{font:900 28px/1.1 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;fill:#123b64} .hp-diagram-center-note{font:800 14px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;fill:#486581} .hp-diagram-caption-svg text{font:700 13px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;fill:#64748b} @media(max-width:720px){.hp-diagram-label-title{font-size:15px}.hp-diagram-label-value{font-size:15px}.hp-diagram-label-note{font-size:12px}.hp-diagram-center-value{font-size:24px}.hp-diagram-caption-svg text{font-size:12px}.harvard-plate-visual{min-height:320px}} @media(prefers-reduced-motion:reduce){.harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-target,.harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-fill{transition:none!important}} @media(prefers-contrast:more){.harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-target{opacity:.22}.harvard-plate-svg-shell svg[data-hp-diagram-remaster="true"] .hp-diagram-fill{opacity:.92}.hp-diagram-label rect{stroke-opacity:.62!important}} /* v5.3.7 Harvard outside groups visibility */ .hp-outside-summary{ margin:14px 0 16px; padding:14px; border:1px solid rgba(14,165,233,.22); border-radius:18px; background:linear-gradient(180deg,#f8fbff 0%,#ffffff 100%); } .hp-outside-summary h3{ margin:0 0 6px; font-size:18px; line-height:1.25; color:#0f3658; } .hp-outside-summary>p{ margin:0 0 12px; color:#64748b; font-size:13px; line-height:1.45; } .hp-outside-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; } .hp-outside-card{ border:1px solid rgba(148,163,184,.28); border-radius:14px; background:#fff; padding:10px 10px 8px; } .hp-outside-card-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:4px; } .hp-outside-card-head strong{ font-size:14px; color:#12324f; } .hp-outside-card-head b{ white-space:nowrap; color:#0f3658; font-size:14px; } .hp-outside-card p{ margin:0 0 8px; color:#64748b; font-size:12px; line-height:1.35; } .hp-outside-card .hp-items-list{ margin-top:4px; } @media (max-width:760px){ .hp-outside-summary{padding:12px;border-radius:16px} .hp-outside-grid{grid-template-columns:1fr} } /* v5.3.9 Harvard mobile UI consolidation: summary-first layout, diagram size preserved */ .hp-mobile-diagnosis{ margin:0 0 12px; padding:14px; border:1px solid rgba(14,165,233,.24); border-radius:18px; background:linear-gradient(180deg,#f8fbff 0%,#ffffff 100%); box-shadow:0 10px 28px rgba(15,23,42,.035); } .hp-mobile-diagnosis-head{ display:grid; gap:4px; } .hp-mobile-diagnosis-head span{ font-size:12px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:#0f73b7; } .hp-mobile-diagnosis-head strong{ font-size:17px; line-height:1.28; color:#12324f; } .hp-mobile-diagnosis-metrics{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:12px; } .hp-mobile-diagnosis-metrics span{ display:grid; gap:2px; padding:10px 8px; border:1px solid rgba(148,163,184,.26); border-radius:14px; background:#fff; } .hp-mobile-diagnosis-metrics b{ font-size:17px; color:#0f3658; white-space:nowrap; } .hp-mobile-diagnosis-metrics small{ color:#64748b; font-size:11px; line-height:1.2; } .hp-mobile-missing{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:12px; color:#334155; font-size:13px; } .hp-mobile-missing strong{ margin-right:2px; } .hp-mobile-missing em{ font-style:normal; padding:4px 8px; border-radius:999px; background:#fff7ed; border:1px solid rgba(245,158,11,.28); color:#7c2d12; font-weight:700; } .hp-mobile-missing[data-ok="1"]{ color:#166534; } .hp-first-actions{ margin:14px 0 14px; padding:14px; border-radius:18px; border:1px solid rgba(15,54,88,.12); background:#ffffff; } .hp-first-actions h3{ margin:0 0 8px; font-size:17px; color:#12324f; } .hp-first-actions ol{ margin:0; padding-left:20px; display:grid; gap:7px; } .hp-first-actions li{ color:#334155; line-height:1.38; } .hp-first-actions li[data-tone="need"]::marker{color:#b45309} .hp-first-actions li[data-tone="balance"]::marker{color:#0f73b7} .hp-first-actions li[data-tone="separate"]::marker{color:#64748b} .hp-first-actions[data-ok="1"] p{ margin:0; color:#64748b; line-height:1.45; } .hpapply-placeholder{ margin:12px 0; padding:10px 12px; border:1px dashed rgba(148,163,184,.45); border-radius:14px; color:#64748b; background:#f8fafc; font-size:13px; line-height:1.4; } @media (max-width:760px){ .hp-mobile-diagnosis{ margin-top:0; padding:12px; border-radius:16px; } .hp-mobile-diagnosis-head strong{ font-size:16px; } .hp-mobile-diagnosis-metrics{ grid-template-columns:1fr; gap:7px; } .hp-mobile-diagnosis-metrics span{ grid-template-columns:auto 1fr; align-items:end; column-gap:10px; } .hp-mobile-diagnosis-metrics small{ font-size:12px; } .hp-outside-summary{ margin-top:12px; } .hpsr, .hpwi, .hpapply{ margin-top:14px; } } /* v5.3.23 Desktop Harvard Plate UX clarity pass */ @media (min-width:761px){ .hp-interaction-guide{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; border:1px solid #bfdbfe; border-radius:18px; padding:12px 14px; background:linear-gradient(180deg,#ffffff,#eff6ff); box-shadow:0 10px 24px rgba(37,99,235,.08); } .hp-interaction-guide-main{display:grid;gap:4px} .hp-interaction-kicker{ font-size:11px; font-weight:900; letter-spacing:.05em; text-transform:uppercase; color:#2563eb; } .hp-interaction-guide strong{ display:flex; align-items:center; gap:8px; color:#123b64; font-size:15px; line-height:1.25; } .hp-interaction-guide strong i{ width:13px; height:13px; border-radius:50%; background:var(--hp-dot); box-shadow:0 0 0 5px rgba(37,99,235,.10); flex:0 0 auto; } .hp-interaction-guide p{ margin:0; color:#475569; font-size:13px; line-height:1.4; } .hp-interaction-guide-side{ min-width:150px; display:grid; gap:3px; justify-items:end; border-left:1px solid #dbeafe; padding-left:12px; } .hp-interaction-guide-side span{ font-size:12px; font-weight:800; color:#1d4ed8; } .hp-interaction-guide-side b{ font-size:15px; color:#0f3d6b; } .hp-diagram-remaster-shell .hp-diagram-active-outline{ filter:drop-shadow(0 0 8px rgba(37,99,235,.32)); } .hp-sector-card{ position:relative; } .hp-sector-card::after{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; box-shadow:inset 0 0 0 0 rgba(37,99,235,0); transition:box-shadow .18s ease; } .hp-sector-card:hover::after{ box-shadow:inset 0 0 0 2px rgba(37,99,235,.18); } .hp-sector-card.is-active{ border-color:#1d4ed8 !important; background:linear-gradient(180deg,#ffffff,#eff6ff) !important; box-shadow:0 0 0 4px rgba(37,99,235,.14),0 12px 30px rgba(15,23,42,.10) !important; transform:translateY(-1px); } .hp-sector-card-action{ display:inline-flex; width:fit-content; align-items:center; gap:5px; margin-top:2px; padding:4px 8px; border-radius:999px; border:1px solid #c7ddff; background:#f8fbff; color:#1d4ed8; font-size:11px; font-weight:900; } .hp-sector-card.is-active .hp-sector-card-action{ background:#1d4ed8; border-color:#1d4ed8; color:#fff; } .hp-sector-card-action::before{ content:"↘"; font-weight:900; } .hp-active-panel-selected{ border-color:#93c5fd !important; box-shadow:0 0 0 4px rgba(37,99,235,.10),0 14px 34px rgba(15,23,42,.08) !important; } .hp-active-selected-row{ display:flex; justify-content:space-between; gap:12px; align-items:flex-start; } .hp-active-click-badge{ display:inline-flex; align-items:center; padding:5px 9px; border-radius:999px; background:#eff6ff; border:1px solid #bfdbfe; color:#1d4ed8; font-size:11px; font-weight:900; white-space:nowrap; } .hp-active-howto{ display:grid; grid-template-columns:auto 1fr; gap:7px; margin:8px 0 11px; padding:9px 10px; border-radius:13px; border:1px solid #dbeafe; background:#f8fbff; color:#475569; font-size:12px; line-height:1.35; } .hp-active-howto strong{ color:#123b64; } .hp-outside-summary{ border:1px solid #fde68a; background:linear-gradient(180deg,#fff,#fffaf0); border-radius:18px; padding:12px 13px; } .hp-outside-summary > h3{ margin-top:0; color:#92400e; } .hp-outside-summary > p{ margin:4px 0 10px; color:#475569; line-height:1.45; } .hp-outside-rules{ display:flex; gap:8px; flex-wrap:wrap; margin:0 0 10px; } .hp-outside-rules span{ display:inline-flex; padding:4px 8px; border-radius:999px; border:1px solid #fed7aa; background:#fff7ed; color:#9a3412; font-size:11px; font-weight:900; } .hp-outside-impact{ display:grid; grid-template-columns:auto 1fr; gap:6px; margin:7px 0 8px; padding:8px 9px; border-radius:12px; background:#fffbeb; border:1px solid #fde68a; color:#475569; font-size:12px; line-height:1.35; } .hp-outside-impact strong{ color:#92400e; } } @media (max-width:760px){ .hp-interaction-guide{ display:none; } } /* v5.3.23 — Harvard Plate information architecture pass */ .hp-diagnostic-hub{ border:1px solid #cfe3f7; border-radius:18px; background:linear-gradient(180deg,#fff,#f8fbff); padding:14px; display:grid; gap:11px; box-shadow:0 14px 32px rgba(15,23,42,.055); } .hp-diagnostic-head{display:grid;gap:5px} .hp-diagnostic-head span,.hp-outside-summary-head span,.hp-click-feedback span{ color:#64748b; font-size:11.5px; font-weight:900; text-transform:uppercase; letter-spacing:.05em; } .hp-diagnostic-head strong{color:#123b64;font-size:16px;line-height:1.25;font-weight:950} .hp-diagnostic-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .hp-diagnostic-chips span{ border:1px solid #dbeafe; border-radius:14px; background:#fff; padding:9px 10px; display:grid; gap:2px; } .hp-diagnostic-chips b{color:#0f3d6b;font-size:15px;font-weight:950;line-height:1.1} .hp-diagnostic-chips small{color:#64748b;font-size:11.5px;font-weight:800;line-height:1.15} .hp-diagnostic-chips span[data-tone="good"]{border-color:#bbf7d0;background:#f7fff9} .hp-diagnostic-chips span[data-tone="mid"]{border-color:#fde68a;background:#fffdf4} .hp-diagnostic-chips span[data-tone="low"]{border-color:#fed7aa;background:#fff7ed} .hp-diagnostic-bridge,.hp-diagnostic-action{ border:1px dashed #cfe3f7; border-radius:14px; background:#ffffff; padding:10px; display:grid; gap:3px; color:#334155; font-size:12.5px; line-height:1.35; } .hp-diagnostic-bridge strong,.hp-diagnostic-action strong{color:#123b64;font-weight:950} .hp-diagnostic-action{background:#eff6ff;border-style:solid} .hp-click-feedback{ border:1px solid #dbeafe; border-radius:16px; background:#fff; padding:10px 12px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; } .hp-click-feedback strong{display:flex;align-items:center;gap:7px;color:#123b64;font-size:13px;line-height:1.25;font-weight:900} .hp-click-feedback strong i{display:inline-block;width:10px;height:10px;border-radius:999px;background:var(--hp-dot,#64748b);box-shadow:0 0 0 4px color-mix(in srgb,var(--hp-dot,#64748b) 14%,transparent)} .hp-click-feedback>b{color:#0f3d6b;font-size:12px;white-space:nowrap} .hp-outside-summary-compact{padding:13px 14px} .hp-outside-summary-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px} .hp-outside-summary-head h3{margin:0;color:#123b64;font-size:17px;line-height:1.15} .hp-outside-summary-head b{border-radius:999px;background:#eff6ff;color:#0f3d6b;padding:6px 9px;font-size:12.5px;font-weight:950;white-space:nowrap} .hp-outside-card-compact{display:grid;gap:8px} .hp-outside-card-compact p{margin:0;color:#334155;font-size:12.5px;line-height:1.35} .hp-outside-card-compact p strong{color:#123b64} .hp-outside-products{border-top:1px dashed #e2edf8;padding-top:6px} .hp-outside-products summary{cursor:pointer;color:#0f3d6b;font-size:12px;font-weight:900;list-style:none} .hp-outside-products summary::-webkit-details-marker{display:none} .hp-outside-products summary::after{content:' ▾';color:#64748b;font-size:11px} .hp-outside-products[open] summary::after{content:' ▴'} .hp-active-panel-selected{order:-1} .hp-active-click-badge{background:#eff6ff;color:#0f3d6b;border:1px solid #bfdbfe;border-radius:999px;padding:5px 8px;font-size:11.5px;font-weight:900;white-space:nowrap} @media(max-width:760px){ .hp-diagnostic-chips{grid-template-columns:1fr 1fr} .hp-click-feedback{grid-template-columns:1fr} .hp-click-feedback>b{white-space:normal} } @media(max-width:520px){ .hp-diagnostic-chips{grid-template-columns:1fr} } /* v5.3.24 — Harvard recommendation flow second pass */ .hp-recommendation-flow{ margin:14px 0; padding:14px; border:1px solid #bfdbfe; border-radius:20px; background:linear-gradient(180deg,#ffffff,#f8fbff); box-shadow:0 14px 34px rgba(15,23,42,.055); } .hp-rec-head{ display:grid; gap:5px; margin-bottom:12px; } .hp-rec-head span{ color:#2563eb; font-size:11.5px; font-weight:950; letter-spacing:.055em; text-transform:uppercase; } .hp-rec-head h3{ margin:0; color:#123b64; font-size:18px; line-height:1.2; } .hp-rec-head p{ margin:0; color:#475569; font-size:13px; line-height:1.4; } .hp-rec-grid{ display:grid; gap:10px; } .hp-rec-card{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:11px; padding:12px; border:1px solid #dbeafe; border-radius:18px; background:#fff; } .hp-rec-card[data-tone="need"]{border-color:#fed7aa;background:linear-gradient(180deg,#fff,#fffaf0)} .hp-rec-card[data-tone="balance"]{border-color:#bfdbfe;background:linear-gradient(180deg,#fff,#f8fbff)} .hp-rec-card[data-tone="separate"]{border-color:#e2e8f0;background:linear-gradient(180deg,#fff,#f8fafc)} .hp-rec-card[data-tone="ok"]{border-color:#bbf7d0;background:linear-gradient(180deg,#fff,#f7fff9)} .hp-rec-index{ width:30px; height:30px; border-radius:999px; display:grid; place-items:center; background:#eff6ff; color:#1d4ed8; font-weight:950; border:1px solid #bfdbfe; } .hp-rec-body{min-width:0;display:grid;gap:8px} .hp-rec-body h4{ margin:0; color:#123b64; font-size:15.5px; line-height:1.25; } .hp-rec-body p{ margin:0; color:#334155; line-height:1.38; font-size:13px; } .hp-rec-effects{ margin:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; } .hp-rec-effects div{ border:1px solid #e2eefb; background:#fbfdff; border-radius:13px; padding:8px; display:grid; gap:3px; } .hp-rec-effects dt{ margin:0; color:#64748b; font-size:11px; font-weight:950; letter-spacing:.03em; text-transform:uppercase; } .hp-rec-effects dd{ margin:0; color:#123b64; font-size:12.2px; line-height:1.32; } .hp-rec-example{ display:grid; grid-template-columns:auto 1fr; gap:6px; padding:8px 9px; border-radius:13px; background:#f8fafc; border:1px dashed #cbd5e1; font-size:12.5px; line-height:1.35; color:#475569; } .hp-rec-example strong{color:#123b64} .hp-rec-actions{ display:flex; gap:8px; flex-wrap:wrap; } .hp-rec-check{ min-height:36px; padding:7px 10px; font-size:12.5px; } .hp-sector-card-simple{ padding:9px 10px; gap:4px; } .hp-sector-card-simple .hp-sector-card-action{display:none} .hp-sector-card-simple .hp-sector-card-head b{ font-size:14px; color:#0f3d6b; } .hp-outside-summary[data-highlight="1"]{ box-shadow:0 0 0 4px rgba(245,158,11,.18),0 18px 34px rgba(15,23,42,.08); border-color:#f59e0b; } .hhb-compact{ border:1px dashed #cbd5e1; border-radius:16px; background:#fff; margin:10px 0 14px; overflow:hidden; } .hhb-compact > summary{ cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:12px; align-items:flex-start; padding:11px 13px; background:linear-gradient(180deg,#fff,#f8fafc); } .hhb-compact > summary::-webkit-details-marker{display:none} .hhb-compact > summary span{ color:#64748b; font-size:11.5px; font-weight:950; letter-spacing:.055em; text-transform:uppercase; } .hhb-compact > summary strong{ color:#123b64; font-size:13.5px; line-height:1.25; text-align:right; } .hhb-compact-body{ padding:12px 13px 13px; border-top:1px solid #e2e8f0; display:grid; gap:10px; } .hhb-compact-body p{ margin:0; color:#475569; font-size:13px; line-height:1.45; } .hhb-compact-bars{ display:grid; gap:8px; } .hhb-compact-weak{ border:1px solid #e2eefb; border-radius:14px; padding:9px 10px; background:#fbfdff; } .hhb-compact-weak strong{ display:block; margin-bottom:5px; color:#123b64; } .hhb-weak-list{ margin:0 0 0 18px; padding:0; color:#475569; font-size:12.5px; line-height:1.4; } .hpsr-shell > summary span, .hpwi-shell > summary span{ color:#64748b; } @media(max-width:900px){ .hp-rec-effects{grid-template-columns:1fr} } @media(max-width:640px){ .hp-rec-card{grid-template-columns:1fr} .hp-rec-index{width:28px;height:28px} .hp-rec-example{grid-template-columns:1fr} .hhb-compact > summary{display:grid} .hhb-compact > summary strong{text-align:left} } /* v5.3.25 — Harvard pass-completion audit fixes */ .hpwi-selected-scenario{ margin:10px 0; padding:9px 11px; border:1px solid #bfdbfe; border-radius:14px; background:#eff6ff; color:#123b64; font-size:13px; font-weight:800; line-height:1.35; } .hp-rec-card .hp-rec-check{ min-height:38px; } .hp-outside-summary[data-highlight="1"], #heiPanel[data-highlight="1"]{ box-shadow:0 0 0 4px rgba(37,99,235,.18), 0 16px 36px rgba(15,23,42,.10); border-color:#2563eb !important; } /* ===== SOURCE: assets/css/harvard-hei-bridge-v5.css ===== */ /* nutrition calculator v5.2.30 — Harvard Plate structural triage + HEI bridge Goal: mobile-first quick diagnosis, action, three structural bars, optional HEI explanation. */ .harvard-hei-bridge{ margin:10px 0 14px; } .hhb-flow{ display:grid; gap:10px; } .hhb-card{ border:1px solid #dbeafe; background:linear-gradient(180deg,#fff,#f8fbff); border-radius:16px; padding:12px; color:#0f172a; min-width:0; } .hhb-kicker{ color:#64748b; text-transform:uppercase; letter-spacing:.045em; font-size:10.5px; font-weight:800; margin-bottom:6px; } .hhb-triage{ padding:12px 13px; } .hhb-triage[data-tone="ok"]{ border-color:#bbf7d0; background:linear-gradient(180deg,#fff,#f7fef9); } .hhb-triage[data-tone="warn"]{ border-color:#fde68a; background:linear-gradient(180deg,#fff,#fffaf0); } .hhb-triage[data-tone="bad"]{ border-color:#fecaca; background:linear-gradient(180deg,#fff,#fff7f7); } .hhb-status-line{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; } .hhb-status-pill{ display:inline-flex; align-items:center; min-height:28px; border-radius:999px; padding:5px 10px; background:#eff6ff; color:#123b64; font-weight:850; font-size:13px; line-height:1.1; } .hhb-triage[data-tone="ok"] .hhb-status-pill{ background:#dcfce7; color:#14532d; } .hhb-triage[data-tone="warn"] .hhb-status-pill{ background:#fef3c7; color:#78350f; } .hhb-triage[data-tone="bad"] .hhb-status-pill{ background:#fee2e2; color:#7f1d1d; } .hhb-score-note{ color:#64748b; font-size:11px; font-weight:700; } .hhb-main-conclusion{ margin:8px 0 0; color:#0f172a; font-size:14px; font-weight:750; line-height:1.35; } .hhb-priority{ background:linear-gradient(180deg,#fff,#fbfdff); } .hhb-action-list{ margin:0; padding-left:20px; color:#123b64; font-size:13.5px; font-weight:760; line-height:1.38; } .hhb-action-list li{ margin:4px 0; } .hhb-indicators{ display:grid; gap:9px; } .hhb-bar{ display:grid; gap:4px; } .hhb-bar-head{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; color:#123b64; font-size:13px; font-weight:850; } .hhb-bar-head span{ white-space:nowrap; } .hhb-track{ position:relative; height:9px; border-radius:999px; background:#e8f2fb; overflow:visible; } .hhb-track i{ display:block; width:var(--hhb-pct,0%); height:100%; border-radius:inherit; background:#0b61d6; } .hhb-bar[data-tone="ok"] .hhb-track i{ background:#16a34a; } .hhb-bar[data-tone="warn"] .hhb-track i{ background:#f59e0b; } .hhb-bar[data-tone="bad"] .hhb-track i{ background:#dc2626; } .hhb-track em{ position:absolute; top:-3px; width:2px; height:15px; background:#0f172a; opacity:.45; border-radius:999px; transform:translateX(-1px); } .hhb-bar-note{ font-size:11.5px; line-height:1.28; color:#64748b; } .hhb-details-card{ padding:0; overflow:hidden; } .hhb-details-card > summary{ list-style:none; cursor:pointer; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; min-height:42px; padding:10px 12px; color:#123b64; } .hhb-details-card > summary::-webkit-details-marker{ display:none; } .hhb-details-card > summary::after{ content:"▾"; color:#64748b; font-size:12px; } .hhb-details-card[open] > summary::after{ content:"▴"; } .hhb-details-card > summary span{ font-weight:850; font-size:13px; } .hhb-details-card > summary strong{ font-size:12px; color:#475569; font-weight:800; white-space:nowrap; } .hhb-details-card > p, .hhb-details-card .hhb-weak, .hhb-details-card .hhb-method{ margin:0; padding:0 12px 10px; color:#334155; font-size:12.5px; line-height:1.38; } .hhb-details-card > p:first-of-type{ padding-top:0; } .hhb-weak{ color:#475569 !important; } .hhb-method{ color:#64748b !important; } /* The version marker is useful for QA but should not dominate the user-facing block. */ .harvard-plate-badge{ font-size:11px !important; font-weight:700 !important; color:#64748b !important; background:#fff !important; white-space:normal; text-align:center; } /* Desktop: keep the triage compact and scannable above the existing two-column Harvard layout. */ @media (min-width:761px){ .hhb-flow{ grid-template-columns:1.05fr .95fr; align-items:stretch; } .hhb-triage, .hhb-indicators{ grid-row:span 2; } } /* Mobile: make the block read as diagnosis -> action -> evidence -> details. */ @media (max-width:760px){ .harvard-plate-head{ margin-bottom:8px !important; } .harvard-plate-subtitle{ font-size:13px !important; line-height:1.42 !important; } .harvard-plate-badge{ display:none !important; } .harvard-hei-bridge{ margin:8px 0 10px !important; } .hhb-flow{ gap:8px; } .hhb-card{ border-radius:14px; padding:10px; } .hhb-status-pill{ font-size:12.5px; min-height:26px; padding:5px 9px; } .hhb-score-note{ font-size:10.5px; } .hhb-main-conclusion{ font-size:13px; line-height:1.32; } .hhb-action-list{ font-size:12.8px; line-height:1.32; } .hhb-bar-head{ font-size:12.6px; } .hhb-bar-note{ font-size:10.8px; } .hhb-details-card > summary{ min-height:38px; padding:9px 10px; } .hhb-details-card > summary span{ font-size:12.5px; } .hhb-details-card > summary strong{ font-size:11.5px; } .hhb-details-card > p, .hhb-details-card .hhb-weak, .hhb-details-card .hhb-method{ font-size:12px; padding-left:10px; padding-right:10px; } /* The new triage carries the interpretation; keep diagram visible but not overwhelming. */ #harvardPlatePanel .harvard-plate-visual{ min-height:0 !important; } #harvardPlatePanel .harvard-plate-visual svg{ max-height:310px; } #harvardPlatePanel .harvard-plate-caption{ font-size:11px !important; line-height:1.35 !important; } } @media (max-width:390px){ .hhb-card{ padding:9px; } .hhb-kicker{ font-size:10px; } .hhb-main-conclusion, .hhb-action-list, .hhb-bar-head{ font-size:12px; } .hhb-score-note{ display:none; } } /* ===== SOURCE: assets/css/harvard-plate-accordion-v5.css ===== */ /* nutrition calculator v5.2.31 — Harvard Plate accordion cleanup Replaces legacy lower Harvard Plate blocks with coherent accordions. */ #harvardPlatePanel .harvard-plate-status, #harvardPlatePanel #harvardPlateCompanions{ display:none !important; } #harvardPlatePanel .harvard-plate-layout{ grid-template-columns:1fr !important; } #harvardPlatePanel .harvard-plate-visual-wrap{ width:100%; } .hpacc{ margin-top:12px; display:grid; gap:12px; } .hpacc-section{ border:1px solid #dbeafe; border-radius:18px; background:linear-gradient(180deg,#fff,#f8fbff); padding:12px; } .hpacc-section-head{ margin:0 0 10px; } .hpacc-section-head h3{ margin:0 0 3px; color:#123b64; font-size:17px; line-height:1.2; } .hpacc-section-head p{ margin:0; color:#64748b; font-size:12.5px; line-height:1.35; } .hpacc-item{ border:1px solid #dbeafe; border-radius:14px; background:#fff; overflow:hidden; margin:8px 0; } .hpacc-item:first-of-type{ margin-top:0; } .hpacc-item:last-child{ margin-bottom:0; } .hpacc-item > summary{ list-style:none; cursor:pointer; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:9px; min-height:50px; padding:10px 11px; color:#123b64; } .hpacc-item > summary::-webkit-details-marker{ display:none; } .hpacc-item > summary::after{ content:"▾"; color:#64748b; font-size:12px; } .hpacc-item[open] > summary::after{ content:"▴"; } .hpacc-dot{ width:14px; height:14px; border-radius:999px; background:var(--hpacc-dot,#64748b); box-shadow:0 0 0 4px rgba(226,232,240,.7); } .hpacc-main{ min-width:0; display:grid; gap:2px; } .hpacc-main strong{ color:#123b64; font-size:14px; line-height:1.16; } .hpacc-main small{ color:#64748b; font-size:11.5px; line-height:1.2; } .hpacc-value{ color:#123b64; font-size:13px; font-weight:850; white-space:nowrap; } .hpacc-chevron{ color:#64748b; font-size:12px; font-weight:800; } .hpacc-body{ border-top:1px solid #e2edf8; padding:10px 11px 12px; } .hpacc-bar{ position:relative; height:9px; border-radius:999px; background:#e8f2fb; margin:0 0 8px; } .hpacc-bar i{ display:block; width:var(--hpacc-pct,0%); max-width:100%; height:100%; border-radius:inherit; background:#0b61d6; } .hpacc-bar em{ position:absolute; left:var(--hpacc-target,50%); top:-3px; width:2px; height:15px; background:#0f172a; opacity:.45; border-radius:999px; transform:translateX(-1px); } .hpacc-item[data-tone="ok"] .hpacc-bar i{ background:#16a34a; } .hpacc-item[data-tone="warn"] .hpacc-bar i{ background:#f59e0b; } .hpacc-item[data-tone="bad"] .hpacc-bar i{ background:#dc2626; } .hpacc-item[data-tone="empty"] .hpacc-bar i{ background:#94a3b8; } .hpacc-note{ margin:0 0 10px; color:#334155; font-size:12.5px; line-height:1.4; } .hpacc-body h4{ margin:10px 0 6px; color:#123b64; font-size:13px; line-height:1.25; } .hpacc-items{ list-style:none; margin:0; padding:0; display:grid; } .hpacc-items li{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:start; padding:7px 0; border-top:1px dashed #e2edf8; color:#334155; font-size:12.5px; line-height:1.25; } .hpacc-items li:first-child{ border-top:0; } .hpacc-items span{ min-width:0; } .hpacc-items small{ display:block; color:#64748b; font-size:10.8px; line-height:1.2; margin-top:2px; } .hpacc-items strong{ color:#123b64; font-weight:850; white-space:nowrap; } .hpacc-empty{ margin:0; color:#64748b; font-size:12.5px; line-height:1.35; } .hpacc-extra > summary{ grid-template-columns:minmax(0,1fr) auto; } .hpacc-extra[data-tone="bad"]{ border-color:#fecaca; background:#fffafa; } .hpacc-extra[data-tone="warn"]{ border-color:#fde68a; background:#fffdf5; } .hpacc-extra[data-tone="ok"]{ border-color:#bbf7d0; background:#fbfffd; } .hpacc-tech{ background:#fff; } .hpacc-tech > summary{ grid-template-columns:minmax(0,1fr) auto; } .hpacc-flags{ margin:0; padding-left:18px; color:#334155; font-size:12.5px; line-height:1.35; } .hpacc-flags li{ margin:5px 0; } .hpacc-flags li[data-severity="warn"]{ color:#92400e; } .hpacc-flags li[data-severity="bad"], .hpacc-flags li[data-severity="error"]{ color:#991b1b; } @media (min-width:761px){ .hpacc{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; } .hpacc-main-sectors{ grid-row:span 2; } } @media (max-width:760px){ #harvardPlatePanel .harvard-plate-layout{ display:block !important; } .hpacc{ margin-top:9px; gap:9px; } .hpacc-section{ border-radius:15px; padding:10px; } .hpacc-section-head h3{ font-size:15px; } .hpacc-section-head p{ font-size:11.5px; } .hpacc-item{ border-radius:13px; margin:7px 0; } .hpacc-item > summary{ min-height:46px; padding:9px 10px; gap:8px; } .hpacc-main strong{ font-size:13px; } .hpacc-main small{ font-size:10.8px; } .hpacc-value{ font-size:12px; } .hpacc-body{ padding:9px 10px 10px; } .hpacc-note, .hpacc-items li, .hpacc-empty, .hpacc-flags{ font-size:12px; } .hpacc-body h4{ font-size:12.5px; } } @media (max-width:390px){ .hpacc-value{ font-size:11.4px; } .hpacc-main strong{ font-size:12.5px; } .hpacc-dot{ width:12px; height:12px; } } /* ===== SOURCE: assets/css/harvard-smart-rebalance-v5.css ===== */ /* nutrition calculator v5.2.34 — Smart HEI-aware Harvard Plate rebalance hints */ .hpsr{ margin:10px 0 12px; } .hpsr-shell{ border:1px solid #cfe3f7; border-radius:18px; background:linear-gradient(180deg,#fff,#f8fbff); padding:12px; color:#0f172a; box-shadow:0 8px 24px rgba(15,23,42,.035); } .hpsr-shell[data-tone="good"]{ border-color:#bbf7d0; background:linear-gradient(180deg,#fff,#f7fef9); } .hpsr-shell[data-tone="warn"]{ border-color:#fde68a; background:linear-gradient(180deg,#fff,#fffaf0); } .hpsr-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:7px; } .hpsr-kicker{ display:block; color:#64748b; text-transform:uppercase; letter-spacing:.045em; font-size:10.5px; font-weight:850; margin-bottom:3px; } .hpsr-head h3{ margin:0; color:#123b64; font-size:17px; line-height:1.2; } .hpsr-badge{ display:inline-flex; align-items:center; min-height:24px; border-radius:999px; padding:4px 8px; background:#eff6ff; color:#123b64; font-size:10.8px; font-weight:850; white-space:nowrap; } .hpsr-lead{ margin:0 0 9px; color:#475569; font-size:12.5px; line-height:1.38; } .hpsr-list{ display:grid; gap:8px; } .hpsr-card{ border:1px solid #dbeafe; border-radius:14px; background:#fff; padding:10px; } .hpsr-card[data-tone="good"]{ border-color:#bbf7d0; background:#fbfffd; } .hpsr-card[data-tone="warn"]{ border-color:#fde68a; background:#fffdf5; } .hpsr-card[data-tone="bad"]{ border-color:#fecaca; background:#fffafa; } .hpsr-card-title{ margin:0 0 4px; color:#123b64; font-size:13px; font-weight:900; line-height:1.2; } .hpsr-card p{ margin:0; color:#334155; font-size:12.5px; line-height:1.38; } .hpsr-more{ margin-top:8px; border-top:1px dashed #dbeafe; padding-top:8px; } .hpsr-more > summary{ cursor:pointer; color:#123b64; font-size:12.5px; font-weight:850; list-style:none; } .hpsr-more > summary::-webkit-details-marker{ display:none; } .hpsr-more > summary::after{ content:" ▾"; color:#64748b; } .hpsr-more[open] > summary::after{ content:" ▴"; } .hpsr-list-extra{ margin-top:8px; } .hpsr-method, .hpsr-shell > p{ color:#64748b; font-size:12px; line-height:1.38; margin:9px 0 0; } @media (min-width:761px){ .hpsr-list{ grid-template-columns:repeat(3,minmax(0,1fr)); } .hpsr-list-extra{ grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:760px){ .hpsr{ margin:8px 0 10px; } .hpsr-shell{ border-radius:15px; padding:10px; } .hpsr-head h3{ font-size:15px; } .hpsr-kicker{ font-size:10px; } .hpsr-badge{ display:none; } .hpsr-lead{ font-size:11.8px; line-height:1.34; } .hpsr-card{ border-radius:13px; padding:9px; } .hpsr-card-title{ font-size:12.5px; } .hpsr-card p{ font-size:12px; line-height:1.34; } } /* ===== SOURCE: assets/css/harvard-whatif-simulator-v5.css ===== */ /* nutrition calculator v5.2.35 — Harvard Plate what-if simulator */ .hpwi{ margin:10px 0 12px; } .hpwi-shell{ border:1px solid #cfe3f7; border-radius:18px; background:linear-gradient(180deg,#fff,#f8fbff); color:#0f172a; overflow:hidden; } .hpwi-shell > summary{ list-style:none; cursor:pointer; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:12px; color:#123b64; } .hpwi-shell > summary::-webkit-details-marker{ display:none; } .hpwi-shell > summary::after{ content:"▾"; color:#64748b; font-size:12px; } .hpwi-shell[open] > summary::after{ content:"▴"; } .hpwi-shell > summary span{ font-size:16px; font-weight:900; line-height:1.2; } .hpwi-shell > summary strong{ color:#64748b; font-size:11.5px; font-weight:800; white-space:nowrap; } .hpwi-grid{ border-top:1px solid #dbeafe; padding:12px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; } .hpwi-controls{ display:grid; gap:10px; } .hpwi-row{ border:1px solid #dbeafe; border-radius:14px; background:#fff; padding:10px; display:grid; gap:8px; } .hpwi-row label{ display:grid; gap:4px; color:#123b64; font-size:12px; font-weight:850; } .hpwi-row select{ min-width:0; width:100%; border:1px solid #cfe3f7; border-radius:10px; padding:8px 9px; background:#fff; color:#0f172a; font-size:13px; } .hpwi-control{ display:grid; grid-template-columns:1fr auto; gap:7px; align-items:center; } .hpwi-control input{ grid-column:1 / -1; width:100%; } .hpwi-control output{ color:#123b64; font-size:12px; font-weight:900; white-space:nowrap; } .hpwi-preview{ border:1px solid #dbeafe; border-radius:14px; background:#fff; padding:10px; display:grid; gap:9px; } .hpwi-result-head{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; } .hpwi-result-head strong{ color:#123b64; font-size:14px; font-weight:900; } .hpwi-result-head span{ color:#123b64; font-size:13px; font-weight:850; white-space:nowrap; } .hpwi-bars{ display:grid; gap:8px; } .hpwi-bar{ display:grid; gap:4px; } .hpwi-bar > div{ display:flex; justify-content:space-between; gap:8px; color:#123b64; font-size:12px; font-weight:850; } .hpwi-bar > div span{ white-space:nowrap; } .hpwi-bar i{ position:relative; display:block; height:9px; border-radius:999px; background:#e8f2fb; } .hpwi-bar i b{ display:block; width:var(--hpwi-pct,0%); max-width:100%; height:100%; border-radius:inherit; background:#0b61d6; } .hpwi-bar i em{ position:absolute; left:var(--hpwi-target,50%); top:-3px; width:2px; height:15px; background:#0f172a; opacity:.45; border-radius:999px; transform:translateX(-1px); } .hpwi-status{ display:flex; flex-wrap:wrap; gap:6px; } .hpwi-status span{ display:inline-flex; align-items:center; min-height:24px; border-radius:999px; padding:4px 8px; background:#eff6ff; color:#123b64; font-size:11.5px; font-weight:800; } .hpwi-deltas{ border-top:1px dashed #dbeafe; padding-top:7px; } .hpwi-deltas summary{ cursor:pointer; color:#123b64; font-size:12px; font-weight:850; } .hpwi-deltas ul{ list-style:none; padding:0; margin:7px 0 0; } .hpwi-deltas li{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:5px 0; border-top:1px dashed #e2edf8; color:#334155; font-size:12px; } .hpwi-deltas li:first-child{ border-top:0; } .hpwi-deltas strong{ color:#123b64; } .hpwi-note, .hpwi-shell > p{ margin:0; color:#64748b; font-size:11.5px; line-height:1.35; } @media (max-width:760px){ .hpwi{ margin:8px 0 10px; } .hpwi-shell{ border-radius:15px; } .hpwi-shell > summary{ padding:10px; } .hpwi-shell > summary span{ font-size:14px; } .hpwi-shell > summary strong{ font-size:10.8px; } .hpwi-grid{ grid-template-columns:1fr; padding:10px; gap:9px; } .hpwi-row{ border-radius:13px; padding:9px; gap:7px; } .hpwi-row label, .hpwi-bar > div, .hpwi-deltas li{ font-size:11.8px; } .hpwi-result-head strong{ font-size:13px; } .hpwi-result-head span{ font-size:12px; } .hpwi-status span{ font-size:10.8px; } } @media (max-width:390px){ .hpwi-shell > summary{ grid-template-columns:1fr; gap:3px; } .hpwi-shell > summary strong{ white-space:normal; } .hpwi-result-head{ display:grid; gap:3px; } .hpwi-result-head span{ white-space:normal; } } /* v5.3.23 what-if usability clarification */ .hpwi-intro{ margin:12px 0; padding:11px 12px; border-radius:14px; border:1px solid #dbeafe; background:#f8fbff; display:grid; grid-template-columns:auto 1fr; gap:8px; color:#475569; font-size:13px; line-height:1.45; } .hpwi-intro strong{color:#123b64} .hpwi-steps{ margin:0 0 12px 0; padding:0; list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; counter-reset:hpwi-step; } .hpwi-steps li{ counter-increment:hpwi-step; position:relative; min-height:58px; padding:10px 10px 10px 38px; border:1px solid #e2eefb; border-radius:14px; background:#fff; color:#475569; font-size:12px; line-height:1.35; } .hpwi-steps li::before{ content:counter(hpwi-step); position:absolute; left:10px; top:10px; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; background:#1d4ed8; color:#fff; font-size:12px; font-weight:900; } .hpwi-result-head strong{font-size:15px} .hpwi-note strong{color:#123b64} @media(max-width:760px){ .hpwi-intro{grid-template-columns:1fr} .hpwi-steps{grid-template-columns:1fr} } /* ===== SOURCE: assets/css/harvard-apply-plan-v5.css ===== */ /* nutrition calculator v5.2.36 — Harvard Apply Plan */ .hpapply{ margin:10px 0 12px; } .hpapply-shell{ border:1px solid #cfe3f7; border-radius:18px; background:linear-gradient(180deg,#fff,#f8fbff); color:#0f172a; overflow:hidden; } .hpapply-shell > summary{ list-style:none; cursor:pointer; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:12px; color:#123b64; } .hpapply-shell > summary::-webkit-details-marker{ display:none; } .hpapply-shell > summary::after{ content:"▾"; color:#64748b; font-size:12px; } .hpapply-shell[open] > summary::after{ content:"▴"; } .hpapply-shell > summary span{ font-size:16px; font-weight:900; line-height:1.2; } .hpapply-shell > summary strong{ color:#64748b; font-size:11.5px; font-weight:800; white-space:nowrap; } .hpapply-lead{ margin:0; padding:0 12px 10px; color:#475569; font-size:12.5px; line-height:1.38; } .hpapply-cols{ border-top:1px solid #dbeafe; padding:12px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; } .hpapply-cols section{ border:1px solid #dbeafe; border-radius:14px; background:#fff; padding:10px; } .hpapply-cols h4{ margin:0 0 7px; color:#123b64; font-size:13.5px; line-height:1.25; } .hpapply-micro{ margin:0 0 6px; color:#64748b; font-size:11.5px; line-height:1.3; } .hpapply-list{ list-style:none; margin:0; padding:0; display:grid; } .hpapply-list li{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:start; padding:7px 0; border-top:1px dashed #e2edf8; color:#334155; font-size:12.5px; line-height:1.25; } .hpapply-list li:first-child{ border-top:0; } .hpapply-list li[data-ok="0"]{ color:#991b1b; } .hpapply-list strong{ color:#123b64; } .hpapply-list small{ display:block; color:#64748b; font-size:10.8px; line-height:1.2; margin-top:2px; } .hpapply-list b{ color:#123b64; white-space:nowrap; } .hpapply-empty{ margin:0; color:#64748b; font-size:12px; line-height:1.35; } .hpapply-actions{ padding:0 12px 12px; display:flex; flex-wrap:wrap; gap:8px; } .hpapply-actions button{ min-height:36px; border-radius:12px; padding:8px 11px; font-size:12.5px; font-weight:850; } .hpapply-actions .primary{ background:#0b61d6; color:#fff; border:1px solid #0b61d6; } .hpapply-actions .secondary{ background:#fff; color:#123b64; border:1px solid #cfe3f7; } .hpapply-actions button:disabled{ opacity:.55; cursor:not-allowed; } .hpapply-status{ margin:0 12px 12px; color:#64748b; font-size:12px; line-height:1.35; min-height:1.2em; } .hpapply-status[data-good="1"]{ color:#166534; } .hpapply-status[data-good="0"]{ color:#991b1b; } @media (max-width:760px){ .hpapply{ margin:8px 0 10px; } .hpapply-shell{ border-radius:15px; } .hpapply-shell > summary{ padding:10px; } .hpapply-shell > summary span{ font-size:14px; } .hpapply-shell > summary strong{ font-size:10.8px; } .hpapply-lead{ padding:0 10px 9px; font-size:11.8px; } .hpapply-cols{ grid-template-columns:1fr; padding:10px; gap:9px; } .hpapply-cols section{ border-radius:13px; padding:9px; } .hpapply-list li{ font-size:12px; } .hpapply-actions{ padding:0 10px 10px; display:grid; grid-template-columns:1fr; } .hpapply-actions button{ width:100%; } .hpapply-status{ margin:0 10px 10px; } } @media (max-width:390px){ .hpapply-shell > summary{ grid-template-columns:1fr; gap:3px; } .hpapply-shell > summary strong{ white-space:normal; } } /* ===== SOURCE: assets/css/harvard-third-pass-v5.css ===== */ /* v5.3.28 Harvard third pass: progressive disclosure, regression-safe UX polish */ .harvard-plate-card[data-harvard-third-pass="1"] .hp-diagnostic-hub, .harvard-plate-card .hp-diagnostic-hub{ position:relative; } .hp-diagnostic-hub::after{ content:"Диагноз → сектор → рекомендация → проверка варианта"; display:block; margin-top:8px; font-size:11px; line-height:1.35; color:#64748b; letter-spacing:.01em; } .hp-recommendation-flow{ border-width:2px; } .hp-rec-card{ min-height:100%; } .hp-rec-effects div{ align-content:start; } .hp-rec-check{ min-height:40px; } .hp-click-feedback{ border-style:solid; border-width:1px; } .hp-outside-summary[data-highlight="1"], #heiPanel[data-highlight="1"]{ outline:4px solid rgba(37,99,235,.22); outline-offset:4px; border-radius:18px; } #harvardSmartRebalance, #harvardWhatIfSimulator, #harvardApplyPlan, #harvardPlateAccordions{ scroll-margin-top:18px; } #harvardSmartRebalance .hpsr-shell, #harvardWhatIfSimulator .hpwi-shell, #harvardApplyPlan .hpapply-shell{ border-color:#dbeafe; } #harvardSmartRebalance .hpsr-shell > summary, #harvardWhatIfSimulator .hpwi-shell > summary, #harvardApplyPlan .hpapply-shell > summary{ cursor:pointer; } #harvardSmartRebalance::before, #harvardWhatIfSimulator::before, #harvardApplyPlan::before{ display:block; margin:12px 0 6px; font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#64748b; } #harvardSmartRebalance::before{ content:"Дополнительный уровень"; } #harvardWhatIfSimulator::before{ content:"Проверка варианта"; } #harvardApplyPlan::before{ content:"Применение после проверки"; } #harvardPlateAccordions{ opacity:.96; } #harvardPlateAccordions::before{ content:"Подробности по секторам"; display:block; margin:12px 0 6px; font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#64748b; } .hp-quality-card{ background:#fbfdff; } .hp-active-panel-selected{ contain:layout paint; } .harvard-plate-companion .hp-companion-value, .hp-outside-card-head b, .hp-sector-card-head b{ font-variant-numeric:tabular-nums; } @media (min-width: 1121px){ .harvard-plate-layout{ grid-template-columns:minmax(360px,.95fr) minmax(440px,1.05fr); } .hp-rec-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } } @media (max-width:760px){ .hp-diagnostic-hub::after{ content:"Диагноз → рекомендация → проверка"; } } /* ===== SOURCE: assets/css/harvard-inline-plate-details-v5.css ===== */ /* v5.3.28 Harvard inline plate details: sector accordions directly under diagram */ #harvardPlatePanel .harvard-plate-caption{ margin-bottom:10px; } #harvardPlateAccordions.hpacc-inline-under-plate{ margin-top:10px; scroll-margin-top:18px; } #harvardPlateAccordions.hpacc-inline-under-plate::before{ content:"Под диаграммой"; display:block; margin:4px 0 6px; font-size:11px; font-weight:850; letter-spacing:.05em; text-transform:uppercase; color:#64748b; } .hpacc-inline-under-plate .hpacc-section{ box-shadow:0 10px 28px rgba(15,23,42,.045); } .hpacc-inline-under-plate .hpacc-main-sectors{ border-width:2px; background:linear-gradient(180deg,#ffffff,#f8fbff); } .hpacc-inline-feedback{ margin:0 0 9px; padding:8px 10px; border:1px solid #dbeafe; border-radius:12px; background:#f8fbff; color:#334155; font-size:12px; line-height:1.35; } .hpacc-sector[data-hpacc-selected="1"]{ border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.11),0 10px 24px rgba(15,23,42,.08); } .hpacc-sector[data-hpacc-selected="1"] > summary{ background:linear-gradient(180deg,#eff6ff,#ffffff); } .hpacc-sector > summary[data-hp-sector-card]{ touch-action:manipulation; } .hpacc-outside{ background:linear-gradient(180deg,#fff,#fffdf7); border-color:#f6d8a8; } .hpacc-outside .hpacc-section-head h3::after{ content:" — есть в рационе, но не в круге"; font-weight:600; color:#64748b; font-size:12px; } .hp-mobile-actual-sector{ cursor:pointer; outline:none; } .hp-mobile-actual-sector:focus-visible{ filter:drop-shadow(0 0 0 rgba(37,99,235,.0)); stroke:#1d4ed8; stroke-width:7px; } .hp-mobile-actual-legend-item{ appearance:none; border:0; background:transparent; width:100%; color:inherit; text-align:left; cursor:pointer; font:inherit; padding:0; } .hp-mobile-actual-legend-item:focus-visible{ outline:3px solid rgba(37,99,235,.28); outline-offset:4px; border-radius:12px; } @media (min-width:761px){ #harvardPlateAccordions.hpacc-inline-under-plate{ grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); } #harvardPlateAccordions.hpacc-inline-under-plate .hpacc-main-sectors{ grid-row:auto; } } @media (max-width:760px){ #harvardPlateAccordions.hpacc-inline-under-plate{ margin-top:8px; } #harvardPlateAccordions.hpacc-inline-under-plate::before{ content:"Подробности под тарелкой"; } .hpacc-inline-under-plate .hpacc-section-head p{ font-size:12px; } .hpacc-inline-feedback{ font-size:11.5px; padding:7px 9px; } .hpacc-outside .hpacc-section-head h3::after{ display:block; margin-top:2px; } } /* ===== SOURCE: assets/css/harvard-mobile-clarity-polish-v5.css ===== */ /* v5.3.36 Harvard Mobile Clarity Polish */ #harvardPlateAccordions.hpacc-inline-under-plate::before{ content:"Подробности по секторам"; display:block; margin:8px 0 7px; font-size:11px; font-weight:900; letter-spacing:.055em; text-transform:uppercase; color:#475569; } #harvardPlatePanel .harvard-plate-caption{ color:#475569; font-weight:650; } .hpacc-inline-feedback{ display:grid; gap:2px; border-color:#bfdbfe; background:linear-gradient(180deg,#eff6ff,#ffffff); } .hpacc-inline-feedback strong{ display:block; color:#123b64; font-size:12.5px; line-height:1.25; } .hpacc-inline-feedback span{ display:block; color:#475569; font-size:12px; line-height:1.35; } .hpacc-sector > summary[data-hp-sector-card]{ display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; gap:10px; align-items:center; min-height:58px; padding:11px 12px; border-radius:14px; cursor:pointer; background:#fff; transition:background .16s ease,border-color .16s ease,box-shadow .16s ease; } .hpacc-sector > summary[data-hp-sector-card]::-webkit-details-marker{display:none} .hpacc-sector > summary[data-hp-sector-card]:hover{ background:#f8fbff; } .hpacc-sector[data-hpacc-selected="1"] > summary[data-hp-sector-card], .hpacc-sector[open] > summary[data-hp-sector-card]{ background:linear-gradient(180deg,#eff6ff,#ffffff); box-shadow:inset 0 0 0 1px rgba(37,99,235,.14); } .hpacc-main small{ color:#64748b; font-weight:650; } .hpacc-value-wrap{ display:grid; justify-items:end; gap:2px; min-width:98px; } .hpacc-value-wrap .hpacc-value{ font-weight:900; color:#123b64; white-space:nowrap; } .hpacc-target{ font-size:11px; color:#64748b; font-weight:750; white-space:nowrap; } .hpacc-toggle-text{ display:inline-flex; align-items:center; justify-content:center; min-height:22px; padding:2px 7px; border-radius:999px; background:#e9f2ff; color:#0b61d6; font-size:11px; font-weight:900; white-space:nowrap; } .hpacc-sector[open] .hpacc-toggle-text{ font-size:0; background:#dbeafe; color:#123b64; } .hpacc-sector[open] .hpacc-toggle-text::before{ content:"открыто"; font-size:11px; } .hpacc-sector > summary .hpacc-chevron{ display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:999px; background:#f1f5f9; color:#475569; transition:transform .16s ease; } .hpacc-sector[open] > summary .hpacc-chevron{ transform:rotate(180deg); background:#dbeafe; color:#123b64; } .hpacc-sector-conclusion{ margin:0 0 10px; padding:10px 11px; border-radius:12px; background:#f8fbff; border:1px solid #dbeafe; color:#334155; font-size:13px; line-height:1.45; } .hpacc-sector-conclusion strong{ color:#123b64; } .hpacc-extra-cluster{ display:grid; gap:8px; margin:10px 0 0; } .hpacc-extra-cluster > h4{ margin:0; color:#123b64; font-size:13px; font-weight:900; } .hpacc-extra-cluster > p{ margin:0; color:#475569; font-size:12px; line-height:1.4; } .hpacc-extra-cluster[data-cluster="separate"]{ padding:10px; border:1px solid #dbeafe; border-radius:14px; background:#fbfdff; } .hpacc-extra-cluster[data-cluster="attention"]{ padding:10px; border:1px solid #fde68a; border-radius:14px; background:#fffdf5; } .hp-mobile-actual-legend-item{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:7px 10px; align-items:center; padding:9px 2px; border-radius:12px; } .hp-mobile-actual-title{ display:grid; gap:1px; min-width:0; } .hp-mobile-actual-title strong{ min-width:0; } .hp-mobile-actual-title small{ color:#64748b; font-size:12px; line-height:1.15; } .hp-mobile-actual-action{ grid-column:2 / -1; justify-self:start; display:inline-flex; padding:2px 7px; border-radius:999px; background:#e9f2ff; color:#0b61d6; font-size:11px; font-weight:900; } #harvardSmartRebalance .hpsr-shell > summary, #harvardWhatIfSimulator .hpwi-shell > summary, #harvardApplyPlan .hpapply-shell > summary{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 10px; align-items:center; } #harvardSmartRebalance .hpsr-shell > summary span, #harvardWhatIfSimulator .hpwi-shell > summary span, #harvardApplyPlan .hpapply-shell > summary span{ display:block; color:#64748b; font-size:12px; line-height:1.2; text-transform:none; } #harvardSmartRebalance .hpsr-shell > summary strong, #harvardWhatIfSimulator .hpwi-shell > summary strong, #harvardApplyPlan .hpapply-shell > summary strong{ display:block; color:#123b64; font-size:14px; line-height:1.2; } #harvardSmartRebalance, #harvardWhatIfSimulator, #harvardApplyPlan{ opacity:.96; } @media (max-width:760px){ .hpacc-sector > summary[data-hp-sector-card]{ grid-template-columns:auto minmax(0,1fr) auto; gap:8px; padding:10px; } .hpacc-sector > summary .hpacc-chevron{ grid-column:3; grid-row:1; } .hpacc-value-wrap{ grid-column:2 / -1; grid-row:2; justify-items:start; display:flex; align-items:center; flex-wrap:wrap; gap:5px 7px; min-width:0; } .hpacc-main small{ font-size:11.5px; } .hpacc-target{ font-size:10.8px; } .hpacc-sector-conclusion{ font-size:12.5px; } .hpacc-outside .hpacc-section-head h3::after{ content:""; } } @media(prefers-reduced-motion:reduce){ .hpacc-sector > summary[data-hp-sector-card], .hpacc-sector > summary .hpacc-chevron{transition:none!important} } /* ===== SOURCE: assets/css/diet-analysis-profile-v5.css ===== */ /* v5.3.36 Integrated Diet Analysis Profile — architectural first pass */ .diet-analysis-card{ position:relative; overflow:hidden; border:1px solid rgba(28,46,70,.14); background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%); } .diet-analysis-card::before{ content:""; position:absolute; inset:0 0 auto 0; height:4px; background:linear-gradient(90deg,#50627a,#8aa0b8,#d8e1eb); opacity:.75; } .diet-analysis-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; } .diet-analysis-head h2{margin:4px 0 4px 0;letter-spacing:-.02em;} .diet-analysis-badge{ display:inline-flex; align-items:center; justify-content:center; padding:7px 10px; border-radius:999px; background:#eef3f8; color:#31465f; font-weight:700; font-size:12px; white-space:nowrap; border:1px solid rgba(49,70,95,.12); } .diet-analysis-grid{ display:grid; grid-template-columns:minmax(280px, 1.05fr) minmax(260px, .95fr); gap:14px; align-items:stretch; } .diet-matrix-card,.diet-analysis-summary-card,.diet-domain-profile,.diet-interpretation-card,.diet-analysis-help,.diet-analysis-extra-harvard{ border:1px solid rgba(28,46,70,.12); border-radius:18px; background:#fff; box-shadow:0 10px 24px rgba(18,34,56,.06); } .diet-matrix-card{padding:14px;} .diet-matrix-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;} .diet-matrix-topline span{ display:inline-flex;align-items:center;justify-content:center; padding:5px 8px;border-radius:999px;background:#f2f5f8;color:#40536b;font-size:12px;font-weight:700; } .diet-matrix{ --x:50; --y:50; position:relative; aspect-ratio:1/1; min-height:270px; border-radius:18px; border:1px solid rgba(30,48,70,.18); overflow:hidden; background: linear-gradient(90deg,rgba(255,255,255,.72) 0 1px,transparent 1px 25%), linear-gradient(0deg,rgba(255,255,255,.72) 0 1px,transparent 1px 25%), linear-gradient(135deg,#f2d9d9 0%,#f4e6d3 38%,#e8f0d8 68%,#d9ebe5 100%); background-size:25% 25%,25% 25%,100% 100%; } .diet-matrix::before,.diet-matrix::after{content:"";position:absolute;background:rgba(31,49,72,.32);z-index:1;} .diet-matrix::before{left:50%;top:0;width:1px;height:100%;} .diet-matrix::after{top:50%;left:0;height:1px;width:100%;} .diet-matrix-axis{position:absolute;z-index:3;font-size:11px;font-weight:800;letter-spacing:.02em;color:#22374f;text-transform:uppercase;background:rgba(255,255,255,.78);border:1px solid rgba(31,49,72,.12);border-radius:999px;padding:5px 8px;} .diet-matrix-axis-y{left:10px;top:10px;} .diet-matrix-axis-x{right:10px;bottom:10px;} .diet-matrix-zone{position:absolute;z-index:2;max-width:44%;font-size:11px;line-height:1.25;color:rgba(27,42,60,.62);font-weight:700;} .zone-top-left{left:14px;top:48px;} .zone-top-right{right:14px;top:48px;text-align:right;} .zone-bottom-left{left:14px;bottom:48px;} .zone-bottom-right{right:14px;bottom:48px;text-align:right;} .diet-matrix-point{ position:absolute;z-index:5;left:calc(var(--x)*1%);top:calc((100 - var(--y))*1%); transform:translate(-50%,-50%);width:22px;height:22px;border-radius:50%;background:#17283d;border:3px solid #fff;box-shadow:0 0 0 4px rgba(23,40,61,.18),0 8px 18px rgba(17,32,52,.22); } .diet-matrix-point span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:6px;height:6px;border-radius:50%;background:#fff;} .diet-matrix-scale{display:flex;justify-content:space-between;gap:10px;margin-top:8px;color:#607086;font-size:12px;} .diet-analysis-summary-card{padding:16px;display:flex;flex-direction:column;gap:12px;} .diet-analysis-score-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;} .diet-analysis-score-row div{border:1px solid rgba(28,46,70,.1);border-radius:14px;background:#f8fafc;padding:12px;} .diet-analysis-score-row span{display:block;color:#607086;font-size:12px;margin-bottom:4px;} .diet-analysis-score-row strong{font-size:26px;line-height:1;color:#17283d;} .diet-analysis-main{border-left:4px solid #6f849f;background:#f4f7fa;border-radius:12px;padding:12px 12px 12px 14px;line-height:1.5;color:#22374f;} .diet-analysis-step{border:1px solid rgba(91,121,86,.16);background:#f6faf4;border-radius:14px;padding:12px;line-height:1.45;color:#2d4b32;} .diet-domain-profile{margin-top:14px;padding:14px;display:grid;gap:10px;} .diet-domain-row{display:grid;grid-template-columns:minmax(140px, 1fr) minmax(90px, auto);gap:10px;align-items:center;border:1px solid rgba(28,46,70,.09);background:#fff;border-radius:14px;padding:10px 12px;} .diet-domain-row b{font-size:14px;color:#22374f;} .diet-domain-row small{display:block;color:#66768c;line-height:1.35;margin-top:3px;} .diet-domain-meter{display:flex;align-items:center;gap:8px;min-width:140px;} .diet-domain-track{position:relative;flex:1;height:8px;border-radius:999px;background:#e8edf3;overflow:hidden;} .diet-domain-fill{position:absolute;left:0;top:0;bottom:0;width:calc(var(--value,0)*1%);border-radius:inherit;background:#647b94;} .diet-domain-value{font-weight:800;color:#22374f;white-space:nowrap;font-size:13px;} .diet-domain-placeholder{color:#64748b;font-size:14px;padding:4px;} .diet-interpretation-card{margin-top:14px;padding:14px;border-left:4px solid #7b8797;} .diet-interpretation-card p{margin:6px 0 10px;color:#53657b;line-height:1.45;} .diet-interpretation-status{font-weight:700;color:#22374f;background:#f5f7fa;border-radius:12px;padding:10px;} .diet-analysis-help{margin-top:14px;padding:0;} .diet-analysis-help summary,.diet-analysis-extra-harvard summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;} .diet-analysis-help summary::-webkit-details-marker,.diet-analysis-extra-harvard summary::-webkit-details-marker{display:none;} .diet-analysis-help summary span,.diet-analysis-extra-harvard summary span{color:#68788c;font-size:13px;line-height:1.35;text-align:right;} .diet-analysis-help-body{padding:0 16px 16px;line-height:1.55;color:#384b62;} .diet-analysis-extra-harvard{margin-top:14px;background:#fbfcfe;} .diet-analysis-extra-harvard-body{padding:0 12px 12px;} .harvard-plate-card-embedded{box-shadow:none;border:0;background:transparent;margin:0;padding:0;} .diet-analysis-extra-harvard[open] > summary{border-bottom:1px solid rgba(28,46,70,.10);} @media (max-width: 780px){ .diet-analysis-head{flex-direction:column;gap:8px;} .diet-analysis-grid{grid-template-columns:1fr;} .diet-matrix{min-height:260px;} .diet-domain-row{grid-template-columns:1fr;} .diet-domain-meter{min-width:0;} .diet-analysis-help summary,.diet-analysis-extra-harvard summary{align-items:flex-start;flex-direction:column;} .diet-analysis-help summary span,.diet-analysis-extra-harvard summary span{text-align:left;} } /* v5.3.36 — method formulas, dairy functional layer, interpretation clarity */ .diet-domain-row[data-domain-status="good"] .diet-domain-fill{background:#4f7664;} .diet-domain-row[data-domain-status="neutral"] .diet-domain-fill{background:#6f849f;} .diet-domain-row[data-domain-status="warn"] .diet-domain-fill{background:#a9804d;} .diet-domain-row[data-domain-status="bad"] .diet-domain-fill{background:#9b5a58;} .diet-domain-status{ min-width:72px; text-align:right; color:#53657b; font-size:12px; font-weight:700; white-space:nowrap; } .diet-method-facts{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:2px; } .diet-method-facts div{ border:1px solid rgba(28,46,70,.10); background:#f8fafc; border-radius:12px; padding:9px 10px; } .diet-method-facts b{display:block;color:#4b5e75;font-size:11px;line-height:1.25;margin-bottom:4px;} .diet-method-facts span{display:block;color:#17283d;font-weight:800;font-size:14px;} .diet-analysis-help-body p{margin:0 0 10px;} @media (max-width:780px){ .diet-method-facts{grid-template-columns:1fr;} .diet-domain-meter{display:grid;grid-template-columns:auto 1fr auto;width:100%;} .diet-domain-status{text-align:left;min-width:0;} } /* v5.3.36 — final medical dashboard UI for Integrated Diet Analysis Profile */ .diet-analysis-card{ --diet-zone-accent:#6f849f; --diet-zone-bg:#f5f8fb; background: radial-gradient(circle at 0 0,rgba(96,123,150,.10),transparent 34%), linear-gradient(180deg,#fff 0%,#f7fafc 100%); } .diet-analysis-card[data-profile-zone="strong"]{--diet-zone-accent:#4f7664;--diet-zone-bg:#f3f8f5;} .diet-analysis-card[data-profile-zone="structure"]{--diet-zone-accent:#8a6f48;--diet-zone-bg:#faf7f0;} .diet-analysis-card[data-profile-zone="quality"]{--diet-zone-accent:#647b94;--diet-zone-bg:#f3f6fa;} .diet-analysis-card[data-profile-zone="complex"]{--diet-zone-accent:#8b5a5a;--diet-zone-bg:#fbf4f3;} .diet-analysis-card::before{background:linear-gradient(90deg,var(--diet-zone-accent),#b7c3cf,#e6edf3);height:5px;} .diet-analysis-head h2{font-size:clamp(24px,3vw,34px);} .diet-analysis-head .muted{max-width:860px;line-height:1.55;} .diet-analysis-badge{ background:var(--diet-zone-bg); color:#1f344c; border-color:color-mix(in srgb,var(--diet-zone-accent) 26%, transparent); box-shadow:0 8px 18px rgba(25,45,70,.06); } .diet-matrix-card{ padding:16px; background:linear-gradient(180deg,#fff,#f9fbfd); } .diet-matrix-topline{ align-items:flex-start; border-bottom:1px solid rgba(31,49,72,.08); padding-bottom:10px; } .diet-matrix-topline strong{display:block;font-size:18px;color:#17283d;letter-spacing:-.01em;} .diet-matrix-topline small{display:block;margin-top:3px;color:#66768c;line-height:1.35;} .diet-matrix-topline > span{ background:var(--diet-zone-bg); border:1px solid color-mix(in srgb,var(--diet-zone-accent) 22%, transparent); color:#1e3349; } .diet-matrix-frame{ display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto; gap:8px; align-items:center; margin-top:10px; } .diet-matrix-y-caption{ grid-column:1; grid-row:1; writing-mode:vertical-rl; transform:rotate(180deg); color:#50627a; font-size:12px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; text-align:center; } .diet-matrix-x-caption{ grid-column:2; grid-row:2; text-align:center; color:#50627a; font-size:12px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; } .diet-matrix{ grid-column:2; grid-row:1; min-height:300px; border-radius:20px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.38),0 14px 26px rgba(19,35,54,.08); background: linear-gradient(90deg,rgba(36,54,76,.10) 0 1px,transparent 1px 25%), linear-gradient(0deg,rgba(36,54,76,.10) 0 1px,transparent 1px 25%), linear-gradient(135deg,#f0d5d5 0%,#f4e7d7 42%,#e5efd8 68%,#d7ece4 100%); background-size:25% 25%,25% 25%,100% 100%; } .diet-matrix::before,.diet-matrix::after{background:rgba(31,49,72,.18);} .diet-matrix-threshold{position:absolute;z-index:2;background:rgba(20,34,50,.28);} .diet-matrix-threshold.threshold-x{left:70%;top:0;width:1px;height:100%;} .diet-matrix-threshold.threshold-y{top:30%;left:0;height:1px;width:100%;} .diet-matrix-axis{font-size:10px;letter-spacing:.04em;background:rgba(255,255,255,.86);} .diet-matrix-zone{ max-width:46%; color:rgba(31,49,72,.70); font-size:11px; font-weight:600; line-height:1.32; } .diet-matrix-zone b{color:rgba(24,39,57,.86);font-weight:900;} .zone-top-left{top:42px;} .zone-top-right{top:42px;} .zone-bottom-left{bottom:42px;} .zone-bottom-right{bottom:42px;} .diet-matrix-point{ width:24px; height:24px; background:#10243a; box-shadow:0 0 0 5px color-mix(in srgb,var(--diet-zone-accent) 22%, transparent),0 10px 22px rgba(17,32,52,.24); } .diet-matrix-point-caption{ position:absolute; left:calc(var(--x)*1%); top:calc((100 - var(--y))*1%); transform:translate(14px,-34px); z-index:6; max-width:180px; padding:6px 8px; border-radius:11px; border:1px solid rgba(20,34,50,.14); background:rgba(255,255,255,.92); box-shadow:0 8px 18px rgba(17,32,52,.12); color:#1e3349; font-size:12px; font-weight:800; line-height:1.25; white-space:nowrap; pointer-events:none; } .diet-matrix-corner{ position:absolute; z-index:4; color:rgba(31,49,72,.52); font-size:10px; font-weight:900; background:rgba(255,255,255,.70); border-radius:8px; padding:2px 4px; } .tick-y-100{left:6px;top:6px}.tick-y-0{left:6px;bottom:6px}.tick-x-0{left:28px;bottom:6px}.tick-x-100{right:6px;bottom:6px} .diet-matrix-scale{font-weight:700;color:#53657b;} .diet-analysis-summary-card{ background:linear-gradient(180deg,#fff,var(--diet-zone-bg)); border-color:color-mix(in srgb,var(--diet-zone-accent) 18%, transparent); } .diet-analysis-score-row div{background:#fff;border-color:rgba(31,49,72,.11);} .diet-analysis-score-row strong{font-size:clamp(26px,4vw,36px);} .diet-analysis-main{ border-left-color:var(--diet-zone-accent); background:rgba(255,255,255,.72); color:#1f344c; font-size:15px; } .diet-analysis-step{ background:#fff; border-color:color-mix(in srgb,var(--diet-zone-accent) 20%, transparent); color:#263d55; } .diet-domain-profile{ padding:16px; background:linear-gradient(180deg,#fff,#fbfcfe); } .diet-domain-section-title{ display:flex; align-items:flex-end; justify-content:space-between; gap:14px; padding:4px 2px 0; } .diet-domain-section-title:not(:first-child){margin-top:6px;padding-top:12px;border-top:1px solid rgba(31,49,72,.08);} .diet-domain-section-title strong{color:#17283d;font-size:16px;letter-spacing:-.01em;} .diet-domain-section-title span{max-width:520px;text-align:right;color:#68788c;font-size:12px;line-height:1.35;} .diet-domain-row{ grid-template-columns:minmax(190px,1fr) minmax(230px,auto); border-color:rgba(31,49,72,.10); box-shadow:0 6px 14px rgba(20,35,55,.035); } .diet-domain-row[data-domain="hei"],.diet-domain-row[data-domain="structure"]{ background:#f8fbfe; border-color:rgba(31,49,72,.15); } .diet-domain-label b{font-size:14px;} .diet-domain-label small{font-size:12px;} .diet-domain-track{height:10px;background:#e6ecf2;} .diet-domain-fill{transition:width .18s ease-out;} .diet-interpretation-card{ background:linear-gradient(180deg,#fff,#f9fafc); border-left-color:#7b8797; } .diet-interpretation-card[data-reliability="high"]{border-left-color:#4f7664;background:#f7fbf8;} .diet-interpretation-card[data-reliability="medium"]{border-left-color:#8a6f48;background:#fbf9f3;} .diet-interpretation-card[data-reliability="low"]{border-left-color:#8b5a5a;background:#fbf5f4;} .diet-interpretation-status{display:grid;gap:6px;background:rgba(255,255,255,.72);border:1px solid rgba(31,49,72,.10);} .diet-interpretation-status span{font-weight:900;color:#17283d;} .diet-interpretation-status em{font-style:normal;font-weight:500;line-height:1.45;color:#41566e;} .diet-method-facts div{background:rgba(255,255,255,.78);} .diet-analysis-help,.diet-analysis-extra-harvard{box-shadow:0 8px 18px rgba(18,34,56,.045);} .diet-analysis-help summary strong,.diet-analysis-extra-harvard summary strong{font-size:15px;color:#17283d;} @media (max-width:780px){ .diet-matrix-card{padding:13px;} .diet-matrix-frame{grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:7px;} .diet-matrix-y-caption{grid-column:1;grid-row:1;writing-mode:horizontal-tb;transform:none;text-align:left;} .diet-matrix{grid-column:1;grid-row:2;min-height:270px;border-radius:17px;} .diet-matrix-x-caption{grid-column:1;grid-row:3;} .diet-matrix-zone{font-size:10px;max-width:48%;} .diet-matrix-point-caption{max-width:150px;white-space:normal;transform:translate(-6px,-42px);font-size:11px;} .diet-matrix-axis{display:none;} .diet-domain-section-title{display:block;} .diet-domain-section-title span{display:block;max-width:none;text-align:left;margin-top:4px;} .diet-domain-row{grid-template-columns:1fr;padding:11px;} .diet-domain-meter{grid-template-columns:1fr;gap:6px;} .diet-domain-status{order:1;} .diet-domain-track{order:2;width:100%;} .diet-domain-value{order:3;} .diet-analysis-score-row strong{font-size:28px;} } @media (max-width:420px){ .diet-matrix{min-height:245px;} .diet-matrix-zone{font-size:9.5px;line-height:1.25;} .zone-top-left,.zone-top-right{top:34px;} .zone-bottom-left,.zone-bottom-right{bottom:34px;} .diet-matrix-point-caption{display:none;} } /* v5.3.36 — Diet profile clarity dashboard: interactive matrix and domain accordions */ .diet-profile-quick-guide{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:14px 0 16px; } .diet-profile-quick-guide div{ border:1px solid rgba(31,49,72,.10); background:linear-gradient(180deg,#fff,#f8fbfe); border-radius:16px; padding:12px 13px; box-shadow:0 8px 18px rgba(18,34,56,.035); } .diet-profile-quick-guide b{display:block;color:#17283d;font-size:13px;margin-bottom:4px;} .diet-profile-quick-guide span{display:block;color:#65758b;font-size:12px;line-height:1.35;} .diet-matrix-card{border-color:rgba(31,49,72,.12);} .diet-matrix-topline{align-items:flex-start;} .diet-matrix-topline > span{ min-width:128px; text-align:center; border-color:rgba(31,49,72,.14); box-shadow:inset 0 0 0 1px rgba(255,255,255,.55); } .diet-matrix{ background: linear-gradient(90deg, rgba(255,255,255,.46) 1px, transparent 1px), linear-gradient(0deg, rgba(255,255,255,.46) 1px, transparent 1px), linear-gradient(135deg, rgba(154,85,85,.18) 0%, rgba(180,137,72,.13) 42%, rgba(79,118,100,.18) 100%); background-size:25% 25%,25% 25%,100% 100%; box-shadow:inset 0 0 0 1px rgba(31,49,72,.12), inset 0 16px 30px rgba(255,255,255,.35); } .diet-matrix-zone{ border:1px solid transparent; border-radius:12px; padding:6px 7px; cursor:pointer; transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease; } .diet-matrix-zone:hover,.diet-matrix-zone:focus-visible{ background:rgba(255,255,255,.68); border-color:rgba(31,49,72,.18); outline:none; box-shadow:0 8px 18px rgba(18,34,56,.10); } .diet-matrix-zone.is-current-zone{ background:rgba(255,255,255,.76); border-color:rgba(31,49,72,.24); box-shadow:0 10px 22px rgba(18,34,56,.12); } .diet-matrix-zone.is-selected-zone{ transform:translateY(-1px); box-shadow:0 12px 26px rgba(18,34,56,.16); } .diet-matrix-point{ width:26px; height:26px; margin:-13px 0 0 -13px; border:4px solid #fff; box-shadow:0 0 0 2px rgba(22,40,62,.42),0 12px 28px rgba(18,34,56,.28); } .diet-matrix-point span{width:8px;height:8px;background:#17283d;} .diet-matrix-point::before,.diet-matrix-point::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:999px;border:1px solid rgba(23,40,61,.26);width:38px;height:38px;pointer-events:none;} .diet-matrix-point::after{width:52px;height:52px;border-color:rgba(23,40,61,.12);} .diet-matrix-point-caption{ background:#fff; border:1px solid rgba(31,49,72,.18); box-shadow:0 10px 22px rgba(18,34,56,.12); color:#17283d; } .diet-matrix-zone-explain{ margin-top:12px; border:1px solid rgba(31,49,72,.12); border-radius:16px; background:linear-gradient(180deg,#fff,#f7fafc); padding:13px; color:#31445c; line-height:1.5; } .diet-zone-explain-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;} .diet-zone-explain-head span{font-size:11px;letter-spacing:.05em;text-transform:uppercase;font-weight:800;color:#6a7c92;} .diet-zone-explain-head strong{font-size:16px;color:#17283d;text-align:right;} .diet-matrix-zone-explain p{margin:7px 0 10px;} .diet-zone-explain-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:9px 0;} .diet-zone-explain-grid div{border:1px solid rgba(31,49,72,.09);border-radius:12px;background:#fff;padding:9px;} .diet-zone-explain-grid span{display:block;color:#6a7c92;font-size:11px;margin-bottom:2px;} .diet-zone-explain-grid b{display:block;color:#17283d;font-size:14px;} .diet-matrix-zone-explain em{display:block;font-style:normal;color:#4a5f77;background:#f0f5f8;border-radius:12px;padding:9px;margin-top:8px;} .diet-domain-intro{ border:1px solid rgba(31,49,72,.10); border-radius:15px; background:#f7fafc; padding:12px; display:flex; justify-content:space-between; gap:12px; align-items:flex-start; } .diet-domain-intro strong{color:#17283d;} .diet-domain-intro span{color:#66768c;font-size:12px;line-height:1.35;text-align:right;max-width:520px;} .diet-domain-detail{display:block;} .diet-domain-detail > summary{list-style:none;cursor:pointer;} .diet-domain-detail > summary::-webkit-details-marker{display:none;} .diet-domain-summary{ display:grid; grid-template-columns:minmax(150px,1fr) minmax(190px,auto) auto; gap:10px; align-items:center; } .diet-domain-chevron{ width:28px;height:28px;display:grid;place-items:center;border-radius:999px;background:#eef3f7;color:#31445c;font-weight:900;transition:transform .16s ease,background .16s ease; } .diet-domain-detail[open] .diet-domain-chevron{transform:rotate(180deg);background:#e0e9f0;} .diet-domain-detail[open]{border-color:rgba(31,49,72,.18);box-shadow:0 10px 22px rgba(18,34,56,.06);} .diet-domain-detail-body{ margin-top:10px; padding:11px 12px; border-radius:13px; background:#f7fafc; color:#384b62; line-height:1.52; border:1px solid rgba(31,49,72,.08); } .diet-domain-detail-body p{margin:0 0 9px;} .diet-domain-detail-body p:last-child{margin-bottom:0;} .diet-analysis-main,.diet-analysis-step{font-size:14px;} .diet-analysis-main b,.diet-analysis-step b{color:inherit;} @media (max-width:760px){ .diet-profile-quick-guide{grid-template-columns:1fr;gap:8px;margin:11px 0 13px;} .diet-profile-quick-guide div{padding:10px 11px;border-radius:14px;} .diet-matrix-topline{display:grid;grid-template-columns:1fr;gap:8px;} .diet-matrix-topline > span{width:100%;text-align:left;} .diet-matrix{min-height:310px;} .diet-matrix-zone{font-size:10px;line-height:1.25;padding:5px;} .diet-matrix-point{width:24px;height:24px;margin:-12px 0 0 -12px;} .diet-matrix-point-caption{display:block;max-width:136px;font-size:10.5px;transform:translate(-6px,-44px);} .diet-zone-explain-head{display:block;} .diet-zone-explain-head strong{display:block;text-align:left;margin-top:2px;} .diet-zone-explain-grid{grid-template-columns:1fr;} .diet-domain-intro{display:block;} .diet-domain-intro span{display:block;text-align:left;margin-top:4px;max-width:none;} .diet-domain-summary{grid-template-columns:1fr auto;} .diet-domain-summary .diet-domain-meter{grid-column:1 / -1;} .diet-domain-chevron{grid-column:2;grid-row:1;align-self:start;} } @media (max-width:420px){ .diet-matrix{min-height:290px;} .diet-matrix-zone{max-width:52%;font-size:9px;} .diet-matrix-point-caption{max-width:116px;font-size:10px;} } /* v5.3.36 — Matrix Interaction & Clarity: diagnostic coordinate grid */ .diet-matrix{ --x:50; --y:50; border-radius:22px; border:1px solid rgba(20,34,50,.26); background: linear-gradient(90deg, rgba(23,40,61,.105) 1px, transparent 1px), linear-gradient(0deg, rgba(23,40,61,.105) 1px, transparent 1px), linear-gradient(90deg, rgba(23,40,61,.18) 1px, transparent 1px), linear-gradient(0deg, rgba(23,40,61,.18) 1px, transparent 1px), linear-gradient(135deg, rgba(139,90,90,.20) 0%, rgba(160,128,77,.14) 43%, rgba(79,118,100,.20) 100%); background-size:10% 10%,10% 10%,25% 25%,25% 25%,100% 100%; box-shadow:inset 0 0 0 2px rgba(255,255,255,.55), inset 0 0 0 1px rgba(20,34,50,.20), 0 14px 30px rgba(18,34,56,.10); } .diet-matrix::before,.diet-matrix::after{background:rgba(20,34,50,.26);z-index:2;} .diet-matrix-threshold{position:absolute;z-index:2;background:rgba(20,34,50,.24);pointer-events:none;} .diet-matrix-threshold.threshold-x-50{left:50%;top:0;width:1px;height:100%;} .diet-matrix-threshold.threshold-y-50{left:0;top:50%;width:100%;height:1px;} .diet-matrix::selection{background:transparent;} .diet-matrix-axis{ appearance:none; border:1px solid rgba(20,34,50,.18); cursor:pointer; box-shadow:0 8px 16px rgba(18,34,56,.08); transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease; } .diet-matrix-axis:hover,.diet-matrix-axis:focus-visible,.diet-matrix-axis.is-selected-inspect{ background:#fff; border-color:rgba(20,34,50,.34); outline:none; transform:translateY(-1px); box-shadow:0 12px 22px rgba(18,34,56,.14); } .diet-matrix-threshold-button{ appearance:none; position:absolute; z-index:7; border:1px solid rgba(20,34,50,.22); background:rgba(255,255,255,.88); color:#22374f; border-radius:999px; padding:3px 6px; font-size:10px; font-weight:900; line-height:1; cursor:pointer; box-shadow:0 6px 12px rgba(18,34,56,.08); } .diet-matrix-threshold-button:hover,.diet-matrix-threshold-button:focus-visible,.diet-matrix-threshold-button.is-selected-inspect{ background:#fff; border-color:#20364e; outline:none; box-shadow:0 10px 18px rgba(18,34,56,.16); } .diet-matrix-threshold-button.threshold-x-70{left:70%;bottom:28px;transform:translateX(-50%);} .diet-matrix-threshold-button.threshold-y-70{left:30px;top:30%;transform:translateY(-50%);} .diet-matrix-threshold-button.threshold-x-50{left:50%;bottom:28px;transform:translateX(-50%);} .diet-matrix-threshold-button.threshold-y-50{left:30px;top:50%;transform:translateY(-50%);} .diet-matrix-projection{position:absolute;z-index:4;pointer-events:none;opacity:.82;} .diet-matrix-projection.projection-x{ left:calc(var(--x)*1%); top:calc((100 - var(--y))*1%); bottom:0; border-left:2px dashed rgba(23,40,61,.44); } .diet-matrix-projection.projection-y{ left:0; top:calc((100 - var(--y))*1%); width:calc(var(--x)*1%); border-top:2px dashed rgba(23,40,61,.44); } .diet-matrix-score-badge{ position:absolute; z-index:8; border:1px solid rgba(20,34,50,.18); background:rgba(255,255,255,.92); color:#17283d; border-radius:11px; padding:5px 7px; font-size:10.5px; font-weight:900; line-height:1; box-shadow:0 8px 16px rgba(18,34,56,.10); pointer-events:none; } .diet-matrix-score-badge.badge-hei{left:8px;top:calc((100 - var(--y))*1%);transform:translateY(-50%);} .diet-matrix-score-badge.badge-structure{left:calc(var(--x)*1%);bottom:8px;transform:translateX(-50%);} .diet-matrix-point{ appearance:none; padding:0; border-radius:50%; cursor:pointer; border:4px solid #fff; background:#10243a; } .diet-matrix-point:hover,.diet-matrix-point:focus-visible,.diet-matrix-point.is-selected-inspect{ outline:none; box-shadow:0 0 0 2px rgba(22,40,62,.55),0 0 0 8px color-mix(in srgb,var(--diet-zone-accent) 25%, transparent),0 14px 30px rgba(18,34,56,.32); } .diet-matrix-corner{font-variant-numeric:tabular-nums;} .tick-y-75{left:6px;top:25%}.tick-y-50{left:6px;top:50%;transform:translateY(-50%)}.tick-y-25{left:6px;top:75%;transform:translateY(-50%)} .tick-x-25{left:25%;bottom:6px;transform:translateX(-50%)}.tick-x-50{left:50%;bottom:6px;transform:translateX(-50%)}.tick-x-75{left:75%;bottom:6px;transform:translateX(-50%)} .diet-matrix-control-chips{ display:flex; flex-wrap:wrap; gap:7px; margin:10px 0 0; } .diet-matrix-control-chips button{ appearance:none; border:1px solid rgba(31,49,72,.13); background:#fff; color:#31445c; border-radius:999px; padding:7px 10px; font-size:12px; font-weight:800; cursor:pointer; box-shadow:0 5px 12px rgba(18,34,56,.04); } .diet-matrix-control-chips button:hover,.diet-matrix-control-chips button:focus-visible,.diet-matrix-control-chips button.is-selected-inspect{ outline:none; border-color:color-mix(in srgb,var(--diet-zone-accent) 45%, rgba(31,49,72,.2)); background:var(--diet-zone-bg); color:#17283d; } .diet-selected-domain-list{ border:1px solid rgba(31,49,72,.10); background:#fff; border-radius:12px; padding:10px 11px; margin:9px 0; } .diet-selected-domain-list b{display:block;color:#17283d;margin-bottom:4px;} .diet-selected-domain-list ul{margin:4px 0 0 18px;padding:0;color:#455c75;line-height:1.45;} .diet-analysis-card[data-matrix-inspect="axis-structure"] .diet-domain-row[data-domain="plant"], .diet-analysis-card[data-matrix-inspect="axis-structure"] .diet-domain-row[data-domain="whole"], .diet-analysis-card[data-matrix-inspect="axis-structure"] .diet-domain-row[data-domain="protein"], .diet-analysis-card[data-matrix-inspect="axis-structure"] .diet-domain-row[data-domain="dairy"], .diet-analysis-card[data-matrix-inspect="axis-structure"] .diet-domain-row[data-domain="outside"], .diet-analysis-card[data-matrix-inspect="axis-structure"] .diet-domain-row[data-domain="balance"], .diet-analysis-card[data-matrix-inspect="axis-hei"] .diet-domain-row[data-domain="hei"], .diet-analysis-card[data-matrix-inspect="point"] .diet-domain-row[open], .diet-analysis-card[data-matrix-inspect="agreement"] .diet-interpretation-card{ border-color:color-mix(in srgb,var(--diet-zone-accent) 34%, rgba(31,49,72,.12)); box-shadow:0 10px 22px rgba(18,34,56,.08); } @media (max-width:760px){ .diet-matrix{min-height:330px;} .diet-matrix-threshold-button{font-size:9.5px;padding:3px 5px;} .diet-matrix-threshold-button.threshold-y-70,.diet-matrix-threshold-button.threshold-y-50{left:24px;} .diet-matrix-score-badge.badge-hei{left:6px;} .diet-matrix-score-badge.badge-structure{bottom:6px;} .diet-matrix-control-chips{display:grid;grid-template-columns:1fr 1fr;} .diet-matrix-control-chips button{padding:8px 9px;text-align:center;} } @media (max-width:420px){ .diet-matrix{min-height:305px;} .diet-matrix-score-badge{font-size:9.5px;padding:4px 5px;} .diet-matrix-threshold-button.threshold-x-70,.diet-matrix-threshold-button.threshold-x-50{bottom:24px;} .diet-matrix-point-caption{display:none;} } .diet-matrix-point{margin:0;transform:translate(-50%,-50%);} /* v5.3.36 — Product-level redesign of Diet Analysis Profile */ .diet-analysis-redesigned{ --profile-ink:#142235; --profile-muted:#627286; --profile-line:rgba(20,34,53,.13); --profile-soft:#f6f9fc; --profile-accent:#2f4968; padding-top:24px; } .diet-analysis-redesigned .diet-analysis-head-redesigned{ margin-bottom:14px; } .diet-analysis-redesigned .diet-analysis-head h2{font-size:clamp(26px,4vw,36px);} .diet-analysis-redesigned .diet-analysis-head .muted{font-size:14px;max-width:820px;} .diet-overview-card{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(250px,.9fr); gap:12px; align-items:stretch; border:1px solid var(--profile-line); border-radius:22px; background:linear-gradient(180deg,#fff,#f8fbfd); box-shadow:0 16px 34px rgba(18,34,56,.07); padding:14px; margin:12px 0 14px; } .diet-overview-main{display:flex;flex-direction:column;gap:10px;min-width:0;} .diet-overview-kicker{font-size:11px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:#6a7d94;} .diet-analysis-redesigned .diet-analysis-main{ border:0; background:transparent; padding:0; border-radius:0; font-size:clamp(16px,2.5vw,20px); line-height:1.45; font-weight:800; letter-spacing:-.01em; color:var(--profile-ink); } .diet-analysis-redesigned .diet-analysis-step{ border:1px solid rgba(79,118,100,.18); background:#f4faf6; border-radius:16px; padding:11px 12px; font-size:14px; color:#2e5138; } .diet-overview-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;} .diet-overview-metric{ appearance:none; border:1px solid rgba(20,34,53,.11); background:#fff; border-radius:18px; padding:12px 10px; display:flex; flex-direction:column; gap:4px; text-align:left; cursor:pointer; box-shadow:0 8px 18px rgba(18,34,56,.045); transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease; } .diet-overview-metric:hover,.diet-overview-metric:focus-visible,.diet-overview-metric.is-selected-inspect{ transform:translateY(-1px); border-color:rgba(20,34,53,.28); box-shadow:0 13px 24px rgba(18,34,56,.095); outline:none; } .diet-overview-metric span{font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:#65778d;} .diet-overview-metric strong{font-size:clamp(24px,5vw,34px);line-height:1;color:var(--profile-ink);} .diet-overview-metric small{font-size:11px;color:#6a7d94;line-height:1.2;} .diet-method-facts-host{margin:0 0 14px;} .diet-matrix-card-redesigned{ padding:16px; border-radius:22px; border:1px solid rgba(20,34,53,.14); background:#fff; box-shadow:0 16px 34px rgba(18,34,56,.075); } .diet-matrix-card-redesigned .diet-matrix-topline{ border-bottom:0; padding-bottom:0; margin-bottom:12px; } .diet-matrix-card-redesigned .diet-matrix-topline strong{font-size:20px;} .diet-matrix-card-redesigned .diet-matrix-topline small{font-size:13px;line-height:1.4;} .diet-matrix-card-redesigned .diet-matrix-topline > span{ min-width:0; padding:7px 10px; border-radius:999px; font-size:12px; background:var(--diet-zone-bg,#f4f7fa); } .diet-matrix-shell{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px; align-items:center; } .diet-matrix-wrap{min-width:0;} .diet-matrix-card-redesigned .diet-matrix-y-caption{ writing-mode:vertical-rl; transform:rotate(180deg); font-weight:900; color:#354a63; font-size:12px; letter-spacing:.02em; text-align:center; } .diet-matrix-card-redesigned .diet-matrix-x-caption{ margin-top:8px; text-align:center; font-weight:900; color:#354a63; font-size:12px; letter-spacing:.02em; } .diet-analysis-redesigned .diet-matrix{ --x:50; --y:50; position:relative; min-height:360px; aspect-ratio:1/1; border-radius:20px; border:1px solid rgba(20,34,53,.30); overflow:hidden; background: linear-gradient(90deg,rgba(20,34,53,.08) 1px,transparent 1px), linear-gradient(0deg,rgba(20,34,53,.08) 1px,transparent 1px), linear-gradient(90deg,rgba(20,34,53,.16) 1px,transparent 1px), linear-gradient(0deg,rgba(20,34,53,.16) 1px,transparent 1px), linear-gradient(135deg,#f8efee 0%,#f5f2e9 42%,#edf5ef 100%); background-size:10% 10%,10% 10%,25% 25%,25% 25%,100% 100%; box-shadow:inset 0 0 0 2px rgba(255,255,255,.75),0 12px 28px rgba(18,34,56,.09); } .diet-analysis-redesigned .diet-matrix::before, .diet-analysis-redesigned .diet-matrix::after{ content:""; position:absolute; z-index:5; background:rgba(20,34,53,.32); pointer-events:none; } .diet-analysis-redesigned .diet-matrix::before{left:50%;top:0;width:1px;height:100%;} .diet-analysis-redesigned .diet-matrix::after{top:50%;left:0;height:1px;width:100%;} .diet-analysis-redesigned .diet-matrix-zone{ appearance:none; position:absolute!important; z-index:2; width:50%!important; height:50%!important; max-width:none!important; border:0; border-radius:0; padding:14px!important; cursor:pointer; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; text-align:center!important; background:transparent; color:#2b4059; transition:background .16s ease,box-shadow .16s ease,outline-color .16s ease; } .diet-analysis-redesigned .zone-top-left{left:0!important;top:0!important;right:auto!important;bottom:auto!important;} .diet-analysis-redesigned .zone-top-right{left:50%!important;top:0!important;right:auto!important;bottom:auto!important;} .diet-analysis-redesigned .zone-bottom-left{left:0!important;top:50%!important;right:auto!important;bottom:auto!important;} .diet-analysis-redesigned .zone-bottom-right{left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;} .diet-analysis-redesigned .diet-matrix-zone span{font-size:clamp(14px,3.2vw,18px);font-weight:950;letter-spacing:-.02em;color:#182a40;} .diet-analysis-redesigned .diet-matrix-zone small{font-size:11px;line-height:1.15;color:#5f7187;font-weight:800;} .diet-analysis-redesigned .diet-matrix-zone:hover, .diet-analysis-redesigned .diet-matrix-zone:focus-visible, .diet-analysis-redesigned .diet-matrix-zone.is-selected-zone{ background:rgba(255,255,255,.55); outline:2px solid rgba(20,34,53,.18); outline-offset:-8px; box-shadow:inset 0 0 0 1px rgba(20,34,53,.12); } .diet-analysis-redesigned .diet-matrix-zone.is-current-zone{ background:rgba(255,255,255,.70); outline:2px solid var(--diet-zone-accent,#6f849f); outline-offset:-8px; box-shadow:inset 0 0 0 1px rgba(20,34,53,.14),0 0 0 1px rgba(255,255,255,.7); } .diet-analysis-redesigned .diet-matrix-threshold{z-index:6;background:rgba(20,34,53,.26);pointer-events:none;} .diet-analysis-redesigned .diet-matrix-threshold.threshold-x-50{left:50%;top:0;width:1px;height:100%;} .diet-analysis-redesigned .diet-matrix-threshold.threshold-y-50{left:0;top:50%;height:1px;width:100%;} .diet-analysis-redesigned .diet-matrix-axis{ z-index:12; border:1px solid rgba(20,34,53,.18); background:rgba(255,255,255,.92); color:#1d3149; border-radius:999px; padding:6px 9px; font-size:10px; font-weight:950; } .diet-analysis-redesigned .diet-matrix-axis-y{left:10px;top:10px;} .diet-analysis-redesigned .diet-matrix-axis-x{right:10px;bottom:10px;} .diet-analysis-redesigned .diet-matrix-axis-label{ position:absolute; z-index:9; font-size:10px; font-weight:900; color:#5c7087; background:rgba(255,255,255,.72); border:1px solid rgba(20,34,53,.08); border-radius:999px; padding:2px 5px; pointer-events:none; } .diet-analysis-redesigned .y-high{left:8px;top:8px;} .diet-analysis-redesigned .y-mid{left:8px;top:50%;transform:translateY(-50%);} .diet-analysis-redesigned .y-low{left:8px;bottom:8px;} .diet-analysis-redesigned .x-low{left:8px;bottom:8px;} .diet-analysis-redesigned .x-mid{left:50%;bottom:8px;transform:translateX(-50%);} .diet-analysis-redesigned .x-high{right:8px;bottom:8px;} .diet-analysis-redesigned .diet-matrix-projection{z-index:13;pointer-events:none;opacity:.95;} .diet-analysis-redesigned .diet-matrix-projection.projection-x{ left:calc(var(--x)*1%); top:calc((100 - var(--y))*1%); bottom:0; border-left:2px dashed rgba(20,34,53,.46); } .diet-analysis-redesigned .diet-matrix-projection.projection-y{ left:0; top:calc((100 - var(--y))*1%); width:calc(var(--x)*1%); border-top:2px dashed rgba(20,34,53,.46); } .diet-analysis-redesigned .diet-matrix-point{ z-index:20; width:28px; height:28px; margin:-14px 0 0 -14px; background:#10243a; border:4px solid #fff; box-shadow:0 0 0 3px rgba(16,36,58,.42),0 13px 28px rgba(18,34,56,.35); } .diet-analysis-redesigned .diet-matrix-point::before{width:44px;height:44px;border-color:rgba(16,36,58,.25);} .diet-analysis-redesigned .diet-matrix-point::after{width:58px;height:58px;border-color:rgba(16,36,58,.12);} .diet-analysis-redesigned .diet-matrix-point-caption{ z-index:21; background:#fff; border:1px solid rgba(20,34,53,.18); color:#10243a; border-radius:12px; padding:6px 8px; font-size:11px; font-weight:950; box-shadow:0 10px 24px rgba(18,34,56,.16); } .diet-analysis-redesigned .diet-matrix-score-badge{z-index:19;background:#fff;border-color:rgba(20,34,53,.18);font-size:10px;} .diet-matrix-actions{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; margin-top:11px; } .diet-matrix-actions button{ appearance:none; border:1px solid rgba(20,34,53,.12); background:#f8fbfd; color:#2e435c; border-radius:999px; padding:8px 7px; font-size:12px; font-weight:900; cursor:pointer; } .diet-matrix-actions button:hover,.diet-matrix-actions button:focus-visible,.diet-matrix-actions button.is-selected-inspect{background:#fff;border-color:rgba(20,34,53,.30);outline:none;box-shadow:0 8px 16px rgba(18,34,56,.09);} .diet-analysis-redesigned .diet-matrix-zone-explain{ margin-top:13px; border-radius:18px; border:1px solid rgba(20,34,53,.13); background:linear-gradient(180deg,#fff,#f7fafc); padding:14px; box-shadow:0 10px 24px rgba(18,34,56,.055); } .diet-analysis-redesigned .diet-domain-profile, .diet-analysis-redesigned .diet-interpretation-card, .diet-analysis-redesigned .diet-analysis-help{ border-radius:20px; } .diet-analysis-redesigned .diet-domain-row{border-radius:16px;} @media(max-width:780px){ .diet-overview-card{grid-template-columns:1fr;padding:12px;border-radius:20px;} .diet-overview-metrics{grid-template-columns:repeat(3,minmax(0,1fr));} .diet-overview-metric{padding:10px 8px;border-radius:15px;} .diet-overview-metric strong{font-size:25px;} .diet-matrix-shell{grid-template-columns:1fr;} .diet-matrix-card-redesigned .diet-matrix-y-caption{writing-mode:horizontal-tb;transform:none;text-align:left;} .diet-analysis-redesigned .diet-matrix{min-height:330px;} .diet-matrix-actions{grid-template-columns:repeat(2,minmax(0,1fr));} .diet-matrix-actions button:first-child{grid-column:1 / -1;} .diet-analysis-redesigned .diet-matrix-axis{display:none;} .diet-analysis-redesigned .diet-matrix-zone{padding:10px 8px!important;} .diet-analysis-redesigned .diet-matrix-zone span{font-size:15px;} .diet-analysis-redesigned .diet-matrix-zone small{font-size:10px;} } @media(max-width:420px){ .diet-overview-metrics{grid-template-columns:1fr 1fr;} .diet-overview-metric:last-child{grid-column:1 / -1;} .diet-analysis-redesigned .diet-matrix{min-height:305px;} .diet-analysis-redesigned .diet-matrix-point-caption{display:block;max-width:120px;font-size:10px;} .diet-analysis-redesigned .diet-matrix-zone span{font-size:13px;} .diet-analysis-redesigned .diet-matrix-zone small{font-size:9.5px;} } /* v5.3.36 — clinical map rebuild: no decorative coordinate chart, clear diagnostic board */ .diet-analysis-card.diet-analysis-redesigned{ background:linear-gradient(180deg,#ffffff 0%,#f6f9fc 100%); } .diet-analysis-card .diet-overview-card{ border:1px solid rgba(23,40,61,.10); border-radius:22px; background:#fff; box-shadow:0 12px 28px rgba(15,32,52,.07); padding:14px; } .diet-overview-kicker{ display:inline-flex; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#5d6d82; margin-bottom:8px; } .diet-analysis-card .diet-analysis-main{ border:0; border-radius:18px; background:#f4f7fb; padding:14px; color:#18314c; font-size:15px; } .diet-analysis-card .diet-analysis-step{ border-radius:18px; background:#f4faf5; border:1px solid rgba(58,103,68,.14); margin-top:10px; } .diet-clinical-map-card{ margin-top:14px; padding:16px; border-radius:24px; border:1px solid rgba(23,40,61,.12); background:linear-gradient(180deg,#ffffff 0%,#f8fbfe 100%); box-shadow:0 14px 30px rgba(15,32,52,.07); } .diet-map-topline{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:12px; border-bottom:1px solid rgba(23,40,61,.08); } .diet-map-topline strong{display:block;color:#142b44;font-size:19px;letter-spacing:-.015em;} .diet-map-topline small{display:block;margin-top:4px;color:#5e6f84;line-height:1.45;max-width:720px;} .diet-map-topline > span{ display:inline-flex; align-items:center; justify-content:center; min-height:30px; padding:7px 10px; border-radius:999px; font-size:12px; font-weight:800; color:#17304a; background:var(--diet-zone-bg,#f4f7fa); border:1px solid rgba(23,40,61,.12); white-space:nowrap; } .diet-map-summary-strip{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:14px; } .diet-map-score-card{ appearance:none; text-align:left; border:1px solid rgba(23,40,61,.11); background:#fff; border-radius:18px; padding:12px; min-height:126px; display:flex; flex-direction:column; gap:6px; box-shadow:0 8px 18px rgba(15,32,52,.045); cursor:pointer; } .diet-map-score-card span{font-size:12px;font-weight:800;color:#53677f;text-transform:uppercase;letter-spacing:.04em;} .diet-map-score-card strong{font-size:27px;line-height:1;color:#142b44;letter-spacing:-.02em;} .diet-map-score-card em{font-style:normal;color:#66778c;line-height:1.35;font-size:12px;} .diet-map-score-card:focus-visible,.diet-map-score-card:hover{ outline:none; border-color:rgba(23,40,61,.28); box-shadow:0 0 0 3px rgba(77,103,132,.12),0 10px 20px rgba(15,32,52,.07); } .diet-map-mini-scale{ position:relative; display:block; height:9px; border-radius:999px; background:linear-gradient(90deg,#e5e9ef 0%,#e5e9ef 50%,#d5dde7 50%,#d5dde7 70%,#c4d2df 70%,#c4d2df 100%); overflow:hidden; margin-top:auto; } .diet-map-mini-scale b{ display:block; width:calc(var(--value,0) * 1%); height:100%; border-radius:inherit; background:#243850; } .diet-map-score-card-neutral .diet-map-mini-scale b{background:#5e6f84;} .diet-zone-board{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:14px; } .diet-zone-tile{ appearance:none; display:flex; flex-direction:column; text-align:left; gap:5px; min-height:118px; padding:14px; border-radius:20px; border:1px solid rgba(23,40,61,.10); background:#fff; box-shadow:0 8px 18px rgba(15,32,52,.045); cursor:pointer; } .diet-zone-tile span{font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#708096;} .diet-zone-tile strong{font-size:16px;line-height:1.2;color:#142b44;letter-spacing:-.01em;} .diet-zone-tile em{font-size:13px;line-height:1.38;color:#5b6b80;font-style:normal;} .diet-zone-tile.is-current-zone{ border-color:color-mix(in srgb,var(--diet-zone-accent,#5e6f84) 42%, transparent); background:linear-gradient(180deg,var(--diet-zone-bg,#f5f8fb),#fff); box-shadow:0 0 0 3px color-mix(in srgb,var(--diet-zone-accent,#5e6f84) 12%, transparent),0 12px 24px rgba(15,32,52,.07); } .diet-zone-tile.is-current-zone span::after{content:" · текущая";} .diet-zone-tile.is-selected-zone{outline:2px solid color-mix(in srgb,var(--diet-zone-accent,#5e6f84) 52%, transparent);outline-offset:2px;} .diet-zone-tile:focus-visible,.diet-zone-tile:hover{border-color:rgba(23,40,61,.28);} .diet-map-note{ margin-top:12px; padding:12px 14px; border-radius:18px; background:#f5f8fb; color:#40546c; line-height:1.45; font-size:13px; border:1px solid rgba(23,40,61,.08); } .diet-map-note strong{color:#18314c;} .diet-map-actions{ margin-top:12px; display:flex; flex-wrap:wrap; gap:8px; } .diet-map-actions button{ border:1px solid rgba(23,40,61,.12); background:#fff; color:#223950; border-radius:999px; padding:8px 11px; font-weight:800; font-size:12px; cursor:pointer; } .diet-map-actions button.is-selected-inspect, .diet-map-actions button:hover, .diet-map-actions button:focus-visible{ border-color:rgba(23,40,61,.28); background:#edf3f8; outline:none; } .diet-map-explain{ margin-top:12px; border-radius:20px; border:1px solid rgba(23,40,61,.10); background:#fff; box-shadow:0 8px 18px rgba(15,32,52,.045); } .diet-zone-explain-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; border-bottom:1px solid rgba(23,40,61,.08); padding-bottom:10px; margin-bottom:10px; } .diet-zone-explain-head span{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:#68798d;} .diet-zone-explain-head strong{color:#142b44;font-size:16px;text-align:right;} .diet-zone-explain-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0;} .diet-zone-explain-grid div{border:1px solid rgba(23,40,61,.08);border-radius:14px;background:#f8fafc;padding:9px;} .diet-zone-explain-grid span{display:block;font-size:11px;color:#68798d;margin-bottom:4px;} .diet-zone-explain-grid b{color:#142b44;} .diet-selected-domain-list ul{margin:8px 0 0 18px;padding:0;} .diet-domain-profile{border-radius:22px;} .diet-domain-summary{min-height:58px;} @media (max-width:780px){ .diet-clinical-map-card{padding:13px;border-radius:22px;} .diet-map-topline{flex-direction:column;align-items:flex-start;} .diet-map-summary-strip{grid-template-columns:1fr;} .diet-map-score-card{min-height:auto;} .diet-zone-board{grid-template-columns:1fr;} .diet-zone-tile{min-height:auto;} .diet-zone-explain-head{flex-direction:column;gap:4px;} .diet-zone-explain-head strong{text-align:left;} .diet-zone-explain-grid{grid-template-columns:1fr;} } /* v5.3.37 — strict matrix grid dashboard rebuild */ .diet-analysis-card[data-profile-zone]{ --diet-matrix-line: rgba(31,49,72,.14); --diet-matrix-line-strong: rgba(31,49,72,.30); --diet-matrix-axis: #1a2e45; --diet-matrix-bg: #fbfcfe; } .diet-clinical-map-card{ padding:14px; border-radius:22px; background:linear-gradient(180deg,#ffffff 0%,#f7fafc 100%); border:1px solid rgba(29,47,68,.11); box-shadow:0 14px 34px rgba(23,39,56,.08); } .diet-map-topline-v5337{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:0 0 12px; border-bottom:1px solid rgba(31,49,72,.10); } .diet-map-topline-v5337 strong{font-size:18px;color:#17283d;letter-spacing:-.01em;} .diet-map-topline-v5337 small{display:block;margin-top:4px;color:#607086;line-height:1.45;} .diet-map-topline-v5337 > span{ border:1px solid rgba(31,49,72,.12); background:#f7fafc; color:#1c3148; border-radius:999px; padding:7px 10px; font-size:12px; font-weight:800; white-space:nowrap; } .diet-map-summary-strip-v5337{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:12px 0 12px;} .diet-map-score-card{ text-align:left; border:1px solid rgba(31,49,72,.12); border-radius:16px; background:#fff; padding:12px; cursor:pointer; box-shadow:0 8px 18px rgba(19,35,54,.04); } .diet-map-score-card span{display:block;color:#607086;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;} .diet-map-score-card strong{display:block;color:#16283c;font-size:24px;line-height:1;margin:6px 0 5px;} .diet-map-score-card em{display:block;font-style:normal;color:#64748b;font-size:12px;line-height:1.3;min-height:30px;} .diet-map-mini-scale{display:block;position:relative;height:6px;border-radius:99px;background:#e6edf4;margin-top:8px;overflow:hidden;} .diet-map-mini-scale b{display:block;height:100%;width:calc(var(--value,0)*1%);background:#5f7893;border-radius:inherit;} .diet-map-score-card.is-selected-inspect,.diet-map-score-card:focus-visible{outline:2px solid rgba(38,82,128,.36);outline-offset:2px;} .diet-matrix-dashboard-v5337{ margin-top:12px; border:1px solid rgba(31,49,72,.12); border-radius:22px; background:linear-gradient(180deg,#fdfefe,#f7fafc); padding:12px; } .diet-matrix-axis-row{display:flex;justify-content:center;margin:0 0 8px;} .diet-matrix-axis-row-bottom{margin:8px 0 0;} .diet-matrix-axis-pill{ border:1px solid rgba(31,49,72,.13); background:#fff; color:#20364f; border-radius:999px; padding:8px 12px; font-size:12px; font-weight:900; text-transform:uppercase; letter-spacing:.03em; cursor:pointer; } .diet-matrix-axis-pill.is-selected-inspect,.diet-matrix-axis-pill:focus-visible{outline:2px solid rgba(38,82,128,.35);outline-offset:2px;background:#f3f7fb;} .diet-matrix-stage-v5337{display:grid;grid-template-columns:34px minmax(0,1fr);gap:7px;align-items:stretch;} .diet-matrix-y-scale{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;color:#6a7a90;font-size:10px;font-weight:800;padding:3px 0;} .diet-matrix-x-scale{display:grid;grid-template-columns:34px repeat(5,1fr);gap:0;color:#6a7a90;font-size:10px;font-weight:800;margin-top:5px;} .diet-matrix-x-scale span{text-align:center;} .diet-matrix-x-scale span:first-child{grid-column:2;} .diet-matrix-grid-v5337{ position:relative; isolation:isolate; width:100%; aspect-ratio:1/1; min-height:286px; border-radius:16px; border:2px solid rgba(31,49,72,.34); overflow:hidden; background: linear-gradient(90deg,var(--diet-matrix-line) 1px,transparent 1px), linear-gradient(0deg,var(--diet-matrix-line) 1px,transparent 1px), linear-gradient(90deg,var(--diet-matrix-line-strong) 1px,transparent 1px), linear-gradient(0deg,var(--diet-matrix-line-strong) 1px,transparent 1px), linear-gradient(135deg,rgba(145,86,86,.13) 0%,rgba(160,124,77,.11) 42%,rgba(84,118,95,.10) 68%,rgba(64,112,140,.12) 100%), #fbfcfe; background-size:10% 10%,10% 10%,25% 25%,25% 25%,100% 100%,100% 100%; } .diet-matrix-grid-v5337::before,.diet-matrix-grid-v5337::after{ content:"";position:absolute;z-index:2;background:rgba(31,49,72,.34);pointer-events:none; } .diet-matrix-grid-v5337::before{left:50%;top:0;width:1px;height:100%;} .diet-matrix-grid-v5337::after{left:0;top:50%;width:100%;height:1px;} .diet-matrix-zone-q{ position:absolute; z-index:1; width:50%;height:50%; border:0;background:transparent; padding:10px; text-align:left; cursor:pointer; color:rgba(30,48,70,.70); } .diet-matrix-zone-q b{display:block;color:rgba(24,39,57,.86);font-size:11px;line-height:1.15;margin-bottom:3px;} .diet-matrix-zone-q span{display:block;font-size:10px;line-height:1.2;} .zone-q-structure{left:0;top:0;} .zone-q-strong{right:0;top:0;text-align:right;} .zone-q-complex{left:0;bottom:0;} .zone-q-quality{right:0;bottom:0;text-align:right;} .diet-matrix-zone-q.is-current-zone{box-shadow:inset 0 0 0 2px rgba(27,53,82,.22);background:rgba(255,255,255,.24);} .diet-matrix-zone-q.is-selected-zone,.diet-matrix-zone-q:focus-visible{outline:2px solid rgba(27,65,110,.40);outline-offset:-3px;background:rgba(255,255,255,.38);} .diet-matrix-threshold-v5337{position:absolute;z-index:3;pointer-events:none;background:rgba(25,43,64,.42);} .threshold-x50{left:50%;top:0;width:1px;height:100%;}.threshold-y50{left:0;top:50%;height:1px;width:100%;} .threshold-x70{left:70%;top:0;width:1px;height:100%;background:rgba(25,43,64,.26);}.threshold-y70{left:0;top:30%;height:1px;width:100%;background:rgba(25,43,64,.26);} .diet-matrix-threshold-label{position:absolute;z-index:4;background:rgba(255,255,255,.86);border:1px solid rgba(31,49,72,.12);border-radius:999px;padding:2px 5px;color:#53657b;font-size:10px;font-weight:900;line-height:1;} .label-x50{left:50%;bottom:5px;transform:translateX(-50%);}.label-x70{left:70%;bottom:5px;transform:translateX(-50%);} .label-y50{left:5px;top:50%;transform:translateY(-50%);}.label-y70{left:5px;top:30%;transform:translateY(-50%);} .diet-matrix-projection-line{position:absolute;z-index:5;background:rgba(16,36,58,.48);pointer-events:none;} .projection-hei{left:0;top:calc((100 - var(--y,50))*1%);width:calc(var(--x,50)*1%);height:1px;} .projection-structure{left:calc(var(--x,50)*1%);top:calc((100 - var(--y,50))*1%);bottom:0;width:1px;} .diet-matrix-projection-badge{position:absolute;z-index:8;border:1px solid rgba(31,49,72,.18);background:#fff;border-radius:999px;color:#1b3048;font-size:10px;font-weight:900;padding:4px 6px;box-shadow:0 5px 12px rgba(18,34,52,.10);pointer-events:none;} .projection-hei-badge{left:6px;top:calc((100 - var(--y,50))*1%);transform:translateY(-50%);} .projection-structure-badge{left:calc(var(--x,50)*1%);bottom:7px;transform:translateX(-50%);} .diet-matrix-point-v5337{position:absolute;z-index:10;left:calc(var(--x,50)*1%);top:calc((100 - var(--y,50))*1%);transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;border:4px solid #fff;background:#10243a;box-shadow:0 0 0 6px rgba(16,36,58,.18),0 12px 22px rgba(17,32,52,.24);cursor:pointer;} .diet-matrix-point-v5337 span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:#fff;} .diet-matrix-point-v5337:focus-visible{outline:3px solid rgba(38,82,128,.48);outline-offset:4px;} .diet-matrix-point-caption-v5337{position:absolute;z-index:9;left:calc(var(--x,50)*1%);top:calc((100 - var(--y,50))*1%);transform:translate(15px,-32px);max-width:145px;border:1px solid rgba(31,49,72,.16);background:rgba(255,255,255,.93);border-radius:12px;padding:6px 8px;color:#1f344c;font-size:11px;font-weight:900;line-height:1.2;box-shadow:0 8px 18px rgba(19,35,54,.10);pointer-events:none;} .diet-matrix-reading-v5337{margin-top:10px;border:1px solid rgba(31,49,72,.11);background:#fff;border-radius:14px;padding:10px 12px;color:#53657b;line-height:1.45;font-size:13px;} .diet-matrix-reading-v5337 strong{color:#1e3349;} .diet-map-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;} .diet-map-actions button{border:1px solid rgba(31,49,72,.13);background:#fff;color:#1f344c;border-radius:999px;padding:9px 11px;font-size:12px;font-weight:800;cursor:pointer;} .diet-map-actions button.is-selected-inspect,.diet-map-actions button:focus-visible{outline:2px solid rgba(38,82,128,.35);outline-offset:2px;background:#f2f6fa;} .diet-map-explain{margin-top:12px;border:1px solid rgba(31,49,72,.12);border-radius:18px;background:#fff;padding:14px;box-shadow:0 8px 18px rgba(19,35,54,.04);} @media (max-width:780px){ .diet-map-summary-strip-v5337{grid-template-columns:1fr;} .diet-matrix-dashboard-v5337{padding:10px;border-radius:18px;} .diet-matrix-stage-v5337{grid-template-columns:28px minmax(0,1fr);gap:5px;} .diet-matrix-grid-v5337{min-height:255px;border-radius:14px;} .diet-matrix-zone-q{padding:7px;} .diet-matrix-zone-q b{font-size:9.5px;} .diet-matrix-zone-q span{display:none;} .diet-matrix-point-v5337{width:28px;height:28px;} .diet-matrix-point-caption-v5337{font-size:10px;max-width:120px;transform:translate(12px,-31px);} .projection-hei-badge,.projection-structure-badge{font-size:9px;padding:3px 5px;} .diet-matrix-axis-pill{font-size:10px;padding:7px 10px;} } /* v5.3.39 — visual parity pass for premium coordinate matrix */ .diet-analysis-card[data-profile-zone]{ --diet-v538-ink:#10243a; --diet-v538-muted:#5f7187; --diet-v538-line:rgba(20,34,53,.135); --diet-v538-line-strong:rgba(20,34,53,.255); --diet-v538-card:#ffffff; --diet-v538-soft:#f7fafc; --diet-v538-blue:#eaf2fb; --diet-v538-green:#eef7ef; --diet-v538-warm:#fbf5e9; --diet-v538-rose:#fbefef; } .diet-clinical-map-card{ padding:16px; border-radius:26px; border:1px solid rgba(20,34,53,.105); background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%); box-shadow:0 18px 42px rgba(15,32,52,.075); } .diet-map-topline-v5338{ position:relative; display:grid; grid-template-columns:44px minmax(0,1fr); align-items:start; gap:12px; padding:0 0 14px; border-bottom:0; } .diet-map-topline-v5338 > span#dietMatrixZoneLabel{display:none;} .diet-map-topline-v5338 strong{ display:block; max-width:760px; color:var(--diet-v538-ink); font-size:clamp(23px,4.8vw,38px); line-height:1.08; letter-spacing:-.035em; font-weight:950; } .diet-map-topline-v5338 small{ display:block; margin-top:12px; color:#53647b; font-size:clamp(14px,2.8vw,18px); line-height:1.42; max-width:720px; } .diet-matrix-title-icon-v5338{ width:38px; height:38px; border-radius:13px; background:linear-gradient(180deg,#f5f7fa,#edf1f6); border:1px solid rgba(20,34,53,.08); box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 8px 18px rgba(15,32,52,.055); display:grid; place-items:center; margin-top:1px; } .diet-matrix-title-icon-v5338 span, .diet-matrix-title-icon-v5338 span::before, .diet-matrix-title-icon-v5338 span::after{box-sizing:border-box;} .diet-matrix-title-icon-v5338 span{ display:block; width:21px; height:21px; border:2px solid #263a54; border-radius:4px; position:relative; } .diet-matrix-title-icon-v5338 span::before, .diet-matrix-title-icon-v5338 span::after{ content:""; position:absolute; background:#263a54; opacity:.9; } .diet-matrix-title-icon-v5338 span::before{left:50%;top:0;width:2px;height:100%;transform:translateX(-50%);} .diet-matrix-title-icon-v5338 span::after{left:0;top:50%;width:100%;height:2px;transform:translateY(-50%);} .diet-matrix-dashboard-v5338{ margin-top:12px; border:0; border-radius:0; background:transparent; padding:0; } .diet-matrix-dashboard-v5338 .diet-matrix-axis-row{justify-content:flex-start;margin:0 0 8px 38px;} .diet-matrix-dashboard-v5338 .diet-matrix-axis-row-bottom{justify-content:center;margin:12px 0 0;} .diet-matrix-dashboard-v5338 .diet-matrix-axis-pill{ border:0; background:transparent; box-shadow:none; padding:0; border-radius:0; color:var(--diet-v538-ink); font-size:clamp(13px,2.8vw,16px); font-weight:850; text-transform:none; letter-spacing:-.01em; cursor:pointer; } .diet-matrix-dashboard-v5338 .diet-matrix-axis-pill:hover, .diet-matrix-dashboard-v5338 .diet-matrix-axis-pill:focus-visible, .diet-matrix-dashboard-v5338 .diet-matrix-axis-pill.is-selected-inspect{ outline:2px solid rgba(38,82,128,.28); outline-offset:5px; background:transparent; } .diet-matrix-stage-v5337{grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:stretch;} .diet-matrix-y-scale{ color:var(--diet-v538-ink); font-size:clamp(12px,3.2vw,17px); font-weight:600; line-height:1; padding:1px 0 0; } .diet-matrix-x-scale{ grid-template-columns:34px repeat(5,1fr); margin-top:8px; color:var(--diet-v538-ink); font-size:clamp(12px,3.2vw,17px); font-weight:600; line-height:1; } .diet-matrix-grid-v5338{ min-height:0; aspect-ratio:1/1; border-radius:0 13px 0 0; border:1.5px solid rgba(20,34,53,.46); border-left-width:2px; border-bottom-width:2px; overflow:visible; background: radial-gradient(circle at calc(var(--x,50)*1%) calc((100 - var(--y,50))*1%), rgba(35,55,80,.10) 0 32px, transparent 62px), linear-gradient(90deg,rgba(255,255,255,0) 0%, rgba(244,239,229,.50) 46%, rgba(232,240,236,.62) 56%, rgba(232,240,236,.78) 100%), linear-gradient(180deg,rgba(255,255,255,0) 0%, rgba(255,255,255,.10) 47%, rgba(246,249,252,.72) 100%), linear-gradient(90deg,var(--diet-v538-line) 1px,transparent 1px), linear-gradient(0deg,var(--diet-v538-line) 1px,transparent 1px), linear-gradient(90deg,var(--diet-v538-line-strong) 1px,transparent 1px), linear-gradient(0deg,var(--diet-v538-line-strong) 1px,transparent 1px), linear-gradient(135deg,var(--diet-v538-rose) 0%, #fbf6ee 45%, var(--diet-v538-green) 100%); background-size:100% 100%,100% 100%,100% 100%,10% 10%,10% 10%,25% 25%,25% 25%,100% 100%; box-shadow:inset 0 0 0 1px rgba(255,255,255,.72),0 12px 28px rgba(15,32,52,.06); } .diet-matrix-grid-v5338::before, .diet-matrix-grid-v5338::after{background:rgba(20,34,53,.17);z-index:2;} .diet-matrix-grid-v5338::before{width:1px;} .diet-matrix-grid-v5338::after{height:1px;} .diet-matrix-grid-v5338 .threshold-x70, .diet-matrix-grid-v5338 .threshold-y70, .diet-matrix-grid-v5338 .label-x70, .diet-matrix-grid-v5338 .label-y70, .diet-matrix-grid-v5338 .label-x50, .diet-matrix-grid-v5338 .label-y50{display:none;} .diet-matrix-grid-v5338 .threshold-x50, .diet-matrix-grid-v5338 .threshold-y50{background:rgba(20,34,53,.15);z-index:3;} .diet-matrix-grid-v5338 .diet-matrix-zone-q{ z-index:1; padding:0!important; color:#65758c; pointer-events:auto; } .diet-matrix-grid-v5338 .diet-matrix-zone-q b{ position:absolute; display:block; max-width:46%; color:#65758c; font-size:clamp(12px,3.2vw,16px); line-height:1.18; letter-spacing:-.015em; font-weight:650; margin:0; } .diet-matrix-grid-v5338 .diet-matrix-zone-q span{display:none;} .diet-matrix-grid-v5338 .zone-q-structure b{left:8%;top:7%;text-align:left;} .diet-matrix-grid-v5338 .zone-q-strong b{right:8%;top:7%;text-align:right;} .diet-matrix-grid-v5338 .zone-q-complex b{left:7%;bottom:8%;text-align:left;} .diet-matrix-grid-v5338 .zone-q-quality b{right:7%;bottom:8%;text-align:right;} .diet-matrix-grid-v5338 .diet-matrix-zone-q.is-current-zone{box-shadow:none;background:rgba(255,255,255,.12);} .diet-matrix-grid-v5338 .diet-matrix-zone-q.is-current-zone b{color:#30455d;font-weight:780;} .diet-matrix-grid-v5338 .diet-matrix-zone-q.is-selected-zone, .diet-matrix-grid-v5338 .diet-matrix-zone-q:focus-visible{ outline:2px solid rgba(31,73,121,.28); outline-offset:-7px; background:rgba(255,255,255,.22); } .diet-matrix-grid-v5338 .projection-hei, .diet-matrix-grid-v5338 .projection-structure{ z-index:5; background:none; border-color:rgba(16,36,58,.76); border-style:dashed; border-width:0; } .diet-matrix-grid-v5338 .projection-hei{ height:0; border-top-width:2px; } .diet-matrix-grid-v5338 .projection-structure{ width:0; border-left-width:2px; } .diet-matrix-grid-v5338 .diet-matrix-projection-badge{ z-index:9; min-width:34px; height:30px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(16,36,58,.20); border-radius:10px; background:#10243a; color:#fff; font-size:15px; font-weight:780; line-height:1; padding:0 7px; box-shadow:0 9px 18px rgba(16,36,58,.20); } .diet-matrix-grid-v5338 .projection-hei-badge{left:-69px;} .diet-matrix-grid-v5338 .projection-structure-badge{bottom:-41px;} .diet-matrix-grid-v5338 .diet-matrix-point-v5337{ z-index:12; width:26px; height:26px; border:4px solid #fff; background:#10243a; box-shadow:0 0 0 2px rgba(16,36,58,.34),0 0 0 16px rgba(16,36,58,.085),0 13px 26px rgba(16,36,58,.32); } .diet-matrix-grid-v5338 .diet-matrix-point-v5337 span{display:none;} .diet-matrix-grid-v5338 .diet-matrix-point-v5337:hover, .diet-matrix-grid-v5338 .diet-matrix-point-v5337:focus-visible, .diet-matrix-grid-v5338 .diet-matrix-point-v5337.is-selected-inspect{ outline:none; box-shadow:0 0 0 2px rgba(16,36,58,.42),0 0 0 18px rgba(16,36,58,.105),0 16px 32px rgba(16,36,58,.36); } .diet-matrix-grid-v5338 .diet-matrix-point-caption-v5337{ z-index:11; transform:translate(22px,-8px); max-width:174px; min-width:112px; border:0; border-radius:10px; background:#10243a; color:#fff; padding:11px 13px 12px; box-shadow:0 16px 32px rgba(16,36,58,.24); font-weight:650; font-size:13px; line-height:1.22; letter-spacing:-.01em; } .diet-matrix-grid-v5338 .diet-matrix-point-caption-v5337::before{ content:""; position:absolute; left:-9px; top:15px; width:18px; height:18px; background:#10243a; transform:rotate(45deg); border-radius:2px; } .diet-matrix-grid-v5338 .diet-matrix-point-caption-v5337 b{ display:block; font-size:22px; line-height:1; letter-spacing:-.03em; margin-bottom:5px; color:#fff; position:relative; } .diet-matrix-grid-v5338 .diet-matrix-point-caption-v5337 span{ display:block; color:rgba(255,255,255,.88); position:relative; } .diet-map-summary-strip-v5338{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:18px 0 14px; } .diet-map-summary-strip-v5338 .diet-map-score-card{ position:relative; min-height:92px; border-radius:18px; padding:13px 13px 12px 58px; background:#fff; border:1px solid rgba(20,34,53,.10); box-shadow:0 9px 20px rgba(15,32,52,.045); } .diet-map-summary-strip-v5338 .diet-map-score-card::before{ content:""; position:absolute; left:13px; top:50%; transform:translateY(-50%); width:34px; height:34px; border-radius:12px; background:#eef4ff; border:1px solid rgba(20,34,53,.04); } .diet-map-summary-strip-v5338 .diet-map-score-card::after{ position:absolute; left:23px; top:50%; transform:translateY(-50%); font-size:17px; line-height:1; } .diet-map-summary-strip-v5338 .diet-map-score-card-quality::after{content:"◇";color:#2f68be;} .diet-map-summary-strip-v5338 .diet-map-score-card-structure::before{background:#eef8ef;} .diet-map-summary-strip-v5338 .diet-map-score-card-structure::after{content:"☷";color:#2d8b48;} .diet-map-summary-strip-v5338 .diet-map-score-card-zone::before{background:#fff4df;} .diet-map-summary-strip-v5338 .diet-map-score-card-zone::after{content:"⚖";color:#d17a18;left:21px;} .diet-map-summary-strip-v5338 .diet-map-score-card span{ color:#334a64; font-size:13px; font-weight:650; letter-spacing:0; text-transform:none; } .diet-map-summary-strip-v5338 .diet-map-score-card strong{ color:var(--diet-v538-ink); font-size:26px; font-weight:850; letter-spacing:-.035em; line-height:1.02; margin:4px 0 0; } .diet-map-summary-strip-v5338 .diet-map-score-card-zone strong{ font-size:18px; line-height:1.15; max-width:130px; } .diet-map-summary-strip-v5338 .diet-map-score-card em, .diet-map-summary-strip-v5338 .diet-map-mini-scale{display:none;} .diet-matrix-insight-v5338{ display:flex; align-items:flex-start; gap:12px; margin-top:0; border:0; border-radius:18px; background:linear-gradient(180deg,#f3f8ff,#f7fbff); padding:14px 16px; box-shadow:inset 0 0 0 1px rgba(41,94,150,.055); color:#324a66; font-size:15px; line-height:1.45; } .diet-matrix-insight-v5338 strong{ flex:0 0 auto; display:grid; place-items:center; width:28px; height:28px; border-radius:999px; background:#72a7f4; color:#fff; font-size:0; margin-top:1px; } .diet-matrix-insight-v5338 strong::before{content:"i";font-size:16px;font-weight:850;line-height:1;} .diet-matrix-actions.diet-map-actions{margin-top:14px;} @media (max-width:780px){ .diet-clinical-map-card{padding:14px;border-radius:24px;} .diet-map-topline-v5338{grid-template-columns:42px minmax(0,1fr);gap:11px;} .diet-map-topline-v5338 strong{font-size:26px;} .diet-map-topline-v5338 small{font-size:16px;margin-top:10px;} .diet-matrix-dashboard-v5338 .diet-matrix-axis-row{margin-left:34px;} .diet-matrix-dashboard-v5338 .diet-matrix-axis-row-bottom{margin-left:0;} .diet-matrix-stage-v5337{grid-template-columns:30px minmax(0,1fr);gap:7px;} .diet-matrix-grid-v5338{min-height:auto;} .diet-matrix-y-scale,.diet-matrix-x-scale{font-size:15px;} .diet-matrix-x-scale{grid-template-columns:30px repeat(5,1fr);} .diet-matrix-grid-v5338 .diet-matrix-zone-q b{font-size:14px;} .diet-matrix-grid-v5338 .projection-hei-badge{left:-55px;} .diet-matrix-grid-v5338 .projection-structure-badge{bottom:-38px;} .diet-map-summary-strip-v5338{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;} .diet-map-summary-strip-v5338 .diet-map-score-card{padding:12px 10px 12px 48px;min-height:82px;border-radius:16px;} .diet-map-summary-strip-v5338 .diet-map-score-card::before{left:10px;width:30px;height:30px;border-radius:10px;} .diet-map-summary-strip-v5338 .diet-map-score-card::after{left:19px;font-size:15px;} .diet-map-summary-strip-v5338 .diet-map-score-card-zone::after{left:17px;} .diet-map-summary-strip-v5338 .diet-map-score-card span{font-size:12px;} .diet-map-summary-strip-v5338 .diet-map-score-card strong{font-size:22px;} .diet-map-summary-strip-v5338 .diet-map-score-card-zone strong{font-size:16px;} .diet-matrix-insight-v5338{font-size:14px;padding:13px 14px;} } @media (max-width:430px){ .diet-clinical-map-card{padding:13px;border-radius:22px;} .diet-map-topline-v5338{grid-template-columns:38px minmax(0,1fr);gap:10px;} .diet-matrix-title-icon-v5338{width:34px;height:34px;border-radius:12px;} .diet-map-topline-v5338 strong{font-size:24px;line-height:1.10;} .diet-map-topline-v5338 small{font-size:14px;line-height:1.43;} .diet-matrix-dashboard-v5338 .diet-matrix-axis-row{margin-left:32px;} .diet-matrix-stage-v5337{grid-template-columns:28px minmax(0,1fr);gap:6px;} .diet-matrix-y-scale,.diet-matrix-x-scale{font-size:14px;} .diet-matrix-x-scale{grid-template-columns:28px repeat(5,1fr);} .diet-matrix-grid-v5338 .diet-matrix-zone-q b{font-size:12.5px;} .diet-matrix-grid-v5338 .diet-matrix-point-v5337{width:24px;height:24px;border-width:4px;} .diet-matrix-grid-v5338 .diet-matrix-point-caption-v5337{max-width:132px;min-width:100px;padding:9px 10px;transform:translate(18px,-8px);font-size:11px;} .diet-matrix-grid-v5338 .diet-matrix-point-caption-v5337 b{font-size:19px;} .diet-matrix-grid-v5338 .diet-matrix-projection-badge{min-width:30px;height:27px;border-radius:9px;font-size:14px;} .diet-matrix-grid-v5338 .projection-hei-badge{left:-49px;} .diet-matrix-grid-v5338 .projection-structure-badge{bottom:-36px;} .diet-map-summary-strip-v5338{grid-template-columns:1fr 1fr;gap:8px;margin-top:17px;} .diet-map-summary-strip-v5338 .diet-map-score-card-zone{grid-column:1 / -1;} .diet-map-summary-strip-v5338 .diet-map-score-card-zone strong{max-width:none;} } @media (max-width:360px){ .diet-map-topline-v5338 strong{font-size:22px;} .diet-matrix-grid-v5338 .diet-matrix-zone-q b{font-size:11.5px;} .diet-matrix-grid-v5338 .diet-matrix-point-caption-v5337{transform:translate(14px,-8px);max-width:112px;} .diet-matrix-grid-v5338 .diet-matrix-point-caption-v5337 b{font-size:17px;} } .diet-matrix-grid-v5338[data-point-side="left"] .diet-matrix-point-caption-v5337{ transform:translate(calc(-100% - 22px),-8px); } .diet-matrix-grid-v5338[data-point-side="left"] .diet-matrix-point-caption-v5337::before{ left:auto; right:-9px; } @media (max-width:430px){ .diet-matrix-grid-v5338[data-point-side="left"] .diet-matrix-point-caption-v5337{transform:translate(calc(-100% - 18px),-8px);} } /* v5.3.39 — matrix visual parity refinements */ .diet-matrix-grid-v5338 .diet-matrix-zone-q.is-current-zone{ box-shadow:none; background:rgba(255,255,255,.08); } .diet-matrix-grid-v5338 .diet-matrix-zone-q.is-current-zone b{ color:#5f7087; font-weight:680; } .diet-matrix-grid-v5338 .diet-matrix-zone-q.is-selected-zone, .diet-matrix-grid-v5338 .diet-matrix-zone-q:focus-visible{ outline:2px solid rgba(31,73,121,.24); outline-offset:-7px; background:rgba(255,255,255,.18); } @media (max-width:430px){ .diet-map-summary-strip-v5338{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; } .diet-map-summary-strip-v5338 .diet-map-score-card, .diet-map-summary-strip-v5338 .diet-map-score-card-zone{ grid-column:auto; min-height:78px; border-radius:15px; padding:11px 7px 10px 39px; } .diet-map-summary-strip-v5338 .diet-map-score-card::before{ left:8px; width:27px; height:27px; border-radius:9px; } .diet-map-summary-strip-v5338 .diet-map-score-card::after{ left:16px; font-size:13px; } .diet-map-summary-strip-v5338 .diet-map-score-card-zone::after{ left:14px; } .diet-map-summary-strip-v5338 .diet-map-score-card span{ font-size:11px; line-height:1.08; } .diet-map-summary-strip-v5338 .diet-map-score-card strong{ font-size:19px; line-height:1.02; } .diet-map-summary-strip-v5338 .diet-map-score-card-zone strong{ max-width:88px; font-size:13.5px; line-height:1.16; } } @media (max-width:360px){ .diet-map-summary-strip-v5338{ gap:6px; } .diet-map-summary-strip-v5338 .diet-map-score-card, .diet-map-summary-strip-v5338 .diet-map-score-card-zone{ padding-left:8px; padding-right:6px; min-height:72px; } .diet-map-summary-strip-v5338 .diet-map-score-card::before, .diet-map-summary-strip-v5338 .diet-map-score-card::after{ display:none; } .diet-map-summary-strip-v5338 .diet-map-score-card strong{ font-size:17px; } .diet-map-summary-strip-v5338 .diet-map-score-card-zone strong{ font-size:12.5px; } } /* v5.3.43 — full rebuild of profile matrix block as a production UI module */ .diet-profile-v540{ --matrix-ink:#10243a; --matrix-muted:#5f7187; --matrix-line:rgba(20,34,53,.105); --matrix-line-strong:rgba(20,34,53,.185); --matrix-axis:rgba(20,34,53,.66); --matrix-card-shadow:0 22px 54px rgba(15,32,52,.105); } .diet-profile-v540 .diet-analysis-head-redesigned{margin-bottom:14px;} .diet-profile-v540 .diet-analysis-head-redesigned .muted{max-width:720px;} /* The old profile preface made the matrix look secondary. In v5.3.43 the matrix becomes the hero. */ .diet-profile-v540 > .diet-overview-card, .diet-profile-v540 > #dietMethodFacts{display:none!important;} .diet-profile-v540 .diet-matrix-card-v540{ margin-top:12px; padding:26px 26px 24px; border-radius:30px; background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%); border:1px solid rgba(20,34,53,.075); box-shadow:var(--matrix-card-shadow); overflow:hidden; } .diet-profile-v540 .diet-map-topline-v540{ display:grid!important; grid-template-columns:54px minmax(0,1fr); align-items:start; gap:16px; padding:0 0 25px; margin:0; border:0!important; } .diet-profile-v540 .diet-map-topline-v540 > span{display:none!important;} .diet-profile-v540 .diet-matrix-title-icon-v5338{ width:50px; height:50px; border-radius:17px; background:linear-gradient(180deg,#f5f7fb,#eef2f7); border:1px solid rgba(20,34,53,.055); box-shadow:inset 0 1px 0 rgba(255,255,255,.86),0 8px 18px rgba(15,32,52,.045); } .diet-profile-v540 .diet-matrix-title-icon-v5338 span, .diet-profile-v540 .diet-matrix-title-icon-v5338 span::before, .diet-profile-v540 .diet-matrix-title-icon-v5338 span::after{background:var(--matrix-ink);} .diet-profile-v540 .diet-map-topline-v540 strong{ display:block; max-width:680px; color:var(--matrix-ink); font-size:clamp(28px,4.8vw,44px)!important; font-weight:840; line-height:1.08; letter-spacing:-.042em; } .diet-profile-v540 .diet-map-topline-v540 small{ display:block; max-width:650px; margin-top:16px!important; color:#52627a; font-size:clamp(16px,3.05vw,22px)!important; line-height:1.42!important; letter-spacing:-.015em; } .diet-profile-v540 .diet-matrix-dashboard-v540{ margin:0; padding:0!important; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; } .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row{ justify-content:flex-start; margin:0 0 12px 44px!important; } .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row-bottom{ justify-content:center; margin:14px 0 0!important; } .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-pill{ border:0!important; background:transparent!important; box-shadow:none!important; padding:0!important; border-radius:0!important; color:var(--matrix-ink)!important; font-size:clamp(15px,3.25vw,20px)!important; font-weight:680!important; letter-spacing:-.018em!important; text-transform:none!important; } .diet-profile-v540 .diet-matrix-stage-v5337{ display:grid; grid-template-columns:44px minmax(0,1fr)!important; gap:9px!important; align-items:stretch; } .diet-profile-v540 .diet-matrix-y-scale{ padding:0!important; color:var(--matrix-ink)!important; font-size:clamp(14px,3.25vw,19px)!important; font-weight:610!important; line-height:1!important; } .diet-profile-v540 .diet-matrix-x-scale{ position:relative!important; display:block!important; height:24px; margin-top:9px!important; color:var(--matrix-ink)!important; font-size:clamp(14px,3.25vw,19px)!important; font-weight:610!important; line-height:1!important; padding-left:44px; } .diet-profile-v540 .diet-matrix-x-scale span{ position:absolute; top:0; text-align:center; transform:translateX(-50%); width:34px; } .diet-profile-v540 .diet-matrix-x-scale span:nth-child(1){left:44px;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(2){left:calc(44px + (100% - 44px)*.25);} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(3){left:calc(44px + (100% - 44px)*.50);} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(4){left:calc(44px + (100% - 44px)*.75);} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(5){left:calc(44px + (100% - 44px)*1);} .diet-profile-v540 .diet-matrix-grid-v540{ position:relative; isolation:isolate; aspect-ratio:1/1; min-height:0!important; width:100%; border-radius:0 15px 0 0!important; border-top:1px solid rgba(20,34,53,.28)!important; border-right:1px solid rgba(20,34,53,.28)!important; border-left:2px solid rgba(20,34,53,.64)!important; border-bottom:2px solid rgba(20,34,53,.64)!important; overflow:visible!important; background: radial-gradient(circle at calc(var(--x,50)*1%) calc((100 - var(--y,50))*1%), rgba(16,36,58,.115) 0 28px, rgba(16,36,58,.048) 29px 54px, transparent 76px), linear-gradient(90deg, rgba(246,230,213,.34) 0 50%, rgba(231,243,237,.48) 50% 100%), linear-gradient(180deg, rgba(255,255,255,.05) 0 50%, rgba(245,249,253,.62) 50% 100%), linear-gradient(90deg,var(--matrix-line) 1px,transparent 1px), linear-gradient(0deg,var(--matrix-line) 1px,transparent 1px), linear-gradient(90deg,var(--matrix-line-strong) 1px,transparent 1px), linear-gradient(0deg,var(--matrix-line-strong) 1px,transparent 1px), linear-gradient(135deg,rgba(244,226,224,.62) 0%,rgba(251,247,238,.52) 45%,rgba(236,246,240,.72) 100%)!important; background-size:100% 100%,100% 100%,100% 100%,10% 10%,10% 10%,25% 25%,25% 25%,100% 100%!important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.68),0 12px 30px rgba(15,32,52,.06)!important; } .diet-profile-v540 .diet-matrix-grid-v540::before, .diet-profile-v540 .diet-matrix-grid-v540::after{ background:rgba(20,34,53,.16)!important; z-index:2; } .diet-profile-v540 .diet-matrix-grid-v540::before{width:1px!important;} .diet-profile-v540 .diet-matrix-grid-v540::after{height:1px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .threshold-x50, .diet-profile-v540 .diet-matrix-grid-v540 .threshold-y50{ background:rgba(20,34,53,.13)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .threshold-x70, .diet-profile-v540 .diet-matrix-grid-v540 .threshold-y70, .diet-profile-v540 .diet-matrix-grid-v540 .label-x50, .diet-profile-v540 .diet-matrix-grid-v540 .label-y50, .diet-profile-v540 .diet-matrix-grid-v540 .label-x70, .diet-profile-v540 .diet-matrix-grid-v540 .label-y70{display:none!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q{ z-index:1; padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; color:#64758b!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{ position:absolute; display:block; max-width:45%; margin:0!important; color:#64758b!important; font-size:clamp(13px,3.15vw,17px)!important; font-weight:560!important; line-height:1.22!important; letter-spacing:-.018em; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q span{display:none!important;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-structure b{left:8%;top:8%;text-align:left;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-strong b{right:8%;top:8%;text-align:right;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-complex b{left:8%;bottom:8%;text-align:left;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-quality b{right:8%;bottom:8%;text-align:right;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q.is-current-zone b{ color:#50657d!important; font-weight:650!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q.is-selected-zone, .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q:focus-visible{ outline:2px solid rgba(16,36,58,.20)!important; outline-offset:-8px!important; background:rgba(255,255,255,.16)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei, .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure{ z-index:6!important; background:none!important; border-style:dashed!important; border-color:rgba(16,36,58,.76)!important; border-width:0!important; } .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei{height:0!important;border-top-width:2px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure{width:0!important;border-left-width:2px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-projection-badge{ z-index:10!important; min-width:40px; height:36px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(16,36,58,.22)!important; border-radius:11px!important; background:#10243a!important; color:#fff!important; font-size:17px!important; font-weight:760!important; letter-spacing:-.02em; line-height:1!important; padding:0 8px!important; box-shadow:0 11px 22px rgba(16,36,58,.22)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei-badge{left:-65px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure-badge{bottom:-44px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337{ z-index:13!important; width:30px!important; height:30px!important; border:5px solid #fff!important; background:#10243a!important; box-shadow:0 0 0 2px rgba(16,36,58,.38),0 0 0 18px rgba(16,36,58,.09),0 16px 34px rgba(16,36,58,.34)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337 span{display:none!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337:hover, .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337:focus-visible, .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337.is-selected-inspect{ outline:none!important; box-shadow:0 0 0 2px rgba(16,36,58,.46),0 0 0 20px rgba(16,36,58,.115),0 18px 36px rgba(16,36,58,.38)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{ z-index:12!important; transform:translate(24px,-8px)!important; min-width:140px; max-width:190px; border:0!important; border-radius:12px!important; background:#10243a!important; color:#fff!important; padding:13px 15px 14px!important; box-shadow:0 18px 38px rgba(16,36,58,.28)!important; font-size:14px!important; font-weight:620!important; line-height:1.22!important; letter-spacing:-.015em; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337::before{ content:""; position:absolute; left:-9px; top:17px; width:18px; height:18px; background:#10243a; transform:rotate(45deg); border-radius:2px; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{ display:block; position:relative; margin:0 0 6px!important; color:#fff!important; font-size:26px!important; font-weight:820!important; line-height:1!important; letter-spacing:-.045em; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 span{ display:block; position:relative; color:rgba(255,255,255,.88)!important; } .diet-profile-v540 .diet-matrix-grid-v540[data-point-side="left"] .diet-matrix-point-caption-v5337{ transform:translate(calc(-100% - 24px),-8px)!important; } .diet-profile-v540 .diet-matrix-grid-v540[data-point-side="left"] .diet-matrix-point-caption-v5337::before{ left:auto!important; right:-9px!important; } .diet-profile-v540 .diet-map-summary-strip-v540{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:14px!important; margin:28px 0 18px!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card{ position:relative; min-height:102px!important; padding:18px 16px 16px 70px!important; border-radius:20px!important; background:#fff!important; border:1px solid rgba(20,34,53,.10)!important; box-shadow:0 10px 24px rgba(15,32,52,.045)!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::before{ content:""; position:absolute; left:17px; top:50%; width:42px; height:42px; transform:translateY(-50%); border-radius:14px; background:#eef4ff; border:1px solid rgba(20,34,53,.045); } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::after{ position:absolute; left:29px; top:50%; transform:translateY(-50%); font-size:20px; line-height:1; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-quality::after{content:"◇";color:#2f68be;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-structure::before{background:#eef8ef;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-structure::after{content:"☷";color:#2d8b48;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone::before{background:#fff4df;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone::after{content:"⚖";color:#d17a18;left:27px;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card span{ color:#344c67!important; font-size:15px!important; font-weight:640!important; text-transform:none!important; letter-spacing:-.01em!important; line-height:1.12; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong{ margin:6px 0 0!important; color:var(--matrix-ink)!important; font-size:31px!important; font-weight:830!important; letter-spacing:-.045em!important; line-height:1!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{ max-width:155px!important; font-size:20px!important; line-height:1.16!important; letter-spacing:-.025em!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card em, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-mini-scale{display:none!important;} .diet-profile-v540 .diet-matrix-insight-v540{ display:flex; align-items:flex-start; gap:15px; margin:0!important; border:0!important; border-radius:20px!important; background:linear-gradient(180deg,#f2f8ff,#f7fbff)!important; padding:18px 20px!important; box-shadow:inset 0 0 0 1px rgba(41,94,150,.055)!important; color:#324a66!important; font-size:clamp(16px,3.1vw,20px)!important; line-height:1.45!important; letter-spacing:-.015em; } .diet-profile-v540 .diet-matrix-insight-v540 strong{ flex:0 0 auto; display:grid!important; place-items:center; width:34px!important; height:34px!important; margin:1px 0 0!important; border-radius:999px!important; background:#6fa4f3!important; color:#fff!important; font-size:0!important; } .diet-profile-v540 .diet-matrix-insight-v540 strong::before{content:"i";font-size:18px;font-weight:850;line-height:1;} .diet-profile-v540 .diet-matrix-actions.diet-map-actions{ margin-top:18px!important; padding-top:2px; } .diet-profile-v540 .diet-matrix-actions.diet-map-actions button{ background:#fff!important; border:1px solid rgba(20,34,53,.10)!important; color:#2d4056!important; box-shadow:0 6px 16px rgba(15,32,52,.035); } .diet-profile-v540 .diet-map-explain{ border-radius:20px!important; border:1px solid rgba(20,34,53,.09)!important; background:#fff!important; box-shadow:0 10px 24px rgba(15,32,52,.045)!important; } @media (max-width:780px){ .diet-profile-v540 .diet-matrix-card-v540{padding:22px 18px 20px;border-radius:28px;} .diet-profile-v540 .diet-map-topline-v540{grid-template-columns:48px minmax(0,1fr);gap:14px;padding-bottom:22px;} .diet-profile-v540 .diet-matrix-title-icon-v5338{width:44px;height:44px;border-radius:15px;} .diet-profile-v540 .diet-map-topline-v540 strong{font-size:30px!important;} .diet-profile-v540 .diet-map-topline-v540 small{font-size:18px!important;margin-top:14px!important;} .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row{margin-left:37px!important;} .diet-profile-v540 .diet-matrix-stage-v5337{grid-template-columns:37px minmax(0,1fr)!important;gap:8px!important;} .diet-profile-v540 .diet-matrix-x-scale{padding-left:37px;height:23px;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(1){left:37px;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(2){left:calc(37px + (100% - 37px)*.25);} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(3){left:calc(37px + (100% - 37px)*.50);} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(4){left:calc(37px + (100% - 37px)*.75);} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(5){left:calc(37px + (100% - 37px)*1);} .diet-profile-v540 .diet-matrix-y-scale, .diet-profile-v540 .diet-matrix-x-scale{font-size:17px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{font-size:15px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei-badge{left:-58px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure-badge{bottom:-42px!important;} .diet-profile-v540 .diet-map-summary-strip-v540{gap:9px!important;margin-top:24px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card{min-height:88px!important;padding:13px 9px 12px 50px!important;border-radius:17px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::before{left:10px;width:32px;height:32px;border-radius:11px;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::after{left:19px;font-size:15px;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone::after{left:17px;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card span{font-size:12.5px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong{font-size:23px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{font-size:15.5px!important;max-width:96px!important;} .diet-profile-v540 .diet-matrix-insight-v540{font-size:15px!important;padding:15px 16px!important;gap:12px;} .diet-profile-v540 .diet-matrix-insight-v540 strong{width:30px!important;height:30px!important;} } @media (max-width:430px){ .diet-profile-v540 .diet-matrix-card-v540{padding:19px 15px 18px;border-radius:26px;box-shadow:0 18px 42px rgba(15,32,52,.09);} .diet-profile-v540 .diet-map-topline-v540{grid-template-columns:42px minmax(0,1fr);gap:12px;padding-bottom:20px;} .diet-profile-v540 .diet-matrix-title-icon-v5338{width:38px;height:38px;border-radius:14px;} .diet-profile-v540 .diet-map-topline-v540 strong{font-size:27px!important;line-height:1.08!important;} .diet-profile-v540 .diet-map-topline-v540 small{font-size:16px!important;line-height:1.42!important;margin-top:12px!important;} .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row{margin-left:34px!important;margin-bottom:10px!important;} .diet-profile-v540 .diet-matrix-stage-v5337{grid-template-columns:34px minmax(0,1fr)!important;gap:7px!important;} .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-pill{font-size:16px!important;} .diet-profile-v540 .diet-matrix-y-scale, .diet-profile-v540 .diet-matrix-x-scale{font-size:16px!important;} .diet-profile-v540 .diet-matrix-x-scale{padding-left:34px;height:22px;margin-top:8px!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(1){left:34px;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(2){left:calc(34px + (100% - 34px)*.25);} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(3){left:calc(34px + (100% - 34px)*.50);} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(4){left:calc(34px + (100% - 34px)*.75);} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(5){left:calc(34px + (100% - 34px)*1);} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{font-size:13.5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337{width:27px!important;height:27px!important;border-width:4px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{min-width:118px;max-width:138px;padding:10px 11px 11px!important;transform:translate(19px,-8px)!important;font-size:11.5px!important;border-radius:10px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{font-size:20px!important;margin-bottom:5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-projection-badge{min-width:34px;height:30px;border-radius:10px!important;font-size:15px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei-badge{left:-52px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure-badge{bottom:-38px!important;} .diet-profile-v540 .diet-map-summary-strip-v540{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin-top:22px!important;margin-bottom:14px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone{grid-column:auto!important;min-height:78px!important;padding:11px 7px 10px 39px!important;border-radius:15px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::before{left:8px;width:27px;height:27px;border-radius:9px;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::after{left:16px;font-size:13px;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone::after{left:14px;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card span{font-size:11px!important;line-height:1.08!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong{font-size:19px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{max-width:88px!important;font-size:13.5px!important;line-height:1.16!important;} .diet-profile-v540 .diet-matrix-insight-v540{font-size:14px!important;padding:14px 14px!important;border-radius:18px!important;} } @media (max-width:360px){ .diet-profile-v540 .diet-map-topline-v540 strong{font-size:24px!important;} .diet-profile-v540 .diet-map-topline-v540 small{font-size:14.5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{font-size:11.5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{transform:translate(14px,-8px)!important;min-width:104px;max-width:112px;font-size:10.5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{font-size:17px!important;} .diet-profile-v540 .diet-map-summary-strip-v540{gap:6px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone{padding-left:8px!important;padding-right:6px!important;min-height:72px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::before, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::after{display:none!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong{font-size:17px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{font-size:12.5px!important;} } /* v5.3.43 — parity fixes after rendered inspection */ .diet-profile-v540 .diet-matrix-card-v540{overflow:visible!important;} .diet-profile-v540 .diet-matrix-title-icon-v5338{position:relative;} .diet-profile-v540 .diet-matrix-title-icon-v5338 span{display:none!important;} .diet-profile-v540 .diet-matrix-title-icon-v5338::before{ content:""; position:absolute; inset:12px; border:3px solid #10243a; border-radius:4px; background: linear-gradient(90deg,transparent calc(50% - 1.5px),#10243a calc(50% - 1.5px) calc(50% + 1.5px),transparent calc(50% + 1.5px)), linear-gradient(0deg,transparent calc(50% - 1.5px),#10243a calc(50% - 1.5px) calc(50% + 1.5px),transparent calc(50% + 1.5px)); } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card > span{ display:block!important; color:#344c67!important; font-size:15px!important; font-weight:640!important; text-transform:none!important; letter-spacing:-.01em!important; line-height:1.12!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong span{ display:inline!important; color:inherit!important; font-size:inherit!important; font-weight:inherit!important; letter-spacing:inherit!important; line-height:inherit!important; text-transform:none!important; } .diet-profile-v540 .diet-matrix-details-v540{ margin-top:18px; border:1px solid rgba(20,34,53,.09); border-radius:18px; background:#fff; box-shadow:0 10px 24px rgba(15,32,52,.04); overflow:hidden; } .diet-profile-v540 .diet-matrix-details-v540 summary{ cursor:pointer; list-style:none; padding:14px 16px; color:#263d55; font-size:14px; font-weight:760; letter-spacing:-.01em; } .diet-profile-v540 .diet-matrix-details-v540 summary::-webkit-details-marker{display:none;} .diet-profile-v540 .diet-matrix-details-v540 summary::after{content:"⌄";float:right;color:#728197;} .diet-profile-v540 .diet-matrix-details-v540[open] summary::after{content:"⌃";} .diet-profile-v540 .diet-matrix-details-v540 .diet-map-actions{padding:0 14px 12px;margin-top:0!important;} .diet-profile-v540 .diet-matrix-details-v540 .diet-map-explain{margin:0 14px 14px!important;} @media (max-width:430px){ .diet-profile-v540 .diet-matrix-title-icon-v5338::before{inset:9px;border-width:2.5px;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{transform:translate(14px,-8px)!important;min-width:108px;max-width:126px;padding:10px 10px 10px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{font-size:19px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card > span{font-size:11px!important;} } /* v5.3.43 — axis edge-label alignment */ .diet-profile-v540 .diet-matrix-x-scale span:nth-child(1){transform:translateX(0);text-align:left;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(5){transform:translateX(-100%);text-align:right;} /* v5.3.43 — mobile reference parity: rebuild the matrix card to match the approved reference more closely */ .diet-profile-v540 .diet-matrix-card-v540{ max-width:980px; margin-left:auto; margin-right:auto; } /* Header: icon + two-line title, subtitle uses the full card width like the reference */ .diet-profile-v540 .diet-map-topline-v540 > div:nth-child(2){display:contents!important;} .diet-profile-v540 .diet-map-topline-v540 strong{grid-column:2!important;} .diet-profile-v540 .diet-map-topline-v540 small{grid-column:1 / -1!important;} /* Reference-level matrix proportions */ .diet-profile-v540 .diet-matrix-grid-v540{ background: radial-gradient(circle at calc(var(--x,50)*1%) calc((100 - var(--y,50))*1%), rgba(16,36,58,.105) 0 26px, rgba(16,36,58,.045) 27px 54px, transparent 78px), linear-gradient(90deg,var(--matrix-line) 1px,transparent 1px), linear-gradient(0deg,var(--matrix-line) 1px,transparent 1px), linear-gradient(90deg,var(--matrix-line-strong) 1px,transparent 1px), linear-gradient(0deg,var(--matrix-line-strong) 1px,transparent 1px), linear-gradient(rgba(251,245,232,.72),rgba(251,245,232,.72)) left top / 50% 50% no-repeat, linear-gradient(rgba(239,248,240,.78),rgba(239,248,240,.78)) right top / 50% 50% no-repeat, linear-gradient(rgba(252,239,239,.66),rgba(252,239,239,.66)) left bottom / 50% 50% no-repeat, linear-gradient(rgba(239,247,252,.78),rgba(239,247,252,.78)) right bottom / 50% 50% no-repeat, #fbfdff!important; background-size:100% 100%,25% 25%,25% 25%,50% 50%,50% 50%,50% 50%,50% 50%,50% 50%,50% 50%,100% 100%!important; } .diet-profile-v540 .diet-matrix-grid-v540::before, .diet-profile-v540 .diet-matrix-grid-v540::after, .diet-profile-v540 .diet-matrix-grid-v540 .threshold-x50, .diet-profile-v540 .diet-matrix-grid-v540 .threshold-y50{background:rgba(20,34,53,.135)!important;} @media (max-width:430px){ .diet-profile-v540 .diet-matrix-card-v540{ padding:20px 14px 18px!important; border-radius:26px!important; box-shadow:0 18px 42px rgba(15,32,52,.09)!important; } .diet-profile-v540 .diet-map-topline-v540{ grid-template-columns:42px minmax(0,1fr)!important; gap:12px!important; padding-bottom:18px!important; } .diet-profile-v540 .diet-matrix-title-icon-v5338{ width:38px!important; height:38px!important; border-radius:14px!important; } .diet-profile-v540 .diet-map-topline-v540 strong{ font-size:23.5px!important; line-height:1.10!important; letter-spacing:-.035em!important; font-weight:860!important; } .diet-profile-v540 .diet-map-topline-v540 small{ margin-top:14px!important; font-size:16px!important; line-height:1.44!important; max-width:none!important; } .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row{ margin-left:31px!important; margin-bottom:9px!important; } .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-pill{ font-size:16px!important; line-height:1.15!important; } .diet-profile-v540 .diet-matrix-stage-v5337{ grid-template-columns:29px minmax(0,1fr)!important; gap:6px!important; } .diet-profile-v540 .diet-matrix-y-scale, .diet-profile-v540 .diet-matrix-x-scale{ font-size:16px!important; font-weight:620!important; } .diet-profile-v540 .diet-matrix-x-scale{ padding-left:35px!important; height:24px!important; margin-top:8px!important; } .diet-profile-v540 .diet-matrix-x-scale span:nth-child(1){left:35px!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(2){left:calc(35px + (100% - 35px)*.25)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(3){left:calc(35px + (100% - 35px)*.50)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(4){left:calc(35px + (100% - 35px)*.75)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(5){left:calc(35px + (100% - 35px)*1)!important;} .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row-bottom{margin-top:14px!important;} .diet-profile-v540 .diet-matrix-grid-v540{ border-top:1px solid rgba(20,34,53,.26)!important; border-right:1px solid rgba(20,34,53,.26)!important; border-left:2px solid rgba(20,34,53,.58)!important; border-bottom:2px solid rgba(20,34,53,.58)!important; border-radius:0 14px 0 0!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{ font-size:13.5px!important; line-height:1.22!important; font-weight:560!important; color:#65758c!important; } .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-structure b{left:8%;top:7.5%!important;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-strong b{right:8%;top:7.5%!important;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-complex b{left:8%;bottom:8%!important;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-quality b{right:8%;bottom:8%!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337{ width:27px!important; height:27px!important; border-width:4px!important; box-shadow:0 0 0 2px rgba(16,36,58,.38),0 0 0 17px rgba(16,36,58,.09),0 15px 30px rgba(16,36,58,.32)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{ min-width:112px!important; max-width:124px!important; padding:10px 10px 10px!important; transform:translate(13px,-7px)!important; font-size:11.5px!important; line-height:1.22!important; border-radius:10px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337::before{ left:-7px!important; top:14px!important; width:15px!important; height:15px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{ font-size:20px!important; margin-bottom:5px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-projection-badge{ min-width:34px!important; height:30px!important; border-radius:10px!important; font-size:15px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei-badge{left:-49px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure-badge{bottom:-38px!important;} .diet-profile-v540 .diet-map-summary-strip-v540{ grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:8px!important; margin:24px 0 16px!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone{ min-height:78px!important; padding:11px 7px 10px 39px!important; border-radius:15px!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::before{left:8px!important;width:27px!important;height:27px!important;border-radius:9px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::after{left:16px!important;font-size:13px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone::after{left:14px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card > span{font-size:11.5px!important;line-height:1.08!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong{font-size:19px!important;line-height:1.02!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{max-width:88px!important;font-size:13.5px!important;line-height:1.16!important;} .diet-profile-v540 .diet-matrix-insight-v540{ font-size:14.5px!important; line-height:1.42!important; padding:15px 14px!important; border-radius:18px!important; gap:12px!important; } .diet-profile-v540 .diet-matrix-insight-v540 strong{width:30px!important;height:30px!important;} } @media (max-width:370px){ .diet-profile-v540 .diet-matrix-card-v540{padding-left:12px!important;padding-right:12px!important;} .diet-profile-v540 .diet-map-topline-v540{grid-template-columns:38px minmax(0,1fr)!important;gap:10px!important;} .diet-profile-v540 .diet-map-topline-v540 strong{font-size:22px!important;} .diet-profile-v540 .diet-map-topline-v540 small{font-size:14.5px!important;} .diet-profile-v540 .diet-matrix-stage-v5337{grid-template-columns:27px minmax(0,1fr)!important;gap:5px!important;} .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row{margin-left:30px!important;} .diet-profile-v540 .diet-matrix-y-scale,.diet-profile-v540 .diet-matrix-x-scale{font-size:14.5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{font-size:12px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{min-width:104px!important;max-width:112px!important;font-size:10.5px!important;transform:translate(11px,-7px)!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{font-size:17.5px!important;} } /* v5.3.43 — mobile matrix precision pass: draw the coordinate matrix as a true mobile-first hero block, not as a squeezed desktop chart. */ @media (max-width: 520px){ /* Remove the outer card compression on mobile; the matrix card itself becomes the visual card. */ .diet-analysis-card.diet-analysis-redesigned.diet-profile-v540{ padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; overflow:visible!important; } .diet-profile-v540 .diet-matrix-card-v540{ width:100%!important; max-width:none!important; margin:14px 0 18px!important; padding:22px 14px 20px!important; border-radius:28px!important; background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important; border:1px solid rgba(20,34,53,.07)!important; box-shadow:0 18px 46px rgba(15,32,52,.10)!important; overflow:visible!important; } /* Reference header geometry: icon + two-line title, subtitle full width. */ .diet-profile-v540 .diet-map-topline-v540{ grid-template-columns:43px minmax(0,1fr)!important; gap:12px!important; padding:0 0 18px!important; align-items:start!important; } .diet-profile-v540 .diet-matrix-title-icon-v5338{ width:42px!important; height:42px!important; border-radius:15px!important; } .diet-profile-v540 .diet-map-topline-v540 strong{ font-size:24px!important; line-height:1.10!important; letter-spacing:-.035em!important; font-weight:860!important; color:#142235!important; } .diet-profile-v540 .diet-map-topline-v540 small{ grid-column:1 / -1!important; margin-top:13px!important; font-size:16px!important; line-height:1.43!important; color:#52627a!important; max-width:none!important; } /* Matrix occupies the maximum useful width and keeps a strict square shape. */ .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row{ margin:0 0 8px 35px!important; } .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row-bottom{ margin:13px 0 0!important; justify-content:center!important; } .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-pill{ font-size:16px!important; line-height:1.15!important; font-weight:700!important; color:#142235!important; } .diet-profile-v540 .diet-matrix-stage-v5337{ grid-template-columns:33px minmax(0,1fr)!important; gap:5px!important; } .diet-profile-v540 .diet-matrix-y-scale{ font-size:16px!important; font-weight:640!important; color:#142235!important; } .diet-profile-v540 .diet-matrix-grid-v540{ width:100%!important; aspect-ratio:1/1!important; border-radius:0 14px 0 0!important; border-top:1px solid rgba(20,34,53,.24)!important; border-right:1px solid rgba(20,34,53,.24)!important; border-left:2px solid rgba(20,34,53,.55)!important; border-bottom:2px solid rgba(20,34,53,.55)!important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.72),0 10px 24px rgba(15,32,52,.045)!important; background: radial-gradient(circle at calc(var(--x,50)*1%) calc((100 - var(--y,50))*1%), rgba(16,36,58,.075) 0 18px, rgba(16,36,58,.035) 19px 34px, transparent 52px), linear-gradient(90deg,rgba(20,34,53,.085) 1px,transparent 1px), linear-gradient(0deg,rgba(20,34,53,.085) 1px,transparent 1px), linear-gradient(90deg,rgba(20,34,53,.14) 1px,transparent 1px), linear-gradient(0deg,rgba(20,34,53,.14) 1px,transparent 1px), linear-gradient(rgba(251,245,232,.66),rgba(251,245,232,.66)) left top / 50% 50% no-repeat, linear-gradient(rgba(239,248,240,.72),rgba(239,248,240,.72)) right top / 50% 50% no-repeat, linear-gradient(rgba(252,240,240,.60),rgba(252,240,240,.60)) left bottom / 50% 50% no-repeat, linear-gradient(rgba(239,247,252,.72),rgba(239,247,252,.72)) right bottom / 50% 50% no-repeat, #fbfdff!important; background-size:100% 100%,25% 25%,25% 25%,50% 50%,50% 50%,50% 50%,50% 50%,50% 50%,50% 50%,100% 100%!important; } .diet-profile-v540 .diet-matrix-grid-v540::before, .diet-profile-v540 .diet-matrix-grid-v540::after, .diet-profile-v540 .diet-matrix-grid-v540 .threshold-x50, .diet-profile-v540 .diet-matrix-grid-v540 .threshold-y50{ background:rgba(20,34,53,.115)!important; } /* Quiet quadrant labels: readable, but not competing with the point. */ .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{ font-size:13px!important; line-height:1.20!important; font-weight:560!important; letter-spacing:-.012em!important; color:#66758a!important; max-width:42%!important; } .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-structure b{left:7.5%!important;top:7%!important;text-align:left!important;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-strong b{right:7.5%!important;top:7%!important;text-align:right!important;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-complex b{left:7.5%!important;bottom:7.5%!important;text-align:left!important;} .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-quality b{right:7.5%!important;bottom:7.5%!important;text-align:right!important;} /* Small precise point + compact halo. */ .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337{ width:22px!important; height:22px!important; border:3px solid #fff!important; background:#10243a!important; box-shadow:0 0 0 1.5px rgba(16,36,58,.42),0 0 0 11px rgba(16,36,58,.075),0 12px 24px rgba(16,36,58,.30)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337:hover, .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337:focus-visible, .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337.is-selected-inspect{ box-shadow:0 0 0 1.5px rgba(16,36,58,.48),0 0 0 12px rgba(16,36,58,.09),0 13px 26px rgba(16,36,58,.32)!important; } /* Thinner projections and smaller axis chips. */ .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei, .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure{ border-color:rgba(16,36,58,.72)!important; opacity:.94!important; } .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei{border-top-width:1.5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure{border-left-width:1.5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-projection-badge{ min-width:31px!important; height:29px!important; padding:0 7px!important; border-radius:10px!important; font-size:15px!important; font-weight:760!important; box-shadow:0 9px 18px rgba(16,36,58,.21)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei-badge{left:-44px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure-badge{bottom:-35px!important;} /* Compact tooltip, proportional to the mobile grid. */ .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{ min-width:104px!important; max-width:116px!important; padding:8px 9px 9px!important; transform:translate(12px,-7px)!important; border-radius:10px!important; font-size:10.8px!important; line-height:1.20!important; box-shadow:0 13px 28px rgba(16,36,58,.23)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337::before{ left:-6px!important; top:13px!important; width:13px!important; height:13px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{ font-size:18px!important; line-height:1!important; margin-bottom:4px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 span{ font-size:10.8px!important; line-height:1.20!important; } .diet-profile-v540 .diet-matrix-grid-v540[data-point-side="left"] .diet-matrix-point-caption-v5337{ transform:translate(calc(-100% - 12px),-7px)!important; } .diet-profile-v540 .diet-matrix-grid-v540[data-point-side="left"] .diet-matrix-point-caption-v5337::before{ left:auto!important; right:-6px!important; } /* X scale aligned with the exact grid width. */ .diet-profile-v540 .diet-matrix-x-scale{ padding-left:38px!important; height:22px!important; margin-top:8px!important; font-size:16px!important; font-weight:640!important; color:#142235!important; } .diet-profile-v540 .diet-matrix-x-scale span:nth-child(1){left:38px!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(2){left:calc(38px + (100% - 38px)*.25)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(3){left:calc(38px + (100% - 38px)*.50)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(4){left:calc(38px + (100% - 38px)*.75)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(5){left:calc(38px + (100% - 38px)*1)!important;} /* Keep the summary useful but lighter; it should not squeeze the matrix visually. */ .diet-profile-v540 .diet-map-summary-strip-v540{ grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:8px!important; margin:23px 0 15px!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone{ min-height:76px!important; padding:10px 6px 10px 38px!important; border-radius:15px!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::before{left:8px!important;width:26px!important;height:26px!important;border-radius:9px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::after{left:15px!important;font-size:12px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone::after{left:13px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card > span{font-size:11px!important;line-height:1.05!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong{font-size:18px!important;line-height:1.03!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{font-size:13px!important;line-height:1.15!important;max-width:88px!important;} .diet-profile-v540 .diet-matrix-insight-v540{ margin-top:0!important; padding:15px 14px!important; border-radius:18px!important; font-size:14.5px!important; line-height:1.42!important; gap:12px!important; } .diet-profile-v540 .diet-matrix-insight-v540 strong{width:30px!important;height:30px!important;flex:0 0 30px!important;} } @media (max-width:370px){ .diet-profile-v540 .diet-matrix-card-v540{padding-left:12px!important;padding-right:12px!important;border-radius:26px!important;} .diet-profile-v540 .diet-map-topline-v540{grid-template-columns:40px minmax(0,1fr)!important;gap:10px!important;} .diet-profile-v540 .diet-matrix-title-icon-v5338{width:39px!important;height:39px!important;} .diet-profile-v540 .diet-map-topline-v540 strong{font-size:22.5px!important;} .diet-profile-v540 .diet-map-topline-v540 small{font-size:14.8px!important;} .diet-profile-v540 .diet-matrix-stage-v5337{grid-template-columns:31px minmax(0,1fr)!important;gap:5px!important;} .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row{margin-left:34px!important;} .diet-profile-v540 .diet-matrix-y-scale,.diet-profile-v540 .diet-matrix-x-scale{font-size:14.5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{font-size:11.6px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337{width:20px!important;height:20px!important;border-width:3px!important;box-shadow:0 0 0 1.5px rgba(16,36,58,.42),0 0 0 10px rgba(16,36,58,.075),0 10px 20px rgba(16,36,58,.30)!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{min-width:98px!important;max-width:104px!important;font-size:10px!important;transform:translate(10px,-7px)!important;padding:8px 8px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{font-size:16.5px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 span{font-size:10px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-projection-badge{min-width:30px!important;height:28px!important;font-size:14px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei-badge{left:-41px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure-badge{bottom:-34px!important;} .diet-profile-v540 .diet-matrix-x-scale{padding-left:36px!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(1){left:36px!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(2){left:calc(36px + (100% - 36px)*.25)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(3){left:calc(36px + (100% - 36px)*.50)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(4){left:calc(36px + (100% - 36px)*.75)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(5){left:calc(36px + (100% - 36px)*1)!important;} } /* v5.3.43b — exact mobile geometry correction after screenshot audit: no button padding on marker, wider usable grid, two-line title bias. */ @media (max-width:520px){ .diet-profile-v540 .diet-matrix-card-v540{ padding-left:10px!important; padding-right:10px!important; } .diet-profile-v540 .diet-map-topline-v540{ grid-template-columns:39px minmax(0,1fr)!important; gap:9px!important; } .diet-profile-v540 .diet-matrix-title-icon-v5338{ width:38px!important; height:38px!important; border-radius:14px!important; } .diet-profile-v540 .diet-map-topline-v540 strong{ font-size:21.6px!important; line-height:1.08!important; letter-spacing:-.038em!important; max-width:100%!important; } .diet-profile-v540 .diet-map-topline-v540 small{ font-size:15.6px!important; line-height:1.42!important; } .diet-profile-v540 .diet-matrix-dashboard-v540 .diet-matrix-axis-row{ margin-left:32px!important; } .diet-profile-v540 .diet-matrix-stage-v5337{ grid-template-columns:28px minmax(0,1fr)!important; gap:4px!important; } .diet-profile-v540 .diet-matrix-x-scale{ padding-left:32px!important; } .diet-profile-v540 .diet-matrix-x-scale span:nth-child(1){left:32px!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(2){left:calc(32px + (100% - 32px)*.25)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(3){left:calc(32px + (100% - 32px)*.50)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(4){left:calc(32px + (100% - 32px)*.75)!important;} .diet-profile-v540 .diet-matrix-x-scale span:nth-child(5){left:calc(32px + (100% - 32px)*1)!important;} .diet-profile-v540 .diet-matrix-y-scale, .diet-profile-v540 .diet-matrix-x-scale{ font-size:15.2px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337{ box-sizing:border-box!important; padding:0!important; min-width:0!important; max-width:none!important; line-height:0!important; width:21px!important; height:21px!important; border:3px solid #fff!important; border-radius:50%!important; aspect-ratio:1/1!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{ min-width:101px!important; max-width:108px!important; transform:translate(10px,-7px)!important; padding:8px 8px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{ font-size:17.4px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{ font-size:12.4px!important; } .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei-badge{left:-40px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure-badge{bottom:-34px!important;} } @media (max-width:370px){ .diet-profile-v540 .diet-matrix-card-v540{padding-left:9px!important;padding-right:9px!important;} .diet-profile-v540 .diet-map-topline-v540 strong{font-size:20.4px!important;} .diet-profile-v540 .diet-map-topline-v540 small{font-size:14.4px!important;} .diet-profile-v540 .diet-matrix-stage-v5337{grid-template-columns:27px minmax(0,1fr)!important;gap:4px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337{width:19px!important;height:19px!important;border-width:3px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b{font-size:11.1px!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337{min-width:94px!important;max-width:100px!important;transform:translate(8px,-7px)!important;} .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b{font-size:16px!important;} } /* v5.3.43c — reference title line-break and narrow-card value wrapping. */ @media (max-width:520px){ .diet-profile-v540 .diet-map-topline-v540 strong br{display:block!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone{overflow:visible!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important;} } @media (max-width:370px){ .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone{padding-left:34px!important;padding-right:4px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::before{left:6px!important;width:24px!important;height:24px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::after{left:13px!important;font-size:11px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card > span{font-size:10px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong{font-size:16px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{font-size:11px!important;line-height:1.12!important;max-width:54px!important;} } /* v5.3.43d — force the approved two-line title composition on typical mobile widths. */ @media (max-width:520px){ .diet-profile-v540 .diet-map-topline-v540 strong{font-size:20px!important;line-height:1.10!important;} } @media (min-width:400px) and (max-width:520px){ .diet-profile-v540 .diet-map-topline-v540 strong{font-size:22px!important;} } @media (max-width:370px){ .diet-profile-v540 .diet-map-topline-v540 strong{font-size:19px!important;} } /* v5.3.43e — prevent mobile summary-card clipping without sacrificing the one-row reference layout. */ @media (max-width:520px){ .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone{ padding-left:31px!important; padding-right:5px!important; } .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::before{left:6px!important;width:23px!important;height:23px!important;border-radius:8px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::after{left:13px!important;font-size:10.5px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone::after{left:11px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{font-size:11.6px!important;line-height:1.12!important;max-width:none!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong{font-size:17.5px!important;} } @media (max-width:370px){ .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card, .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone{padding-left:28px!important;padding-right:3px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::before{left:5px!important;width:21px!important;height:21px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card::after{left:11px!important;font-size:9.5px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card-zone strong{font-size:10.4px!important;} .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card strong{font-size:15.5px!important;} } /* v5.3.43f — final summary-zone specificity fix. */ @media (max-width:520px){ .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card.diet-map-score-card-zone strong{ font-size:11.4px!important; line-height:1.12!important; max-width:64px!important; white-space:normal!important; overflow:hidden!important; } } @media (max-width:370px){ .diet-profile-v540 .diet-map-summary-strip-v540 .diet-map-score-card.diet-map-score-card-zone strong{ font-size:10.2px!important; max-width:52px!important; } } /* v5.3.43 — mobile marker geometry fix: reset generic button min-height so the point remains a true circle. */ @media (max-width:520px){ .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337{ -webkit-appearance:none!important; appearance:none!important; display:block!important; box-sizing:border-box!important; width:18px!important; height:18px!important; min-width:0!important; min-height:0!important; max-width:18px!important; max-height:18px!important; aspect-ratio:1 / 1!important; padding:0!important; margin:0!important; border:3px solid #fff!important; border-radius:999px!important; background:#10243a!important; color:transparent!important; font-size:0!important; line-height:0!important; transform:translate(-50%,-50%)!important; overflow:visible!important; box-shadow:0 0 0 1.25px rgba(16,36,58,.42),0 0 0 9px rgba(16,36,58,.072),0 10px 20px rgba(16,36,58,.28)!important; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337::after{ content:""; position:absolute; left:50%; top:50%; width:44px; height:44px; transform:translate(-50%,-50%); border-radius:999px; background:transparent; } .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337:hover, .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337:focus-visible, .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337.is-selected-inspect{ box-shadow:0 0 0 1.25px rgba(16,36,58,.48),0 0 0 10px rgba(16,36,58,.085),0 11px 22px rgba(16,36,58,.30)!important; } } @media (max-width:370px){ .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337{ width:17px!important; height:17px!important; max-width:17px!important; max-height:17px!important; border-width:3px!important; box-shadow:0 0 0 1.15px rgba(16,36,58,.42),0 0 0 8px rgba(16,36,58,.070),0 9px 18px rgba(16,36,58,.27)!important; } } /* v5.3.47 — personal narrative engine for the matrix explanation */ .diet-personal-narrative{ display:grid; gap:12px; margin:12px 0 14px; padding:14px; border:1px solid rgba(20,34,53,.09); border-radius:20px; background:linear-gradient(180deg,#ffffff 0%,#f7fbff 100%); box-shadow:0 12px 28px rgba(15,32,52,.045); } .diet-personal-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:10px; border-bottom:1px solid rgba(20,34,53,.08); } .diet-personal-head span{ color:#61758e; font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .diet-personal-head strong{ color:#142b44; font-size:17px; line-height:1.25; text-align:right; } .diet-personal-narrative p, .diet-personal-note p, .diet-personal-item p{ margin:0; color:#33465d; font-size:13px; line-height:1.55; } .diet-personal-facts{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; } .diet-personal-facts div{ padding:10px; border:1px solid rgba(20,34,53,.08); border-radius:15px; background:#fff; } .diet-personal-facts span, .diet-personal-action span{ display:block; color:#66788e; font-size:11px; font-weight:800; margin-bottom:3px; } .diet-personal-facts b{ display:block; color:#132a43; font-size:17px; line-height:1.15; } .diet-personal-facts em{ display:block; margin-top:4px; color:#607188; font-size:11px; line-height:1.3; font-style:normal; } .diet-personal-action{ padding:12px 13px; border-radius:17px; border:1px solid rgba(31,78,121,.10); background:linear-gradient(180deg,#f4f9ff 0%,#eef6ff 100%); } .diet-personal-action b{ display:block; color:#17334f; font-size:13px; line-height:1.55; } .diet-personal-note{ padding:12px; border:1px solid rgba(20,34,53,.08); border-radius:16px; background:#fff; } .diet-personal-note strong{ display:block; color:#142b44; font-size:13px; margin-bottom:8px; } .diet-personal-note ul, .diet-selected-domain-list ul{ margin:8px 0 0 18px; padding:0; color:#33465d; font-size:13px; line-height:1.5; } .diet-personal-list{ display:grid; gap:9px; margin-top:8px; } .diet-personal-item{ display:grid; gap:7px; padding:11px 12px; border:1px solid rgba(20,34,53,.085); border-radius:16px; background:#fff; } .diet-personal-item > div:first-child{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; } .diet-personal-item strong{ color:#162d46; font-size:13px; line-height:1.25; } .diet-personal-item span{ flex:0 0 auto; color:#536a84; font-size:11px; font-weight:800; text-align:right; } .diet-zone-explain .diet-personal-list{margin:8px 0 0;} .diet-zone-explain .diet-personal-item{background:#f9fbfd;} @media (max-width:540px){ .diet-personal-head{display:block;} .diet-personal-head strong{display:block;text-align:left;margin-top:4px;font-size:16px;} .diet-personal-facts{grid-template-columns:1fr;} .diet-personal-item > div:first-child{display:block;} .diet-personal-item span{display:block;text-align:left;margin-top:4px;} } /* v5.3.47 — matrix narrative clarity pass: passport, limiter scales and correction plan */ .diet-point-passport{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; } .diet-point-passport div{ min-width:0; padding:10px 10px 11px; border:1px solid rgba(20,34,53,.085); border-radius:16px; background:linear-gradient(180deg,#fff 0%,#f9fbfe 100%); } .diet-point-passport span, .diet-limiter-head span{ display:block; color:#64758a; font-size:11px; font-weight:850; line-height:1.25; } .diet-point-passport b{ display:block; margin-top:4px; color:#132a43; font-size:15px; line-height:1.18; } .diet-point-passport em{ display:block; margin-top:5px; color:#66788d; font-size:10.5px; line-height:1.25; font-style:normal; } .diet-limiter-panel{ padding:12px; border:1px solid rgba(20,34,53,.08); border-radius:18px; background:#fff; } .diet-limiter-head{ display:grid; gap:3px; margin-bottom:9px; } .diet-limiter-head strong, .diet-personal-plan strong{ color:#142b44; font-size:13.5px; line-height:1.25; } .diet-limiter-list{ display:grid; gap:9px; } .diet-limiter-item{ display:grid; gap:6px; padding:10px 11px; border:1px solid rgba(20,34,53,.075); border-radius:16px; background:linear-gradient(180deg,#fbfdff 0%,#f7fbff 100%); } .diet-limiter-item > div:first-child{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; } .diet-limiter-item b{ color:#152d46; font-size:13px; line-height:1.25; } .diet-limiter-item span{ flex:0 0 auto; padding:3px 7px; border-radius:999px; background:#eef4fb; color:#51677f; font-size:10px; font-weight:850; text-transform:uppercase; letter-spacing:.04em; } .diet-limiter-meter{ height:7px; overflow:hidden; border-radius:999px; background:#eaf0f6; box-shadow:inset 0 0 0 1px rgba(20,34,53,.04); } .diet-limiter-meter i{ display:block; width:calc(var(--value,0) * 1%); height:100%; border-radius:inherit; background:linear-gradient(90deg,#94a9bd 0%,#183753 100%); } .diet-limiter-item p{ margin:0; color:#3d5168; font-size:12px; line-height:1.4; } .diet-limiter-item p strong{ color:#132a43; font-size:12.5px; } .diet-limiter-item em{ color:#60738a; font-size:11.5px; line-height:1.35; font-style:normal; } .diet-personal-plan{ display:grid; gap:8px; padding:12px 13px; border:1px solid rgba(20,34,53,.08); border-radius:17px; background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%); } .diet-personal-plan ol{ margin:0; padding-left:20px; color:#33465d; font-size:13px; line-height:1.5; } .diet-personal-plan li + li{margin-top:6px;} .diet-personal-note-muted{background:#fbfcfe;} .diet-personal-reasons{background:#fbfdff;} @media (max-width:540px){ .diet-point-passport{grid-template-columns:repeat(2,minmax(0,1fr));} .diet-point-passport b{font-size:14px;} .diet-limiter-item > div:first-child{display:block;} .diet-limiter-item span{display:inline-flex;margin-top:5px;} } @media (max-width:370px){ .diet-point-passport{grid-template-columns:1fr;} } /* v5.3.47 — reorganized matrix output flow */ .diet-matrix-diagnostic-details{ margin-top:12px; border:1px solid rgba(20,34,53,.08); border-radius:20px; background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%); box-shadow:0 10px 22px rgba(18,34,56,.045); } .diet-matrix-diagnostic-details > summary{ cursor:pointer; list-style:none; padding:14px 16px; color:#142b44; font-weight:850; letter-spacing:-.01em; } .diet-matrix-diagnostic-details > summary::-webkit-details-marker{display:none;} .diet-matrix-narrative-host{ padding:0 12px 12px; } .diet-map-actions-user{ padding:0 12px 10px; gap:7px; } .diet-map-actions-user button{ font-size:12px; line-height:1.18; } .diet-reliability-mini{ display:grid; gap:4px; padding:10px 12px; border:1px solid rgba(20,34,53,.075); border-radius:16px; background:#fff; } .diet-reliability-mini span, .diet-reliability-compact span{ color:#66788d; font-size:10.5px; font-weight:850; text-transform:uppercase; letter-spacing:.055em; } .diet-reliability-mini b{ color:#152d46; font-size:14px; line-height:1.2; } .diet-reliability-mini em{ color:#51677f; font-size:11.5px; line-height:1.35; font-style:normal; } .diet-reliability-mini[data-reliability="high"]{background:#f7fbf8;border-color:rgba(79,118,100,.16);} .diet-reliability-mini[data-reliability="medium"]{background:#fbf9f3;border-color:rgba(138,111,72,.18);} .diet-reliability-mini[data-reliability="low"]{background:#fbf5f4;border-color:rgba(139,90,90,.18);} .diet-interpretation-compact-card{ padding:13px 14px; } .diet-reliability-compact{ display:grid; grid-template-columns:minmax(0,1fr) 86px; gap:12px; align-items:center; } .diet-reliability-compact strong{ display:block; margin-top:3px; color:#142b44; font-size:15px; line-height:1.2; } .diet-reliability-compact em{ display:block; margin-top:4px; color:#53677f; font-size:12px; line-height:1.35; font-style:normal; } .diet-reliability-meter{ display:block; height:8px; border-radius:999px; background:#e7edf4; overflow:hidden; box-shadow:inset 0 0 0 1px rgba(20,34,53,.045); } .diet-reliability-meter i{ display:block; height:100%; width:calc(var(--value,0) * 1%); border-radius:inherit; background:linear-gradient(90deg,#8ea5ba 0%,#183753 100%); } .diet-reliability-more{ margin-top:10px; border-top:1px solid rgba(20,34,53,.08); padding-top:9px; } .diet-reliability-more summary{ cursor:pointer; color:#40556e; font-size:12px; font-weight:800; } .diet-reliability-more p{ margin:7px 0 0; color:#53677f; font-size:12.5px; line-height:1.45; } .diet-method-facts-details{ margin-top:14px; padding:0; border:1px solid rgba(20,34,53,.08); border-radius:18px; background:#fbfcfe; } .diet-method-facts-details > summary{ cursor:pointer; list-style:none; padding:12px 13px; display:flex; justify-content:space-between; gap:12px; align-items:flex-start; } .diet-method-facts-details > summary::-webkit-details-marker{display:none;} .diet-method-facts-details > summary strong{ color:#17283d; font-size:13.5px; } .diet-method-facts-details > summary span{ color:#68788c; font-size:12px; line-height:1.35; text-align:right; } .diet-method-facts-details .diet-method-facts-host{ padding:0 12px 12px; margin:0; } .diet-domain-profile .diet-domain-section-title strong{ letter-spacing:-.015em; } .diet-domain-profile .diet-domain-section-title + .diet-domain-section-title{ margin-top:12px; } @media (max-width:540px){ .diet-matrix-narrative-host{padding:0 9px 10px;} .diet-map-actions-user{padding:0 9px 10px;} .diet-reliability-compact{grid-template-columns:1fr;gap:9px;} .diet-method-facts-details > summary{display:block;} .diet-method-facts-details > summary span{display:block;text-align:left;margin-top:4px;} } /* v5.3.49 — diagnostic accordions for matrix reading */ .diet-profile-v540 .diet-matrix-inspect-accordions{ display:grid; gap:10px; padding:0 12px 14px; } .diet-profile-v540 .diet-matrix-inspect-accordion{ border:1px solid rgba(20,34,53,.09); border-radius:18px; background:linear-gradient(180deg,#fff,#fbfdff); box-shadow:0 8px 18px rgba(15,32,52,.035); overflow:hidden; } .diet-profile-v540 .diet-matrix-inspect-accordion summary{ list-style:none; cursor:pointer; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 12px; align-items:center; padding:13px 15px; color:#1f344c; } .diet-profile-v540 .diet-matrix-inspect-accordion summary::-webkit-details-marker{display:none;} .diet-profile-v540 .diet-matrix-inspect-accordion summary::after{ content:"⌄"; grid-column:2; grid-row:1 / span 2; display:grid; place-items:center; width:28px; height:28px; border-radius:999px; background:#f2f6fa; color:#65778d; font-size:15px; font-weight:850; } .diet-profile-v540 .diet-matrix-inspect-accordion[open] summary::after{content:"⌃";} .diet-profile-v540 .diet-matrix-inspect-accordion summary .diet-acc-kicker{ grid-column:1; color:#74849a; font-size:10.5px; font-weight:850; line-height:1.05; letter-spacing:.055em; text-transform:uppercase; } .diet-profile-v540 .diet-matrix-inspect-accordion summary > strong{ grid-column:1; color:#1f344c; font-size:15px; line-height:1.15; font-weight:850; letter-spacing:-.015em; } .diet-profile-v540 .diet-matrix-inspect-accordion.is-selected-inspect{ border-color:rgba(42,80,122,.24); box-shadow:0 10px 22px rgba(15,32,52,.055), inset 0 0 0 1px rgba(42,80,122,.08); } .diet-profile-v540 .diet-matrix-inspect-accordion.is-selected-inspect summary::after{ background:#eaf2fb; color:#1f5f9f; } .diet-profile-v540 .diet-matrix-inspect-body{ padding:0 14px 14px; } .diet-profile-v540 .diet-matrix-inspect-body .diet-zone-explain-head{ margin-top:0; } .diet-profile-v540 .diet-map-explain-legacy[hidden]{display:none!important;} @media (max-width:430px){ .diet-profile-v540 .diet-matrix-inspect-accordions{padding:0 9px 12px;gap:9px;} .diet-profile-v540 .diet-matrix-inspect-accordion{border-radius:16px;} .diet-profile-v540 .diet-matrix-inspect-accordion summary{padding:12px 13px;gap:5px 10px;} .diet-profile-v540 .diet-matrix-inspect-accordion summary > strong{font-size:14.5px;} .diet-profile-v540 .diet-matrix-inspect-accordion summary .diet-acc-kicker{font-size:10px;} .diet-profile-v540 .diet-matrix-inspect-accordion summary::after{width:26px;height:26px;} .diet-profile-v540 .diet-matrix-inspect-body{padding:0 12px 12px;} } /* v5.3.54 — visual microindicators inside diagnostic accordion headers */ .diet-profile-v540 .diet-matrix-inspect-accordion[data-acc-priority="главное"]{ border-color:rgba(72,105,82,.22); box-shadow:0 12px 26px rgba(32,64,42,.07), inset 0 0 0 1px rgba(72,105,82,.08); } .diet-profile-v540 .diet-matrix-inspect-accordion[data-acc-priority="практика"]{ border-color:rgba(73,98,128,.16); } .diet-profile-v540 .diet-matrix-inspect-accordion summary{ grid-template-columns:minmax(0,1fr) 30px; gap:5px 12px; } .diet-profile-v540 .diet-matrix-inspect-accordion summary::after{ grid-column:2; grid-row:1 / span 3; align-self:center; } .diet-profile-v540 .diet-matrix-inspect-accordion summary .diet-acc-kicker{ grid-column:1; color:#74849a; font-size:10.5px; font-weight:850; line-height:1.05; letter-spacing:.055em; text-transform:uppercase; } .diet-profile-v540 .diet-matrix-inspect-accordion summary > strong{ grid-column:1; color:#1f344c; font-size:15px; line-height:1.15; font-weight:850; letter-spacing:-.015em; } .diet-acc-indicator-row{ grid-column:1; display:flex; align-items:center; gap:8px; min-width:0; margin-top:2px; } .diet-acc-chips{ display:flex; flex-wrap:wrap; align-items:center; gap:5px; min-width:0; } .diet-acc-chip{ display:inline-flex; align-items:center; min-height:22px; max-width:100%; padding:4px 8px; border-radius:999px; border:1px solid rgba(30,48,70,.10); background:#f5f7fa; color:#40536b; font-size:11.5px; font-weight:800; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .diet-acc-chip[data-chip-kind="product"]{background:#f8f3e9;color:#604a26;border-color:rgba(142,105,44,.16);} .diet-acc-chip[data-chip-kind="action"]{background:#eef6f0;color:#31553b;border-color:rgba(62,112,76,.17);} .diet-acc-chip[data-chip-kind="reduce"]{background:#fbf0f0;color:#794343;border-color:rgba(142,75,75,.16);} .diet-acc-chip[data-chip-kind="shift"]{background:#eef4fb;color:#315777;border-color:rgba(73,111,151,.16);} .diet-acc-chip[data-chip-kind="domain"]{background:#f4f6fa;color:#354b65;border-color:rgba(45,70,100,.13);} .diet-acc-chip[data-chip-kind="keep"]{background:#f0f7f3;color:#345c43;border-color:rgba(58,118,80,.16);} .diet-acc-chip[data-chip-kind="check"]{background:#f4f1fb;color:#59457c;border-color:rgba(99,76,140,.15);} .diet-acc-chip[data-chip-kind="score"]{background:#f6f8fb;color:#40536b;} .diet-acc-metric{ display:grid; grid-template-columns:82px auto; grid-template-rows:auto auto; gap:2px 7px; align-items:center; flex:0 0 auto; } .diet-acc-metric > b{ grid-column:2; grid-row:1; color:#1f344c; font-size:12px; font-weight:900; line-height:1; white-space:nowrap; } .diet-acc-metric > small{ grid-column:2; grid-row:2; color:#718197; font-size:10px; line-height:1; white-space:nowrap; } .diet-acc-microbar{ --value:0; position:relative; display:block; width:82px; height:9px; border-radius:999px; overflow:hidden; background:linear-gradient(90deg,#ead6d5 0 50%,#f0e3cc 50% 70%,#dfead5 70% 85%,#d5eadf 85% 100%); box-shadow:inset 0 0 0 1px rgba(31,49,72,.10); } .diet-acc-metric .diet-acc-microbar{ grid-column:1; grid-row:1 / span 2; } .diet-acc-microbar > i, .diet-acc-microbar > u{ position:absolute; left:0; top:0; bottom:0; width:calc(var(--value,0) * 1%); border-radius:inherit; background:#607b96; opacity:.92; } .diet-acc-microbar > em{ position:absolute; left:70%; top:-2px; bottom:-2px; width:2px; background:rgba(24,39,57,.42); border-radius:2px; transform:translateX(-1px); } .diet-acc-metric[data-band="good"] .diet-acc-microbar > i{background:#4f7664;} .diet-acc-metric[data-band="support"] .diet-acc-microbar > i{background:#6c8f65;} .diet-acc-metric[data-band="watch"] .diet-acc-microbar > i{background:#9a7848;} .diet-acc-metric[data-band="limit"] .diet-acc-microbar > i{background:#965a58;} .diet-acc-dual-bars{ display:grid; gap:4px; width:172px; flex:0 0 auto; } .diet-acc-dual-row{ display:grid; grid-template-columns:54px minmax(76px,1fr) 28px; gap:6px; align-items:center; min-width:0; } .diet-acc-dual-row > b, .diet-acc-dual-row > strong{ color:#40536b; font-size:10.5px; line-height:1; font-weight:900; white-space:nowrap; } .diet-acc-dual-row > strong{text-align:right;color:#1f344c;} .diet-acc-dual-row[data-band="good"] .diet-acc-microbar > u{background:#4f7664;} .diet-acc-dual-row[data-band="support"] .diet-acc-microbar > u{background:#6c8f65;} .diet-acc-dual-row[data-band="watch"] .diet-acc-microbar > u{background:#9a7848;} .diet-acc-dual-row[data-band="limit"] .diet-acc-microbar > u{background:#965a58;} .diet-acc-threshold{ display:grid; gap:3px; width:108px; flex:0 0 auto; } .diet-acc-threshold > i{ position:relative; display:block; height:9px; border-radius:999px; background:linear-gradient(90deg,#ead6d5 0 50%,#f0e3cc 50% 70%,#dfead5 70% 100%); box-shadow:inset 0 0 0 1px rgba(31,49,72,.10); } .diet-acc-threshold > i b, .diet-acc-threshold > i em, .diet-acc-threshold > i strong{ position:absolute; top:-2px; bottom:-2px; width:2px; border-radius:2px; background:rgba(24,39,57,.30); } .diet-acc-threshold > i b{left:50%;} .diet-acc-threshold > i em{left:70%;background:rgba(24,39,57,.48);} .diet-acc-threshold > i strong{left:100%;} .diet-acc-threshold > small{font-size:10px;color:#718197;line-height:1;} .diet-acc-reliability{ display:inline-grid; grid-template-columns:repeat(3,28px); gap:4px; align-items:center; flex:0 0 auto; } .diet-acc-reliability i{ display:block; height:9px; border-radius:999px; background:#d9e0e8; box-shadow:inset 0 0 0 1px rgba(31,49,72,.08); } .diet-acc-reliability[data-reliability="low"] i:nth-child(1), .diet-acc-reliability[data-reliability="medium"] i:nth-child(-n+2), .diet-acc-reliability[data-reliability="high"] i{background:#607b96;} .diet-acc-reliability[data-reliability="high"] i{background:#4f7664;} .diet-acc-reliability[data-reliability="medium"] i:nth-child(-n+2){background:#9a7848;} .diet-acc-reliability[data-reliability="low"] i:nth-child(1){background:#965a58;} @media (max-width:540px){ .diet-profile-v540 .diet-matrix-inspect-accordion summary{padding:12px 12px;grid-template-columns:minmax(0,1fr) 28px;} .diet-acc-indicator-row{align-items:flex-start;flex-direction:column;gap:7px;} .diet-acc-chips{width:100%;gap:5px;} .diet-acc-chip{max-width:100%;font-size:11px;padding:4px 7px;} .diet-acc-metric{width:100%;grid-template-columns:minmax(94px,1fr) auto;} .diet-acc-metric > .diet-acc-microbar{width:100%;} .diet-acc-dual-bars{width:100%;} .diet-acc-dual-row{grid-template-columns:58px minmax(0,1fr) 32px;} .diet-acc-threshold{width:100%;} .diet-acc-reliability{grid-template-columns:repeat(3,minmax(26px,1fr));width:100%;} } /* v5.3.57 — structured gram-action cards inside matrix diagnostics */ .diet-profile-v540 .diet-gram-action{ margin:10px 0 0; padding:12px 13px; border-radius:15px; border:1px solid rgba(60,91,122,.13); background:linear-gradient(180deg,#fbfcfd 0%,#f5f8fb 100%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.55); } .diet-profile-v540 .diet-gram-action > span{ display:inline-flex; align-items:center; min-height:22px; padding:3px 8px; border-radius:999px; background:#eef6f0; color:#31553b; font-size:11px; font-weight:900; line-height:1.1; letter-spacing:.015em; margin-bottom:7px; } .diet-profile-v540 .diet-gram-action > strong{ display:block; color:#1f344c; font-size:13.5px; line-height:1.25; font-weight:900; margin-bottom:5px; } .diet-profile-v540 .diet-gram-action > p{ margin:0; color:#263b54; font-size:13px; line-height:1.45; } .diet-profile-v540 .diet-gram-action > em{ display:block; margin-top:6px; color:#5b6f85; font-size:12px; line-height:1.35; font-style:normal; } .diet-profile-v540 .diet-gram-action > em b{color:#334a63;} .diet-profile-v540 .diet-limiter-action{ margin:8px 0 0; padding:9px 10px; border-radius:12px; background:#f7faf8; border:1px solid rgba(61,116,78,.12); } .diet-profile-v540 .diet-limiter-action > b{ display:block; color:#31553b; font-size:11px; font-weight:900; line-height:1.1; margin-bottom:4px; } .diet-profile-v540 .diet-limiter-action > span{ display:block; color:#263b54; font-size:12px; line-height:1.4; } .diet-profile-v540 .diet-personal-plan-cards ol{display:none;} .diet-profile-v540 .diet-step-card-list{ display:grid; gap:9px; margin-top:10px; } .diet-profile-v540 .diet-step-card{ position:relative; padding:11px 12px 11px 44px; border-radius:14px; border:1px solid rgba(48,74,102,.12); background:#fbfcfd; } .diet-profile-v540 .diet-step-card::before{ content:attr(data-step); position:absolute; left:12px; top:12px; width:22px; height:22px; border-radius:999px; display:grid; place-items:center; background:#eef4fb; color:#315777; font-size:12px; line-height:1; font-weight:900; } .diet-profile-v540 .diet-step-card > span{ display:block; color:#1f344c; font-size:12px; line-height:1.15; font-weight:900; margin-bottom:4px; } .diet-profile-v540 .diet-step-card > p{ margin:0; color:#334a63; font-size:13px; line-height:1.45; } @media (max-width:540px){ .diet-profile-v540 .diet-gram-action{padding:11px 11px;border-radius:14px;} .diet-profile-v540 .diet-gram-action > p{font-size:12.7px;} .diet-profile-v540 .diet-step-card{padding:10px 10px 10px 40px;} .diet-profile-v540 .diet-step-card::before{left:10px;top:11px;width:21px;height:21px;} } /* v5.3.57 — contextual help for fruit-heavy / vegetable-light plant base */ .diet-profile-v540 .diet-context-help{ margin:10px 0 0; border:1px solid rgba(54,93,125,.14); border-radius:16px; background:linear-gradient(180deg,#ffffff 0%,#f7fafc 100%); overflow:hidden; } .diet-profile-v540 .diet-context-help > summary{ cursor:pointer; list-style:none; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:8px 10px; padding:11px 12px; } .diet-profile-v540 .diet-context-help > summary::-webkit-details-marker{display:none;} .diet-profile-v540 .diet-context-help > summary span{ display:inline-flex; align-items:center; min-height:22px; padding:3px 8px; border-radius:999px; background:#eef4fb; color:#315777; font-size:11px; font-weight:900; line-height:1.1; } .diet-profile-v540 .diet-context-help > summary strong{ color:#1c334d; font-size:13.5px; line-height:1.25; } .diet-profile-v540 .diet-context-help > summary em{ color:#66788e; font-size:11.5px; line-height:1.25; font-style:normal; text-align:right; } .diet-profile-v540 .diet-context-help-body{ display:grid; gap:9px; padding:0 12px 12px; } .diet-profile-v540 .diet-context-help-body p{ margin:0; color:#34495f; font-size:12.8px; line-height:1.52; } .diet-profile-v540 .diet-context-help-body p b{color:#263d57;} .diet-profile-v540 .diet-context-help-current, .diet-profile-v540 .diet-context-help-action{ padding:10px 11px; border-radius:14px; border:1px solid rgba(50,88,120,.11); background:#fff; } .diet-profile-v540 .diet-context-help-current span, .diet-profile-v540 .diet-context-help-action span{ display:block; margin-bottom:5px; color:#61748b; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.055em; } .diet-profile-v540 .diet-context-help-action{ background:#f4f9f6; border-color:rgba(61,116,78,.14); } .diet-profile-v540 .diet-context-help-action em{ display:block; margin-top:6px; color:#607188; font-size:12px; line-height:1.35; font-style:normal; } @media (max-width:640px){ .diet-profile-v540 .diet-context-help > summary{ grid-template-columns:1fr; align-items:flex-start; } .diet-profile-v540 .diet-context-help > summary em{text-align:left;} } /* v5.3.65 — personal needs priority context inside matrix profile */ .diet-profile-personal-bridge{border:1px solid #d7e5f2;background:#f8fbff;border-radius:14px;padding:10px 12px;margin:10px 0;display:grid;gap:8px;} .diet-profile-personal-bridge>div:first-child span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#64748b;font-weight:750;} .diet-profile-personal-bridge>div:first-child strong{display:block;color:#0f172a;font-size:14px;line-height:1.25;} .diet-profile-personal-tags,.diet-profile-personal-nutrients{display:flex;flex-wrap:wrap;gap:6px;} .diet-profile-personal-tags span,.diet-profile-personal-nutrients span{display:inline-flex;border:1px solid #d7e5f2;background:#fff;border-radius:999px;padding:4px 8px;font-size:12px;color:#334155;} .diet-profile-personal-nutrients span{background:#eef6ff;color:#1e3a8a;border-color:#bfdbfe;} .diet-profile-personal-bridge ul{margin:0;padding-left:18px;color:#334155;font-size:13px;line-height:1.45;} .diet-profile-personal-bridge em{font-style:normal;color:#7c2d12;background:#fff7ed;border:1px solid #fed7aa;border-radius:10px;padding:7px 8px;font-size:12px;} @media(max-width:720px){.diet-profile-personal-bridge{padding:9px}.diet-profile-personal-tags span,.diet-profile-personal-nutrients span{font-size:11.5px;padding:4px 7px}.diet-profile-personal-bridge ul{font-size:12.5px}} @media print{.diet-profile-personal-bridge{break-inside:avoid;background:#fff;border-color:#ccd6e1}.diet-profile-personal-nutrients span{background:#fff;color:#111827;border-color:#ccd6e1}} .diet-profile-personal-nutrients span[data-priority="main"]{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe;font-weight:900;} .diet-profile-personal-nutrients span[data-priority="important"]{background:#fff7ed;color:#9a3412;border-color:#fed7aa;font-weight:900;} /* ===== SOURCE: assets/css/methodology-governance-v5.css ===== */ /* nutrition calculator v5.2.5 methodology/navigation/governance */ .workflow-steps{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; margin:12px 0 16px; } .workflow-steps a{ display:flex; flex-direction:column; gap:2px; min-height:48px; padding:9px 10px; border:1px solid #d8e8f7; border-radius:14px; background:linear-gradient(180deg,#ffffff,#f8fbff); color:#17324d; text-decoration:none; box-shadow:0 8px 20px rgba(15,23,42,.04); } .workflow-steps a:hover, .workflow-steps a:focus-visible{ border-color:#8ec2ef; outline:0; box-shadow:0 0 0 3px rgba(56,111,164,.16); } .workflow-steps span, .step-badge{ display:inline-flex; width:max-content; align-items:center; gap:4px; padding:3px 8px; border-radius:999px; background:#e8f3ff; color:#245d93; font-size:11px; line-height:1.1; font-weight:800; letter-spacing:.02em; text-transform:uppercase; } .workflow-steps a{font-weight:700;font-size:13px;} .section-title-block, .section-title-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;} .section-title-block h2, .section-title-row h1{margin:0;} .data-quality-card{border-color:#d8e8f7;background:linear-gradient(180deg,#fff,#fbfdff);} .data-quality-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;} .data-quality-head h2{margin:6px 0 4px;} .data-quality-version{font-size:12px;font-weight:800;color:#386fa4;background:#e8f3ff;border-radius:999px;padding:5px 9px;white-space:nowrap;} .data-quality-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0;} .data-quality-metric{border:1px solid #e0ebf5;border-radius:14px;padding:10px;background:#fff;} .data-quality-metric strong{display:block;font-size:20px;line-height:1.1;color:#172033;} .data-quality-metric span{display:block;margin-top:4px;color:#64748b;font-size:12px;} .data-quality-meter{height:7px;border-radius:999px;background:#e5edf6;overflow:hidden;margin-top:8px;} .data-quality-meter i{display:block;height:100%;width:var(--dq-pct,0%);background:linear-gradient(90deg,#8ec2ef,#386fa4);border-radius:inherit;} .data-quality-details{border:1px solid #e0ebf5;border-radius:12px;padding:10px;background:#fff;} .data-quality-details summary{cursor:pointer;font-weight:800;color:#17324d;} .data-quality-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:13px;} .data-quality-table th,.data-quality-table td{border:1px solid #dce8f3;padding:7px 8px;text-align:left;vertical-align:top;} .data-quality-table th{background:#eef6ff;font-size:12px;} .data-quality-note{margin:10px 0 0;color:#64748b;font-size:12px;line-height:1.45;} .data-quality-warning{margin-top:10px;border-left:4px solid #f59e0b;background:#fff8e6;border-radius:10px;padding:9px 11px;color:#7a4b00;font-size:13px;} @media (max-width:860px){ .workflow-steps{display:flex;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x proximity;} .workflow-steps a{min-width:136px;scroll-snap-align:start;} .data-quality-summary{grid-template-columns:repeat(2,minmax(0,1fr));} } @media (max-width:520px){ .data-quality-head{display:block;} .data-quality-version{margin-top:8px;} .data-quality-summary{grid-template-columns:1fr;} } @media print{ .workflow-steps{display:none;} .data-quality-card{break-inside:avoid;} } /* ===== SOURCE: assets/css/mobile-ergonomics-v5.css ===== */ /* v5.2.23 mobile ergonomics hotfix Purpose: make Step 2 search usable on narrow mobile screens with the on-screen keyboard open. Data/calculation logic is untouched. */ @media (max-width: 760px) { html, body { width: 100%; max-width: 100%; overflow-x: hidden !important; } body { -webkit-text-size-adjust: 100%; touch-action: manipulation; } *, *::before, *::after { max-width: 100%; box-sizing: border-box; } .container { width: 100%; max-width: 100%; padding-left: 10px !important; padding-right: 10px !important; overflow-x: hidden; } .card, section, #globalSearchSection, #rationSection, .search-field-card, .search-grams-card { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } .step-nav { display: flex; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; gap: 8px; padding-bottom: 4px; } .step-nav a { flex: 0 0 auto; min-width: 132px; scroll-snap-align: start; } /* Search input: no two-column overflow on small screens. */ #globalSearchSection.search-hero { padding: 12px !important; scroll-margin-top: 8px; overflow: visible; } #globalSearchSection .search-hero-head, #globalSearchSection .search-main-grid, #globalSearchSection .search-line { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; width: 100% !important; min-width: 0 !important; gap: 10px !important; } #globalSearchInput.search-input-main { width: 100% !important; min-width: 0 !important; max-width: 100% !important; font-size: 16px !important; line-height: 1.25; } #globalSearchClear { width: 100% !important; min-width: 0 !important; } .search-field-hint, .search-lead { overflow-wrap: anywhere; } .quick-searches, .quick-grams { display: flex; flex-wrap: nowrap !important; overflow-x: auto !important; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; gap: 8px; padding-bottom: 6px; max-width: 100%; } .quick-searches button, .quick-grams button { flex: 0 0 auto !important; max-width: none; } /* The old fixed result panel conflicts with mobile keyboards. Keep results inline. */ .mobile-results-anchor { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; } .mobile-results-anchor #globalResults.search-results-enhanced, .mobile-results-anchor #globalResults.search-results-enhanced.has-query, #globalResults.search-results-enhanced, #globalResults.search-results-enhanced.has-query { position: static !important; inset: auto !important; transform: none !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 10px 0 0 0 !important; padding: 8px !important; max-height: min(44vh, 420px) !important; overflow-y: auto !important; overflow-x: hidden !important; border: 1px solid #bfdbfe !important; border-radius: 16px !important; background: #fff !important; box-shadow: 0 8px 20px rgba(15, 23, 42, .10) !important; z-index: auto !important; } .mobile-results-anchor #globalResults.search-results-enhanced:not(.has-query), #globalResults.search-results-enhanced:not(.has-query) { display: none !important; } .mobile-results-anchor #globalResults.search-results-enhanced.has-query::before, #globalResults.search-results-enhanced.has-query::before { content: none !important; display: none !important; } #globalResults .v45-search-panel-head, .mobile-results-anchor #globalResults .v45-search-panel-head { position: static !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 4px !important; margin: 0 0 8px 0 !important; padding: 8px 10px !important; border-radius: 12px !important; font-size: 13px !important; } #globalResults .search-result-card, .mobile-results-anchor #globalResults .search-result-card { width: 100% !important; min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; padding: 10px !important; margin: 0 0 8px 0 !important; border-radius: 14px !important; } #globalResults .search-result-title, .mobile-results-anchor #globalResults .search-result-title { font-size: 15px !important; line-height: 1.28 !important; overflow-wrap: anywhere !important; word-break: normal; } #globalResults .search-result-meta, .mobile-results-anchor #globalResults .search-result-meta { font-size: 12px !important; line-height: 1.28 !important; overflow-wrap: anywhere !important; } #globalResults .search-result-nutrients, .mobile-results-anchor #globalResults .search-result-nutrients { display: flex !important; flex-wrap: wrap !important; gap: 5px !important; overflow: visible !important; } #globalResults .search-result-actions, .mobile-results-anchor #globalResults .search-result-actions { display: grid !important; grid-template-columns: 92px minmax(0, 1fr) !important; gap: 8px !important; align-items: end !important; } #globalResults .search-result-actions label, .mobile-results-anchor #globalResults .search-result-actions label { grid-column: 1 / -1 !important; } #globalResults .search-result-actions input, .mobile-results-anchor #globalResults .search-result-actions input { width: 92px !important; min-width: 0 !important; } #globalResults .search-result-actions button, .mobile-results-anchor #globalResults .search-result-actions button { min-width: 0 !important; width: 100% !important; white-space: normal !important; overflow-wrap: anywhere; } /* The floating cart hides useful controls while the keyboard is open. */ body.mobile-search-mode .v40-mini-cart, body.keyboard-open .v40-mini-cart { display: none !important; pointer-events: none !important; } .v40-mini-cart { max-width: calc(100vw - 16px) !important; } .v40-mini-cart-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } body.mobile-search-mode #globalSearchSection { border-color: #60a5fa; box-shadow: 0 10px 24px rgba(37, 99, 235, .10); } /* Wide tables and utility panels must not widen the whole page. */ .table-wrap, .table-scroll, #rationSection, #totalsSection, #heiPanel, #harvardPlatePanel, #reportPanel { overflow-x: auto; max-width: 100%; } } @media (max-width: 420px) { #globalResults .search-result-actions, .mobile-results-anchor #globalResults .search-result-actions { grid-template-columns: 86px minmax(0, 1fr) !important; } #globalResults .search-result-actions input, .mobile-results-anchor #globalResults .search-result-actions input { width: 86px !important; } #globalSearchSection h2 { font-size: 1.52rem !important; line-height: 1.12 !important; } } /* v5.2.23 final mobile ergonomics audit polish Stronger mobile-only guarantees for search, keyboard and mini-cart behavior. */ @media (max-width: 760px) { :root { --mobile-bottom-safe-gap: 10px; } html, body, #mainContent, .container { min-width: 0 !important; max-width: 100vw !important; overflow-x: hidden !important; } body { margin-left: 0 !important; margin-right: 0 !important; } #mainContent.container { padding-left: clamp(8px, 2.6vw, 12px) !important; padding-right: clamp(8px, 2.6vw, 12px) !important; } header, header .toolbar, .workflow-steps, .step-nav, .card, #needsCompact, #globalSearchSection, #rationSection, #totalsSection, #harvardPlatePanel, #heiPanel, #globalActions { max-width: 100% !important; min-width: 0 !important; } /* Mobile search should behave as an inline work area, not as a floating overlay. */ #globalSearchSection { contain: inline-size; overflow: visible !important; } #globalSearchSection .search-hero-head, #globalSearchSection .search-main-grid, #globalSearchSection .search-field-card, #globalSearchSection .search-grams-card, #globalSearchSection .search-line { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; align-items: stretch !important; } #globalSearchInput, #globalSearchInput.search-input-main, #globalSearchGrams, #globalSearchClear { min-height: 48px !important; border-radius: 14px !important; font-size: 16px !important; } #globalSearchClear { width: 100% !important; } #globalSearchStatus { overflow-wrap: anywhere !important; } /* Quick chips wrap instead of forcing a sideways mobile scroll. */ #globalSearchSection .quick-searches, #globalSearchSection .quick-grams { display: flex !important; flex-wrap: wrap !important; overflow-x: visible !important; gap: 8px !important; padding-bottom: 0 !important; } #globalSearchSection .quick-searches button, #globalSearchSection .quick-grams button { flex: 1 1 auto !important; min-width: min(42vw, 128px) !important; max-width: 100% !important; min-height: 42px !important; white-space: normal !important; } /* Defeat all older fixed-panel search-result rules. */ #globalResults, #globalResults.search-results-enhanced, #globalResults.search-results-enhanced.has-query, .mobile-results-anchor, .mobile-results-anchor #globalResults, .mobile-results-anchor #globalResults.search-results-enhanced, .mobile-results-anchor #globalResults.search-results-enhanced.has-query { position: static !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; inset: auto !important; transform: none !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 10px 0 0 !important; box-sizing: border-box !important; z-index: auto !important; } #globalResults.search-results-enhanced.has-query, .mobile-results-anchor #globalResults.search-results-enhanced.has-query { display: block !important; max-height: min(52svh, 430px) !important; overflow-y: auto !important; overflow-x: hidden !important; overscroll-behavior: contain !important; -webkit-overflow-scrolling: touch !important; } body.keyboard-open #globalResults.search-results-enhanced.has-query, body.keyboard-open .mobile-results-anchor #globalResults.search-results-enhanced.has-query { max-height: min(42svh, 340px) !important; } #globalResults.search-results-enhanced.has-query::before, .mobile-results-anchor #globalResults.search-results-enhanced.has-query::before { content: none !important; display: none !important; } #globalResults .search-result-card, .mobile-results-anchor #globalResults .search-result-card { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 8px !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; padding: 10px !important; margin: 0 0 8px 0 !important; overflow: hidden !important; } #globalResults .search-result-title, #globalResults .search-result-meta, #globalResults .meta, .mobile-results-anchor #globalResults .search-result-title, .mobile-results-anchor #globalResults .search-result-meta, .mobile-results-anchor #globalResults .meta { max-width: 100% !important; min-width: 0 !important; overflow-wrap: anywhere !important; } #globalResults .search-result-nutrients, .mobile-results-anchor #globalResults .search-result-nutrients { display: flex !important; flex-wrap: wrap !important; gap: 5px !important; } #globalResults .search-result-actions, .mobile-results-anchor #globalResults .search-result-actions { display: grid !important; grid-template-columns: 86px minmax(0, 1fr) !important; gap: 8px !important; align-items: end !important; width: 100% !important; min-width: 0 !important; } #globalResults .search-result-actions label, .mobile-results-anchor #globalResults .search-result-actions label { grid-column: 1 / -1 !important; margin: 0 !important; } #globalResults .search-result-actions input, .mobile-results-anchor #globalResults .search-result-actions input { width: 86px !important; min-width: 0 !important; min-height: 48px !important; font-size: 16px !important; } #globalResults .search-result-actions button, .mobile-results-anchor #globalResults .search-result-actions button { width: 100% !important; min-width: 0 !important; min-height: 48px !important; padding: 10px 12px !important; white-space: normal !important; overflow-wrap: anywhere !important; } /* Hide the floating mini-cart whenever search is active. Use JS classes and CSS :has as a fallback. */ body.mobile-search-mode #v40MiniCart, body.keyboard-open #v40MiniCart, body.search-results-visible #v40MiniCart, body.mobile-search-mode .v40-mini-cart, body.keyboard-open .v40-mini-cart, body.search-results-visible .v40-mini-cart, body:has(#globalSearchInput:focus) #v40MiniCart, body:has(#globalSearchInput:focus) .v40-mini-cart { display: none !important; visibility: hidden !important; pointer-events: none !important; } /* Dialogs and dev panels must be full-width sheets on phones. */ dialog, .dev-panel, .hosting-test-panel { width: calc(100vw - 16px) !important; max-width: calc(100vw - 16px) !important; max-height: min(82svh, 720px) !important; left: 8px !important; right: 8px !important; margin: auto !important; overflow: auto !important; } .dev-panel, .hosting-test-panel { bottom: 8px !important; } } @media (max-width: 360px) { #globalResults .search-result-actions, .mobile-results-anchor #globalResults .search-result-actions { grid-template-columns: 78px minmax(0, 1fr) !important; } #globalResults .search-result-actions input, .mobile-results-anchor #globalResults .search-result-actions input { width: 78px !important; } #globalSearchSection .quick-searches button, #globalSearchSection .quick-grams button { flex-basis: 100% !important; } } /* ===== SOURCE: assets/css/mobile-critical-fix-v5.css ===== */ /* nutrition calculator v5.2.23 — mobile critical hotfix Purpose: final viewport containment and touch ergonomics based on phone screenshots. Data/calculation logic is untouched. */ @media (max-width: 760px) { html, body { width: 100% !important; max-width: 100vw !important; min-width: 0 !important; overflow-x: clip !important; } @supports not (overflow-x: clip) { html, body { overflow-x: hidden !important; } } body { margin: 0 !important; padding: 0 !important; background: linear-gradient(180deg,#ffffff,#f7fbff) !important; } *, *::before, *::after { box-sizing: border-box !important; } #mainContent.container, .container { width: 100% !important; max-width: 100vw !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 10px !important; padding-right: 10px !important; padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important; overflow-x: clip !important; } @supports not (overflow-x: clip) { #mainContent.container, .container { overflow-x: hidden !important; } } header { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 0 12px 0 !important; } header .title, .title { width: 100% !important; min-width: 0 !important; max-width: 100% !important; font-size: clamp(25px, 7vw, 34px) !important; line-height: 1.12 !important; overflow-wrap: anywhere !important; } header .toolbar { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 8px !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; overflow: visible !important; } header .toolbar > *, header .toolbar select, header .toolbar button, header .toolbar .seg, #regionSeg { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; } header .toolbar .seg, #regionSeg { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; gap: 4px !important; padding: 3px !important; border-radius: 18px !important; } header .toolbar .seg button, #regionSeg button { width: 100% !important; min-width: 0 !important; max-width: 100% !important; white-space: nowrap !important; padding-left: 8px !important; padding-right: 8px !important; } .workflow-steps { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; overflow: visible !important; padding: 0 !important; margin: 10px 0 14px 0 !important; scroll-snap-type: none !important; } .workflow-steps a { width: 100% !important; min-width: 0 !important; max-width: 100% !important; min-height: 54px !important; overflow-wrap: anywhere !important; scroll-snap-align: none !important; } .card, section, #needsCompact, #needs, #globalSearchSection, #rationSection, #totalsSection, #dataQualityPanel, #heiPanel, #harvardPlatePanel, #selectSection, #presetsPanel, #globalActions, #legal-note { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: clamp(12px, 4vw, 16px) !important; padding-right: clamp(12px, 4vw, 16px) !important; overflow-wrap: anywhere !important; contain: inline-size; } .grid, .row, .inline, .totals-grid, .kpi, .search-main-grid, .search-line, .search-field-card, .search-grams-card, .meal-grid, .data-quality-summary, .harvard-plate-layout, .hp-explain-grid { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; } input, select, textarea, button, .btn { max-width: 100% !important; min-width: 0 !important; font-size: 16px !important; } input[type="number"], input[type="text"], input[type="search"], select, textarea { width: 100% !important; min-height: 48px !important; } #globalSearchSection.search-hero { padding: 14px !important; border-radius: 18px !important; overflow: hidden !important; } #globalSearchSection h2 { font-size: clamp(30px, 9vw, 40px) !important; line-height: 1.12 !important; letter-spacing: -0.02em !important; } #globalSearchSection .search-lead, #globalSearchSection .search-field-hint, #globalSearchStatus, .muted, .small { max-width: 100% !important; overflow-wrap: anywhere !important; word-break: normal !important; } #globalSearchSection .quick-searches, #globalSearchSection .quick-grams { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 8px !important; width: 100% !important; overflow: visible !important; } #globalSearchSection .quick-searches button, #globalSearchSection .quick-grams button { width: 100% !important; min-width: 0 !important; max-width: 100% !important; white-space: normal !important; } #globalResults, #globalResults.search-results-enhanced, #globalResults.search-results-enhanced.has-query, .mobile-results-anchor, .mobile-results-anchor #globalResults { width: 100% !important; max-width: 100% !important; min-width: 0 !important; left: auto !important; right: auto !important; transform: none !important; } table, .tbl, .ration-table, .data-quality-table { width: 100% !important; max-width: 100% !important; } .table-wrap, .table-scroll, .catalog-drawer-body, .additional-body, .ration-table-wrap, #microsGroups, #totalsGrid { max-width: 100% !important; min-width: 0 !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; } .harvard-plate-visual-wrap, .harvard-plate-status, .harvard-plate-visual, .harvard-plate-svg-shell, .harvard-plate-svg-shell svg { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } .harvard-plate-companions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } #v40MiniCart, .v40-mini-cart { left: 8px !important; right: 8px !important; width: auto !important; max-width: calc(100vw - 16px) !important; } } @media (max-width: 380px) { .workflow-steps, #globalSearchSection .quick-searches, #globalSearchSection .quick-grams, .harvard-plate-companions { grid-template-columns: minmax(0, 1fr) !important; } .card, section, #globalSearchSection.search-hero { padding-left: 10px !important; padding-right: 10px !important; } } /* ===== SOURCE: assets/css/mobile-final-v5.3.37.css ===== */ /* nutrition calculator v5.2.25 — mobile first pass base Purpose: first high-priority pass after mobile UX audit. Scope: compact mobile shell, hidden skip-links, stable nutrient cards, HEI cards, honest mobile Harvard pie. Data/calculation logic is untouched. */ @media (max-width: 760px) { html, body { overflow-x: hidden !important; max-width: 100vw !important; } /* 1) Skip links must not look like broken top banners on touch phones. */ @media (hover: none) and (pointer: coarse) { .skip-link, .skip-link.skip-link--second { position: fixed !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; transform: none !important; left: 0 !important; top: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: transparent !important; } .skip-link:focus-visible, .skip-link.skip-link--second:focus-visible { width: auto !important; height: auto !important; overflow: visible !important; clip-path: none !important; left: 8px !important; top: 8px !important; padding: 8px 10px !important; border: 2px solid #0b61d6 !important; border-radius: 10px !important; box-shadow: 0 8px 20px rgba(15,23,42,.18) !important; background: #fff !important; color: #084a9f !important; z-index: 20000 !important; } } /* 2) Compact mobile shell. */ #mainContent.container, .container { padding-left: 8px !important; padding-right: 8px !important; padding-top: 8px !important; } header { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 6px !important; margin: 0 0 8px 0 !important; padding: 0 !important; } header .title, .title { font-size: clamp(21px, 6.2vw, 26px) !important; line-height: 1.08 !important; letter-spacing: -0.025em !important; margin: 0 !important; word-break: normal !important; overflow-wrap: break-word !important; } header .toolbar { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 6px !important; align-items: center !important; } header .toolbar > * { min-width: 0 !important; } #regionSeg { width: 100% !important; min-height: 38px !important; border-radius: 14px !important; padding: 3px !important; } #regionSeg button { min-height: 32px !important; padding: 5px 10px !important; font-size: 15px !important; line-height: 1.1 !important; border-radius: 11px !important; } #resetBtn { width: auto !important; min-width: 76px !important; min-height: 38px !important; padding: 6px 11px !important; font-size: 14px !important; line-height: 1.1 !important; border-radius: 12px !important; white-space: nowrap !important; } #editNormsBtn, #devToggle, #normProfile { display: none !important; } /* 3) Compact workflow chips instead of large cards. */ .workflow-steps, .step-nav { display: flex !important; gap: 6px !important; overflow-x: auto !important; overflow-y: hidden !important; -webkit-overflow-scrolling: touch !important; scroll-snap-type: x proximity !important; margin: 6px 0 10px 0 !important; padding: 0 0 4px 0 !important; max-width: 100% !important; } .workflow-steps a, .step-nav a { flex: 0 0 auto !important; min-width: auto !important; width: auto !important; min-height: 34px !important; padding: 6px 9px !important; border-radius: 999px !important; font-size: 12px !important; line-height: 1.12 !important; display: inline-flex !important; flex-direction: row !important; align-items: center !important; gap: 5px !important; scroll-snap-align: start !important; } .workflow-steps a span, .step-nav a span { display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 2px 5px !important; font-size: 10px !important; line-height: 1 !important; border-radius: 999px !important; white-space: nowrap !important; } /* 4) Reduce vertical bulk in cards. */ .card, section, #needsCompact, #globalSearchSection, #rationSection, #heiPanel, #totalsSection, #harvardPlatePanel, #dataQualityPanel, #globalActions { border-radius: 16px !important; padding: 12px !important; margin-top: 10px !important; margin-bottom: 10px !important; contain: none !important; overflow-wrap: normal !important; word-break: normal !important; } .step-badge { padding: 5px 10px !important; font-size: 13px !important; line-height: 1 !important; } h1, h2, h3, .card-title, .harvard-plate-title { word-break: normal !important; overflow-wrap: break-word !important; } #needs h1, #globalSearchSection h2, #rationSection h2, #heiPanel h2, #totalsSection h2, #harvardPlatePanel h2 { font-size: clamp(22px, 6.8vw, 28px) !important; line-height: 1.12 !important; letter-spacing: -0.02em !important; margin-bottom: 6px !important; } .search-lead, .ration-subtitle, .harvard-plate-subtitle, .muted, .small, .hint, .footer-note { word-break: normal !important; overflow-wrap: break-word !important; } /* 5) Search: compact working area. */ #globalSearchSection.search-hero { padding: 12px !important; } #globalSearchSection .search-lead { font-size: 15px !important; line-height: 1.42 !important; margin-bottom: 8px !important; } #globalSearchSection .search-field-card, #globalSearchSection .search-grams-card { padding: 10px !important; border-radius: 14px !important; } #globalSearchInput.search-input-main, #globalSearchGrams, #globalSearchClear { min-height: 44px !important; border-radius: 12px !important; } #globalSearchSection .quick-searches, #globalSearchSection .quick-grams { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; } #globalSearchSection .quick-searches button, #globalSearchSection .quick-grams button { min-height: 36px !important; min-width: auto !important; flex: 1 1 calc(50% - 6px) !important; padding: 7px 8px !important; font-size: 14px !important; border-radius: 999px !important; } /* 6) Nutrient cards: do not allow Russian words to collapse into letter columns. */ #totalsGrid, #microsGroups .totals-grid { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; overflow: visible !important; } #totalsSection .total-card { padding: 12px !important; border-radius: 14px !important; overflow: hidden !important; min-width: 0 !important; max-width: 100% !important; } #totalsSection .total-row { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 6px !important; align-items: stretch !important; min-width: 0 !important; } #totalsSection .total-row > div { min-width: 0 !important; max-width: 100% !important; word-break: normal !important; overflow-wrap: break-word !important; } #totalsSection .total-row > div:first-child strong, #totalsSection .total-card strong { word-break: normal !important; overflow-wrap: break-word !important; hyphens: none !important; } #totalsSection .total-row > .muted, #totalsSection .total-card .muted { font-size: 13px !important; line-height: 1.36 !important; text-align: left !important; } #totalsSection .progress { width: 100% !important; min-width: 0 !important; } #totalsSection .total-row:has(.progress) { grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; } #totalsSection .total-row:has(.progress) strong { white-space: nowrap !important; font-size: 17px !important; } #totalsSection details.norms > summary { font-size: 15px !important; line-height: 1.25 !important; } /* 7) HEI table becomes mobile cards. */ #heiPanel .table-wrap { display: none !important; } #heiMobileCards { display: grid !important; gap: 10px !important; margin-top: 10px !important; } .hei-mobile-card { border: 1px solid #dbeafe; background: #fff; border-radius: 14px; padding: 11px 12px; display: grid; gap: 7px; } .hei-mobile-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; } .hei-mobile-card__title { font-size: 16px; line-height: 1.2; font-weight: 800; color: #123b64; } .hei-mobile-card__score { flex: 0 0 auto; padding: 4px 8px; border-radius: 999px; background: #e9f2ff; color: #084a9f; font-size: 13px; font-weight: 800; white-space: nowrap; } .hei-mobile-card__row { display: grid; gap: 2px; font-size: 13px; line-height: 1.32; color: #334155; } .hei-mobile-card__row span { font-size: 11px; font-weight: 800; color: #64748b; text-transform: uppercase; letter-spacing: .03em; } /* 8) Harvard Plate: on phones show actual shares as actual sectors. */ .hp-mobile-actual-shell svg { display: block !important; width: 100% !important; height: auto !important; max-height: none !important; } .hp-mobile-actual-legend { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; padding: 8px 2px 0; } .hp-mobile-actual-legend-item { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 8px; align-items: center; font-size: 13px; line-height: 1.25; color: #334155; } .hp-mobile-actual-dot { width: 10px; height: 10px; border-radius: 999px; background: var(--hp-dot, #64748b); } .hp-mobile-actual-legend-item strong { color: #123b64; word-break: normal !important; overflow-wrap: break-word !important; } .hp-mobile-actual-legend-item b { color: #123b64; white-space: nowrap; } .harvard-plate-companions { grid-template-columns: minmax(0, 1fr) !important; } } @media (min-width: 761px) { #heiMobileCards { display: none !important; } } @media (max-width: 380px) { #mainContent.container, .container { padding-left: 6px !important; padding-right: 6px !important; } .card, section, #needsCompact, #globalSearchSection, #rationSection, #heiPanel, #totalsSection, #harvardPlatePanel, #dataQualityPanel, #globalActions { padding-left: 10px !important; padding-right: 10px !important; } header .title, .title { font-size: 21px !important; } } /* ===== SOURCE: assets/css/mobile-hei-dashboard-v5.css ===== */ /* nutrition calculator v5.2.24 — mobile HEI dashboard Mobile-only: compact total score + all 13 HEI component indicators with accordion details. Desktop HEI table is intentionally preserved. */ @media (max-width: 760px) { #heiMobileCards { display: none !important; } #heiPanel .table-wrap { display: none !important; } #heiMobileDashboard { display: grid !important; gap: 8px !important; margin: 8px 0 10px !important; } #heiPanel #heiSummary { display: none !important; } #heiPanel #heiLevers, #heiPanel #heiRecs, #heiPanel #heiReference { margin-top: 10px !important; } .hei-mobile-empty, .hei-mobile-total, .hei-mobile-indicator { border: 1px solid #dbeafe; background: #fff; border-radius: 14px; overflow: hidden; color: #0f172a; } .hei-mobile-empty { padding: 12px; display: grid; gap: 4px; } .hei-mobile-empty strong { color: #123b64; } .hei-mobile-empty span { color: #475569; font-size: 13px; line-height: 1.35; } .hei-mobile-total { padding: 0; background: linear-gradient(180deg,#ffffff,#f8fbff); } .hei-mobile-total > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 11px 12px 8px; } .hei-mobile-total > summary::-webkit-details-marker, .hei-mobile-indicator > summary::-webkit-details-marker { display: none; } .hei-mobile-total > summary span { display: grid; gap: 2px; min-width: 0; } .hei-mobile-total > summary b { font-size: 17px; line-height: 1.1; color: #123b64; } .hei-mobile-total > summary small { font-size: 12px; line-height: 1.2; color: #64748b; } .hei-mobile-total > summary strong { font-size: 19px; line-height: 1; color: #123b64; white-space: nowrap; } .hei-mobile-total-bar { height: 10px; margin: 0 12px 8px; background: #e8f2fb; border-radius: 999px; overflow: hidden; } .hei-mobile-total-bar i, .hei-mobile-scorebar i { display: block; width: var(--hei-score-pct,0%); height: 100%; border-radius: inherit; background: #0b61d6; } .hei-mobile-total[data-tone="ok"] .hei-mobile-total-bar i, .hei-mobile-indicator[data-tone="ok"] .hei-mobile-scorebar i { background: #16a34a; } .hei-mobile-total[data-tone="warn"] .hei-mobile-total-bar i, .hei-mobile-indicator[data-tone="warn"] .hei-mobile-scorebar i { background: #f59e0b; } .hei-mobile-total[data-tone="bad"] .hei-mobile-total-bar i, .hei-mobile-indicator[data-tone="bad"] .hei-mobile-scorebar i { background: #dc2626; } .hei-mobile-total p { margin: 0; padding: 0 12px 10px; color: #334155; font-size: 13px; line-height: 1.35; } .hei-mobile-total .hei-mobile-total-note { color: #64748b; font-size: 12px; padding-top: 0; } .hei-mobile-dashboard-head { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; color: #123b64; margin-top: 2px; padding: 0 2px; } .hei-mobile-dashboard-head strong { font-size: 14px; } .hei-mobile-dashboard-head span { color: #64748b; font-size: 11px; text-align: right; } .hei-mobile-indicator-list { display: grid; gap: 5px; } .hei-mobile-indicator { border-radius: 12px; } .hei-mobile-indicator > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(104px, 1.12fr) minmax(74px, .72fr) auto; gap: 8px; align-items: center; min-height: 38px; padding: 7px 9px; } .hei-mobile-indicator > summary::after { content: "▾"; color: #64748b; font-size: 12px; margin-left: 2px; } .hei-mobile-indicator[open] > summary::after { content: "▴"; } .hei-mobile-indicator-title { min-width: 0; color: #123b64; font-weight: 800; font-size: 12.5px; line-height: 1.16; word-break: normal; overflow-wrap: break-word; } .hei-mobile-scorebar { height: 8px; background: #e8f2fb; border-radius: 999px; overflow: hidden; min-width: 0; } .hei-mobile-indicator-score { color: #123b64; font-weight: 800; font-size: 12px; line-height: 1; white-space: nowrap; justify-self: end; } .hei-mobile-indicator-body { border-top: 1px solid #e2eefb; padding: 8px 10px 10px; display: grid; gap: 7px; background: #fbfdff; } .hei-mobile-detail-row { display: grid; gap: 2px; font-size: 13px; line-height: 1.35; } .hei-mobile-detail-row span { color: #64748b; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .035em; } .hei-mobile-detail-row strong { color: #0f172a; font-weight: 650; } } @media (min-width: 761px) { #heiMobileDashboard, #heiMobileCards { display: none !important; } #heiPanel .table-wrap { display: block; } } @media (max-width: 380px) { .hei-mobile-indicator > summary { grid-template-columns: minmax(96px, 1fr) minmax(62px, .62fr) auto; gap: 6px; padding-left: 8px; padding-right: 8px; } .hei-mobile-indicator-title { font-size: 12px; } .hei-mobile-indicator-score { font-size: 11.5px; } } /* ===== SOURCE: assets/css/hei-metric-advice-v5.css ===== */ /* nutrition calculator v5.2.26 — HEI metric advice readability Keeps HEI math intact; improves desktop/mobile wording and long recommendation wrapping. */ #heiPanel #heiTable td:nth-child(4){ max-width: 360px; line-height: 1.45; } #heiPanel #heiTable td, #heiPanel #heiTable th{ vertical-align: top; } #heiPanel .lever{ line-height: 1.45; } @media (max-width:760px){ #heiPanel #heiLevers, #heiPanel #heiRecs{ font-size: 13px; line-height: 1.45; } .hei-mobile-detail-row strong{ white-space: normal !important; overflow-wrap: break-word !important; word-break: normal !important; line-height: 1.38 !important; } .hei-mobile-indicator-body{ gap: 8px !important; } } /* ===== SOURCE: assets/css/mobile-runtime-layout-rescue-v5.3.37.css ===== */ /* nutrition calculator v5.2.25 — mobile runtime/layout rescue Loaded last. Purpose: stabilize mobile containment after v5.2.24 HEI dashboard without changing desktop UI or calculation logic. */ @media (max-width: 760px) { html, body { width: 100% !important; max-width: 100vw !important; overflow-x: hidden !important; } #mainContent.container, .container { width: 100% !important; max-width: 100vw !important; min-width: 0 !important; padding-left: 8px !important; padding-right: 8px !important; margin-left: 0 !important; margin-right: 0 !important; overflow-x: hidden !important; } header, nav, section, .card, dialog, #needsCompact, #needs, #globalSearchSection, #rationSection, #heiPanel, #totalsSection, #harvardPlatePanel, #dataQualityPanel, #selectSection, #globalActions { max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } header { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 6px !important; margin: 0 0 8px !important; } header .title, .title { font-size: clamp(21px, 6vw, 25px) !important; line-height: 1.1 !important; overflow-wrap: break-word !important; word-break: normal !important; } header .toolbar { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 6px !important; align-items: center !important; width: 100% !important; max-width: 100% !important; overflow: hidden !important; } #regionSeg { width: 100% !important; min-width: 0 !important; display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 4px !important; } #resetBtn { width: auto !important; min-width: 72px !important; max-width: 92px !important; white-space: nowrap !important; } .workflow-steps, .step-nav { display: flex !important; grid-template-columns: none !important; flex-wrap: nowrap !important; overflow-x: auto !important; overflow-y: hidden !important; gap: 6px !important; padding: 0 0 4px !important; margin: 6px 0 10px !important; } .workflow-steps a, .step-nav a { flex: 0 0 auto !important; width: auto !important; min-width: auto !important; max-width: none !important; min-height: 34px !important; padding: 6px 9px !important; white-space: nowrap !important; } .card, section { width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; } #needsCompact .card, #needs { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } input, select, textarea, button, .btn { max-width: 100% !important; box-sizing: border-box !important; } .grid, .row, .inline, .search-main-grid, .search-line, .search-field-card, .search-grams-card, .totals-grid, .kpi, .meal-grid, .harvard-plate-layout, .hp-explain-grid { max-width: 100% !important; min-width: 0 !important; } /* Dialogs as mobile sheets; avoids off-screen windows. */ dialog { width: calc(100vw - 16px) !important; max-width: calc(100vw - 16px) !important; max-height: min(84svh, 720px) !important; margin: auto !important; overflow: auto !important; border-radius: 16px !important; } /* HEI mobile dashboard must stay compact but not squeeze columns off-screen. */ #heiMobileDashboard { width: 100% !important; max-width: 100% !important; overflow: hidden !important; } .hei-mobile-total > summary, .hei-mobile-indicator > summary { width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; } .hei-mobile-indicator > summary { grid-template-columns: minmax(92px, 1fr) minmax(64px, .72fr) auto !important; gap: 6px !important; } .hei-mobile-indicator-title { overflow-wrap: break-word !important; word-break: normal !important; hyphens: none !important; } .hei-mobile-scorebar { min-width: 54px !important; } .hei-mobile-indicator-score { font-size: 11.5px !important; } } @media (max-width: 360px) { #mainContent.container, .container { padding-left: 6px !important; padding-right: 6px !important; } .hei-mobile-indicator > summary { grid-template-columns: minmax(0, 1fr) 54px auto !important; gap: 5px !important; padding-left: 7px !important; padding-right: 7px !important; } .hei-mobile-indicator-score { font-size: 11px !important; } } @media (min-width: 761px) { /* Explicitly keep desktop HEI/table behavior. */ #heiMobileDashboard, #heiMobileCards { display: none !important; } #heiPanel .table-wrap { display: block !important; } } /* ===== SOURCE: assets/css/personal-profile-clinical-ui-v5.3.99.css ===== */ /* v5.3.99 — Age profile popover and explanation UX */ :root{ --profile-ink:#12263a; --profile-muted:#5f7184; --profile-line:#cdddeb; --profile-blue:#1f6fb2; --profile-blue-soft:#eef6fc; --profile-blue-pale:#f7fbfe; --profile-shadow:0 16px 36px rgba(30,72,105,.12),0 3px 8px rgba(30,72,105,.06); } .needs-age-profile-indicator, .needs-personal-profile, .needs-profile-primary, .needs-scenario-router, .needs-profile-method, .needs-personal-card{ word-break:normal; overflow-wrap:break-word; hyphens:auto; } .needs-age-profile-indicator{ --profile-accent:#2b78b8; --profile-surface:#f5faff; --profile-border:#bfd8eb; position:relative; margin:9px 3px 2px; padding:0; border:1px solid var(--profile-border); border-radius:16px; background:linear-gradient(145deg,#fff 0%,var(--profile-surface) 100%); box-shadow:var(--profile-shadow); color:var(--profile-ink); transform-origin:28px top; opacity:0; transform:translateY(-7px) scale(.988); } .needs-age-profile-indicator[hidden]{display:none!important;} .needs-age-profile-indicator.is-visible{animation:needsProfileReveal .26s cubic-bezier(.2,.75,.25,1) both;} .needs-age-profile-indicator::before{ content:''; position:absolute; top:-7px; left:30px; width:12px; height:12px; border-left:1px solid var(--profile-border); border-top:1px solid var(--profile-border); background:#fff; transform:rotate(45deg); border-radius:2px 0 0 0; } .needs-age-profile-indicator::after{ content:''; position:absolute; left:0; top:17px; bottom:17px; width:3px; border-radius:0 4px 4px 0; background:var(--profile-accent); } .needs-age-profile-indicator.is-child{--profile-accent:#6658b8;--profile-surface:#f7f6ff;--profile-border:#d1ccf0;} .needs-age-profile-indicator.is-older{--profile-accent:#9a6c16;--profile-surface:#fffaf0;--profile-border:#ead6a4;} .needs-age-profile-indicator.is-special{--profile-accent:#b85d2d;--profile-surface:#fff8f3;--profile-border:#edcdbb;} .needs-age-profile-card{display:grid;grid-template-columns:38px minmax(0,1fr);gap:11px;padding:13px 14px 11px 15px;align-items:start;} .needs-age-profile-mark{ width:36px;height:36px;border-radius:12px;display:grid;place-items:center; color:var(--profile-accent);background:color-mix(in srgb,var(--profile-accent) 10%,#fff); border:1px solid color-mix(in srgb,var(--profile-accent) 20%,#fff); } .needs-age-profile-mark svg{width:22px;height:22px;display:block;} .needs-age-profile-content{min-width:0;} .needs-age-profile-topline{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 4px;} .needs-age-profile-topline>span{ display:inline-flex;align-items:center;border-radius:999px;padding:3px 7px; background:color-mix(in srgb,var(--profile-accent) 12%,#fff);color:var(--profile-accent); font-size:9.5px;font-weight:850;letter-spacing:.045em;text-transform:uppercase;line-height:1.2; } .needs-age-profile-topline>small{color:#748596;font-size:10.5px;line-height:1.25;} .needs-age-profile-content>strong{display:block;color:var(--profile-ink);font-size:15px;line-height:1.32;letter-spacing:-.01em;} .needs-age-profile-content>p{margin:6px 0 0;color:#4e6275;font-size:12.25px;line-height:1.46;} .needs-age-profile-why{border-top:1px solid color-mix(in srgb,var(--profile-border) 72%,#fff);margin:0 12px;padding:0;} .needs-age-profile-why>summary{list-style:none;cursor:pointer;padding:8px 2px 9px;color:#315d82;font-size:11.5px;font-weight:750;display:flex;align-items:center;justify-content:space-between;gap:8px;} .needs-age-profile-why>summary::-webkit-details-marker{display:none;} .needs-age-profile-why>summary::after{content:'›';font-size:18px;line-height:1;transform:rotate(90deg);transition:transform .18s ease;} .needs-age-profile-why[open]>summary::after{transform:rotate(-90deg);} .needs-age-profile-why>p{margin:0 0 11px;padding:0 2px;color:#5b6d7f;font-size:11.75px;line-height:1.48;} @keyframes needsProfileReveal{to{opacity:1;transform:translateY(0) scale(1);}} @media (prefers-reduced-motion:reduce){.needs-age-profile-indicator.is-visible{animation:none;opacity:1;transform:none;}} .needs-personal-profile{ position:relative; border:1px solid #cfdde9; border-radius:20px; background:linear-gradient(180deg,#fbfdff 0%,#f6f9fc 100%); padding:18px; margin:16px 0; box-shadow:0 10px 30px rgba(34,72,101,.06); } .needs-personal-profile::before{content:'';position:absolute;left:18px;right:18px;top:0;height:3px;border-radius:0 0 4px 4px;background:linear-gradient(90deg,#2e7bb8,#78afd5);} .needs-personal-profile-heading{margin:0 0 14px;padding-top:3px;} .needs-personal-profile-heading>span{display:block;color:#4f7da1;font-size:10px;font-weight:850;letter-spacing:.075em;text-transform:uppercase;} .needs-personal-profile-heading h2{margin:4px 0 0;color:#143450;font-size:25px;line-height:1.18;letter-spacing:-.018em;} .needs-personal-profile-heading p{margin:8px 0 0;max-width:760px;color:#56697b;font-size:13.5px;line-height:1.58;} .needs-profile-primary{ border:1px solid #bfd6e8;border-radius:16px;background:#fff;padding:14px 15px;margin:0 0 11px; box-shadow:0 4px 14px rgba(32,77,112,.045); } .needs-profile-primary-heading{display:flex;gap:10px;align-items:center;} .needs-profile-primary-icon{width:32px;height:32px;border-radius:10px;background:#eaf4fb;border:1px solid #cce0ef;position:relative;flex:0 0 auto;} .needs-profile-primary-icon::before{content:'';position:absolute;left:9px;top:7px;width:12px;height:15px;border:1.7px solid #2d75aa;border-radius:7px 7px 5px 5px;} .needs-profile-primary-icon::after{content:'✓';position:absolute;right:2px;bottom:1px;width:14px;height:14px;border-radius:50%;display:grid;place-items:center;background:#2d75aa;color:#fff;font-size:9px;font-weight:900;} .needs-profile-primary-kicker{display:block;color:#47779e;font-size:10px;font-weight:850;letter-spacing:.055em;text-transform:uppercase;} .needs-profile-primary-heading strong{display:block;margin-top:2px;color:#122c43;font-size:17px;line-height:1.3;} .needs-profile-primary>p{margin:10px 0 0;color:#506476;font-size:13px;line-height:1.52;} .needs-profile-context-wrap{margin-top:11px;padding-top:10px;border-top:1px solid #e5edf4;} .needs-profile-context-label{display:block;margin-bottom:6px;color:#60778a;font-size:10.5px;font-weight:800;} .needs-profile-context{display:flex;flex-wrap:wrap;gap:6px;} .needs-profile-context span,.needs-personal-focus span{display:inline-flex;align-items:center;border:1px solid #d5e3ee;border-radius:999px;background:#f8fbfd;padding:4px 8px;color:#2f465a;font-size:11px;font-weight:700;line-height:1.25;} .needs-profile-method,.needs-scenario-router{border:1px solid #d8e4ee;border-radius:14px;background:#fff;margin:0 0 11px;overflow:hidden;} .needs-profile-method>summary,.needs-scenario-router>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;color:#1d3e58;} .needs-profile-method>summary::-webkit-details-marker,.needs-scenario-router>summary::-webkit-details-marker{display:none;} .needs-profile-method>summary>span,.needs-scenario-router>summary>span{display:grid;gap:2px;} .needs-profile-method>summary>span{font-weight:800;font-size:13px;} .needs-profile-method>summary small,.needs-scenario-router>summary small{color:#6b7e8f;font-size:10.75px;font-weight:600;} .needs-profile-method>summary::after,.needs-scenario-router>summary::after{content:'＋';font-size:17px;line-height:1;color:#42769e;} .needs-profile-method[open]>summary::after,.needs-scenario-router[open]>summary::after{content:'−';} .needs-profile-method[open]>summary,.needs-scenario-router[open]>summary{background:#f8fbfd;border-bottom:1px solid #e4edf4;} .needs-profile-method-body{padding:12px;} .needs-profile-method-body ol{list-style:none;counter-reset:profile-step;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;} .needs-profile-method-body li{counter-increment:profile-step;border:1px solid #e1eaf1;border-radius:12px;padding:10px;background:#fff;} .needs-profile-method-body li::before{content:counter(profile-step);display:grid;place-items:center;width:21px;height:21px;border-radius:7px;background:#eaf4fb;color:#286c9f;font-size:10px;font-weight:900;margin-bottom:6px;} .needs-profile-method-body strong{display:block;color:#17344c;font-size:12.5px;line-height:1.35;} .needs-profile-method-body li p{margin:5px 0 0;color:#596c7d;font-size:11.75px;line-height:1.47;} .needs-profile-method-note{margin:10px 0 0;border-left:3px solid #9fc4df;background:#f6fafc;border-radius:8px;padding:8px 9px;color:#526779;font-size:11.75px;line-height:1.48;} .needs-scenario-router>summary>span>b{color:#1d3e58;font-size:13px;} .needs-scenario-router>summary>em{font-style:normal;min-width:25px;height:25px;border-radius:9px;display:grid;place-items:center;background:#eef5fa;color:#315f82;font-size:10.5px;font-weight:850;} .needs-scenario-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px;} .needs-scenario-factor{margin:0;border:1px solid #e1e9f0;border-radius:12px;background:#fff;padding:10px;} .needs-scenario-factor>span{display:block;color:#4b789c;font-size:9.5px;font-weight:850;letter-spacing:.055em;text-transform:uppercase;} .needs-scenario-factor>strong{display:block;margin-top:3px;color:#142d43;font-size:12.5px;line-height:1.35;} .needs-scenario-factor>p{margin:6px 0 0;color:#596d7f;font-size:11.75px;line-height:1.47;} .needs-priority-section{margin-top:14px;} .needs-priority-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.72fr);gap:14px;align-items:end;margin-bottom:9px;} .needs-priority-heading>div>span{display:block;color:#4c7a9e;font-size:9.5px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;} .needs-priority-heading h3{margin:3px 0 0;color:#17334a;font-size:18px;line-height:1.25;} .needs-priority-heading>p{margin:0;color:#657789;font-size:11.75px;line-height:1.48;} .needs-personal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:0;} .needs-personal-card{border:1px solid #dbe6ef;border-radius:14px;background:#fff;padding:11px;box-shadow:0 3px 10px rgba(34,72,101,.035);} .needs-personal-card[data-level="главный"]{border-left:4px solid #2b78b8;background:#fbfdff;} .needs-personal-card[data-level="важный"]{border-left:4px solid #5b8fb3;} .needs-personal-card[data-level="осторожно"]{border-left:4px solid #b77a22;background:#fffdf8;} .needs-personal-card[data-level="поддерживать"]{border-left:4px solid #719585;} .needs-personal-card-head{display:grid;grid-template-columns:25px minmax(0,1fr);gap:8px;align-items:start;} .needs-personal-order{width:23px;height:23px;border-radius:8px;display:grid;place-items:center;background:#edf5fa;color:#356c94;font-size:10px;font-weight:900;} .needs-personal-level{display:block;color:#547691;font-size:9.3px;font-weight:850;letter-spacing:.055em;text-transform:uppercase;} .needs-personal-card-head strong{display:block;margin-top:2px;color:#142d43;font-size:13.25px;line-height:1.34;} .needs-personal-reason{margin:8px 0 0;color:#526779;font-size:12px;line-height:1.48;} .needs-personal-action{margin-top:9px;border-radius:10px;background:#f2f7fb;border:1px solid #d9e7f1;padding:8px 9px;} .needs-personal-action>span{display:block;color:#2d6994;font-size:9px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;} .needs-personal-action>p{margin:4px 0 0;color:#284156;font-size:11.75px;line-height:1.47;} .needs-personal-focus{margin-top:12px;padding:11px 12px;border:1px solid #d8e5ef;border-radius:13px;background:#fff;} .needs-personal-focus>strong{display:block;color:#1d3c55;font-size:13px;} .needs-personal-focus>p{margin:3px 0 8px;color:#687a8b;font-size:11.5px;line-height:1.4;} .needs-personal-focus>div{display:flex;flex-wrap:wrap;gap:6px;} .needs-personal-caution{margin-top:10px;border:1px solid #ead1aa;border-radius:13px;background:#fffaf2;padding:10px 11px;color:#744516;} .needs-personal-caution>strong{display:block;font-size:12px;} .needs-personal-caution>p{margin:4px 0 0;font-size:11.75px;line-height:1.48;} .needs-personal-child-norm{display:grid;gap:4px;border:1px solid #cfd8ef;border-radius:13px;background:#f5f6fd;padding:10px 11px;margin:0 0 11px;color:#2c355d;} .needs-personal-child-norm strong{font-size:12.5px;color:#303a69;} .needs-personal-child-norm span{font-size:11.75px;line-height:1.42;} @media(max-width:720px){ .needs-age-profile-indicator{margin-top:8px;border-radius:15px;} .needs-age-profile-card{grid-template-columns:34px minmax(0,1fr);gap:9px;padding:12px 11px 10px 13px;} .needs-age-profile-mark{width:32px;height:32px;border-radius:10px;} .needs-age-profile-mark svg{width:20px;height:20px;} .needs-age-profile-content>strong{font-size:14.5px;} .needs-age-profile-content>p{font-size:12px;} .needs-age-profile-topline>small{flex-basis:100%;} .needs-personal-profile{padding:15px 12px;border-radius:18px;} .needs-personal-profile::before{left:12px;right:12px;} .needs-personal-profile-heading h2{font-size:22px;} .needs-personal-profile-heading p{font-size:13px;line-height:1.54;} .needs-profile-primary{padding:12px;} .needs-profile-primary-heading strong{font-size:15.5px;} .needs-profile-method-body ol{grid-template-columns:1fr;gap:7px;} .needs-scenario-grid{grid-template-columns:1fr;gap:7px;padding:9px;} .needs-priority-heading{grid-template-columns:1fr;gap:6px;align-items:start;} .needs-priority-heading h3{font-size:16.5px;} .needs-personal-grid{grid-template-columns:1fr;} .needs-personal-card{padding:10px;} } @media(max-width:420px){ .needs-age-profile-content>strong{font-size:14px;} .needs-age-profile-topline>span{font-size:9px;} .needs-personal-profile-heading h2{font-size:20.5px;} .needs-profile-primary-heading{align-items:flex-start;} .needs-profile-context span,.needs-personal-focus span{font-size:10.5px;padding:4px 7px;} } @media print{ .needs-age-profile-indicator,.needs-personal-profile,.needs-profile-primary,.needs-personal-card,.needs-profile-method,.needs-scenario-router{box-shadow:none;break-inside:avoid;} .needs-age-profile-indicator{opacity:1;transform:none;} .needs-profile-method>summary::after,.needs-scenario-router>summary::after,.needs-age-profile-why>summary::after{display:none;} .needs-profile-method:not([open])>.needs-profile-method-body,.needs-scenario-router:not([open])>.needs-scenario-grid,.needs-age-profile-why:not([open])>p{display:block;} } /* ===== SOURCE: assets/css/ration-clarity-analytics-v5.3.100.css ===== */ /* v5.3.100 — ration composite clarity + lightweight analytics */ .ration-head-status{display:grid;gap:7px;min-width:min(100%,260px)} .ration-attention-strip{border:1px solid #fecaca;border-radius:12px;background:#fff7f7;color:#9f1239;padding:8px 10px;font-size:.82rem;line-height:1.35;font-weight:700} .ration-attention-strip[hidden]{display:none!important} .ration-ui-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin:4px 0 12px;padding:10px 12px;border:1px solid #dce9f8;border-radius:13px;background:#f8fbff;color:#405b73;font-size:.79rem;line-height:1.4} .ration-legend-item{display:inline-flex;align-items:flex-start;gap:7px;max-width:520px} .ration-legend-composite{width:14px;height:14px;border-radius:4px;background:#e9f5ff;border:1px solid #9dcaef;box-shadow:inset 3px 0 0 #2f80c9;flex:0 0 auto;margin-top:1px} .ration-legend-impact{width:8px;height:8px;border-radius:999px;background:#e69a2f;box-shadow:0 0 0 4px #fff3dd;flex:0 0 auto;margin:4px 3px 0} #rationTable .ration-name{display:table-cell;cursor:pointer;min-width:280px} .ration-name-main{display:flex;align-items:center;gap:7px;flex-wrap:wrap} .ration-title{font-weight:700;line-height:1.32} .regular-expander{width:18px;text-align:center;flex:0 0 18px} .composite-folder-row>td{background:#f3f9ff;border-bottom-color:#cfe3f5!important} .composite-folder-row>td:first-child{box-shadow:inset 4px 0 0 #5aa3df} .composite-folder-row:hover>td{background:#eaf5ff} .composite-folder-row.is-expanded>td{background:#e8f4ff} .composite-leading-icon{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#dcedfb;color:#1769aa;flex:0 0 28px} .composite-leading-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round} .composite-badge{display:inline-flex!important;align-items:center;gap:5px;margin-left:1px!important;padding:3px 8px!important;border-color:#a9d0ef!important;background:#e8f4ff!important;color:#165d92!important;font-size:.72rem!important;font-weight:800;letter-spacing:.01em} .composite-badge-dot{width:6px;height:6px;border-radius:50%;background:#2f80c9} .composite-custom-badge{background:#fff7e8!important;border-color:#f2d18c!important;color:#8a5b08!important} .composite-compose-toggle{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;margin:7px 0 0 35px;padding:6px 10px;border:1px solid #9cc7e9;border-radius:10px;background:#fff;color:#1769aa;font-size:.79rem;font-weight:800;box-shadow:none} .composite-compose-toggle:hover{background:#edf7ff} .composite-toggle-chevron{transition:transform .18s ease;font-size:.9em} .composite-compose-toggle[aria-expanded="true"] .composite-toggle-chevron{transform:rotate(180deg)} .ration-impact-row{display:flex;flex-wrap:wrap;gap:5px;margin:7px 0 0 35px} .ration-impact-chip{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 7px;font-size:.69rem;line-height:1.2;font-weight:800;border:1px solid transparent;white-space:nowrap} .ration-impact-dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 6px} .ration-impact-notice{color:#8a5b08;background:#fff8e7;border-color:#f2d18c} .ration-impact-high{color:#a23c32;background:#fff0ed;border-color:#f3b8ae} .ration-impact-over{color:#9f1239;background:#fff0f4;border-color:#f4b7c7;box-shadow:0 0 0 2px rgba(244,183,199,.18)} .ration-impact-more{font-size:.7rem;color:#64748b;padding:3px 4px} .ration-row-attention>td:first-child{box-shadow:inset 4px 0 0 #d26a79} .composite-folder-details-row>td{background:#f8fbff!important;border-left:4px solid #5aa3df} .composite-folder-note{border:1px solid #d7e8f6;border-radius:11px;background:#fff;padding:9px 10px} .composite-impact-summary{margin:9px 0 11px;padding:10px 11px;border:1px solid #f1c7c2;border-radius:11px;background:#fff8f6;color:#6f312d;font-size:.82rem;line-height:1.42} .composite-impact-summary.is-quiet{border-color:#d9e8df;background:#f7fcf9;color:#446052} .composite-impact-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px} .composite-impact-caption{margin-top:7px;color:#6a7784;font-size:.75rem} .composite-child-impact{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px} .composite-child-impact .ration-impact-chip{font-size:.65rem} @media (max-width:760px){ .ration-head-status{width:100%;min-width:0} .ration-ui-legend{display:grid;gap:8px;padding:9px 10px} #rationTable .ration-name{display:block;min-width:0} .composite-folder-row{border:1px solid #bcdaf0!important;border-radius:14px!important;background:#f3f9ff!important;box-shadow:0 5px 16px rgba(47,128,201,.08)} .composite-folder-row>td{background:transparent!important} .composite-folder-row>td:first-child{box-shadow:inset 4px 0 0 #5aa3df;border-radius:13px 0 0 13px} .composite-compose-toggle{margin-left:35px;max-width:calc(100% - 35px);width:auto} .ration-impact-row{margin-left:35px} .ration-impact-chip{white-space:normal} .composite-folder-details-row>td{border-left:3px solid #5aa3df!important;padding:9px!important} .composite-child-table tr{background:#fff;border:1px solid #dbe8f3!important;border-radius:11px;margin-bottom:8px;padding:8px!important} } /* ===== SOURCE: assets/css/ui-design-audit-v5.3.110.css ===== */ /* v5.3.110 — UI/DESIGN AUDIT */ :root{--ui110-bg:#f5f7fa;--ui110-card:#fff;--ui110-border:#d9e2ec;--ui110-muted:#526174;--ui110-text:#172033;--ui110-blue:#0b61d6;--ui110-soft:#eef5ff;} html{scroll-behavior:smooth;scroll-padding-top:16px}body{background:var(--ui110-bg);color:var(--ui110-text);font-size:16px;line-height:1.5} .container{max-width:1180px!important;padding:0 20px 40px!important} #mainContent>section.card,#needsCompact,#globalSearchSection,#rationSection,#heiPanel,#totalsSection,#dietAnalysisProfilePanel,#dataQualityPanel,#globalActions{background:var(--ui110-card)!important;border:1px solid var(--ui110-border)!important;border-radius:16px!important;box-shadow:0 5px 18px rgba(15,23,42,.045)!important;margin-bottom:16px!important} #mainContent .card .card{box-shadow:none!important;border-color:#e5ebf2!important} header{padding:14px 0 10px!important;gap:12px}header .title{font-size:20px!important;font-weight:750!important;color:var(--ui110-text)!important}header .toolbar{gap:8px!important} .workflow-steps{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:6px!important;margin:0 0 16px!important;padding:6px!important;border:1px solid var(--ui110-border)!important;border-radius:14px!important;background:#fff!important;overflow:visible!important} .workflow-steps a{min-width:0!important;min-height:44px!important;padding:8px 7px!important;border-radius:10px!important;font-size:13px!important;justify-content:center!important;text-align:center!important;text-decoration:none!important} .workflow-steps a span{font-size:11px!important;flex:0 0 22px!important;width:22px!important;height:22px!important} .step-badge{font-size:11px!important;letter-spacing:.03em!important} #needsCompact{padding:16px!important}#needsCompact>#needs{border:0!important;padding:14px 0 0!important;box-shadow:none!important;border-radius:0!important} #needsCompact>#needs>.row:first-child .step-badge{display:none!important}#needsHelpNeedsBtn{display:none!important} #needsCompact>.small{display:none!important}.ui-method-details{margin:8px 0 12px!important;border:1px solid #e3eaf2!important;border-radius:10px!important;background:#fafbfd!important}.ui-method-details summary{padding:10px 12px!important;min-height:42px!important;font-weight:650!important}.ui-method-details #needs-method-notice{border:0!important;margin:0!important;border-radius:0 0 10px 10px!important;background:transparent!important;padding:0 12px 12px!important} #needs .grid{gap:14px!important}#needs label{font-weight:650!important;color:#263449!important}#needs input,#needs select{min-height:44px!important;border-color:#d9e2ec!important} #needsAgeProfileIndicator[hidden],body.ui-age-empty #needsAgeProfileIndicator{display:none!important} #globalSearchSection{padding:18px!important}#v40TopNote{display:none!important}.search-hero-head{align-items:flex-start!important;gap:18px!important}.search-hero-head h2{margin:4px 0!important}.search-lead{max-width:760px!important;color:#3f4f63!important}.search-db-count{min-width:140px!important;padding:10px 14px!important;border-color:#dbe4ee!important;background:#fafcff!important} .search-main-grid{grid-template-columns:minmax(0,1fr) 230px!important;gap:14px!important}.search-field-card,.search-grams-card{border-color:#dfe7f0!important;border-radius:14px!important;box-shadow:none!important}.search-line{gap:8px!important}.search-line input{min-height:48px!important}.search-line button{min-height:48px!important;width:auto!important;flex:0 0 auto!important}.quick-searches button,.quick-grams button{min-height:40px!important}.search-status{margin-top:12px!important;padding:10px 12px!important;border-radius:10px!important;background:var(--ui110-soft)!important;border:0!important}.search-results-enhanced.is-empty{display:none!important} #rationSection{padding:18px!important}.ration-head-enhanced{gap:16px!important}.ration-head-enhanced .step-badge{display:none!important}.ration-kpi-strip{min-width:220px!important}.ration-ui-legend{border-color:#e2e9f1!important;background:#fafcff!important}.ui-ration-tools{margin-top:10px!important;border:1px solid #dfe7f0!important;border-radius:12px!important;background:#fafcff!important}.ui-ration-tools>summary{min-height:44px!important;padding:10px 14px!important;font-weight:700!important;color:#24446e!important}.ui-ration-tools .toolbar{padding:8px 12px 12px!important;margin:0!important;justify-content:flex-start!important}.ui-ration-tools button{background:#fff!important;color:#0b58bd!important;border:1px solid #9cc2f5!important;box-shadow:none!important}.ui-ration-tools button.danger{color:#b54949!important;border-color:#efb4b4!important}.ui-ration-tools .footer-note{padding:0 12px 12px!important} #rationSection.ui-empty .ration-ui-legend,#rationSection.ui-empty #rationTable{display:none!important}#rationSection.ui-empty{padding-bottom:14px!important} #heiPanel{padding:18px!important}#heiPanel>.row{gap:10px!important;flex-wrap:wrap!important;border:1px solid #e2e9f1!important;border-radius:12px!important;padding:10px 12px!important;background:#fafcff!important}#heiPanel>.row label.inline{min-height:36px!important;padding:6px 8px!important;border-radius:8px!important}#heiPanel.ui-empty>*:not(.section-title-block):not(.ui-hei-empty-state){display:none!important}.ui-hei-empty-state{display:none;align-items:flex-start;gap:12px;padding:18px;border-radius:12px;background:#f5f9ff;border:1px solid #d7e6fa;color:#28435f}.ui-hei-empty-state strong{display:block;margin-bottom:4px;color:#173a64}.ui-hei-empty-state .ui-empty-icon{width:34px;height:34px;border-radius:10px;background:#e1efff;display:grid;place-items:center;font-weight:800;color:#0b61d6}.ui-empty .ui-hei-empty-state{display:flex!important} .totals-grid{gap:12px!important}.totals-grid>.card,.totals-grid>div{border-color:#e0e7ef!important;box-shadow:none!important}.legend{gap:8px!important}.legend .item{background:#fafcff!important;border-color:#e0e7ef!important} #dietAnalysisProfilePanel.ui-empty>*{display:none!important}.ui-profile-empty-state{display:none;padding:22px;border-radius:14px;background:linear-gradient(135deg,#f8fbff,#f4f8fd);border:1px solid #d9e7f6}.ui-profile-empty-state h2{margin:0 0 6px;color:#0b55b5}.ui-profile-empty-state p{margin:0;color:#4a5b70}.ui-empty>.ui-profile-empty-state{display:block!important} .ui-profile-domains{margin-top:14px!important;border:1px solid #dfe6ee!important;border-radius:14px!important;background:#fbfcfe!important}.ui-profile-domains>summary{padding:12px 14px!important;min-height:46px!important;font-weight:750!important;color:#253d5d!important}.ui-profile-domains>#dietDomainProfile{padding:0 12px 12px!important} .diet-matrix-diagnostic-details:not([open]){padding-bottom:0!important}.diet-matrix-diagnostic-details>summary{min-height:46px!important} #dataQualityPanel,#additionalToolsSection{box-shadow:none!important} button,a,summary,input,select,textarea{outline-offset:3px}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(11,97,214,.35)!important} @media(max-width:720px){ body{font-size:15px}.container{padding:0 8px 28px!important}header{align-items:stretch!important}header .title{font-size:18px!important}.toolbar{gap:8px!important} .workflow-steps{grid-template-columns:repeat(3,minmax(0,1fr))!important;overflow:visible!important;padding:5px!important}.workflow-steps a{min-height:44px!important;font-size:12px!important;white-space:normal!important}.workflow-steps a span{display:inline-grid!important} #needsCompact,#globalSearchSection,#rationSection,#heiPanel,#totalsSection,#dietAnalysisProfilePanel,#dataQualityPanel{border-radius:14px!important;padding:14px!important} #v40NeedsSummary{padding:12px!important}.v40-needs-toggle{min-height:44px!important;width:100%!important}.ui-method-details{margin-top:8px!important} #needs .section-title-row{align-items:flex-start!important}#needs .section-title-row h1{font-size:24px!important;line-height:1.1!important}.search-hero-head{display:block!important}.search-db-count{display:none!important}.search-lead{font-size:15px!important}.search-main-grid{grid-template-columns:1fr!important}.search-field-hint{display:none!important}.quick-searches button:nth-child(n+4){display:none!important}.search-line{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important}.search-line button{width:auto!important;min-width:48px!important;padding:0 12px!important;font-size:0!important}.search-line button:after{content:'×';font-size:24px;line-height:1}.search-status{font-size:14px!important} .ration-head-enhanced{display:block!important}.ration-head-status{margin-top:10px!important}.ration-kpi-strip{min-width:0!important;width:100%!important}.ui-ration-tools .toolbar{display:grid!important;grid-template-columns:1fr 1fr!important}.ui-ration-tools button{min-height:44px!important;width:100%!important}.ui-ration-tools button.danger{grid-column:1/-1!important} #heiPanel>.row{display:grid!important;grid-template-columns:1fr!important}#heiPanel>.row input[type=number]{width:100%!important}#heiPanel>.row>div[style*='flex:1']{display:none!important}.ui-hei-empty-state{padding:14px!important} .totals-grid{grid-template-columns:1fr!important}.legend{display:block!important}.legend .item{margin-bottom:6px!important} .diet-matrix-card-v540{padding:14px!important}.diet-matrix-plot-v540,.diet-matrix-stage-v540{max-height:390px!important}.diet-matrix-point-v5337{touch-action:manipulation} .ui-profile-domains>summary{font-size:15px!important} } @media print{.workflow-steps,.ui-ration-tools,.ui-method-details,.ui-hei-empty-state,.ui-profile-empty-state{display:none!important}body{background:#fff!important}#mainContent>section.card{box-shadow:none!important;border-color:#bbb!important}} /* audit refinements */ #dietAnalysisProfilePanel.ui-empty>.ui-profile-empty-state{display:block!important} #needs .grid>.row:last-child{grid-column:1/-1!important;display:flex!important;gap:10px!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap!important} #needs .grid>.row:last-child>label{display:none!important} #needs .grid>.row:last-child .btn{width:auto!important;min-width:150px!important} @media(max-width:720px){ .search-line button{font-size:15px!important;width:100%!important;min-width:0!important} .search-line button:after{content:none!important} #needs .grid>.row:last-child{display:grid!important;grid-template-columns:1fr 1fr!important} #needs .grid>.row:last-child .btn{width:100%!important;min-width:0!important} } /* filled-state mobile overflow hardening */ .progress,.ticks{max-width:100%!important;box-sizing:border-box!important} .diet-acc-chip,#dataQualityDetails,#dietAnalysisPointCaption{max-width:100%!important;overflow-wrap:anywhere!important;word-break:normal!important} #dietAnalysisMatrix{max-width:100%!important;box-sizing:border-box!important} @media(max-width:720px){ #dietAnalysisMatrix{overflow:hidden!important} .diet-matrix-zone-q,.diet-matrix-point-caption-v5337{max-width:100%!important} #dataQualityDetails{overflow:hidden!important} } /* ===== SOURCE: assets/css/design-system-audit-v5.3.111.css ===== */ /* v5.3.111 — visual design system audit */ :root{ --d111-bg:#f3f6fa;--d111-surface:#ffffff;--d111-subtle:#f7f9fc;--d111-soft-blue:#eef4ff; --d111-ink:#182235;--d111-text:#304057;--d111-muted:#637086;--d111-border:#dde5ef; --d111-blue:#145ec7;--d111-blue-dark:#0b4ca5;--d111-green:#178653;--d111-green-soft:#edf8f2; --d111-amber:#ad6b0c;--d111-amber-soft:#fff7e8;--d111-red:#b93642;--d111-red-soft:#fff1f2; --d111-radius:18px;--d111-radius-sm:12px;--d111-shadow:0 10px 30px rgba(24,34,53,.065); } *{box-sizing:border-box} body{background:var(--d111-bg)!important;color:var(--d111-ink)!important;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;letter-spacing:0!important} .container{max-width:1200px!important;padding-inline:24px!important} #mainContent>section.card,#needsCompact,#globalSearchSection,#rationSection,#heiPanel,#totalsSection,#dietAnalysisProfilePanel,#dataQualityPanel,#globalActions{ border:1px solid var(--d111-border)!important;border-radius:var(--d111-radius)!important;box-shadow:var(--d111-shadow)!important;background:var(--d111-surface)!important;margin-bottom:20px!important;padding:22px!important; } #mainContent .card .card{background:var(--d111-subtle)!important;border-color:#e7edf4!important;border-radius:14px!important} h1,h2,h3,h4,.card-title,.v40-needs-summary-title{color:var(--d111-ink)!important;letter-spacing:-.018em!important} h1{font-size:28px!important;line-height:1.15!important}h2{font-size:24px!important;line-height:1.2!important}h3{font-size:19px!important} p,.muted,.small{color:var(--d111-text)!important}.muted,.small{color:var(--d111-muted)!important} .step-badge{display:inline-flex!important;align-items:center!important;min-height:25px!important;padding:4px 9px!important;border-radius:999px!important;background:var(--d111-soft-blue)!important;color:var(--d111-blue-dark)!important;border:0!important;font-size:11px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.055em!important} button,.btn,input,select,textarea{border-radius:12px!important}button,.btn{min-height:42px!important;font-weight:700!important;box-shadow:none!important} button:not(.secondary):not(.danger):not(.icon-btn):not(.close-btn),.btn:not(.secondary):not(.danger){background:var(--d111-blue)!important;border-color:var(--d111-blue)!important;color:#fff!important} button:not(.secondary):not(.danger):hover,.btn:not(.secondary):not(.danger):hover{background:var(--d111-blue-dark)!important;border-color:var(--d111-blue-dark)!important} button.secondary,.btn.secondary{background:#fff!important;color:var(--d111-blue-dark)!important;border:1px solid #a9c7ef!important} button.danger,.btn.danger{background:var(--d111-red-soft)!important;color:var(--d111-red)!important;border:1px solid #f2b9bf!important} input,select,textarea{background:#fff!important;border:1px solid #d6e0eb!important;color:var(--d111-ink)!important;box-shadow:0 1px 2px rgba(24,34,53,.025)!important} input:focus,select:focus,textarea:focus{border-color:#79a9e6!important;box-shadow:0 0 0 4px rgba(20,94,199,.11)!important} summary{color:#29405f!important}details>summary:hover{background:#f7faff!important} /* Brand and workflow */ header{padding:18px 2px 14px!important;align-items:center!important}header .title{font-size:25px!important;font-weight:800!important;display:flex!important;align-items:center!important;gap:11px!important;color:var(--d111-ink)!important;line-height:1.05!important} header .title:before{content:"";width:30px;height:30px;border-radius:10px;background:linear-gradient(145deg,#1767d3,#0c4cac);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3),0 5px 14px rgba(20,94,199,.22);flex:0 0 auto} header .title .app-subtitle{display:block;font-size:12px;font-weight:600;color:var(--d111-muted);letter-spacing:0;margin-top:3px} header .title .version-badge,header .title span:not(.app-subtitle){font-size:11px!important;background:#eef3fa!important;color:#56677e!important;border:0!important} header .toolbar button,header .toolbar select{min-height:38px!important;border-radius:10px!important} .workflow-steps{padding:7px!important;border:1px solid var(--d111-border)!important;border-radius:15px!important;background:rgba(255,255,255,.9)!important;box-shadow:0 4px 16px rgba(24,34,53,.035)!important;gap:7px!important} .workflow-steps a{background:transparent!important;border:1px solid transparent!important;color:#3c4b61!important;font-weight:700!important;transition:.18s ease!important} .workflow-steps a:hover,.workflow-steps a:focus-visible{background:var(--d111-soft-blue)!important;border-color:#cfe0f7!important;color:var(--d111-blue-dark)!important;transform:translateY(-1px)} .workflow-steps a span{background:#eaf1fb!important;color:var(--d111-blue-dark)!important;border:0!important;font-weight:800!important} /* Needs */ #needsCompact{padding:20px!important}.v40-needs-summary{padding:15px 16px!important;border:0!important;border-radius:14px!important;background:linear-gradient(135deg,#f5f9ff,#eef5ff)!important;box-shadow:inset 0 0 0 1px #d8e6f8!important} .v40-needs-summary-title{font-size:19px!important;font-weight:800!important}.v40-needs-summary-text{font-size:14px!important;line-height:1.45!important;color:#4d5c70!important} .ui-method-details{border:0!important;background:#f7f9fc!important;box-shadow:inset 0 0 0 1px #e5ebf3!important} #needs{padding-top:18px!important}#needs .section-title-row{margin-bottom:16px!important}#needs .section-title-row h1{margin:0!important} #needs .grid{gap:16px!important}#needs label{font-size:13px!important;color:#344258!important;margin-bottom:6px!important}#needs input,#needs select{min-height:46px!important} #needs .grid>.row:last-child{padding-top:4px!important}#needs .grid>.row:last-child .btn{min-width:154px!important} #needs .grid>.row:last-child .btn:nth-of-type(n+3){background:#fff!important;color:#54657a!important;border-color:#d8e1eb!important} /* Search */ .search-hero-head h2{color:var(--d111-ink)!important;font-size:26px!important}.search-lead{font-size:15px!important;line-height:1.55!important}.search-db-count{background:linear-gradient(145deg,#f6f9fe,#eef4fc)!important;border:0!important;box-shadow:inset 0 0 0 1px #d9e5f4!important;border-radius:14px!important}.search-db-count strong{color:var(--d111-blue-dark)!important;font-size:25px!important} .search-field-card,.search-grams-card{background:var(--d111-subtle)!important;border:0!important;box-shadow:inset 0 0 0 1px #e2e9f1!important;padding:14px!important} .search-line input{min-height:52px!important;font-size:16px!important}.search-line button{min-height:52px!important} .quick-searches button,.quick-grams button{background:var(--d111-soft-blue)!important;color:var(--d111-blue-dark)!important;border:1px solid #cfe0f6!important;min-height:38px!important;padding:0 13px!important} .quick-searches button:hover,.quick-grams button:hover{background:#dfeeff!important} .search-status{background:#f0f5fb!important;color:#3c536e!important;border-left:3px solid #8fb6e7!important;padding-left:14px!important} .search-result-card{border-color:#dfe7f0!important;border-radius:15px!important;box-shadow:0 5px 16px rgba(24,34,53,.04)!important} /* Ration */ .ration-head-enhanced h2{color:var(--d111-ink)!important;font-size:26px!important}.ration-subtitle{font-size:15px!important;line-height:1.5!important}.ration-kpi-strip{background:var(--d111-soft-blue)!important;color:#173d71!important;border:1px solid #c8dbf4!important;border-radius:12px!important;font-weight:800!important} .ration-ui-legend{background:#f7f9fc!important;border:0!important;border-radius:13px!important;box-shadow:inset 0 0 0 1px #e4eaf2!important;color:#55657b!important} .ration-table{border-collapse:separate!important;border-spacing:0 7px!important}.ration-table thead th{font-size:12px!important;text-transform:uppercase!important;letter-spacing:.055em!important;color:#6b7789!important;border:0!important;padding:6px 12px!important}.ration-table tbody tr.ration-row>td{background:#fff!important;border-top:1px solid #e3eaf2!important;border-bottom:1px solid #e3eaf2!important;padding:12px!important}.ration-table tbody tr.ration-row>td:first-child{border-left:1px solid #e3eaf2!important;border-radius:13px 0 0 13px!important}.ration-table tbody tr.ration-row>td:last-child{border-right:1px solid #e3eaf2!important;border-radius:0 13px 13px 0!important}.ration-title{font-weight:780!important;color:#1c2738!important}.meta .pill{background:#eff4fb!important;border:0!important;color:#38516f!important}.ration-impact-chip{font-weight:700!important;border-radius:999px!important}.ration-row button.danger{min-height:38px!important;padding:0 13px!important;background:var(--d111-red-soft)!important;color:var(--d111-red)!important;border-color:#f3c0c5!important} .ui-ration-tools{background:#f7f9fc!important;border:0!important;box-shadow:inset 0 0 0 1px #e1e8f0!important}.ui-ration-tools>summary{color:#314b6d!important} /* HEI */ #heiPanel .section-title-block h2{color:var(--d111-ink)!important;font-size:25px!important}.chip,#heiBadge{background:#edf3fb!important;color:#466079!important;border:0!important} #heiPanel>.row{background:#f7f9fc!important;border:0!important;box-shadow:inset 0 0 0 1px #e2e8f0!important}.ui-hei-empty-state{background:linear-gradient(135deg,#f7faff,#eef5ff)!important;border:0!important;box-shadow:inset 0 0 0 1px #d8e5f6!important} .hei-mobile-total{border:0!important;border-radius:16px!important;background:linear-gradient(145deg,#f7fbff,#edf5ff)!important;box-shadow:inset 0 0 0 1px #d5e4f7!important;padding:16px!important}.hei-mobile-total summary strong{font-size:22px!important;color:#123e75!important}.hei-mobile-total-bar{height:8px!important;background:#dbe8f7!important;border-radius:999px!important}.hei-mobile-total-bar i{background:linear-gradient(90deg,#1b9b60,#41b879)!important;border-radius:999px!important} .hei-mobile-dashboard-head{margin:18px 2px 8px!important}.hei-mobile-dashboard-head strong{font-size:17px!important}.hei-mobile-dashboard-head span{color:var(--d111-muted)!important} .hei-mobile-indicator{border:1px solid #e2e8f0!important;border-left:4px solid #91a4ba!important;border-radius:12px!important;background:#fff!important;overflow:hidden!important;box-shadow:0 2px 8px rgba(24,34,53,.025)!important}.hei-mobile-indicator[data-tone="ok"]{border-left-color:var(--d111-green)!important}.hei-mobile-indicator[data-tone="warn"]{border-left-color:#df981d!important}.hei-mobile-indicator[data-tone="bad"],.hei-mobile-indicator[data-tone="danger"]{border-left-color:var(--d111-red)!important} .hei-mobile-indicator>summary{min-height:48px!important;padding:10px 11px!important;gap:9px!important;background:#fff!important}.hei-mobile-indicator-title{font-size:14px!important;color:#243247!important;font-weight:750!important}.hei-mobile-scorebar{height:6px!important;background:#e7edf4!important}.hei-mobile-indicator[data-tone="ok"] .hei-mobile-scorebar i{background:var(--d111-green)!important}.hei-mobile-indicator[data-tone="warn"] .hei-mobile-scorebar i{background:#e49b1c!important}.hei-mobile-indicator-score{font-size:13px!important;color:#243247!important} .hei-mobile-indicator-body{background:#fafbfd!important;border-top:1px solid #e8edf3!important;padding:10px 12px!important}.hei-mobile-detail-row{gap:12px!important;padding:7px 0!important}.hei-mobile-detail-row span{color:#6a7688!important}.hei-mobile-detail-row strong{font-weight:650!important;color:#28384d!important;line-height:1.42!important} #heiRecommendations .rec,.rec{background:#fff!important;border:1px solid #e2e8f0!important;border-left:4px solid #8aa0b8!important;border-radius:12px!important;box-shadow:none!important;padding:12px!important}.rec.ok{background:#fbfefc!important;border-left-color:var(--d111-green)!important}.rec.warn{background:#fffdfa!important;border-left-color:#dd941b!important}.rec.bad{background:#fffafa!important;border-left-color:var(--d111-red)!important}.rec .tag{border-radius:999px!important;font-weight:800!important}.rec .tag.ok{background:var(--d111-green-soft)!important;color:#137044!important}.rec .tag.warn{background:var(--d111-amber-soft)!important;color:var(--d111-amber)!important} /* Totals */ #totalsSection .section-title-block h2,#totalsSection h2{color:var(--d111-ink)!important}.legend .item{background:#f7f9fc!important;border:0!important;box-shadow:inset 0 0 0 1px #e3e9f1!important;color:#46566b!important} .total-card{background:#fff!important;border:1px solid #e2e8f0!important;border-radius:15px!important;padding:16px!important;box-shadow:0 4px 14px rgba(24,34,53,.03)!important}.total-card .total-row:first-child strong{font-size:16px!important;color:#202b3c!important}.total-card .total-row:first-child .muted{font-size:13px!important}.total-card input{background:#f8fafc!important;border:1px solid #e0e7ef!important;font-weight:700!important}.progress{height:9px!important;background:#e9eff6!important;border-radius:999px!important}.progress .bar{border-radius:999px!important;background:var(--d111-blue)!important}.progress .bar.ok{background:var(--d111-green)!important}.progress .bar.warn{background:#e49a1c!important}.progress .bar.danger{background:var(--d111-red)!important} #totalsSection>button,#totalsSection>.toolbar button{background:#fff!important;color:var(--d111-blue-dark)!important;border:1px solid #b6cdeb!important} /* Profile */ #dietAnalysisProfilePanel{border-top:1px solid var(--d111-border)!important}.diet-analysis-head h2{color:var(--d111-ink)!important}.diet-analysis-badge{background:#edf7f3!important;color:#17664b!important;border-color:#cce7db!important}.diet-overview-card,.diet-matrix-card-v540{border:1px solid #e1e7ef!important;box-shadow:0 8px 24px rgba(24,34,53,.045)!important}.diet-overview-kicker{color:var(--d111-blue-dark)!important}.diet-overview-metric{background:#fff!important;border-color:#e0e7ef!important}.diet-overview-metric strong{color:#193d6c!important}.diet-matrix-point-v5337{box-shadow:0 0 0 5px rgba(20,94,199,.16),0 5px 12px rgba(17,40,72,.25)!important}.diet-matrix-insight-v540{background:#f1f6fc!important;border-color:#dce8f5!important}.ui-profile-domains,.diet-matrix-diagnostic-details{background:#f8fafc!important;border:0!important;box-shadow:inset 0 0 0 1px #e0e7ef!important}.ui-profile-empty-state{background:linear-gradient(135deg,#f7faff,#eff5fd)!important;border:0!important;box-shadow:inset 0 0 0 1px #dce7f4!important}.ui-profile-empty-state h2{color:var(--d111-ink)!important} /* Secondary panels and footer */ #dataQualityPanel,#additionalToolsSection,#globalActions{box-shadow:0 6px 20px rgba(24,34,53,.04)!important}#additionalToolsSection{background:#fff!important;border-color:var(--d111-border)!important}#globalActions .btn,#globalActions button{min-height:40px!important} @media(max-width:720px){ .container{padding-inline:10px!important}.container>header{padding-inline:3px!important}header .title{font-size:21px!important;gap:8px!important}header .title:before{width:27px;height:27px;border-radius:9px}header .title .app-subtitle{font-size:11px!important} #mainContent>section.card,#needsCompact,#globalSearchSection,#rationSection,#heiPanel,#totalsSection,#dietAnalysisProfilePanel,#dataQualityPanel,#globalActions{padding:16px!important;border-radius:18px!important;margin-bottom:14px!important;box-shadow:0 7px 22px rgba(24,34,53,.055)!important} h1{font-size:23px!important}h2,.search-hero-head h2,.ration-head-enhanced h2,#heiPanel .section-title-block h2{font-size:22px!important;line-height:1.16!important}.step-badge{font-size:10px!important;min-height:23px!important;padding:3px 8px!important} .workflow-steps{gap:5px!important;padding:5px!important}.workflow-steps a{font-size:12px!important;min-height:47px!important;padding:6px 5px!important}.workflow-steps a span{width:21px!important;height:21px!important} #needsCompact{padding:14px!important}.v40-needs-summary{padding:13px!important}.v40-needs-summary-title{font-size:17px!important}.v40-needs-summary-text{font-size:14px!important}.v40-needs-toggle{font-size:14px!important} #needs .grid{gap:13px!important}#needs input,#needs select{min-height:48px!important}#needs .grid>.row:last-child{grid-template-columns:1fr 1fr!important;gap:8px!important}#needs .grid>.row:last-child .btn{min-height:44px!important;font-size:14px!important} .search-main-grid{gap:11px!important}.search-field-card,.search-grams-card{padding:12px!important}.search-line input{min-height:50px!important}.quick-searches,.quick-grams{gap:7px!important}.quick-searches button,.quick-grams button{min-height:38px!important;font-size:13px!important}.search-status{font-size:13px!important} .ration-ui-legend{font-size:13px!important;line-height:1.42!important}.ration-kpi-strip{font-size:14px!important;padding:10px 12px!important} .ration-table{border-spacing:0 10px!important}.ration-table tbody tr.ration-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important;padding:14px!important;border:1px solid #dfe7f0!important;border-radius:15px!important;background:#fff!important;box-shadow:0 4px 14px rgba(24,34,53,.035)!important}.ration-table tbody tr.ration-row>td{background:transparent!important;border:0!important;padding:0!important}.ration-table tbody tr.ration-row>td.ration-name{grid-column:1/-1!important}.ration-table tbody tr.ration-row>td:nth-child(2){grid-column:1/-1!important}.ration-table tbody tr.ration-row>td:nth-child(3){grid-column:1!important}.ration-table tbody tr.ration-row>td:nth-child(4){grid-column:2!important;align-self:end!important}.ration-title{font-size:16px!important;line-height:1.35!important}.ration-row .meta{margin-top:3px!important}.ration-row .meta .pill{font-size:12px!important}.ration-row input[type=number]{min-height:46px!important;font-size:18px!important}.ration-row button.danger{min-height:46px!important;padding:0 14px!important;font-size:14px!important;background:var(--d111-red-soft)!important;color:var(--d111-red)!important;border:1px solid #efbcc2!important} #heiPanel>.row{padding:12px!important}.hei-mobile-total{padding:14px!important}.hei-mobile-total summary strong{font-size:20px!important}.hei-mobile-dashboard-head{display:block!important}.hei-mobile-dashboard-head span{display:block;margin-top:2px;font-size:12px!important}.hei-mobile-indicator-list{gap:8px!important}.hei-mobile-indicator>summary{grid-template-columns:minmax(95px,1fr) minmax(60px,1fr) auto!important}.hei-mobile-indicator-title{font-size:13px!important}.hei-mobile-indicator-score{font-size:12px!important}.hei-mobile-detail-row{display:grid!important;grid-template-columns:92px minmax(0,1fr)!important}.hei-mobile-detail-row strong{font-size:13px!important}.rec{font-size:14px!important;line-height:1.48!important} .total-card{padding:14px!important}.total-card .total-row{gap:10px!important}.total-card .total-row:first-child{align-items:flex-start!important}.total-card .total-row:first-child strong{font-size:15px!important}.legend .item{font-size:12px!important} .diet-analysis-head h2{font-size:25px!important}.diet-matrix-card-v540{padding:14px!important}.diet-matrix-card-v540 h3{font-size:21px!important}.diet-matrix-metric-v540{padding:10px 7px!important}.diet-matrix-metric-v540 strong{font-size:16px!important} } @media print{body{background:#fff!important}#mainContent>section.card{box-shadow:none!important;border-color:#cbd3dd!important}.ration-row button.danger{display:none!important}} /* final hierarchy refinements */ #needs .section-title-row h1,.search-hero-head h2,.ration-head-enhanced h2,#heiPanel .section-title-block h2{color:var(--d111-ink)!important} #globalSearchSection .quick-searches button,#globalSearchSection .quick-grams button{background:var(--d111-soft-blue)!important;color:var(--d111-blue-dark)!important;border:1px solid #cfe0f6!important} #globalSearchSection .quick-searches button:hover,#globalSearchSection .quick-grams button:hover{background:#dfeaff!important;border-color:#b9d2f1!important} /* interactive analytical controls are informational, not primary actions */ #dietAnalysisProfilePanel button.diet-overview-metric, #dietAnalysisProfilePanel button.diet-map-score-card, #dietAnalysisProfilePanel button.diet-matrix-axis-pill{ background:#fff!important;color:var(--d111-ink)!important;border:1px solid #e0e7ef!important; } #dietAnalysisProfilePanel button.diet-matrix-axis-pill{border:0!important;background:transparent!important;color:#223047!important;min-height:36px!important} #dietAnalysisProfilePanel button.diet-matrix-zone-q{border:0!important;color:#64748b!important;box-shadow:none!important} #dietAnalysisProfilePanel button.zone-q-structure{background:#f7f5ef!important} #dietAnalysisProfilePanel button.zone-q-strong{background:#edf7f2!important} #dietAnalysisProfilePanel button.zone-q-complex{background:#faf4f4!important} #dietAnalysisProfilePanel button.zone-q-quality{background:#f0f6fb!important} #dietAnalysisProfilePanel button.diet-matrix-zone-q b{color:#697a90!important} #dietAnalysisProfilePanel button.diet-matrix-point-v5337{background:#12304f!important;border:3px solid #fff!important;color:#fff!important} #dietAnalysisProfilePanel .diet-map-score-card{background:#fff!important;color:var(--d111-ink)!important} #dietAnalysisProfilePanel .diet-map-score-card strong{color:#173b68!important} @media(max-width:720px){ #heiPanel .section-title-block .card-title{font-size:21px!important;line-height:1.2!important;color:var(--d111-ink)!important} #heiRecommendations .rec,#heiLevers .rec,.hei-recommendations .rec{font-size:13px!important;line-height:1.48!important;padding:12px!important} #heiRecommendations .rec p,#heiRecommendations .rec li,#heiRecommendations .rec .small{font-size:13px!important;line-height:1.48!important} } #globalSearchSection.search-hero .search-hero-head h2, #rationSection .ration-head-enhanced h2, #needsCompact #needs .section-title-row h1, #heiPanel .section-title-block .card-title{color:var(--d111-ink)!important} /* ===== SOURCE: assets/css/ui-ux-consolidation-v5.3.117.css ===== */ /* v5.3.117 — final UI/UX consolidation layer */ :root{--ui117-ink:#18243a;--ui117-blue:#1365d1;--ui117-blue-dark:#0d4fa8;--ui117-border:#dbe4ef;--ui117-soft:#f5f8fc;--ui117-focus:#ffbf47} .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important} /* Skip links must never occupy ordinary layout space. */ .skip-link,.skip-link--second{position:fixed!important;z-index:10000!important;top:8px!important;left:8px!important;width:auto!important;max-width:calc(100vw - 16px)!important;transform:translateY(-160%)!important;opacity:0!important;pointer-events:none!important;margin:0!important;padding:10px 14px!important;border:2px solid var(--ui117-focus)!important;border-radius:10px!important;background:#fff!important;color:#10233f!important;font-weight:800!important;box-shadow:0 8px 24px rgba(15,35,65,.22)!important} .skip-link:focus,.skip-link:focus-visible{transform:translateY(0)!important;opacity:1!important;pointer-events:auto!important;outline:0!important} .skip-link--second{top:58px!important} /* Version and header state */ header .title .version-badge{display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border-radius:999px;background:#edf3fb;color:#526985;font-size:11px;font-weight:800;letter-spacing:.01em;white-space:nowrap} #regionSeg{display:inline-flex!important;gap:3px!important;padding:3px!important;border:1px solid #c9d8ea!important;border-radius:12px!important;background:#edf3fa!important} #regionSeg button{min-width:64px!important;min-height:38px!important;border:0!important;border-radius:9px!important;background:transparent!important;color:#445b77!important;box-shadow:none!important;font-weight:800!important} #regionSeg button:hover{background:#fff!important;color:var(--ui117-blue-dark)!important} #regionSeg button.active,#regionSeg button[aria-pressed="true"]{background:var(--ui117-blue)!important;color:#fff!important;box-shadow:0 3px 8px rgba(19,101,209,.22)!important} /* HEI: progressive disclosure rather than an uninterrupted wall of content. */ .ui-analysis-fold{margin:10px 0;border:1px solid var(--ui117-border);border-radius:14px;background:#fff;overflow:hidden} .ui-analysis-fold>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:12px 14px;cursor:pointer;list-style:none;color:#203754;background:#f7f9fc} .ui-analysis-fold>summary::-webkit-details-marker{display:none} .ui-analysis-fold>summary span{display:grid;gap:2px;min-width:0} .ui-analysis-fold>summary b{font-size:14px;line-height:1.3} .ui-analysis-fold>summary small{color:#65758a;font-size:12px;line-height:1.35;font-weight:500} .ui-analysis-fold>summary>strong{color:var(--ui117-blue-dark);font-size:12px;white-space:nowrap} .ui-analysis-fold>summary:before{content:'›';display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:#e7effa;color:var(--ui117-blue-dark);font-size:20px;line-height:1;transition:transform .16s ease;flex:0 0 auto} .ui-analysis-fold[open]>summary:before{transform:rotate(90deg)} .ui-analysis-fold>#heiRecs,.ui-analysis-fold>.table-wrap,.ui-analysis-fold>.row{margin:0!important;padding:14px!important} #heiSettingsFold>summary{display:none} #heiSettingsFold{border:0;background:transparent;overflow:visible;margin:0} #heiSettingsFold>.row{padding:0!important} #heiTableFold .table-wrap{overflow:auto!important} #heiFullRecsFold>#heiRecs{display:grid;gap:10px} /* Mobile HEI summary */ .hei-mobile-dashboard{display:none} @media(max-width:760px){ #heiSettingsFold{display:block!important;border:1px solid var(--ui117-border)!important;border-radius:13px!important;background:#fff!important;overflow:hidden!important;margin:8px 0!important} #heiSettingsFold>summary{display:flex!important} #heiSettingsFold>.row{padding:12px!important;background:#fff!important;display:grid!important;grid-template-columns:1fr!important;gap:8px!important} #heiSettingsFold>.row>div[style*="flex:1"]{display:none!important} #heiSettingsFold>.row label{margin:0!important;padding:8px 9px!important;border:1px solid #e1e8f1!important;border-radius:10px!important;background:#f8fafc!important} #heiSettingsFold>.row input[type=number]{width:100%!important;max-width:none!important;min-height:44px!important} #heiSettingsFold>.row button{width:100%!important;min-height:42px!important} #heiPanel #heiTableFold{display:none!important} #heiPanel #heiFullRecsFold{margin-top:10px!important} #heiPanel #heiFullRecsFold>summary{min-height:50px!important} #heiPanel #heiLevers{margin-top:10px!important} #heiMobileDashboard{display:grid!important;gap:9px!important;margin:9px 0 10px!important} .hei-mobile-total{padding:13px;border:1px solid #cfe0f5;border-radius:15px;background:linear-gradient(180deg,#fff,#f7fbff);color:#10243f} .hei-mobile-total-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px} .hei-mobile-total-head span{display:grid;gap:2px}.hei-mobile-total-head b{font-size:14px}.hei-mobile-total-head small{font-size:11px;color:#607089}.hei-mobile-total-head>strong{font-size:20px;color:#123b69;white-space:nowrap} .hei-mobile-total-bar{height:8px;margin:10px 0 8px;border-radius:999px;background:#e4ebf3;overflow:hidden}.hei-mobile-total-bar i{display:block;width:var(--hei-score-pct);height:100%;border-radius:inherit;background:#27835a}.hei-mobile-total[data-tone="warn"] .hei-mobile-total-bar i{background:#e29a24}.hei-mobile-total[data-tone="bad"] .hei-mobile-total-bar i{background:#d33c49} .hei-mobile-total p{margin:0;color:#40536d;font-size:12px;line-height:1.4} .hei-mobile-priorities{display:grid;gap:7px;padding:11px;border:1px solid #dce5ef;border-radius:15px;background:#f8fafc} .hei-mobile-dashboard-head{display:grid!important;gap:1px!important;margin:0 0 2px!important}.hei-mobile-dashboard-head strong{font-size:14px;color:#1a2d49}.hei-mobile-dashboard-head span{font-size:11px;color:#6b7b90} .hei-mobile-priority{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;min-height:48px;padding:7px 8px;border:1px solid #dbe4ee!important;border-radius:11px!important;background:#fff!important;color:#223551!important;text-align:left!important;box-shadow:none!important} .hei-mobile-priority:hover{border-color:#b8cce5!important;background:#fbfdff!important}.hei-mobile-priority-rank{display:grid;place-items:center;width:23px;height:23px;border-radius:8px;background:#e8f0fb;color:#165ebd;font-size:12px;font-weight:900}.hei-mobile-priority-main{display:grid;gap:5px;min-width:0}.hei-mobile-priority-main b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.hei-mobile-priority-main i{display:block;height:5px;border-radius:999px;background:#e7edf4;overflow:hidden}.hei-mobile-priority-main i span{display:block;width:var(--hei-score-pct);height:100%;background:#e39a22}.hei-mobile-priority[data-tone="bad"] .hei-mobile-priority-main i span{background:#d33c49}.hei-mobile-priority[data-tone="ok"] .hei-mobile-priority-main i span{background:#26825a}.hei-mobile-priority>strong{font-size:11px;white-space:nowrap;color:#324762} .hei-mobile-components-fold{border:1px solid #dbe4ee;border-radius:14px;background:#fff;overflow:hidden}.hei-mobile-components-fold>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;cursor:pointer;list-style:none}.hei-mobile-components-fold>summary::-webkit-details-marker{display:none}.hei-mobile-components-fold>summary span{display:grid;gap:2px}.hei-mobile-components-fold>summary b{font-size:13px;color:#20344f}.hei-mobile-components-fold>summary small{font-size:11px;color:#6c7c90}.hei-mobile-components-fold>summary>strong{font-size:11px;color:#125cb9}.hei-mobile-components-fold[open]>summary>strong{font-size:0}.hei-mobile-components-fold[open]>summary>strong:after{content:'Свернуть';font-size:11px} .hei-mobile-indicator-list{display:grid!important;gap:7px!important;padding:0 9px 10px!important}.hei-mobile-indicator{border:1px solid #dfe7ef!important;border-radius:11px!important;background:#fff!important;overflow:hidden}.hei-mobile-indicator>summary{display:grid!important;grid-template-columns:minmax(92px,1fr) minmax(56px,.9fr) auto!important;align-items:center!important;gap:7px!important;padding:9px!important;list-style:none!important;cursor:pointer}.hei-mobile-indicator>summary::-webkit-details-marker{display:none}.hei-mobile-indicator-title{font-size:12px!important;font-weight:750!important}.hei-mobile-scorebar{height:5px!important;border-radius:999px!important;background:#e6edf4!important;overflow:hidden}.hei-mobile-scorebar i{display:block;width:var(--hei-score-pct);height:100%;background:#27835a}.hei-mobile-indicator[data-tone="warn"] .hei-mobile-scorebar i{background:#e39a22}.hei-mobile-indicator[data-tone="bad"] .hei-mobile-scorebar i{background:#d33c49}.hei-mobile-indicator-score{font-size:11px!important;white-space:nowrap!important}.hei-mobile-indicator-body{padding:0 9px 9px!important;border-top:1px solid #edf1f5!important}.hei-mobile-detail-row{display:grid!important;grid-template-columns:88px minmax(0,1fr)!important;gap:8px!important;padding:7px 0!important;border-bottom:1px solid #edf1f5!important}.hei-mobile-detail-row:last-child{border-bottom:0!important}.hei-mobile-detail-row span{font-size:11px!important;color:#6b7b8f!important}.hei-mobile-detail-row strong{font-size:12px!important;line-height:1.4!important} } /* Ration rows: an information control is clearer than a folder arrow on ordinary foods. */ .regular-nutrition-toggle{display:inline-grid!important;place-items:center!important;flex:0 0 auto;width:26px!important;height:26px!important;padding:0!important;border:1px solid #cbd9e9!important;border-radius:8px!important;background:#f5f8fc!important;color:#315a88!important;font:800 13px/1 Georgia,serif!important;box-shadow:none!important} .regular-nutrition-toggle:hover,.regular-nutrition-toggle[aria-expanded="true"]{background:#e7f0fb!important;border-color:#9bbce1!important;color:#0e5cb8!important} #rationBody .meta.has-single-pill .pill:not([hidden]){background:#f0f4f9!important;color:#4b617d!important} #rationBody .pill[hidden]{display:none!important} /* Desktop profile matrix uses its area more efficiently; mobile geometry remains square. */ @media(min-width:761px){ .diet-profile-v540 .diet-matrix-dashboard-v540{max-width:860px!important;margin-inline:auto!important} .diet-profile-v540 .diet-matrix-grid-v540{aspect-ratio:1.22/1!important;min-height:0!important} .diet-profile-v540 .diet-matrix-card-v540{padding:24px!important} .diet-profile-v540 .diet-map-topline-v540{max-width:860px;margin-inline:auto} .diet-profile-v540 .diet-map-summary-strip-v540,.diet-profile-v540 .diet-matrix-insight-v540,.diet-profile-v540 .diet-matrix-diagnostic-details{max-width:860px;margin-left:auto!important;margin-right:auto!important} } /* Tablet and mobile header */ @media(max-width:760px){ header .title{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important} header .title:before{grid-row:1/3!important}.app-subtitle{grid-column:2/4!important}.version-badge{grid-column:3!important;grid-row:1!important} #regionSeg{width:auto!important;flex:1 1 190px!important}#regionSeg button{flex:1!important;min-width:0!important} header .toolbar{gap:7px!important}header .toolbar>#resetBtn{min-height:44px!important} .ui-analysis-fold>summary{padding:11px 12px!important;gap:9px!important}.ui-analysis-fold>summary small{font-size:11px!important} } @media print{ .skip-link{display:none!important}.ui-analysis-fold{display:block!important;border:0!important;overflow:visible!important}.ui-analysis-fold>summary{display:none!important}.ui-analysis-fold>.table-wrap,.ui-analysis-fold>#heiRecs,.ui-analysis-fold>.row{display:block!important;padding:0!important}.hei-mobile-dashboard{display:none!important} .diet-profile-v540 .diet-matrix-grid-v540{aspect-ratio:1.22/1!important} } @media(max-width:760px){.hei-mobile-priorities-ok{background:#f2faf6!important;border-color:#cfe8da!important}.hei-mobile-priorities-ok .hei-mobile-dashboard-head strong{color:#176647!important}} /* High-specificity conflict resolution against legacy primary-button rules. */ #rationBody .ration-row .regular-nutrition-toggle{ width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important; padding:0!important;margin:0 7px 0 0!important;border:1px solid #c5d6e8!important;border-radius:8px!important; background:#f3f7fc!important;color:#245783!important;box-shadow:none!important;font:800 13px/1 Georgia,serif!important; } #rationBody .ration-row .regular-nutrition-toggle:hover, #rationBody .ration-row .regular-nutrition-toggle[aria-expanded="true"]{background:#e3eefb!important;color:#0b5db7!important;border-color:#91b5df!important} @media(min-width:901px){ #heiLevers .hei-p1-actions{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important} #heiLevers .hei-p1-actions>.hei-p1-action:only-child{max-width:640px} } /* Hide the obsolete one-line lever renderer while the enhanced recommendation layer is being applied. */ html[data-ui-version="5.3.117"] #heiLevers:not(:has(.hei-p1-start)){display:none!important} /* Keep HEI controls compact on desktop and tablet instead of stacking full-width controls. */ @media(min-width:761px){ #heiPanel>:scope.row,#heiPanel>.row{ display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px 10px!important; padding:12px!important;margin:8px 0 10px!important;border:1px solid #dbe4ef!important;border-radius:14px!important;background:#f8fafc!important; } #heiPanel>.row>label.inline{display:inline-flex!important;width:auto!important;min-height:40px!important;align-items:center!important;gap:7px!important;padding:8px 10px!important;border:1px solid #dbe4ef!important;border-radius:10px!important;background:#fff!important;margin:0!important} #heiPanel>.row>label.inline[style*="display: none"],#heiPanel>.row>label.muted[style*="display: none"],#heiPanel>.row>input[style*="display: none"]{display:none!important} #heiPanel>.row>#heiManualKcal{flex:0 0 148px!important;width:148px!important;min-height:40px!important;margin:0!important} #heiPanel>.row>div[style*="flex:1"]{display:block!important;flex:1 1 24px!important;width:auto!important;min-width:12px!important;height:1px!important} #heiPanel>.row>#heiPrintBtn,#heiPanel>.row>#heiPdfBtn{flex:0 0 auto!important;width:auto!important;min-width:128px!important;min-height:40px!important;margin:0!important;padding:8px 15px!important} } @media(min-width:761px) and (max-width:900px){ #heiPanel>.row>div[style*="flex:1"]{flex-basis:100%!important;height:0!important} #heiPanel>.row>#heiPrintBtn,#heiPanel>.row>#heiPdfBtn{flex:1 1 180px!important} } @media(min-width:761px){ #heiPanel>.row>label.inline{flex:0 1 auto!important;max-width:none!important;white-space:nowrap!important} } @media(min-width:761px) and (max-width:900px){ #heiPanel>.row>label.inline{font-size:12px!important;padding-inline:8px!important} #heiPanel>.row>#heiManualKcal{flex-basis:132px!important;width:132px!important} } /* v5.3.125: basis of weighing for products stored in free liquid */ .search-result-weighing-note{margin-top:7px;padding:7px 9px;border-radius:8px;background:rgba(15,23,42,.055);font-size:12px;line-height:1.4;color:#475569;} @media(max-width:760px){.search-result-weighing-note{font-size:11.5px;padding:6px 8px;}} /* v5.3.129: merged regional-norm selector styles to prevent partial-hosting 404s. */ /* nutrition calculator v5.3.127 — explicit regional micronutrient profile selector */ .norm-region-switcher{ flex:1 1 390px; min-width:min(100%,340px); max-width:540px; display:grid; gap:6px; padding:9px 10px 8px; border:1px solid #cddbeb; border-radius:15px; background:linear-gradient(180deg,#fbfdff,#f4f8fd); box-shadow:0 3px 12px rgba(26,67,117,.05); } .norm-region-switcher__head{ display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:0; } .norm-region-switcher__label{ color:#334b69; font-size:12px; font-weight:800; line-height:1.25; letter-spacing:.01em; } header .toolbar .norm-region-help-button, .norm-region-help-button{ display:inline-grid!important; place-items:center!important; flex:0 0 28px!important; width:28px!important; min-width:28px!important; max-width:28px!important; height:28px!important; min-height:28px!important; padding:0!important; margin:0!important; border:1px solid #a9c3e3!important; border-radius:999px!important; background:#fff!important; color:#165aab!important; box-shadow:none!important; font:800 15px/1 Georgia,serif!important; } .norm-region-help-button:hover, .norm-region-help-button:focus-visible{ background:#eaf3ff!important; border-color:#6e9dd5!important; } .norm-region-switcher__controls{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:stretch; min-width:0; } .norm-region-switcher #regionSeg{ width:100%!important; min-width:0!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:4px!important; padding:3px!important; border:1px solid #bdd0e7!important; border-radius:12px!important; background:#e9f0f8!important; } .norm-region-switcher #regionSeg button{ position:relative; display:flex!important; align-items:center!important; justify-content:center!important; gap:6px!important; width:100%!important; min-width:0!important; min-height:40px!important; padding:7px 10px!important; border:0!important; border-radius:9px!important; background:transparent!important; color:#425a76!important; box-shadow:none!important; font-weight:800!important; } .norm-region-switcher #regionSeg button small{ font-size:10px; font-weight:800; opacity:.76; letter-spacing:.03em; } .norm-region-switcher #regionSeg button.active, .norm-region-switcher #regionSeg button[aria-pressed="true"]{ background:#1765c9!important; color:#fff!important; box-shadow:0 3px 9px rgba(23,101,201,.24)!important; } .norm-region-switcher #regionSeg button.active::before, .norm-region-switcher #regionSeg button[aria-pressed="true"]::before{ content:"✓"; display:inline-grid; place-items:center; width:16px; height:16px; border-radius:999px; background:rgba(255,255,255,.2); color:#fff; font-size:11px; line-height:1; } header .toolbar .norm-region-switcher #resetBtn, .norm-region-switcher #resetBtn{ width:auto!important; min-width:82px!important; max-width:none!important; min-height:46px!important; padding:8px 14px!important; margin:0!important; align-self:stretch!important; white-space:nowrap!important; } .norm-region-status{ display:flex; flex-wrap:wrap; align-items:baseline; gap:4px; min-height:18px; margin:0; color:#52657d; font-size:12px; line-height:1.35; } .norm-region-status strong{ color:#123f75; font-size:12px; } .norm-region-status small{ padding:1px 5px; border-radius:999px; background:#e5eef9; color:#355a86; font-size:9px; font-weight:900; letter-spacing:.04em; } .norm-region-help-dialog{ width:min(720px,calc(100vw - 24px)); max-width:720px; padding:0; border:1px solid #cbd9e9; border-radius:20px; background:#fff; color:#1d2f47; box-shadow:0 24px 70px rgba(15,35,63,.28); } .norm-region-help-dialog::backdrop{ background:rgba(15,27,45,.52); backdrop-filter:blur(2px); } .norm-region-help-dialog__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:20px 22px 16px; border-bottom:1px solid #e1e8f1; background:linear-gradient(180deg,#f8fbff,#fff); } .norm-region-help-dialog__head>div{ display:grid; gap:4px; } .norm-region-help-dialog__head strong{ color:#172c48; font-size:22px; line-height:1.2; } .norm-region-help-dialog__eyebrow{ color:#1762bc; font-size:11px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; } .norm-region-help-dialog .close-btn{ width:36px!important; min-width:36px!important; height:36px!important; min-height:36px!important; padding:0!important; border-radius:10px!important; background:#f2f6fb!important; color:#405674!important; box-shadow:none!important; } .norm-region-help-dialog__body{ display:grid; gap:16px; padding:20px 22px; } .norm-region-help-dialog__lead{ margin:0; color:#40536c; font-size:15px; line-height:1.55; } .norm-region-help-dialog__profiles, .norm-region-help-dialog__change-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .norm-region-help-dialog__profiles section, .norm-region-help-dialog__change-grid section{ padding:15px; border:1px solid #dbe5f0; border-radius:15px; background:#f8fbff; } .norm-region-help-dialog__profiles section>span{ display:inline-flex; padding:3px 8px; border-radius:999px; background:#1765c9; color:#fff; font-size:11px; font-weight:900; } .norm-region-help-dialog h3{ margin:9px 0 5px; color:#213955; font-size:15px; line-height:1.3; } .norm-region-help-dialog p{ margin:0; color:#4b5f78; font-size:13px; line-height:1.5; } .norm-region-help-dialog__change-grid section{ background:#fff; } .norm-region-help-dialog__note{ padding:13px 14px; border:1px solid #f1d398; border-radius:13px; background:#fff9eb; color:#6b4b13!important; } .norm-region-help-dialog__footer{ display:flex; justify-content:flex-end; padding:14px 22px 20px; border-top:1px solid #e3eaf2; } .norm-region-help-dialog__footer button{ min-width:120px; } @media(max-width:760px){ header .toolbar{ grid-template-columns:minmax(0,1fr)!important; overflow:visible!important; } .norm-region-switcher{ grid-column:1/-1; width:100%!important; min-width:0!important; max-width:none!important; padding:8px!important; border-radius:14px!important; } .norm-region-switcher__controls{ grid-template-columns:minmax(0,1fr) auto!important; gap:7px!important; } .norm-region-switcher #regionSeg{ min-height:44px!important; border-radius:13px!important; } .norm-region-switcher #regionSeg button{ min-height:38px!important; padding:6px 7px!important; font-size:14px!important; } .norm-region-switcher #regionSeg button small{ font-size:9px; } header .toolbar .norm-region-switcher #resetBtn{ min-width:76px!important; min-height:50px!important; padding:7px 11px!important; font-size:14px!important; } .norm-region-switcher__label, .norm-region-status, .norm-region-status strong{ font-size:11px; } .norm-region-help-dialog{ width:calc(100vw - 16px)!important; max-width:calc(100vw - 16px)!important; max-height:min(88svh,760px)!important; border-radius:17px!important; } .norm-region-help-dialog__head{ padding:16px 16px 13px; } .norm-region-help-dialog__head strong{ font-size:19px; } .norm-region-help-dialog__body{ gap:13px; padding:15px 16px; } .norm-region-help-dialog__profiles, .norm-region-help-dialog__change-grid{ grid-template-columns:1fr; gap:9px; } .norm-region-help-dialog__profiles section, .norm-region-help-dialog__change-grid section{ padding:13px; } .norm-region-help-dialog__footer{ padding:12px 16px 16px; } .norm-region-help-dialog__footer button{ width:100%; } } @media print{ .norm-region-help-button, .norm-region-help-dialog{display:none!important} .norm-region-switcher{box-shadow:none!important;background:#fff!important} } .norm-region-help-dialog__examples{padding:15px;border:1px solid #dbe5f0;border-radius:15px;background:#fff} .norm-region-help-dialog__examples>h3{margin:0 0 10px} .norm-region-help-table-wrap{overflow:auto;border:1px solid #dce6f1;border-radius:12px} .norm-region-help-table{width:100%;min-width:640px;border-collapse:collapse;font-size:12px;line-height:1.4} .norm-region-help-table th,.norm-region-help-table td{padding:9px 10px;text-align:left;vertical-align:top;border-bottom:1px solid #e5ebf2} .norm-region-help-table th{position:sticky;top:0;background:#edf5ff;color:#1d3f68;font-weight:900} .norm-region-help-table tbody tr:last-child td{border-bottom:0} .norm-region-help-dialog__fineprint{margin-top:9px!important;font-size:11px!important;color:#61738a!important} #norms_profile_label{display:inline-flex;flex-wrap:wrap;font-size:12px;font-weight:700;color:#536b86} @media(max-width:760px){.norm-region-help-table{min-width:590px}.norm-region-help-dialog__examples{padding:12px}.norm-region-help-table th,.norm-region-help-table td{padding:8px;font-size:11px}} /* v5.3.129 — concrete USA/EU norm comparison */ .norm-region-help-dialog{max-width:780px} .norm-region-help-dialog__scope, .norm-region-help-dialog__unchanged{ padding:15px; border:1px solid #dbe5f0; border-radius:15px; background:#fff; } .norm-region-help-dialog__scope h3, .norm-region-help-dialog__unchanged h3{margin:0 0 9px} .norm-region-change-points{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; } .norm-region-change-points>div{ display:grid; gap:4px; padding:11px; border-radius:12px; background:#f3f8fe; } .norm-region-change-points strong{font-size:12px;color:#24476f} .norm-region-change-points span{font-size:11px;line-height:1.42;color:#5b6f87} .norm-region-comparison-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:10px; } .norm-region-comparison-head h3{margin:0 0 4px} .norm-region-profile-chip{ display:inline-flex; flex:0 0 auto; max-width:48%; padding:5px 9px; border-radius:999px; background:#e8f2ff; color:#17599f; font-size:10px; font-weight:900; line-height:1.3; text-align:center; } .norm-region-comparison-details{ border-top:1px solid #e2eaf3; padding-top:10px; margin-top:10px; } .norm-region-comparison-details summary{ cursor:pointer; color:#213955; font-size:13px; font-weight:900; line-height:1.35; } .norm-region-comparison-details[open] summary{margin-bottom:8px} .norm-region-help-table{min-width:680px} .norm-region-help-table td:first-child{width:30%;font-weight:800;color:#28425f} .norm-region-help-table td small{ display:block; margin-top:3px; color:#6b7d91; font-size:10px; font-weight:500; line-height:1.35; } .norm-region-help-table td[data-different="true"]{background:#fbfdff} .norm-region-help-table--safety td{font-size:11px} @media(max-width:760px){ .norm-region-help-dialog{width:min(720px,calc(100vw - 18px))} .norm-region-change-points{grid-template-columns:1fr} .norm-region-comparison-head{display:grid} .norm-region-profile-chip{max-width:100%;justify-self:start} .norm-region-help-table-wrap{overflow:visible;border:0} .norm-region-help-table{display:block;min-width:0;font-size:11px} .norm-region-help-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} .norm-region-help-table tbody{display:grid;gap:8px} .norm-region-help-table tr{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; padding:10px; border:1px solid #dce6f1; border-radius:12px; background:#fff; } .norm-region-help-table td{ display:block; padding:0!important; border:0!important; background:transparent!important; overflow-wrap:anywhere; } .norm-region-help-table td:first-child{ grid-column:1/-1; width:auto; padding-bottom:6px!important; border-bottom:1px solid #e6edf5!important; } .norm-region-help-table td:nth-child(2)::before, .norm-region-help-table td:nth-child(3)::before{ display:block; margin-bottom:3px; color:#1762bc; font-size:9px; font-weight:900; letter-spacing:.04em; text-transform:uppercase; } .norm-region-help-table td:nth-child(2)::before{content:'США · DRI'} .norm-region-help-table td:nth-child(3)::before{content:'ЕС · EFSA'} } /* v5.3.130 — exact age-profile selection and specification */ .needs-age-profile-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; } .needs-age-profile-chips span{ display:inline-flex; align-items:center; min-height:24px; padding:4px 8px; border:1px solid color-mix(in srgb,var(--profile-border) 76%,#fff); border-radius:999px; background:rgba(255,255,255,.76); color:#38536d; font-size:10.5px; font-weight:750; line-height:1.25; } .needs-age-profile-why-body{ display:grid; gap:7px; margin:0 0 12px; padding:0 2px; } .needs-age-profile-why-body p{ margin:0; color:#5b6d7f; font-size:11.75px; line-height:1.48; } .needs-age-profile-spec-list{ display:grid; gap:6px; margin:0; } .needs-age-profile-spec-row{ display:grid; grid-template-columns:minmax(92px,.7fr) minmax(0,1.3fr); gap:9px; padding:7px 8px; border:1px solid color-mix(in srgb,var(--profile-border) 64%,#fff); border-radius:10px; background:rgba(255,255,255,.7); } .needs-age-profile-spec-row span{ color:#758698; font-size:10px; font-weight:800; letter-spacing:.02em; text-transform:uppercase; } .needs-age-profile-spec-row strong{ color:#2c465f; font-size:11.25px; line-height:1.38; } @media(max-width:520px){ .needs-age-profile-chips{gap:5px} .needs-age-profile-chips span{font-size:10px;padding:3px 7px;min-height:22px} .needs-age-profile-spec-row{grid-template-columns:1fr;gap:3px} } /* v5.3.132 — fast age-profile progress and duplicate-event guard */ .needs-age-profile-progress{ --age-progress-accent:#2372ca; --age-progress-soft:#e8f2ff; display:grid; gap:7px; margin-top:7px; padding:9px 10px 10px; border:1px solid #cfe0f2; border-radius:12px; background:linear-gradient(180deg,#f9fcff,#f3f8fe); box-shadow:0 1px 0 rgba(15,23,42,.025); } .needs-age-profile-progress[hidden]{display:none!important;} .needs-age-profile-progress-copy{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; min-width:0; } .needs-age-profile-progress-copy strong{ color:#183b5d; font-size:11.5px; line-height:1.25; } .needs-age-profile-progress-copy span{ color:#60758a; font-size:10.5px; line-height:1.25; text-align:right; } .needs-age-profile-progress-track{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:5px; } .needs-age-profile-progress-track i{ display:block; height:5px; border-radius:999px; background:#dce8f4; box-shadow:inset 0 0 0 1px rgba(35,114,202,.05); transition:background-color .16s ease,transform .16s ease,box-shadow .16s ease; } .needs-age-profile-progress-track i.is-filled{ background:var(--age-progress-accent); box-shadow:0 0 0 1px rgba(35,114,202,.08),0 2px 6px rgba(35,114,202,.16); } .needs-age-profile-progress-track i.is-current{ transform:scaleY(1.34); animation:needsAgeProgressPulse .62s ease-in-out infinite alternate; } @keyframes needsAgeProgressPulse{ from{opacity:.58;box-shadow:0 0 0 1px rgba(35,114,202,.08)} to{opacity:1;box-shadow:0 0 0 1px rgba(35,114,202,.12),0 0 9px rgba(35,114,202,.32)} } .needs-age-profile-indicator.is-stale{display:none!important;} @media(max-width:520px){ .needs-age-profile-progress{padding:8px 9px 9px;margin-top:6px;gap:6px} .needs-age-profile-progress-copy{display:grid;gap:2px} .needs-age-profile-progress-copy strong{font-size:11px} .needs-age-profile-progress-copy span{font-size:10px;text-align:left} .needs-age-profile-progress-track{gap:4px} } @media(prefers-reduced-motion:reduce){ .needs-age-profile-progress-track i{transition:none} .needs-age-profile-progress-track i.is-current{animation:none} } @media print{.needs-age-profile-progress{display:none!important}} /* ===== END app-bundle-v5.3.117.css ===== */ /* ===== BEGIN gemini-ai-v5.3.141.css sha256=30feec920c079127fdfcff48d9751afaa937dda97f2b21a990cfc5263c415bab ===== */ /* Nutrition Calculator v5.3.138 — readable text-first Gemini explanation layer */ #geminiAiSection{position:relative;overflow:hidden} .gemini-ai-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px} .gemini-ai-kicker{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:800;letter-spacing:.045em;text-transform:uppercase;color:#145aa3} .gemini-ai-kicker::before{content:"✦";font-size:14px} .gemini-ai-badge{flex:0 0 auto;border:1px solid #b8d2ef;background:#eef6ff;color:#184d86;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:800} .gemini-ai-intro{margin:0 0 14px;color:#4b5d73;line-height:1.55} .gemini-ai-privacy{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;border:1px solid #d7e3f0;background:#f7faff;border-radius:14px;padding:12px 14px;margin:12px 0} .gemini-ai-privacy__icon{width:30px;height:30px;border-radius:10px;background:#e2effd;display:grid;place-items:center;color:#145aa3;font-weight:900} .gemini-ai-privacy strong{display:block;color:#20324b;margin-bottom:3px} .gemini-ai-privacy p{margin:0;color:#5b6c80;font-size:13px;line-height:1.45} .gemini-ai-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px} #geminiAiRunBtn{min-height:46px} #geminiAiClearBtn[hidden]{display:none!important} .gemini-ai-status{min-height:22px;margin:12px 0 0;color:#53677d;font-size:13px;line-height:1.45} .gemini-ai-status[data-state="error"]{color:#9a2f2f} .gemini-ai-status[data-state="success"]{color:#17663a} .gemini-ai-progress{display:none;grid-template-columns:repeat(5,1fr);gap:7px;margin:12px 0 0} .gemini-ai-progress[aria-hidden="false"]{display:grid} .gemini-ai-progress span{height:7px;border-radius:999px;background:#dbe6f1;overflow:hidden;position:relative} .gemini-ai-progress span::after{content:"";position:absolute;inset:0;background:#1c69c6;transform:scaleX(0);transform-origin:left;transition:transform .2s ease} .gemini-ai-progress[data-step="1"] span:nth-child(-n+1)::after, .gemini-ai-progress[data-step="2"] span:nth-child(-n+2)::after, .gemini-ai-progress[data-step="3"] span:nth-child(-n+3)::after, .gemini-ai-progress[data-step="4"] span:nth-child(-n+4)::after, .gemini-ai-progress[data-step="5"] span:nth-child(-n+5)::after{transform:scaleX(1)} .gemini-ai-output{margin-top:18px;border-top:1px solid #dfe8f2;padding-top:18px} .gemini-ai-output[hidden]{display:none!important} .gemini-ai-summary{border:1px solid #bcd5ef;background:linear-gradient(180deg,#f4f9ff,#fff);border-radius:16px;padding:16px;margin-bottom:14px} .gemini-ai-summary span{display:block;color:#1766b8;font-size:11px;font-weight:900;letter-spacing:.05em;text-transform:uppercase;margin-bottom:6px} .gemini-ai-summary p{margin:0;color:#24364e;line-height:1.58} .gemini-ai-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px} .gemini-ai-group{border:1px solid #d9e4ef;border-radius:16px;background:#fff;padding:15px} .gemini-ai-group h3{margin:0 0 10px;font-size:17px;color:#1e3048} .gemini-ai-list{display:grid;gap:10px} .gemini-ai-item{border:1px solid #e0e8f1;border-radius:13px;padding:12px;background:#fafcff} .gemini-ai-item strong{display:block;color:#263a54;margin-bottom:5px} .gemini-ai-item p{margin:0;color:#53657a;font-size:13px;line-height:1.5} .gemini-ai-related{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px} .gemini-ai-related span{border-radius:999px;background:#edf3f9;color:#425a74;padding:4px 8px;font-size:11px} .gemini-ai-steps{margin:14px 0 0;padding:0;counter-reset:ai-step;display:grid;gap:8px} .gemini-ai-steps li{list-style:none;counter-increment:ai-step;display:grid;grid-template-columns:28px 1fr;gap:9px;align-items:start;color:#40546d;line-height:1.48} .gemini-ai-steps li::before{content:counter(ai-step);width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:#1b67c2;color:#fff;font-weight:800;font-size:12px} .gemini-ai-caution{margin-top:14px;border:1px solid #eed9aa;background:#fff9eb;border-radius:14px;padding:12px 14px;color:#6f5420;font-size:13px;line-height:1.48} .gemini-ai-meta{margin-top:12px;color:#718095;font-size:11px} .gemini-ai-offline{border:1px dashed #b9c8d9;background:#f8fafc;border-radius:14px;padding:14px;color:#52667c} @media (max-width:760px){ .gemini-ai-head{display:block}.gemini-ai-badge{display:inline-flex;margin-top:9px} .gemini-ai-columns{grid-template-columns:1fr} .gemini-ai-actions{display:grid;grid-template-columns:1fr 1fr}.gemini-ai-actions #geminiAiRunBtn{grid-column:1/-1;width:100%} } @media (prefers-reduced-motion:reduce){.gemini-ai-progress span::after{transition:none}} @media print{#geminiAiRunBtn,#geminiAiClearBtn,.gemini-ai-progress,.gemini-ai-status{display:none!important}#geminiAiSection{break-inside:avoid}.gemini-ai-output[hidden]{display:none!important}} .gemini-ai-plain-text{border:1px solid #d9e4ef;border-radius:16px;background:#fff;padding:16px;color:#33465f;line-height:1.6}.gemini-ai-plain-text>p{margin:0 0 12px}.gemini-ai-plain-text>p:last-child{margin-bottom:0}.gemini-ai-plain-section+ .gemini-ai-plain-section{margin-top:16px}.gemini-ai-plain-section h3{margin:0 0 7px;font-size:17px;color:#1f3550}.gemini-ai-plain-section p{margin:0} .gemini-ai-plain-text h3{margin:18px 0 8px;font-size:18px;color:#1f3550}.gemini-ai-plain-text h3:first-child{margin-top:0}.gemini-ai-plain-text ul,.gemini-ai-plain-text ol{margin:8px 0 14px;padding-left:24px}.gemini-ai-plain-text li+li{margin-top:6px}.gemini-ai-plain-text blockquote{margin:12px 0;padding:10px 13px;border-left:4px solid #9fc4ea;background:#f4f8fc;border-radius:0 10px 10px 0}.gemini-ai-plain-text code{padding:2px 5px;border-radius:5px;background:#edf3f9;font:inherit} .gemini-ai-value{border:1px solid #cfe0f2;background:#f5f9fe;border-radius:15px;padding:14px 16px;margin:12px 0 14px}.gemini-ai-value strong{display:block;color:#203a59;margin-bottom:8px}.gemini-ai-value ul{margin:0;padding-left:20px;color:#52677e;line-height:1.5}.gemini-ai-value li+li{margin-top:5px} .gemini-ai-strategy{border:1px solid #d8e4ef;border-radius:16px;background:#fff;padding:16px;margin-bottom:14px}.gemini-ai-strategy>span{display:block;color:#1766b8;font-size:11px;font-weight:900;letter-spacing:.05em;text-transform:uppercase;margin-bottom:5px}.gemini-ai-strategy h3{margin:0 0 9px;color:#1d324c;font-size:18px}.gemini-ai-strategy>div{color:#425870;line-height:1.58}.gemini-ai-strategy>div p{margin:0 0 10px}.gemini-ai-strategy>div p:last-child{margin-bottom:0}.gemini-ai-strategy--insight{background:linear-gradient(180deg,#f3f8ff,#fff);border-color:#bcd5ef}.gemini-ai-strategy--primary{border-width:2px;border-color:#79ace0;background:#f7fbff}.gemini-ai-strategy--caution{border-color:#ead6a8;background:#fffaf0}.gemini-ai-strategy--check{border-style:dashed;background:#fafcfe}.gemini-ai-strategy-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.gemini-ai-strategy-grid .gemini-ai-strategy{margin-bottom:14px} @media (max-width:760px){.gemini-ai-strategy-grid{grid-template-columns:1fr}.gemini-ai-value{padding:13px 14px}} /* ===== END gemini-ai-v5.3.141.css ===== */ /* ===== BEGIN gemini-ration-import-v5.3.141.css sha256=d8e2e59af610684d0e80ddd3d21e15142059b22ee59ef9099748493c5cb0233f ===== */ /* Nutrition Calculator v5.3.140 — text-protocol Gemini ration import */ .gemini-ration-import{margin:16px 0;border-color:#b8d1ef;background:linear-gradient(180deg,#fff 0%,#f7fbff 100%)} .gemini-ration-import__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.gemini-ration-import__head h2{margin:4px 0 0}.gemini-ration-import__kicker{font-weight:800;color:#1767c9;font-size:13px;letter-spacing:.04em;text-transform:uppercase}.gemini-ration-import__badge{display:inline-flex;align-items:center;min-height:34px;padding:6px 11px;border-radius:999px;background:#eaf4ff;color:#15558f;font-weight:800;font-size:13px;white-space:nowrap}.gemini-ration-import__intro{margin:12px 0 10px;color:#40516a;line-height:1.55}.gemini-ration-import__privacy{padding:11px 13px;border:1px solid #d8e5f3;border-radius:13px;background:#f4f8fc;color:#42536b;font-size:14px;line-height:1.45}.gemini-ration-import__upload-row,.gemini-ration-import__actions,.gemini-ration-draft__actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:13px}.gemini-ration-import__limits{margin-top:8px;color:#66758a;font-size:12.5px}.gemini-ration-import__context{display:block;margin-top:13px;font-weight:700}.gemini-ration-import__context textarea{display:block;width:100%;margin-top:6px;resize:vertical;min-height:66px}.gemini-ration-import__status{min-height:24px;margin-top:10px;font-size:14px;font-weight:700}.gemini-ration-import__status[data-state=error]{color:#a93226}.gemini-ration-import__status[data-state=success]{color:#18723a}.gemini-ration-import__status[data-state=working]{color:#155f9e}.gemini-ration-import__progress{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:7px}.gemini-ration-import__progress[aria-hidden=true]{display:none}.gemini-ration-import__progress span{height:7px;border-radius:999px;background:#dce7f2}.gemini-ration-import__progress[data-step="1"] span:nth-child(-n+1),.gemini-ration-import__progress[data-step="2"] span:nth-child(-n+2),.gemini-ration-import__progress[data-step="3"] span:nth-child(-n+3),.gemini-ration-import__progress[data-step="4"] span:nth-child(-n+4),.gemini-ration-import__progress[data-step="5"] span:nth-child(-n+5){background:#1d6fc9} .gemini-ration-media-queue{display:grid;gap:9px;margin-top:13px}.gemini-ration-media-card{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:11px;align-items:center;padding:10px;border:1px solid #d5e1ee;border-radius:14px;background:#fff}.gemini-ration-media-card>img,.gemini-ration-media-card__audio{width:70px;height:64px;border-radius:10px;object-fit:cover;background:#eaf2fb}.gemini-ration-media-card__audio{display:grid;place-items:center;font-size:34px;font-weight:900;color:#1d65ad}.gemini-ration-media-card__body{min-width:0;display:grid;gap:2px}.gemini-ration-media-card__body>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#52637a;font-size:13px}.gemini-ration-media-card__body small{color:#748196}.gemini-ration-media-card__body label{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:12px;font-weight:700}.gemini-ration-media-card__body select{min-width:180px;padding:7px 9px} .gemini-ration-draft{margin-top:16px;padding:13px;border:1px solid #bcd3ec;border-radius:16px;background:#fff}.gemini-ration-draft__head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.gemini-ration-draft__head>div{display:grid;gap:3px}.gemini-ration-draft__head span{color:#64748b;font-size:13px}.gemini-ration-draft__warnings{margin-top:10px;padding:10px 12px;border-radius:12px;background:#fff7e8;border:1px solid #f1d69a;color:#745118;font-size:13px}.gemini-ration-draft__warnings div+div{margin-top:5px}.gemini-ration-draft__rows{display:grid;gap:10px;margin-top:12px}.gemini-ration-draft-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:start;padding:12px;border:1px solid #d9e3ee;border-radius:14px;background:#f9fbfd}.gemini-ration-draft-row.is-excluded{opacity:.55}.gemini-ration-draft-row__include{display:grid;justify-items:center;gap:3px;font-size:11px;font-weight:700}.gemini-ration-draft-row__include input{width:20px;height:20px}.gemini-ration-draft-row__title{display:flex;flex-wrap:wrap;align-items:center;gap:7px}.gemini-ration-draft-row__title strong{font-size:16px}.gemini-ration-draft-row__title>span{padding:3px 7px;border-radius:999px;background:#eaf2fb;color:#345e88;font-size:11px;font-weight:800}.gemini-ration-draft-row__title em{padding:3px 7px;border-radius:999px;font-style:normal;font-size:11px;font-weight:800}.gemini-ration-draft-row__title .confidence-high{background:#e7f7ed;color:#23633b}.gemini-ration-draft-row__title .confidence-medium{background:#fff4d8;color:#775616}.gemini-ration-draft-row__title .confidence-low{background:#fdecea;color:#8b3129}.gemini-ration-draft-row__meta{margin-top:4px;color:#66758a;font-size:12.5px;line-height:1.4}.gemini-ration-draft-row__controls{display:grid;grid-template-columns:minmax(160px,.9fr) minmax(240px,1.4fr) 110px;gap:8px;margin-top:9px}.gemini-ration-draft-row__controls label{font-size:11.5px;font-weight:800;color:#42526a}.gemini-ration-draft-row__controls input,.gemini-ration-draft-row__controls select{display:block;width:100%;margin-top:4px;padding:9px}.gemini-ration-draft__empty{padding:18px;text-align:center;color:#64748b}.ration-ai-import-badge{display:inline-flex;align-items:center;padding:3px 7px;border-radius:999px;background:#efe9ff;color:#5a3a91;font-size:11px;font-weight:800;white-space:nowrap} @media(max-width:760px){.gemini-ration-import__head{display:grid}.gemini-ration-import__badge{justify-self:start}.gemini-ration-import__upload-row>button,.gemini-ration-import__actions>button,.gemini-ration-draft__actions>button{flex:1 1 100%}.gemini-ration-media-card{grid-template-columns:58px minmax(0,1fr)}.gemini-ration-media-card>img,.gemini-ration-media-card__audio{width:58px;height:58px}.gemini-ration-media-card>button{grid-column:1/-1}.gemini-ration-media-card__body label{display:grid}.gemini-ration-media-card__body select{min-width:0;width:100%}.gemini-ration-draft-row{grid-template-columns:auto minmax(0,1fr)}.gemini-ration-draft-row>button{grid-column:1/-1}.gemini-ration-draft-row__controls{grid-template-columns:1fr}.gemini-ration-draft__head{display:grid}.gemini-ration-draft__head>span{justify-self:start}} @media print{.gemini-ration-import{display:none!important}} .gemini-ration-raw-text{padding:14px;border:1px solid #d5e1ee;border-radius:14px;background:#f9fbfd}.gemini-ration-raw-text strong{display:block;margin-bottom:8px}.gemini-ration-raw-text__body{color:#3c4f68;line-height:1.55}.gemini-ration-raw-text__body p{margin:0 0 10px}.gemini-ration-raw-text__body h3{margin:14px 0 7px;color:#233b57}.gemini-ration-raw-text__body ul,.gemini-ration-raw-text__body ol{margin:8px 0 12px;padding-left:22px}.gemini-ration-raw-text small{display:block;margin-top:10px;color:#758398} .gemini-ration-draft__sources{margin-top:10px;padding:10px 12px;border-radius:12px;background:#eef7ff;border:1px solid #bfd9f2;color:#31516f;font-size:13px}.gemini-ration-draft__sources>div{display:flex;flex-wrap:wrap;gap:7px;margin:7px 0}.gemini-ration-draft__sources a{display:inline-flex;padding:5px 8px;border:1px solid #b8d1e9;border-radius:999px;background:#fff;color:#155f9e;text-decoration:none;font-weight:700}.gemini-ration-draft__sources small{display:block;line-height:1.4}.gemini-ration-draft-row__package{display:grid;gap:4px;margin-top:8px;padding:9px 11px;border:1px solid #c9ddee;border-radius:11px;background:#fff;color:#38516c;font-size:12.5px;line-height:1.4}.gemini-ration-draft-row__package strong{color:#174f80}.gemini-ration-draft-row__package span,.gemini-ration-draft-row__package small{display:block}.gemini-ration-draft-row__package small{color:#6c7889}.gemini-ration-draft-row__match{margin-top:7px;color:#315a3e;font-size:12px;font-weight:700;line-height:1.35} /* v5.3.173: memory-safe placeholder while full-resolution photos are prepared sequentially. */ .gemini-ration-media-card__image-pending{width:70px;height:64px;border-radius:10px;background:#eaf2fb;display:grid;place-items:center;padding:6px;text-align:center;color:#315f8b;font-size:11px;font-weight:800;line-height:1.15} @media(max-width:760px){.gemini-ration-media-card__image-pending{width:58px;height:58px}} html[data-theme="retro-2bit"] .gemini-ration-media-card__image-pending{border:2px solid currentColor;border-radius:0;background:transparent;color:inherit} /* ===== END gemini-ration-import-v5.3.141.css ===== */ /* ===== BEGIN gemini-ration-selection-v5.3.152.css sha256=feae060b01fa3ce09184c3dc1bc5629b5f30a758a8ee6088b9e220c157d54bf8 ===== */ /* nutrition calculator v5.3.152 — explicit Gemini draft selection Applies to both modern and retro themes. */ .gemini-ration-draft__head #geminiRationDraftSummary { display:inline-flex; align-items:center; min-height:32px; padding:6px 10px; border:1px solid #b7c9dc; border-radius:999px; background:#f3f7fb; color:#243b55; font-size:12px; font-weight:850; white-space:nowrap; } .gemini-ration-draft-row { grid-template-columns:minmax(168px,190px) minmax(0,1fr) auto; transition:border-color .14s ease, background-color .14s ease, box-shadow .14s ease; } .gemini-ration-draft-row.is-included { border:2px solid #2563a8; background:#f7fbff; box-shadow:0 0 0 3px rgba(37,99,168,.10); } .gemini-ration-draft-row.is-excluded { opacity:1; border:2px dashed #94a3b8; background:#f1f5f9; box-shadow:none; } .gemini-ration-draft-row.is-excluded .gemini-ration-draft-row__main { opacity:.62; } .gemini-ration-draft-row__include { position:relative; display:grid; grid-template-columns:34px minmax(0,1fr); align-items:center; justify-items:stretch; gap:9px; min-width:0; min-height:58px; padding:9px 10px; border:2px solid #2563a8; border-radius:12px; background:#eaf4ff; color:#173a63; cursor:pointer; user-select:none; } .gemini-ration-draft-row__include input { position:absolute; width:1px !important; height:1px !important; margin:0 !important; opacity:0; pointer-events:none; } .gemini-ration-draft-row__include-box { position:relative; display:grid; place-items:center; width:34px; height:34px; border:2px solid #2563a8; border-radius:8px; background:#fff; box-shadow:inset 0 0 0 2px #dbeafe; } .gemini-ration-draft-row__include input:checked + .gemini-ration-draft-row__include-box { background:#2563a8; border-color:#2563a8; box-shadow:none; } .gemini-ration-draft-row__include input:checked + .gemini-ration-draft-row__include-box::after { content:"✓"; color:#fff; font:900 23px/1 system-ui,-apple-system,"Segoe UI",sans-serif; } .gemini-ration-draft-row__include-copy { display:grid; gap:2px; min-width:0; text-align:left; } .gemini-ration-draft-row__include-text { color:inherit; font-size:12px; line-height:1.25; } .gemini-ration-draft-row__include-state { color:#51677f; font-size:10.5px; font-weight:700; line-height:1.25; } .gemini-ration-draft-row__include:focus-within { outline:3px solid rgba(37,99,168,.28); outline-offset:3px; } .gemini-ration-draft-row.is-excluded .gemini-ration-draft-row__include { border-color:#64748b; background:#e2e8f0; color:#334155; } .gemini-ration-draft-row.is-excluded .gemini-ration-draft-row__include-box { border-color:#64748b; background:#f8fafc; box-shadow:none; } .gemini-ration-draft-row.is-excluded .gemini-ration-draft-row__include-state { color:#475569; } .gemini-ration-draft__actions #geminiRationAddDraftBtn { min-width:min(100%,340px); font-weight:900; } @media(max-width:760px){ .gemini-ration-draft-row { grid-template-columns:minmax(0,1fr) !important; gap:11px; padding:12px; } .gemini-ration-draft-row__include, .gemini-ration-draft-row__main, .gemini-ration-draft-row > button[data-role="remove"] { grid-column:1 !important; width:100%; } .gemini-ration-draft-row__include { grid-row:auto !important; min-height:62px; } .gemini-ration-draft-row__main { min-width:0; } .gemini-ration-draft-row__controls { grid-template-columns:minmax(0,1fr) !important; } .gemini-ration-draft-row__controls input, .gemini-ration-draft-row__controls select { min-width:0; max-width:100%; } .gemini-ration-draft__head { display:grid; grid-template-columns:minmax(0,1fr); } .gemini-ration-draft__head #geminiRationDraftSummary { justify-self:start; white-space:normal; } .gemini-ration-draft__actions { display:grid; grid-template-columns:minmax(0,1fr); } .gemini-ration-draft__actions > button { width:100%; } } /* ===== END gemini-ration-selection-v5.3.152.css ===== */ /* ===== BEGIN gemini-ration-components-v5.3.160.css sha256=0d0d0bb09ea9b7929b94e00902f6a456ab759d46595baac26ee41d06d033461e ===== */ /* nutrition calculator v5.3.160 — component groups for AI-recognized composite dishes */ .gemini-ration-draft-row.is-component { border-left-width:5px; } .gemini-ration-draft-row__component { display:flex; flex-wrap:wrap; align-items:center; gap:5px 8px; margin:3px 0 8px; padding:7px 9px; border:1px solid #9fc0df; border-radius:9px; background:#eaf4ff; color:#204a73; font-size:11px; font-weight:800; line-height:1.35; } .gemini-ration-draft-row__component-role { display:inline-flex; align-items:center; min-height:20px; padding:2px 7px; border-radius:999px; background:#2563a8; color:#fff; font-size:9.5px; font-weight:900; letter-spacing:.02em; text-transform:uppercase; } html[data-theme="retro-2bit"] .gemini-ration-draft-row__component { border:2px solid var(--retro-ink,#111); border-radius:0; background:var(--retro-paper,#f4f4ef); color:var(--retro-ink,#111); box-shadow:3px 3px 0 var(--retro-ink,#111); font-family:var(--retro-font,monospace); } html[data-theme="retro-2bit"] .gemini-ration-draft-row__component-role { border:1px solid var(--retro-ink,#111); border-radius:0; background:var(--retro-ink,#111); color:var(--retro-paper,#f4f4ef); font-family:inherit; } @media(max-width:760px){ .gemini-ration-draft-row__component { display:grid; grid-template-columns:minmax(0,1fr); gap:5px; } .gemini-ration-draft-row__component-role { justify-self:start; } } /* ===== END gemini-ration-components-v5.3.160.css ===== */ /* ===== BEGIN gemini-preparation-matching-v5.3.170.css sha256=8fb55b3c35917b3cb63404ce55ffdd992fb5cc48c1b5fbe6a89c7a42d1a34e88 ===== */ /* v5.3.170 — preparation-aware Gemini matching and manual-review safety */ .gemini-ration-draft-row.needs-manual-review{ border-color:#c47b12; background:#fffaf0; } .gemini-ration-draft-row.needs-manual-review .gemini-ration-draft-row__include{ color:#7a4b00; } .gemini-ration-draft-row.needs-manual-review .gemini-ration-draft-row__match{ border-left:4px solid #c47b12; padding-left:10px; color:#6f470c; } html[data-theme="retro-2bit"] .gemini-ration-draft-row.needs-manual-review{ color:var(--retro-ink)!important; border:2px solid var(--retro-ink)!important; border-left-width:6px!important; background:var(--retro-paper)!important; box-shadow:none!important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row.needs-manual-review .gemini-ration-draft-row__match{ border-left:3px solid var(--retro-ink)!important; color:var(--retro-ink)!important; } /* ===== END gemini-preparation-matching-v5.3.170.css ===== */ /* ===== BEGIN preparation-family-ui-v5.3.176.css sha256=e3848167ea195f519de521028cd016325913c527e6dfae4e59627a7a5b17a066 ===== */ /* Nutrition Calculator v5.3.171 — preparation family UI pass 4 */ .preparation-family-ui{margin:10px 0;padding:12px;border:1px solid #cbdbea;border-radius:13px;background:#f8fbff;color:#25384d;display:grid;gap:9px} .preparation-family-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px} .preparation-family-head>div{min-width:0}.preparation-family-head span{display:block;color:#526b84;font-size:11px;font-weight:850;letter-spacing:.035em;text-transform:uppercase}.preparation-family-head strong{display:block;margin-top:2px;color:#173a5d;font-size:14px;line-height:1.3}.preparation-family-head small{flex:0 0 auto;color:#526b84;font-size:11px;font-weight:750} .preparation-family-select-label{display:grid;gap:5px;color:#344b62;font-size:12px;font-weight:800}.preparation-family-select-label select{width:100%;min-width:0;padding:9px 10px;border:1px solid #aec5da;border-radius:9px;background:#fff;color:#17283a;font:inherit} .preparation-family-selected-name{font-size:12.5px;line-height:1.4;color:#3c536a}.preparation-family-selected-name strong{color:#173a5d} .preparation-family-badges{display:flex;flex-wrap:wrap;gap:5px}.preparation-family-badges span,.preparation-family-count{display:inline-flex;align-items:center;min-height:22px;padding:2px 7px;border:1px solid #c7d9e9;border-radius:999px;background:#fff;color:#425d76;font-size:10.5px;font-weight:750} .preparation-family-weight-note{padding:8px 9px;border-left:3px solid #3979ad;background:#eef6fd;color:#29465f;font-size:12px;line-height:1.4} .preparation-family-warning{padding:8px 9px;border:1px solid #e5c275;border-left:4px solid #b57910;border-radius:8px;background:#fff9e9;color:#65470d;font-size:12px;line-height:1.4} .preparation-family-search-card.preparation-family-needs-choice [data-role="add-search"]{opacity:.58;cursor:not-allowed} .preparation-family-search-card .search-result-title{display:flex;flex-wrap:wrap;align-items:center;gap:7px} .preparation-family-gemini-ui{grid-column:1/-1;margin:10px 0 2px;background:#f7fbff} .gemini-ration-draft-row.needs-manual-review .preparation-family-gemini-ui{border-color:#d5a84f} @media(max-width:760px){.preparation-family-ui{padding:10px;margin:9px 0}.preparation-family-head{display:grid;gap:3px}.preparation-family-head small{justify-self:start}.preparation-family-badges{display:grid;grid-template-columns:1fr}.preparation-family-badges span{justify-content:flex-start;border-radius:7px}.preparation-family-select-label select{min-height:44px}.preparation-family-search-card .search-result-title{align-items:flex-start}.preparation-family-count{border-radius:6px}} @media screen{ html[data-theme="retro-2bit"] .preparation-family-ui{color:var(--retro-ink)!important;border:1px solid var(--retro-dark)!important;border-radius:0!important;background:var(--retro-paper)!important;box-shadow:none!important} html[data-theme="retro-2bit"] .preparation-family-head span,html[data-theme="retro-2bit"] .preparation-family-head strong,html[data-theme="retro-2bit"] .preparation-family-head small,html[data-theme="retro-2bit"] .preparation-family-selected-name,html[data-theme="retro-2bit"] .preparation-family-selected-name strong,html[data-theme="retro-2bit"] .preparation-family-select-label{color:var(--retro-ink)!important} html[data-theme="retro-2bit"] .preparation-family-select-label select{color:var(--retro-ink)!important;border:1px solid var(--retro-ink)!important;border-radius:0!important;background:var(--retro-paper)!important;box-shadow:2px 2px 0 var(--retro-dark)!important} html[data-theme="retro-2bit"] .preparation-family-badges span,html[data-theme="retro-2bit"] .preparation-family-count{color:var(--retro-ink)!important;border:1px solid var(--retro-dark)!important;border-radius:0!important;background:var(--retro-light)!important;box-shadow:none!important} html[data-theme="retro-2bit"] .preparation-family-weight-note{color:var(--retro-ink)!important;border:1px solid var(--retro-dark)!important;border-left:4px solid var(--retro-ink)!important;background:var(--retro-paper)!important} html[data-theme="retro-2bit"] .preparation-family-warning{color:var(--retro-ink)!important;border:1px solid var(--retro-dark)!important;border-left:4px solid var(--retro-ink)!important;border-radius:0!important;background:var(--retro-light)!important;background-image:none!important;box-shadow:none!important} } @media print{.preparation-family-ui{display:none!important}} /* ===== END preparation-family-ui-v5.3.176.css ===== */ /* ===== BEGIN preparation-nutritional-impact-v5.3.179.css sha256=6df65534cdd05a02adffa06a65ba1d46c3c481eddb1e084bd880849ad271b0dd ===== */ /* v5.3.179 — preparation nutritional impact */ .preparation-family-impact-macros{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:9px 0;padding:9px 10px;border:1px solid #d7e3ef;border-radius:10px;background:#f8fbfe} .preparation-family-impact-macros span{font-size:12px;font-weight:850;color:#243b53} .preparation-family-impact-macros small{width:100%;color:#64748b;font-size:11px} .preparation-family-impact-summary{margin-top:8px;color:#40566d;font-size:12.5px;line-height:1.48} .preparation-family-impact-warning{margin-top:9px;padding:9px 10px;border:1px solid #e3b04b;border-left:4px solid #c77d00;border-radius:9px;background:#fff8e8;color:#694300;font-size:12px;line-height:1.45} .preparation-family-confirm{width:100%;margin-top:9px} .preparation-family-needs-confirmation{outline:2px solid rgba(199,125,0,.3);outline-offset:2px} @media(max-width:760px){.preparation-family-impact-macros{gap:5px}.preparation-family-impact-macros span{font-size:11.5px}.preparation-family-impact-warning{font-size:11.5px}} @media print{.preparation-family-confirm,.preparation-family-impact-warning{display:none!important}} @media screen{ html[data-theme="retro-2bit"] .preparation-family-impact-macros, html[data-theme="retro-2bit"] .preparation-family-impact-warning, html[data-theme="retro-2bit"] .preparation-family-impact-summary{color:var(--retro-ink)!important;border-radius:0!important;background:var(--retro-paper)!important;background-image:none!important;box-shadow:none!important} html[data-theme="retro-2bit"] .preparation-family-impact-warning{border:1px solid var(--retro-dark)!important;border-left:4px solid var(--retro-ink)!important} html[data-theme="retro-2bit"] .preparation-family-impact-macros span, html[data-theme="retro-2bit"] .preparation-family-impact-macros small{color:var(--retro-ink)!important} html[data-theme="retro-2bit"] .preparation-family-needs-confirmation{outline:2px dashed var(--retro-ink)!important} } /* ===== END preparation-nutritional-impact-v5.3.179.css ===== */ /* ===== BEGIN gemini-audio-recorder-v5.3.186.css sha256=f831e745dc3bbe31a5a5d520bad66476a1c77bb176985219a46edb8d33a63ea5 ===== */ /* Nutrition Calculator v5.3.186 — real-time microphone state and monotonic recording timer */ .gemini-ration-record-button span[aria-hidden="true"] { display:inline-block; margin-right:.42em; font-size:.78em; line-height:1; color:#b42318; } .gemini-audio-recorder { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:14px; align-items:center; margin:14px 0 4px; padding:14px; border:1px solid #f0b4ad; border-radius:16px; background:#fff7f6; } .gemini-audio-recorder:not([hidden]) { display:grid !important; } .gemini-audio-recorder[hidden] { display:none !important; } .gemini-audio-recorder__signal { display:flex; align-items:center; justify-content:center; gap:3px; width:42px; height:42px; border-radius:50%; background:#b42318; } .gemini-audio-recorder__signal i { display:block; width:3px; height:9px; border-radius:999px; background:#fff; animation:gemini-audio-level .72s ease-in-out infinite alternate; } .gemini-audio-recorder__signal i:nth-child(2) { height:18px; animation-delay:-.18s; } .gemini-audio-recorder__signal i:nth-child(3) { height:13px; animation-delay:-.36s; } .gemini-audio-recorder__signal i:nth-child(4) { height:7px; animation-delay:-.54s; } @keyframes gemini-audio-level { from { transform:scaleY(.58); } to { transform:scaleY(1.12); } } .gemini-audio-recorder__body { display:grid; gap:2px; min-width:0; } .gemini-audio-recorder__status-row { display:flex; align-items:flex-start; gap:8px; min-width:0; } .gemini-audio-recorder__live-dot { flex:0 0 auto; width:10px; height:10px; margin-top:.36em; border-radius:50%; background:#b42318; box-shadow:0 0 0 0 rgba(180,35,24,.38); } .gemini-audio-recorder[data-recorder-state="recording"] .gemini-audio-recorder__live-dot { animation:gemini-recorder-live-pulse 1.15s ease-out infinite; } .gemini-audio-recorder[data-recorder-state="starting"] .gemini-audio-recorder__live-dot, .gemini-audio-recorder[data-recorder-state="processing"] .gemini-audio-recorder__live-dot { background:#667085; box-shadow:none; animation:none; } @keyframes gemini-recorder-live-pulse { 0% { box-shadow:0 0 0 0 rgba(180,35,24,.38); } 70%,100% { box-shadow:0 0 0 8px rgba(180,35,24,0); } } #geminiRationRecorderTimer { display:inline-flex; align-items:center; width:max-content; min-width:8.2em; padding:3px 8px; border:1px solid rgba(180,35,24,.22); border-radius:8px; background:rgba(255,255,255,.72); font-size:1.08rem; line-height:1.25; letter-spacing:.02em; font-variant-numeric:tabular-nums; contain:layout paint; } .gemini-audio-recorder__body strong { color:#7a271a; } .gemini-audio-recorder__body span { font-weight:800; font-variant-numeric:tabular-nums; } .gemini-audio-recorder__body small { color:#667085; line-height:1.35; } .gemini-audio-recorder__actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; } .gemini-audio-recorder__actions button { min-height:42px; } .gemini-ration-media-card__audio { display:grid; align-content:center; gap:6px; min-width:150px; } .gemini-ration-media-card__audio > span { display:none; } .gemini-ration-media-card__audio audio { display:block; width:100%; min-width:145px; max-width:220px; height:36px; } .gemini-ration-media-card__source { font-weight:700; color:#344054; } .gemini-ration-audio-codec-note { display:block; margin-top:5px; color:#667085; line-height:1.35; } @media (prefers-reduced-motion:reduce) { .gemini-audio-recorder__signal i, .gemini-audio-recorder__live-dot { animation:none !important; } } @media (max-width:720px) { .gemini-audio-recorder { grid-template-columns:auto minmax(0,1fr); align-items:start; } .gemini-audio-recorder__actions { grid-column:1 / -1; display:grid; grid-template-columns:1fr; width:100%; } .gemini-audio-recorder__actions button { width:100%; } .gemini-ration-media-card__audio { min-width:0; width:100%; } .gemini-ration-media-card__audio audio { min-width:0; max-width:none; width:100%; } } /* Calm 2-bit theme: no extra shadow, texture or nested heavy frame. */ html[data-theme="retro-2bit"] .gemini-ration-record-button span[aria-hidden="true"] { color:currentColor; } html[data-theme="retro-2bit"] .gemini-audio-recorder { border:2px solid var(--retro-ink,#111); border-radius:0; background:var(--retro-paper,#fff); box-shadow:none; } html[data-theme="retro-2bit"] .gemini-audio-recorder__signal { width:40px; height:40px; border:2px solid var(--retro-ink,#111); border-radius:0; background:var(--retro-ink,#111); } html[data-theme="retro-2bit"] .gemini-audio-recorder__signal i { border-radius:0; background:var(--retro-paper,#fff); } html[data-theme="retro-2bit"] .gemini-audio-recorder__body strong, html[data-theme="retro-2bit"] .gemini-audio-recorder__body span, html[data-theme="retro-2bit"] .gemini-audio-recorder__body small, html[data-theme="retro-2bit"] .gemini-ration-audio-codec-note, html[data-theme="retro-2bit"] .gemini-ration-media-card__source { color:var(--retro-ink,#111); } html[data-theme="retro-2bit"] .gemini-ration-media-card__audio audio { filter:grayscale(1); } html[data-theme="retro-2bit"] .gemini-audio-recorder__live-dot { border-radius:0; background:var(--retro-ink,#111); box-shadow:none; } html[data-theme="retro-2bit"] #geminiRationRecorderTimer { border:2px solid var(--retro-ink,#111); border-radius:0; background:var(--retro-paper,#fff); color:var(--retro-ink,#111); } /* Keep the recorder visibly alive while permission is requested, audio is captured, or MP3 is encoded. */ .gemini-audio-recorder:not([hidden]) .gemini-audio-recorder__body span { min-width:7.4em; } /* ===== END gemini-audio-recorder-v5.3.186.css ===== */ /* ===== BEGIN sergey-vesnin-branding-v5.3.178.css sha256=e9c95b19ae79c1010967cbba0552205eea1dc931777b43510d8ba8f8c83ae6d6 ===== */ /* nutrition calculator v5.3.178 — Sergey Vesnin authorship and build identity */ @media screen { header > .title { max-width: 100%; line-height: 1.12; text-wrap: balance; } #legal-note .sv-authorship { display: grid; gap: 4px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border, #cbd5e1); color: var(--text, #172033); font-size: 13px; line-height: 1.45; } #legal-note .sv-authorship strong { font-size: 14px; } #legal-note .sv-build-date { color:var(--muted-text,#64748b); font-variant-numeric: tabular-nums; } html[data-theme="retro-2bit"] #legal-note .sv-authorship { border-top: 2px solid var(--retro-ink, #111); color: var(--retro-ink, #111); } html[data-theme="retro-2bit"] #legal-note .sv-build-date { color: var(--retro-dark, #444); } @media (max-width: 560px) { header > .title { font-size: clamp(22px, 7vw, 30px); } #legal-note .sv-authorship { font-size: 12.5px; } } } @media print { #legal-note .sv-authorship { display:grid; gap:2px; margin-top:10px; padding-top:8px; border-top:1px solid #333; font-size:10pt; } } /* ===== END sergey-vesnin-branding-v5.3.178.css ===== */ /* ===== BEGIN theme-retro-2bit-v1.css sha256=0d0d091067b33267a24a851eeaf68afad17bce9e597b31784bdaff26026eae09 ===== */ /* nutrition calculator v5.3.146 — 2-bit retro theme foundation, pass 1 Scope: screen-only shell, cards, controls and fields. All selectors are isolated under html[data-theme="retro-2bit"]. Calculation, layout structure, charts and print/PDF logic are intentionally untouched. */ @media screen { html[data-theme="retro-2bit"] { --retro-ink: #111111; --retro-dark: #4a4a4a; --retro-light: #b8b8b8; --retro-paper: #f4f4ef; --retro-unit: 4px; color-scheme: light; } html[data-theme="retro-2bit"] body { color: var(--retro-ink); background-color: var(--retro-light); background-image: linear-gradient(90deg, var(--retro-dark) 1px, transparent 1px), linear-gradient(var(--retro-dark) 1px, transparent 1px); background-size: 8px 8px; } html[data-theme="retro-2bit"] body, html[data-theme="retro-2bit"] button, html[data-theme="retro-2bit"] input, html[data-theme="retro-2bit"] select, html[data-theme="retro-2bit"] textarea { font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace; } html[data-theme="retro-2bit"] #mainContent { background: var(--retro-paper); border-inline: 3px solid var(--retro-ink); box-shadow: 8px 0 0 var(--retro-dark), -8px 0 0 var(--retro-paper); } html[data-theme="retro-2bit"] header { position: relative; padding: 14px; border: 3px solid var(--retro-ink); border-radius: 0; background: var(--retro-paper); box-shadow: 6px 6px 0 var(--retro-dark); } html[data-theme="retro-2bit"] header::before { content: "SYS/UI 2-BIT"; position: absolute; inset: -12px auto auto 12px; padding: 1px 6px; border: 2px solid var(--retro-ink); background: var(--retro-paper); color: var(--retro-ink); font-size: 10px; font-weight: 900; letter-spacing: .09em; line-height: 1.4; } html[data-theme="retro-2bit"] .title, html[data-theme="retro-2bit"] h1, html[data-theme="retro-2bit"] h2, html[data-theme="retro-2bit"] h3, html[data-theme="retro-2bit"] strong { color: var(--retro-ink); text-shadow: none; } html[data-theme="retro-2bit"] .title { letter-spacing: -.04em; text-transform: uppercase; } html[data-theme="retro-2bit"] .card, html[data-theme="retro-2bit"] .total-card, html[data-theme="retro-2bit"] .kpi .tile, html[data-theme="retro-2bit"] .accordion-item, html[data-theme="retro-2bit"] details.fold, html[data-theme="retro-2bit"] dialog { border: 2px solid var(--retro-ink); border-radius: 0; background: var(--retro-paper); box-shadow: 5px 5px 0 var(--retro-dark); } html[data-theme="retro-2bit"] .card + .card, html[data-theme="retro-2bit"] section.card { margin-top: 20px; } html[data-theme="retro-2bit"] .accordion-head, html[data-theme="retro-2bit"] details.fold > summary { border-radius: 0; background: var(--retro-light); color: var(--retro-ink); box-shadow: inset 0 -2px 0 var(--retro-dark); } html[data-theme="retro-2bit"] .accordion-body, html[data-theme="retro-2bit"] details.fold > div, html[data-theme="retro-2bit"] .ration-details td, html[data-theme="retro-2bit"] .mini-nutrients { background: var(--retro-paper); } html[data-theme="retro-2bit"] button, html[data-theme="retro-2bit"] .btn, html[data-theme="retro-2bit"] [role="button"] { min-height: 40px; border: 2px solid var(--retro-ink); border-radius: 0; background: var(--retro-ink); color: var(--retro-paper); box-shadow: 3px 3px 0 var(--retro-dark); text-shadow: none; transition: transform 80ms linear, box-shadow 80ms linear, background-color 80ms linear; } html[data-theme="retro-2bit"] button:hover, html[data-theme="retro-2bit"] .btn:hover, html[data-theme="retro-2bit"] [role="button"]:hover { background: var(--retro-dark); border-color: var(--retro-ink); color: var(--retro-paper); } html[data-theme="retro-2bit"] button:active, html[data-theme="retro-2bit"] .btn:active, html[data-theme="retro-2bit"] [role="button"]:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--retro-dark); } html[data-theme="retro-2bit"] button.secondary, html[data-theme="retro-2bit"] button.ghost, html[data-theme="retro-2bit"] .btn.secondary, html[data-theme="retro-2bit"] .seg button, html[data-theme="retro-2bit"] .theme-switcher__button { background: var(--retro-paper); color: var(--retro-ink); } html[data-theme="retro-2bit"] button.danger { background: var(--retro-dark); color: var(--retro-paper); } html[data-theme="retro-2bit"] button:disabled, html[data-theme="retro-2bit"] .btn:disabled { background: var(--retro-light); color: var(--retro-dark); box-shadow: 2px 2px 0 var(--retro-light); } html[data-theme="retro-2bit"] input[type="number"], html[data-theme="retro-2bit"] input[type="text"], html[data-theme="retro-2bit"] input[type="search"], html[data-theme="retro-2bit"] input[type="email"], html[data-theme="retro-2bit"] select, html[data-theme="retro-2bit"] textarea, html[data-theme="retro-2bit"] .norm-input { border: 2px solid var(--retro-ink); border-radius: 0; background: var(--retro-paper); color: var(--retro-ink); box-shadow: inset 3px 3px 0 var(--retro-light); caret-color: var(--retro-ink); } html[data-theme="retro-2bit"] input[readonly], html[data-theme="retro-2bit"] input:disabled, html[data-theme="retro-2bit"] select:disabled, html[data-theme="retro-2bit"] textarea:disabled { background: var(--retro-light); color: var(--retro-dark); } html[data-theme="retro-2bit"] button:focus-visible, html[data-theme="retro-2bit"] .btn:focus-visible, html[data-theme="retro-2bit"] input:focus-visible, html[data-theme="retro-2bit"] select:focus-visible, html[data-theme="retro-2bit"] textarea:focus-visible, html[data-theme="retro-2bit"] summary:focus-visible { outline: 3px dashed var(--retro-ink); outline-offset: 3px; box-shadow: none; } html[data-theme="retro-2bit"] .seg { padding: 3px; border: 2px solid var(--retro-ink); border-radius: 0; background: var(--retro-light); } html[data-theme="retro-2bit"] .seg button.active, html[data-theme="retro-2bit"] .theme-switcher__button[aria-pressed="true"] { background: var(--retro-ink); color: var(--retro-paper); box-shadow: none; } html[data-theme="retro-2bit"] .pill, html[data-theme="retro-2bit"] .chip, html[data-theme="retro-2bit"] .badge, html[data-theme="retro-2bit"] .step-badge { border: 2px solid var(--retro-ink); border-radius: 0; background: var(--retro-light); color: var(--retro-ink); box-shadow: 2px 2px 0 var(--retro-dark); } html[data-theme="retro-2bit"] .muted, html[data-theme="retro-2bit"] .small, html[data-theme="retro-2bit"] .footer-note, html[data-theme="retro-2bit"] label { color: var(--retro-dark); opacity: 1; } html[data-theme="retro-2bit"] .theme-switcher { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 6px 8px; min-width: 212px; padding: 6px; border: 2px solid var(--retro-ink); background: var(--retro-light); box-shadow: 3px 3px 0 var(--retro-dark); } html[data-theme="retro-2bit"] .theme-switcher__label { grid-column: 1 / -1; font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; } html[data-theme="retro-2bit"] .theme-switcher__controls { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; } html[data-theme="retro-2bit"] .theme-switcher__button { min-height: 34px; padding: 7px 9px; font-size: 11px; box-shadow: none; } html:not([data-theme="retro-2bit"]) .theme-switcher { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 5px 7px; border: 1px solid var(--border, #d9e2ec); border-radius: 12px; background: #fff; } html:not([data-theme="retro-2bit"]) .theme-switcher__label { font-size: 11px; color: #526174; } html:not([data-theme="retro-2bit"]) .theme-switcher__controls { display: flex; gap: 3px; } html:not([data-theme="retro-2bit"]) .theme-switcher__button { min-height: 32px; padding: 6px 9px; border-radius: 9px; box-shadow: none; font-size: 11px; } html:not([data-theme="retro-2bit"]) .theme-switcher__button[aria-pressed="true"] { background: var(--primary, #0b61d6); color: #fff; } @media (max-width: 720px) { html[data-theme="retro-2bit"] body { padding: 8px; } html[data-theme="retro-2bit"] #mainContent { padding-inline: 8px; border-inline-width: 2px; box-shadow: 4px 0 0 var(--retro-dark), -4px 0 0 var(--retro-paper); } html[data-theme="retro-2bit"] header { align-items: stretch; padding: 12px 10px; box-shadow: 4px 4px 0 var(--retro-dark); } html[data-theme="retro-2bit"] header .toolbar { width: 100%; } html[data-theme="retro-2bit"] .theme-switcher { width: 100%; min-width: 0; } html[data-theme="retro-2bit"] .card, html[data-theme="retro-2bit"] .total-card, html[data-theme="retro-2bit"] .kpi .tile, html[data-theme="retro-2bit"] .accordion-item, html[data-theme="retro-2bit"] details.fold { box-shadow: 3px 3px 0 var(--retro-dark); } } @media (prefers-reduced-motion: reduce) { html[data-theme="retro-2bit"] *, html[data-theme="retro-2bit"] *::before, html[data-theme="retro-2bit"] *::after { transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; } } } @media print { .theme-switcher { display: none !important; } } /* ===== END theme-retro-2bit-v1.css ===== */ /* ===== BEGIN theme-retro-2bit-v2.css sha256=4464c03efa0c7f9906e25f6f3be9cc677e4a56910b0fda31f6a8358745b37cb5 ===== */ /* nutrition calculator v5.3.147 — 2-bit retro theme, pass 2 of 4 Full screen UI system for search, ration, HEI, nutrient norms, analysis matrix, Harvard plate, Gemini, dialogs, service states and mobile layouts. Scope is visual only: html[data-theme="retro-2bit"] under @media screen. Print/PDF, loader artwork and pixel iconography remain reserved for pass 3. */ @media screen { html[data-theme="retro-2bit"] { --primary: var(--retro-ink); --primary-2: var(--retro-dark); --primary-soft: var(--retro-light); --text: var(--retro-ink); --muted: var(--retro-dark); --border: var(--retro-dark); --surface: var(--retro-paper); --surface-2: var(--retro-light); --ok: var(--retro-dark); --warning: var(--retro-dark); --danger: var(--retro-ink); --focus: var(--retro-ink); --retro-dither-25: linear-gradient(45deg, transparent 75%, var(--retro-dark) 75%) 0 0 / 4px 4px, linear-gradient(45deg, var(--retro-dark) 25%, transparent 25%) 2px 2px / 4px 4px, var(--retro-paper); --retro-dither-50: linear-gradient(45deg, var(--retro-dark) 25%, transparent 25%, transparent 75%, var(--retro-dark) 75%) 0 0 / 4px 4px, linear-gradient(45deg, var(--retro-dark) 25%, transparent 25%, transparent 75%, var(--retro-dark) 75%) 2px 2px / 4px 4px, var(--retro-paper); --retro-stripes: repeating-linear-gradient(135deg, var(--retro-paper) 0 4px, var(--retro-light) 4px 8px); } /* Shared hierarchy and states */ html[data-theme="retro-2bit"] ::selection { color: var(--retro-paper); background: var(--retro-ink); } html[data-theme="retro-2bit"] a { color: var(--retro-ink); text-decoration-thickness: 2px; text-underline-offset: 3px; } html[data-theme="retro-2bit"] hr, html[data-theme="retro-2bit"] .hr { height: 2px; border: 0; background: var(--retro-dark); } html[data-theme="retro-2bit"] input[type="checkbox"], html[data-theme="retro-2bit"] input[type="radio"] { accent-color: var(--retro-ink); } html[data-theme="retro-2bit"] table { color: var(--retro-ink); border-collapse: collapse; } html[data-theme="retro-2bit"] th { color: var(--retro-paper) !important; background: var(--retro-ink) !important; border-color: var(--retro-ink) !important; font-weight: 900; letter-spacing: .02em; } html[data-theme="retro-2bit"] td { color: var(--retro-ink); border-color: var(--retro-dark) !important; background-color: var(--retro-paper); } html[data-theme="retro-2bit"] tbody tr:nth-child(even) > td { background-color: var(--retro-light); } html[data-theme="retro-2bit"] .table-wrap, html[data-theme="retro-2bit"] .ration-table-wrap, html[data-theme="retro-2bit"] .norm-region-help-table-wrap, html[data-theme="retro-2bit"] .composite-search-table-wrap { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 3px 3px 0 var(--retro-dark); } html[data-theme="retro-2bit"] .alert, html[data-theme="retro-2bit"] .alert.good, html[data-theme="retro-2bit"] .alert.neutral, html[data-theme="retro-2bit"] .alert.bad, html[data-theme="retro-2bit"] .alert-danger, html[data-theme="retro-2bit"] [data-state="error"], html[data-theme="retro-2bit"] [data-state="success"], html[data-theme="retro-2bit"] [data-state="working"] { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; box-shadow: 3px 3px 0 var(--retro-dark); } html[data-theme="retro-2bit"] .alert.good, html[data-theme="retro-2bit"] [data-state="success"] { background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .alert.neutral, html[data-theme="retro-2bit"] [data-state="working"] { background: var(--retro-stripes) !important; } html[data-theme="retro-2bit"] .alert.bad, html[data-theme="retro-2bit"] .alert-danger, html[data-theme="retro-2bit"] [data-state="error"] { color: var(--retro-paper) !important; background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .progress, html[data-theme="retro-2bit"] [class*="-meter"], html[data-theme="retro-2bit"] [class*="-track"], html[data-theme="retro-2bit"] [class*="-scorebar"] { border-radius: 0 !important; } html[data-theme="retro-2bit"] .progress { height: 12px; border: 2px solid var(--retro-ink); background: var(--retro-paper); overflow: hidden; } html[data-theme="retro-2bit"] .progress .bar, html[data-theme="retro-2bit"] .bar { background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .pill, html[data-theme="retro-2bit"] .chip, html[data-theme="retro-2bit"] .badge, html[data-theme="retro-2bit"] [class*="-badge"], html[data-theme="retro-2bit"] [class*="-chip"] { color: var(--retro-ink) !important; border-color: var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; box-shadow: 2px 2px 0 var(--retro-dark); } html[data-theme="retro-2bit"] dialog { color: var(--retro-ink); border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 8px 8px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] dialog::backdrop { background: linear-gradient(45deg, rgba(17,17,17,.72) 25%, transparent 25%, transparent 75%, rgba(17,17,17,.72) 75%) 0 0 / 6px 6px, rgba(74,74,74,.72) !important; } html[data-theme="retro-2bit"] .dialog-head, html[data-theme="retro-2bit"] .norm-region-help-dialog__head { color: var(--retro-paper) !important; background: var(--retro-ink) !important; border-bottom: 3px solid var(--retro-ink) !important; } html[data-theme="retro-2bit"] .dialog-head *, html[data-theme="retro-2bit"] .norm-region-help-dialog__head * { color: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .close-btn { color: var(--retro-paper) !important; border: 2px solid var(--retro-paper) !important; background: var(--retro-ink) !important; box-shadow: none !important; } /* Needs profile and regional norms */ html[data-theme="retro-2bit"] #needs, html[data-theme="retro-2bit"] #needsCompact, html[data-theme="retro-2bit"] .norm-region-switcher, html[data-theme="retro-2bit"] .needs-age-profile-card, html[data-theme="retro-2bit"] .needs-personal-child-norm { color: var(--retro-ink) !important; border-color: var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .norm-region-switcher { box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .norm-region-switcher #regionSeg, html[data-theme="retro-2bit"] .norm-region-help-dialog__profiles section, html[data-theme="retro-2bit"] .norm-region-help-dialog__change-grid section, html[data-theme="retro-2bit"] .norm-region-help-dialog__scope, html[data-theme="retro-2bit"] .norm-region-help-dialog__examples, html[data-theme="retro-2bit"] .norm-region-help-dialog__unchanged, html[data-theme="retro-2bit"] .norm-region-change-points > div, html[data-theme="retro-2bit"] .norm-region-comparison-details, html[data-theme="retro-2bit"] .needs-age-profile-content, html[data-theme="retro-2bit"] .needs-age-profile-why { color: var(--retro-ink) !important; border: 2px solid var(--retro-dark) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .norm-region-comparison-details > summary, html[data-theme="retro-2bit"] .needs-age-profile-head, html[data-theme="retro-2bit"] .needs-age-profile-why > summary { color: var(--retro-ink) !important; background: var(--retro-light) !important; border-radius: 0 !important; } html[data-theme="retro-2bit"] .norm-region-help-table td[data-different="true"] { background: var(--retro-stripes) !important; } html[data-theme="retro-2bit"] .needs-age-profile-progress { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .needs-age-profile-progress-track i { height: 10px !important; border: 1px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .needs-age-profile-progress-track i.is-filled, html[data-theme="retro-2bit"] .needs-age-profile-progress-track i.is-current { background: var(--retro-ink) !important; } html[data-theme="retro-2bit"] .needs-age-profile-indicator { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; } /* Search */ html[data-theme="retro-2bit"] #globalSearchSection.search-hero { border: 3px solid var(--retro-ink) !important; background: var(--retro-paper) !important; box-shadow: 7px 7px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .search-hero-head { border-bottom: 3px double var(--retro-ink); padding-bottom: 12px; } html[data-theme="retro-2bit"] .search-db-count { color: var(--retro-paper) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-ink) !important; box-shadow: 3px 3px 0 var(--retro-dark); } html[data-theme="retro-2bit"] .search-db-count strong, html[data-theme="retro-2bit"] .search-db-count span { color: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .search-field-card, html[data-theme="retro-2bit"] .search-grams-card { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .quick-searches button, html[data-theme="retro-2bit"] .quick-grams button { min-height: 34px; color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; background: var(--retro-light) !important; box-shadow: 2px 2px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .search-status { color: var(--retro-ink) !important; border-left: 6px solid var(--retro-ink); background: var(--retro-light) !important; padding: 9px 11px; } html[data-theme="retro-2bit"] .search-added-toast, html[data-theme="retro-2bit"] .search-empty-state { color: var(--retro-ink) !important; border: 2px dashed var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .search-result-card, html[data-theme="retro-2bit"] .composite-search-preview { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .search-result-card:hover, html[data-theme="retro-2bit"] .search-result-card:focus-within { transform: translate(-1px, -1px); box-shadow: 6px 6px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .search-result-title, html[data-theme="retro-2bit"] .search-result-meta, html[data-theme="retro-2bit"] .search-result-trust, html[data-theme="retro-2bit"] .search-result-weighing-note { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] .search-result-nutrients span, html[data-theme="retro-2bit"] .composite-search-kind, html[data-theme="retro-2bit"] .composite-search-flags span { color: var(--retro-ink) !important; border: 1px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .composite-search-details, html[data-theme="retro-2bit"] .composite-search-note, html[data-theme="retro-2bit"] .composite-search-model-meta { color: var(--retro-ink) !important; border-color: var(--retro-dark) !important; border-radius: 0 !important; background: var(--retro-stripes) !important; } /* Ration, composite folders and editable rows */ html[data-theme="retro-2bit"] #rationSection { border-width: 3px; } html[data-theme="retro-2bit"] .ration-head-enhanced { padding-bottom: 12px; border-bottom: 3px double var(--retro-ink); } html[data-theme="retro-2bit"] .ration-kpi-strip, html[data-theme="retro-2bit"] .ration-attention-strip, html[data-theme="retro-2bit"] .mobile-ration-summary { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .ration-attention-strip { background: var(--retro-stripes) !important; } html[data-theme="retro-2bit"] .ration-ui-legend { border: 2px dashed var(--retro-dark) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .ration-legend-composite, html[data-theme="retro-2bit"] .ration-legend-impact, html[data-theme="retro-2bit"] .ration-impact-dot, html[data-theme="retro-2bit"] .composite-badge-dot { border: 1px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .ration-table { border: 2px solid var(--retro-ink); } html[data-theme="retro-2bit"] .ration-row, html[data-theme="retro-2bit"] .ration-details td, html[data-theme="retro-2bit"] .composite-folder-row > td, html[data-theme="retro-2bit"] .composite-folder-details-row > td { color: var(--retro-ink) !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .ration-row-attention > td { background: var(--retro-stripes) !important; } html[data-theme="retro-2bit"] .ration-name, html[data-theme="retro-2bit"] .ration-title, html[data-theme="retro-2bit"] .ration-serving-hint, html[data-theme="retro-2bit"] .ration-impact-caption, html[data-theme="retro-2bit"] .composite-folder-note, html[data-theme="retro-2bit"] .composite-child-flags, html[data-theme="retro-2bit"] .composite-child-impact { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] .ration-impact-chip, html[data-theme="retro-2bit"] .ration-impact-more, html[data-theme="retro-2bit"] .ration-ai-import-badge, html[data-theme="retro-2bit"] .composite-badge, html[data-theme="retro-2bit"] .composite-confidence { color: var(--retro-ink) !important; border: 1px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; box-shadow: 2px 2px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .ration-impact-high, html[data-theme="retro-2bit"] .ration-impact-over, html[data-theme="retro-2bit"] .ration-impact-notice { color: var(--retro-paper) !important; background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .composite-folder-details, html[data-theme="retro-2bit"] .composite-impact-summary, html[data-theme="retro-2bit"] .composite-inner-editor, html[data-theme="retro-2bit"] .composite-child-table { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .composite-impact-summary.is-quiet, html[data-theme="retro-2bit"] .composite-inner-editor-help { background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .composite-open-after-add-highlight { outline: 4px dashed var(--retro-ink) !important; outline-offset: 2px; } /* HEI desktop, mobile dashboard and recommendations */ html[data-theme="retro-2bit"] #heiPanel, html[data-theme="retro-2bit"] .hei-mobile-dashboard, html[data-theme="retro-2bit"] .hei-mobile-card, html[data-theme="retro-2bit"] .hei-mobile-total, html[data-theme="retro-2bit"] .hei-mobile-priority, html[data-theme="retro-2bit"] .hei-p1-component, html[data-theme="retro-2bit"] .hei-p1-action, html[data-theme="retro-2bit"] .hei-p2-grounding, html[data-theme="retro-2bit"] .hei-p2-profile-context, html[data-theme="retro-2bit"] .hei-p2-reliability { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #heiSummary, html[data-theme="retro-2bit"] .hei-mobile-dashboard-head, html[data-theme="retro-2bit"] .hei-mobile-total-head, html[data-theme="retro-2bit"] .hei-mobile-card__head, html[data-theme="retro-2bit"] .hei-mobile-indicator-title, html[data-theme="retro-2bit"] .hei-p1-heading, html[data-theme="retro-2bit"] .hei-p1-action-head { color: var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .hei-mobile-total-bar, html[data-theme="retro-2bit"] .hei-mobile-scorebar, html[data-theme="retro-2bit"] .hei-mobile-indicator-body, html[data-theme="retro-2bit"] .hei-p1-potential { height: 12px !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; overflow: hidden; } html[data-theme="retro-2bit"] .hei-mobile-total-bar i, html[data-theme="retro-2bit"] .hei-mobile-scorebar i, html[data-theme="retro-2bit"] .hei-mobile-indicator-body i, html[data-theme="retro-2bit"] .hei-p1-potential i, html[data-theme="retro-2bit"] [data-tone="ok"] i, html[data-theme="retro-2bit"] [data-tone="warn"] i, html[data-theme="retro-2bit"] [data-tone="bad"] i { border-radius: 0 !important; background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .hei-mobile-priority-rank, html[data-theme="retro-2bit"] .hei-mobile-card__score, html[data-theme="retro-2bit"] .hei-mobile-indicator-score { color: var(--retro-paper) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-ink) !important; } html[data-theme="retro-2bit"] #heiRecs .rec, html[data-theme="retro-2bit"] #heiRecs .rec.ok, html[data-theme="retro-2bit"] #heiRecs .rec.warn, html[data-theme="retro-2bit"] #heiRecs .rec.bad, html[data-theme="retro-2bit"] #heiRecs .rec-top, html[data-theme="retro-2bit"] .hei-p1-start, html[data-theme="retro-2bit"] .hei-p1-reason, html[data-theme="retro-2bit"] .hei-p1-calculation, html[data-theme="retro-2bit"] .hei-p1-method, html[data-theme="retro-2bit"] .hei-p1-all-fold { color: var(--retro-ink) !important; border: 2px solid var(--retro-dark) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] #heiRecs .rec.warn, html[data-theme="retro-2bit"] #heiRecs .rec.bad { background: var(--retro-stripes) !important; } /* Daily nutrient totals and data quality */ html[data-theme="retro-2bit"] #totalsSection, html[data-theme="retro-2bit"] .total-card, html[data-theme="retro-2bit"] .norms, html[data-theme="retro-2bit"] .micro-group-title, html[data-theme="retro-2bit"] .data-quality-card, html[data-theme="retro-2bit"] .data-quality-summary, html[data-theme="retro-2bit"] .data-quality-details, html[data-theme="retro-2bit"] .data-quality-metric, html[data-theme="retro-2bit"] .data-quality-note, html[data-theme="retro-2bit"] .data-quality-warning { color: var(--retro-ink) !important; border-color: var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .total-card, html[data-theme="retro-2bit"] .data-quality-card { box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .total-row, html[data-theme="retro-2bit"] .micro, html[data-theme="retro-2bit"] .data-quality-table tr { border-color: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .data-quality-meter { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .data-quality-meter > i { background: var(--retro-dark) !important; } /* Integrated analysis profile and matrix */ html[data-theme="retro-2bit"] #dietAnalysisProfilePanel, html[data-theme="retro-2bit"] .diet-analysis-card, html[data-theme="retro-2bit"] .diet-overview-card, html[data-theme="retro-2bit"] .diet-matrix-card, html[data-theme="retro-2bit"] .diet-clinical-map-card, html[data-theme="retro-2bit"] .diet-map-score-card, html[data-theme="retro-2bit"] .diet-interpretation-card, html[data-theme="retro-2bit"] .diet-domain-detail, html[data-theme="retro-2bit"] .diet-limiter-panel, html[data-theme="retro-2bit"] .diet-personal-plan, html[data-theme="retro-2bit"] .diet-personal-item, html[data-theme="retro-2bit"] .diet-step-card, html[data-theme="retro-2bit"] .diet-method-facts, html[data-theme="retro-2bit"] .diet-context-help, html[data-theme="retro-2bit"] .diet-plant-balance-help, html[data-theme="retro-2bit"] .diet-matrix-inspect-accordion, html[data-theme="retro-2bit"] .diet-matrix-zone-explain { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-analysis-head, html[data-theme="retro-2bit"] .diet-overview-kicker, html[data-theme="retro-2bit"] .diet-map-topline, html[data-theme="retro-2bit"] .diet-map-summary-strip, html[data-theme="retro-2bit"] .diet-matrix-inspect-accordion > summary, html[data-theme="retro-2bit"] .diet-method-facts > summary, html[data-theme="retro-2bit"] .diet-context-help > summary, html[data-theme="retro-2bit"] .diet-plant-balance-help > summary { color: var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .diet-overview-metric, html[data-theme="retro-2bit"] .diet-map-score-card, html[data-theme="retro-2bit"] .diet-matrix-axis-pill, html[data-theme="retro-2bit"] .diet-matrix-projection-badge, html[data-theme="retro-2bit"] .diet-domain-status, html[data-theme="retro-2bit"] .diet-acc-metric, html[data-theme="retro-2bit"] .diet-reliability-compact, html[data-theme="retro-2bit"] .diet-point-passport { color: var(--retro-ink) !important; border: 2px solid var(--retro-dark) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540, html[data-theme="retro-2bit"] .diet-matrix-grid-v5337, html[data-theme="retro-2bit"] .diet-matrix-grid-v5338 { border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; background: linear-gradient(90deg, transparent 49.5%, var(--retro-dark) 49.5% 50.5%, transparent 50.5%), linear-gradient(transparent 49.5%, var(--retro-dark) 49.5% 50.5%, transparent 50.5%), repeating-linear-gradient(135deg, var(--retro-paper) 0 8px, var(--retro-light) 8px 9px) !important; box-shadow: 5px 5px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540::before, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540::after, html[data-theme="retro-2bit"] .diet-matrix-threshold, html[data-theme="retro-2bit"] .diet-matrix-threshold-v5337, html[data-theme="retro-2bit"] .diet-matrix-projection-line { border-color: var(--retro-dark) !important; background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-matrix-zone-q, html[data-theme="retro-2bit"] .diet-matrix-zone-q b, html[data-theme="retro-2bit"] .diet-matrix-axis-label, html[data-theme="retro-2bit"] .diet-matrix-x-scale, html[data-theme="retro-2bit"] .diet-matrix-y-scale, html[data-theme="retro-2bit"] .diet-matrix-point-caption-v5337 { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] .diet-matrix-point-v5337, html[data-theme="retro-2bit"] .diet-matrix-point { width: 24px !important; height: 24px !important; border: 4px solid var(--retro-paper) !important; border-radius: 0 !important; background: var(--retro-ink) !important; box-shadow: 0 0 0 3px var(--retro-ink), 5px 5px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-domain-track, html[data-theme="retro-2bit"] .diet-acc-microbar, html[data-theme="retro-2bit"] .diet-reliability-meter, html[data-theme="retro-2bit"] .diet-limiter-meter { border: 1px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .diet-domain-fill, html[data-theme="retro-2bit"] .diet-acc-microbar > i, html[data-theme="retro-2bit"] .diet-reliability-meter > i, html[data-theme="retro-2bit"] .diet-limiter-meter > i { border-radius: 0 !important; background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-matrix-insight-v540, html[data-theme="retro-2bit"] .diet-matrix-reading-v5337, html[data-theme="retro-2bit"] .diet-personal-note, html[data-theme="retro-2bit"] .diet-personal-narrative, html[data-theme="retro-2bit"] .diet-domain-placeholder { color: var(--retro-ink) !important; border-color: var(--retro-dark) !important; border-radius: 0 !important; background: var(--retro-stripes) !important; } /* Harvard plate */ html[data-theme="retro-2bit"] #harvardPlatePanel, html[data-theme="retro-2bit"] .harvard-plate-card, html[data-theme="retro-2bit"] .harvard-plate-visual-wrap, html[data-theme="retro-2bit"] .harvard-plate-status, html[data-theme="retro-2bit"] .harvard-plate-companion, html[data-theme="retro-2bit"] .harvard-plate-explain, html[data-theme="retro-2bit"] .harvard-plate-diagnostics, html[data-theme="retro-2bit"] .harvard-hei-bridge, html[data-theme="retro-2bit"] .hp-sector-card, html[data-theme="retro-2bit"] .hp-active-panel { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .harvard-plate-head, html[data-theme="retro-2bit"] .harvard-plate-explain > summary, html[data-theme="retro-2bit"] .harvard-plate-diagnostics > summary, html[data-theme="retro-2bit"] .hp-active-panel h3 { color: var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .harvard-plate-visual { border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-dither-25) !important; box-shadow: inset 0 0 0 3px var(--retro-paper) !important; } html[data-theme="retro-2bit"] .harvard-plate-svg-shell { border: 2px solid var(--retro-dark) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .harvard-plate-score-ring { border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; color: var(--retro-ink) !important; text-shadow: 1px 1px 0 var(--retro-paper), -1px -1px 0 var(--retro-paper), 1px -1px 0 var(--retro-paper), -1px 1px 0 var(--retro-paper); background: linear-gradient(to top, var(--retro-ink) calc(var(--plate-score, 0) * 1%), var(--retro-light) 0) !important; box-shadow: inset 0 0 0 5px var(--retro-paper), 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .hp-active-bar, html[data-theme="retro-2bit"] .hpacc-bar, html[data-theme="retro-2bit"] .hhb-bar, html[data-theme="retro-2bit"] .hpwi-bar, html[data-theme="retro-2bit"] .rbs-bar { border: 1px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .hp-active-bar span, html[data-theme="retro-2bit"] .hpacc-bar i, html[data-theme="retro-2bit"] .hhb-bar i, html[data-theme="retro-2bit"] .hpwi-bar i, html[data-theme="retro-2bit"] .rbs-bar i { border-radius: 0 !important; background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .harvard-plate-visual svg, html[data-theme="retro-2bit"] .harvard-plate-companion svg, html[data-theme="retro-2bit"] .nr-harvard-svg { filter: grayscale(1) contrast(1.25); } html[data-theme="retro-2bit"] .harvard-plate-empty, html[data-theme="retro-2bit"] .harvard-plate-stage-empty, html[data-theme="retro-2bit"] .harvard-plate-auto-note { color: var(--retro-ink) !important; border: 2px dashed var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } /* Gemini explanation and multimodal ration import */ html[data-theme="retro-2bit"] #geminiAiSection, html[data-theme="retro-2bit"] #geminiRationImportSection, html[data-theme="retro-2bit"] .gemini-ai-output, html[data-theme="retro-2bit"] .gemini-ai-group, html[data-theme="retro-2bit"] .gemini-ai-item, html[data-theme="retro-2bit"] .gemini-ai-strategy, html[data-theme="retro-2bit"] .gemini-ai-summary, html[data-theme="retro-2bit"] .gemini-ai-offline, html[data-theme="retro-2bit"] .gemini-ai-plain-text, html[data-theme="retro-2bit"] .gemini-ration-draft, html[data-theme="retro-2bit"] .gemini-ration-media-card, html[data-theme="retro-2bit"] .gemini-ration-draft-row, html[data-theme="retro-2bit"] .gemini-ration-raw-text, html[data-theme="retro-2bit"] .gemini-ration-draft-row__package { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .gemini-ai-head, html[data-theme="retro-2bit"] .gemini-ration-import__head, html[data-theme="retro-2bit"] .gemini-ration-draft__head, html[data-theme="retro-2bit"] .gemini-ai-strategy--primary { color: var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .gemini-ai-kicker, html[data-theme="retro-2bit"] .gemini-ration-import__kicker, html[data-theme="retro-2bit"] .gemini-ai-intro, html[data-theme="retro-2bit"] .gemini-ai-value, html[data-theme="retro-2bit"] .gemini-ai-meta, html[data-theme="retro-2bit"] .gemini-ration-import__intro, html[data-theme="retro-2bit"] .gemini-ration-import__limits, html[data-theme="retro-2bit"] .gemini-ration-draft-row__meta, html[data-theme="retro-2bit"] .gemini-ration-draft-row__match, html[data-theme="retro-2bit"] .gemini-ration-raw-text__body { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] .gemini-ai-privacy, html[data-theme="retro-2bit"] .gemini-ration-import__privacy, html[data-theme="retro-2bit"] .gemini-ration-draft__warnings, html[data-theme="retro-2bit"] .gemini-ration-draft__sources, html[data-theme="retro-2bit"] .gemini-ai-caution, html[data-theme="retro-2bit"] .gemini-ai-strategy--caution { color: var(--retro-ink) !important; border: 2px dashed var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-stripes) !important; } html[data-theme="retro-2bit"] .gemini-ration-media-card > img, html[data-theme="retro-2bit"] .gemini-ration-media-card__audio { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; image-rendering: auto; } html[data-theme="retro-2bit"] .gemini-ai-progress, html[data-theme="retro-2bit"] .gemini-ration-import__progress { gap: 4px; } html[data-theme="retro-2bit"] .gemini-ai-progress span, html[data-theme="retro-2bit"] .gemini-ration-import__progress span { height: 10px !important; border: 1px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .gemini-ai-progress span::after, html[data-theme="retro-2bit"] .gemini-ration-import__progress[data-step="1"] span:nth-child(-n+1), html[data-theme="retro-2bit"] .gemini-ration-import__progress[data-step="2"] span:nth-child(-n+2), html[data-theme="retro-2bit"] .gemini-ration-import__progress[data-step="3"] span:nth-child(-n+3), html[data-theme="retro-2bit"] .gemini-ration-import__progress[data-step="4"] span:nth-child(-n+4), html[data-theme="retro-2bit"] .gemini-ration-import__progress[data-step="5"] span:nth-child(-n+5) { background: var(--retro-ink) !important; } /* Additional tools, catalog and meal planner */ html[data-theme="retro-2bit"] .additional-tools, html[data-theme="retro-2bit"] .catalog-drawer, html[data-theme="retro-2bit"] .meal-planner-drawer, html[data-theme="retro-2bit"] .meal-slot, html[data-theme="retro-2bit"] .meal-item, html[data-theme="retro-2bit"] .meal-day-summary, html[data-theme="retro-2bit"] .meal-stale-box, html[data-theme="retro-2bit"] .meal-empty-state, html[data-theme="retro-2bit"] .meal-unassigned, html[data-theme="retro-2bit"] .meal-split-box { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .additional-tools > summary, html[data-theme="retro-2bit"] .catalog-drawer > summary, html[data-theme="retro-2bit"] .meal-planner-drawer > summary, html[data-theme="retro-2bit"] .meal-slot-head, html[data-theme="retro-2bit"] .meal-day-summary-head, html[data-theme="retro-2bit"] .meal-why > summary { color: var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .meal-slot--ok, html[data-theme="retro-2bit"] .meal-slot--warn, html[data-theme="retro-2bit"] .meal-slot--bad, html[data-theme="retro-2bit"] .meal-status--ok, html[data-theme="retro-2bit"] .meal-status--warn, html[data-theme="retro-2bit"] .meal-status--bad { color: var(--retro-ink) !important; border-color: var(--retro-ink) !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .meal-slot--warn, html[data-theme="retro-2bit"] .meal-slot--bad, html[data-theme="retro-2bit"] .meal-warnings, html[data-theme="retro-2bit"] .meal-stale-box { background: var(--retro-stripes) !important; } /* Fixed/global actions and service panels */ html[data-theme="retro-2bit"] #globalActions, html[data-theme="retro-2bit"] .ui-ration-tools, html[data-theme="retro-2bit"] .dev-panel { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 5px 5px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .spinner, html[data-theme="retro-2bit"] [class*="spinner"] { border-color: var(--retro-light) !important; border-top-color: var(--retro-ink) !important; border-radius: 0 !important; } /* Mobile: keep information dense but touch-safe, with no horizontal overflow. */ @media (max-width: 760px) { html[data-theme="retro-2bit"] .search-main-grid, html[data-theme="retro-2bit"] .harvard-plate-layout, html[data-theme="retro-2bit"] .diet-analysis-grid, html[data-theme="retro-2bit"] .diet-overview-metrics, html[data-theme="retro-2bit"] .diet-map-summary-strip, html[data-theme="retro-2bit"] .gemini-ai-columns, html[data-theme="retro-2bit"] .gemini-ai-strategy-grid, html[data-theme="retro-2bit"] .meal-grid { grid-template-columns: 1fr !important; } html[data-theme="retro-2bit"] .mobile-results-anchor #globalResults.search-results-enhanced.has-query { left: 8px !important; right: 8px !important; width: auto !important; border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 7px 7px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .mobile-results-anchor #globalResults.search-results-enhanced.has-query::before { color: var(--retro-paper) !important; background: var(--retro-ink) !important; border-radius: 0 !important; } html[data-theme="retro-2bit"] .search-result-card, html[data-theme="retro-2bit"] .gemini-ration-media-card, html[data-theme="retro-2bit"] .gemini-ration-draft-row, html[data-theme="retro-2bit"] .meal-item { box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .ration-table thead { color: var(--retro-paper) !important; background: var(--retro-ink) !important; } html[data-theme="retro-2bit"] .ration-row, html[data-theme="retro-2bit"] .ration-details, html[data-theme="retro-2bit"] .composite-folder-row, html[data-theme="retro-2bit"] .composite-folder-details-row { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540, html[data-theme="retro-2bit"] .diet-matrix-grid-v5337, html[data-theme="retro-2bit"] .diet-matrix-grid-v5338 { min-width: 0 !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .harvard-plate-companions { grid-template-columns: 1fr !important; } html[data-theme="retro-2bit"] dialog, html[data-theme="retro-2bit"] .norm-region-help-dialog { width: calc(100vw - 16px) !important; max-width: calc(100vw - 16px) !important; max-height: calc(100svh - 16px) !important; margin: 8px !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #globalActions, html[data-theme="retro-2bit"] .ui-ration-tools { left: 8px !important; right: 8px !important; bottom: 8px !important; width: auto !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] button, html[data-theme="retro-2bit"] .btn, html[data-theme="retro-2bit"] input, html[data-theme="retro-2bit"] select, html[data-theme="retro-2bit"] textarea { min-height: 44px; } html[data-theme="retro-2bit"] .icon-btn, html[data-theme="retro-2bit"] .close-btn { min-width: 40px; min-height: 40px; } } @media (prefers-contrast: more) { html[data-theme="retro-2bit"] .card, html[data-theme="retro-2bit"] button, html[data-theme="retro-2bit"] input, html[data-theme="retro-2bit"] select, html[data-theme="retro-2bit"] textarea, html[data-theme="retro-2bit"] dialog { border-width: 3px !important; } } } /* ===== END theme-retro-2bit-v2.css ===== */ /* ===== BEGIN theme-retro-2bit-v3.css sha256=d18666fcf2a5ee5433225a23f5e93f8412115a20904813c01fd98fda3ee5a737 ===== */ /* nutrition calculator v5.3.148 — 2-bit retro graphics, loader and indicators, pass 3 Screen-only visual layer. The DOM decorator adds data-retro-icon attributes only. No calculation, product, HEI, profile or ration state is read or changed. */ @media screen { html[data-theme="retro-2bit"] { --retro-icon-sprite: url("../icons/retro-2bit-icons-v1.png"); --retro-loader-sprite: url("../loader/loader-sprite-sheet-retro-2bit-v5.3.148.png"); --retro-checker: repeating-conic-gradient(var(--retro-paper) 0 25%, var(--retro-light) 0 50%) 0 0 / 8px 8px; } html[data-theme="retro-2bit"] [data-retro-icon]::before, html[data-theme="retro-2bit"] [data-retro-section-icon]::before { content:""; display:inline-block; width:16px; height:16px; flex:0 0 16px; margin-inline-end:7px; vertical-align:-3px; background-image:var(--retro-icon-sprite); background-repeat:no-repeat; background-size:80px 64px; background-position:var(--retro-icon-position,0 0); image-rendering:pixelated; image-rendering:crisp-edges; } html[data-theme="retro-2bit"] [data-retro-icon="info"], html[data-theme="retro-2bit"] [data-retro-icon="close"] { --retro-icon-position:0 0; } html[data-theme="retro-2bit"] [data-retro-icon="close"] { --retro-icon-position:-16px 0; } html[data-theme="retro-2bit"] [data-retro-icon="search"] { --retro-icon-position:-32px 0; } html[data-theme="retro-2bit"] [data-retro-icon="add"] { --retro-icon-position:-48px 0; } html[data-theme="retro-2bit"] [data-retro-icon="remove"] { --retro-icon-position:-64px 0; } html[data-theme="retro-2bit"] [data-retro-icon="edit"] { --retro-icon-position:0 -16px; } html[data-theme="retro-2bit"] [data-retro-icon="print"] { --retro-icon-position:-16px -16px; } html[data-theme="retro-2bit"] [data-retro-icon="pdf"] { --retro-icon-position:-32px -16px; } html[data-theme="retro-2bit"] [data-retro-icon="calculate"] { --retro-icon-position:-48px -16px; } html[data-theme="retro-2bit"] [data-retro-icon="ration"] { --retro-icon-position:-64px -16px; } html[data-theme="retro-2bit"] [data-retro-icon="hei"] { --retro-icon-position:0 -32px; } html[data-theme="retro-2bit"] [data-retro-icon="norms"] { --retro-icon-position:-16px -32px; } html[data-theme="retro-2bit"] [data-retro-icon="matrix"] { --retro-icon-position:-32px -32px; } html[data-theme="retro-2bit"] [data-retro-icon="plate"] { --retro-icon-position:-48px -32px; } html[data-theme="retro-2bit"] [data-retro-icon="ai"] { --retro-icon-position:-64px -32px; } html[data-theme="retro-2bit"] [data-retro-icon="upload"] { --retro-icon-position:0 -48px; } html[data-theme="retro-2bit"] [data-retro-icon="camera"] { --retro-icon-position:-16px -48px; } html[data-theme="retro-2bit"] [data-retro-icon="audio"] { --retro-icon-position:-32px -48px; } html[data-theme="retro-2bit"] [data-retro-icon="reset"] { --retro-icon-position:-48px -48px; } html[data-theme="retro-2bit"] [data-retro-icon="check"] { --retro-icon-position:-64px -48px; } html[data-theme="retro-2bit"] button[data-retro-icon], html[data-theme="retro-2bit"] .btn[data-retro-icon], html[data-theme="retro-2bit"] [role="button"][data-retro-icon] { display:inline-flex; align-items:center; justify-content:center; gap:0; } html[data-theme="retro-2bit"] button[data-retro-icon]:not(.secondary):not(.ghost)::before, html[data-theme="retro-2bit"] .btn[data-retro-icon]:not(.secondary):not(.ghost)::before { filter:invert(1); } html[data-theme="retro-2bit"] button[data-retro-icon].secondary::before, html[data-theme="retro-2bit"] button[data-retro-icon].ghost::before, html[data-theme="retro-2bit"] .btn[data-retro-icon].secondary::before, html[data-theme="retro-2bit"] .btn[data-retro-icon].ghost::before { filter:none; } html[data-theme="retro-2bit"] .retro-icon-only { position:relative; width:40px !important; min-width:40px !important; padding:0 !important; overflow:hidden; color:transparent !important; text-shadow:none !important; } html[data-theme="retro-2bit"] .retro-icon-only > * { visibility:hidden !important; } html[data-theme="retro-2bit"] .retro-icon-only::before { position:absolute; inset:50% auto auto 50%; margin:0; transform:translate(-50%,-50%); visibility:visible; } html[data-theme="retro-2bit"] [data-retro-section-icon] { display:flex; align-items:center; gap:0; } html[data-theme="retro-2bit"] [data-retro-section-icon]::before { width:20px; height:20px; flex-basis:20px; background-size:100px 80px; background-position:var(--retro-section-icon-position,0 0); } html[data-theme="retro-2bit"] [data-retro-section-icon="calculate"] { --retro-section-icon-position:-60px -20px; } html[data-theme="retro-2bit"] [data-retro-section-icon="search"] { --retro-section-icon-position:-40px 0; } html[data-theme="retro-2bit"] [data-retro-section-icon="ration"] { --retro-section-icon-position:-80px -20px; } html[data-theme="retro-2bit"] [data-retro-section-icon="hei"] { --retro-section-icon-position:0 -40px; } html[data-theme="retro-2bit"] [data-retro-section-icon="norms"] { --retro-section-icon-position:-20px -40px; } html[data-theme="retro-2bit"] [data-retro-section-icon="matrix"] { --retro-section-icon-position:-40px -40px; } html[data-theme="retro-2bit"] [data-retro-section-icon="plate"] { --retro-section-icon-position:-60px -40px; } html[data-theme="retro-2bit"] [data-retro-section-icon="ai"] { --retro-section-icon-position:-80px -40px; } html[data-theme="retro-2bit"] [data-retro-section-icon="print"] { --retro-section-icon-position:-20px -20px; } html[data-theme="retro-2bit"] input[type="checkbox"], html[data-theme="retro-2bit"] input[type="radio"] { appearance:none; -webkit-appearance:none; width:18px; height:18px; min-width:18px; margin:0 7px 0 0; border:2px solid var(--retro-ink); border-radius:0; background:var(--retro-paper); box-shadow:2px 2px 0 var(--retro-dark); vertical-align:-4px; } html[data-theme="retro-2bit"] input[type="radio"] { border-radius:50%; } html[data-theme="retro-2bit"] input[type="checkbox"]:checked, html[data-theme="retro-2bit"] input[type="radio"]:checked { background: linear-gradient(var(--retro-paper),var(--retro-paper)) center / 6px 6px no-repeat, var(--retro-ink); } html[data-theme="retro-2bit"] input[type="checkbox"]:focus-visible, html[data-theme="retro-2bit"] input[type="radio"]:focus-visible { outline:3px double var(--retro-ink); outline-offset:3px; } html[data-theme="retro-2bit"] .progress, html[data-theme="retro-2bit"] .hei-mobile-total-bar, html[data-theme="retro-2bit"] .diet-domain-track, html[data-theme="retro-2bit"] .gemini-ai-progress, html[data-theme="retro-2bit"] .gemini-ration-import__progress { background-image:repeating-linear-gradient(90deg,transparent 0 7px,var(--retro-light) 7px 9px) !important; image-rendering:pixelated; } html[data-theme="retro-2bit"] .progress .bar, html[data-theme="retro-2bit"] .hei-mobile-total-bar i, html[data-theme="retro-2bit"] .diet-domain-fill { background-image:repeating-linear-gradient(90deg,var(--retro-ink) 0 6px,var(--retro-dark) 6px 8px) !important; } html[data-theme="retro-2bit"] .gemini-ai-progress span, html[data-theme="retro-2bit"] .gemini-ration-import__progress span, html[data-theme="retro-2bit"] .needs-age-profile-progress-track i { clip-path:polygon(0 0,100% 0,100% 75%,75% 75%,75% 100%,0 100%); } html[data-theme="retro-2bit"] .diet-matrix-point-v5337, html[data-theme="retro-2bit"] .diet-matrix-point, html[data-theme="retro-2bit"] [class*="matrix-point"] { border:3px solid var(--retro-ink) !important; background:var(--retro-paper) !important; box-shadow:0 0 0 3px var(--retro-light),5px 5px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-matrix-point-v5337::before, html[data-theme="retro-2bit"] .diet-matrix-point-v5337::after { content:""; position:absolute; background:var(--retro-ink); pointer-events:none; } html[data-theme="retro-2bit"] .diet-matrix-point-v5337::before { width:2px;height:18px;left:50%;top:50%;transform:translate(-50%,-50%); } html[data-theme="retro-2bit"] .diet-matrix-point-v5337::after { width:18px;height:2px;left:50%;top:50%;transform:translate(-50%,-50%); } html[data-theme="retro-2bit"] .harvard-plate-score-ring, html[data-theme="retro-2bit"] [class*="score-ring"] { background:var(--retro-checker) !important; border:4px solid var(--retro-ink) !important; } html[data-theme="retro-2bit"] .alert::before, html[data-theme="retro-2bit"] [data-retro-state-glyph]::before { content:attr(data-retro-state-glyph); display:inline-grid; place-items:center; width:18px; height:18px; margin-inline-end:7px; border:2px solid currentColor; font:900 12px/1 ui-monospace,monospace; vertical-align:middle; } /* Theme-specific loader: the runtime stages and real progress remain unchanged. */ html[data-theme="retro-2bit"] #runtimeBootStatusOverlay { background:var(--retro-checker) !important; backdrop-filter:none !important; transition:opacity 120ms steps(2,end),visibility 120ms steps(2,end) !important; } html[data-theme="retro-2bit"] #runtimeBootStatus { color:var(--retro-ink) !important; border:4px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-paper) !important; box-shadow:10px 10px 0 var(--retro-dark) !important; font-family:ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace !important; } html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-figure { border:3px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-light) !important; box-shadow:inset 0 0 0 4px var(--retro-paper),4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-sprite { background-image:var(--retro-loader-sprite) !important; image-rendering:pixelated !important; filter:contrast(1.08); } html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-title, html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-primary, html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-percent { color:var(--retro-ink) !important; } html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-secondary, html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-foot, html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-step { color:var(--retro-dark) !important; } html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-stage { color:var(--retro-paper) !important; border:2px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-ink) !important; box-shadow:3px 3px 0 var(--retro-dark); } html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-cell { height:16px !important; border:2px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-paper) !important; } html[data-theme="retro-2bit"] #runtimeBootStatus .rbs-cell.on { background:var(--retro-ink) !important; box-shadow:inset -3px -3px 0 var(--retro-dark); } html[data-theme="retro-2bit"] #runtimeBootStatus[data-kind="error"] { color:var(--retro-paper) !important; background:var(--retro-dark) !important; } html[data-theme="retro-2bit"] #runtimeBootStatus[data-kind="error"] .rbs-title, html[data-theme="retro-2bit"] #runtimeBootStatus[data-kind="error"] .rbs-primary, html[data-theme="retro-2bit"] #runtimeBootStatus[data-kind="error"] .rbs-secondary, html[data-theme="retro-2bit"] #runtimeBootStatus[data-kind="error"] .rbs-foot, html[data-theme="retro-2bit"] #runtimeBootStatus[data-kind="error"] .rbs-percent, html[data-theme="retro-2bit"] #runtimeBootStatus[data-kind="error"] .rbs-step { color:var(--retro-paper) !important; } html[data-theme="retro-2bit"] .needs-first-toast.is-loader-handoff .needs-first-toast-card { border-radius:0 !important; border:3px solid var(--retro-ink) !important; background:var(--retro-paper) !important; box-shadow:6px 6px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .needs-first-step-icon { border-radius:0 !important; border:2px solid var(--retro-ink) !important; background:var(--retro-light) !important; box-shadow:3px 3px 0 var(--retro-dark) !important; } @media (prefers-reduced-motion:reduce) { html[data-theme="retro-2bit"] #runtimeBootStatusOverlay, html[data-theme="retro-2bit"] button, html[data-theme="retro-2bit"] .btn { transition:none !important; animation:none !important; } } @media (max-width:760px) { html[data-theme="retro-2bit"] [data-retro-section-icon]::before { width:18px;height:18px;flex-basis:18px;background-size:90px 72px; } html[data-theme="retro-2bit"] .retro-icon-only { width:44px !important;min-width:44px !important; } html[data-theme="retro-2bit"] #runtimeBootStatus { box-shadow:6px 6px 0 var(--retro-dark) !important; } } } /* ===== END theme-retro-2bit-v3.css ===== */ /* ===== BEGIN theme-retro-2bit-v4.css sha256=02e738940172fde4077c0b9cd14559faa04e2c81225dd60d3f2ebe0f8daf3d64 ===== */ /* nutrition calculator v5.3.149 — 2-bit final regression hardening, pass 4 Scope: accessibility, focus, touch ergonomics and overflow safeguards. No calculation, state or report data rules are present. */ @media screen { html[data-theme="retro-2bit"] input[readonly]:not(:disabled), html[data-theme="retro-2bit"] textarea[readonly]:not(:disabled) { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] a[href]:focus-visible, html[data-theme="retro-2bit"] [role="button"]:focus-visible, html[data-theme="retro-2bit"] [tabindex]:not([tabindex="-1"]):focus-visible { outline: 3px dashed var(--retro-ink) !important; outline-offset: 3px !important; box-shadow: none !important; } html[data-theme="retro-2bit"] button, html[data-theme="retro-2bit"] .btn, html[data-theme="retro-2bit"] [role="button"], html[data-theme="retro-2bit"] .theme-switcher__button { touch-action: manipulation; } html[data-theme="retro-2bit"] #needsCompact, html[data-theme="retro-2bit"] #globalSearchSection, html[data-theme="retro-2bit"] #rationSection, html[data-theme="retro-2bit"] #heiPanel, html[data-theme="retro-2bit"] #totalsSection { scroll-margin-top: 12px; } @media (max-width: 760px) { html[data-theme="retro-2bit"] .theme-switcher__button, html[data-theme="retro-2bit"] .retro-icon-only, html[data-theme="retro-2bit"] .icon-btn, html[data-theme="retro-2bit"] .close-btn { min-width: 44px !important; min-height: 44px !important; } html[data-theme="retro-2bit"] .card, html[data-theme="retro-2bit"] .accordion-body, html[data-theme="retro-2bit"] details, html[data-theme="retro-2bit"] dialog, html[data-theme="retro-2bit"] td, html[data-theme="retro-2bit"] th { overflow-wrap: anywhere; } } @media (forced-colors: active) { html[data-theme="retro-2bit"] button, html[data-theme="retro-2bit"] .btn, html[data-theme="retro-2bit"] input, html[data-theme="retro-2bit"] select, html[data-theme="retro-2bit"] textarea, html[data-theme="retro-2bit"] .card, html[data-theme="retro-2bit"] dialog { forced-color-adjust: auto; } } } /* ===== END theme-retro-2bit-v4.css ===== */ /* ===== BEGIN theme-retro-2bit-v5.css sha256=10cc03c4c7523122ae413d84912c11fc30b1a32a292db8d292bd07b245199755 ===== */ /* nutrition calculator v5.3.150 — 2-bit retro completion pass 5 Scope: screen-only completion layer for monochrome fidelity, matrix/plate flattening, Gemini/search controls, mini-cart and mobile overflow fixes. No calculation or product data logic. */ @media screen { html[data-theme="retro-2bit"] { --retro-shadow-heavy: 6px 6px 0 var(--retro-dark); --retro-shadow-soft: 4px 4px 0 var(--retro-dark); } /* Force the main action system into the 4-tone palette. */ html[data-theme="retro-2bit"] button, html[data-theme="retro-2bit"] .btn, html[data-theme="retro-2bit"] input[type="button"], html[data-theme="retro-2bit"] input[type="submit"], html[data-theme="retro-2bit"] .diet-matrix-actions button, html[data-theme="retro-2bit"] .diet-matrix-control-chips button, html[data-theme="retro-2bit"] .hpapply-actions button, html[data-theme="retro-2bit"] .gemini-ration-import__actions > button, html[data-theme="retro-2bit"] .gemini-ration-import__upload-row > button, html[data-theme="retro-2bit"] .gemini-ration-draft__actions > button, html[data-theme="retro-2bit"] .v40-mini-cart button { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-ink) !important; color: var(--retro-paper) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; text-shadow: none !important; } html[data-theme="retro-2bit"] button:hover, html[data-theme="retro-2bit"] .btn:hover, html[data-theme="retro-2bit"] input[type="button"]:hover, html[data-theme="retro-2bit"] input[type="submit"]:hover, html[data-theme="retro-2bit"] .diet-matrix-actions button:hover, html[data-theme="retro-2bit"] .diet-matrix-control-chips button:hover, html[data-theme="retro-2bit"] .hpapply-actions button:hover, html[data-theme="retro-2bit"] .gemini-ration-import__actions > button:hover, html[data-theme="retro-2bit"] .gemini-ration-import__upload-row > button:hover, html[data-theme="retro-2bit"] .gemini-ration-draft__actions > button:hover, html[data-theme="retro-2bit"] .v40-mini-cart button:hover { background: var(--retro-dark) !important; color: var(--retro-paper) !important; } html[data-theme="retro-2bit"] button.secondary, html[data-theme="retro-2bit"] button.ghost, html[data-theme="retro-2bit"] .btn.secondary, html[data-theme="retro-2bit"] .btn.ghost, html[data-theme="retro-2bit"] .diet-matrix-axis, html[data-theme="retro-2bit"] .diet-matrix-threshold-button, html[data-theme="retro-2bit"] .theme-switcher__button, html[data-theme="retro-2bit"] .v40-mini-cart button.secondary, html[data-theme="retro-2bit"] .gemini-ration-media-card button.secondary, html[data-theme="retro-2bit"] .gemini-ration-draft-row > button.secondary, html[data-theme="retro-2bit"] .hp-sector-card button { background: var(--retro-paper) !important; color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] button:disabled, html[data-theme="retro-2bit"] .btn:disabled, html[data-theme="retro-2bit"] input[type="button"]:disabled, html[data-theme="retro-2bit"] input[type="submit"]:disabled { background: var(--retro-light) !important; color: var(--retro-dark) !important; border-color: var(--retro-dark) !important; box-shadow: 2px 2px 0 var(--retro-light) !important; opacity: 1 !important; } html[data-theme="retro-2bit"] .seg button.active, html[data-theme="retro-2bit"] .theme-switcher__button[aria-pressed="true"] { background: var(--retro-ink) !important; color: var(--retro-paper) !important; box-shadow: none !important; } /* Replace remaining blue helper surfaces. */ html[data-theme="retro-2bit"] .v40-mini-cart, html[data-theme="retro-2bit"] .search-db-count, html[data-theme="retro-2bit"] .diet-matrix-score-badge, html[data-theme="retro-2bit"] .diet-matrix-axis, html[data-theme="retro-2bit"] .diet-matrix-threshold-button, html[data-theme="retro-2bit"] .diet-profile-personal-bridge, html[data-theme="retro-2bit"] .diet-profile-personal-tags span, html[data-theme="retro-2bit"] .diet-profile-personal-nutrients span, html[data-theme="retro-2bit"] .composite-search-badge, html[data-theme="retro-2bit"] .composite-search-flags span, html[data-theme="retro-2bit"] .chip, html[data-theme="retro-2bit"] .needs-age-profile-head span, html[data-theme="retro-2bit"] .harvard-plate-auto-note, html[data-theme="retro-2bit"] .hp-plate-summary-line, html[data-theme="retro-2bit"] .hp-quality-card, html[data-theme="retro-2bit"] .hp-diagnostic-chips span, html[data-theme="retro-2bit"] .hp-diagnostic-bridge, html[data-theme="retro-2bit"] .hp-diagnostic-action, html[data-theme="retro-2bit"] .nr-first-step, html[data-theme="retro-2bit"] .hei-p1-order, html[data-theme="retro-2bit"] .hei-p1-potential, html[data-theme="retro-2bit"] .hei-p1-step, html[data-theme="retro-2bit"] .hei-p1-chips span, html[data-theme="retro-2bit"] .hei-p1-all-fold > summary b { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 2px 2px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .v40-mini-cart { border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: var(--retro-shadow-heavy) !important; } html[data-theme="retro-2bit"] .v40-mini-cart-text, html[data-theme="retro-2bit"] .v40-mini-cart strong, html[data-theme="retro-2bit"] .v40-mini-cart span { color: var(--retro-ink) !important; } /* Section headings and pixel icons should stay inside the card on mobile. */ html[data-theme="retro-2bit"] [data-retro-section-icon] { display: flex !important; align-items: flex-start !important; min-width: 0 !important; padding-inline-start: 2px !important; } html[data-theme="retro-2bit"] [data-retro-section-icon]::before { margin-inline-end: 8px !important; margin-top: .14em !important; flex: 0 0 20px !important; } html[data-theme="retro-2bit"] button[data-retro-icon], html[data-theme="retro-2bit"] .btn[data-retro-icon] { overflow: hidden; padding-inline: 12px !important; } html[data-theme="retro-2bit"] button[data-retro-icon]::before, html[data-theme="retro-2bit"] .btn[data-retro-icon]::before { margin-inline-end: 6px !important; flex-shrink: 0 !important; } /* Gemini ration import: flatten modern accents. */ html[data-theme="retro-2bit"] .gemini-ration-import, html[data-theme="retro-2bit"] .gemini-ration-media-card, html[data-theme="retro-2bit"] .gemini-ration-draft-row, html[data-theme="retro-2bit"] .gemini-ration-draft, html[data-theme="retro-2bit"] .gemini-ration-draft-row__package, html[data-theme="retro-2bit"] .gemini-ration-raw-text, html[data-theme="retro-2bit"] .gemini-ration-import__privacy, html[data-theme="retro-2bit"] .gemini-ration-draft__warnings, html[data-theme="retro-2bit"] .gemini-ration-draft__sources { border-radius: 0 !important; box-shadow: var(--retro-shadow-soft) !important; } html[data-theme="retro-2bit"] .gemini-ration-import__head, html[data-theme="retro-2bit"] .gemini-ration-draft__head, html[data-theme="retro-2bit"] .gemini-ration-import__badge { color: var(--retro-ink) !important; background: var(--retro-light) !important; } /* Matrix and analysis profile: replace remaining glossy/blue pieces. */ html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix, html[data-theme="retro-2bit"] .diet-matrix { border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; background: linear-gradient(90deg, transparent 49.5%, var(--retro-dark) 49.5% 50.5%, transparent 50.5%), linear-gradient(transparent 49.5%, var(--retro-dark) 49.5% 50.5%, transparent 50.5%), linear-gradient(90deg, var(--retro-light) 1px, transparent 1px), linear-gradient(var(--retro-light) 1px, transparent 1px), var(--retro-paper) !important; background-size: 100% 100%, 100% 100%, 10% 10%, 10% 10%, auto !important; box-shadow: 5px 5px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix::before, html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix::after, html[data-theme="retro-2bit"] .diet-matrix::before, html[data-theme="retro-2bit"] .diet-matrix::after, html[data-theme="retro-2bit"] .diet-matrix-threshold, html[data-theme="retro-2bit"] .diet-matrix-projection, html[data-theme="retro-2bit"] .diet-matrix-projection-line { background: var(--retro-dark) !important; border-color: var(--retro-dark) !important; opacity: 1 !important; } html[data-theme="retro-2bit"] .diet-matrix-threshold-button, html[data-theme="retro-2bit"] .diet-matrix-score-badge, html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix-axis, html[data-theme="retro-2bit"] .diet-matrix-control-chips button, html[data-theme="retro-2bit"] .diet-matrix-actions button, html[data-theme="retro-2bit"] .diet-matrix-zone, html[data-theme="retro-2bit"] .diet-matrix-zone-q, html[data-theme="retro-2bit"] .diet-matrix-zone-explain, html[data-theme="retro-2bit"] .diet-map-score-card { color: var(--retro-ink) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix-point, html[data-theme="retro-2bit"] .diet-matrix-point, html[data-theme="retro-2bit"] .diet-matrix-point-v5337 { border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 0 0 0 3px var(--retro-light), 5px 5px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix-point::before, html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix-point::after { border-color: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix-point-caption, html[data-theme="retro-2bit"] .diet-matrix-point-caption, html[data-theme="retro-2bit"] .diet-matrix-point-caption-v5337 { color: var(--retro-paper) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-ink) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix-zone, html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix-zone span, html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix-zone small, html[data-theme="retro-2bit"] .diet-matrix-axis-label, html[data-theme="retro-2bit"] .diet-matrix-x-scale, html[data-theme="retro-2bit"] .diet-matrix-y-scale, html[data-theme="retro-2bit"] .diet-matrix-score-badge, html[data-theme="retro-2bit"] .diet-matrix-zone-q b, html[data-theme="retro-2bit"] .diet-matrix-reading-v5337, html[data-theme="retro-2bit"] .diet-matrix-insight-v540 { color: var(--retro-ink) !important; } /* Harvard plate and SVG-heavy areas: monochrome + pixel shell. */ html[data-theme="retro-2bit"] .harvard-plate-card, html[data-theme="retro-2bit"] .harvard-plate-visual-wrap, html[data-theme="retro-2bit"] .harvard-plate-status, html[data-theme="retro-2bit"] .harvard-plate-companion, html[data-theme="retro-2bit"] .hp-sector-card, html[data-theme="retro-2bit"] .hp-active-panel, html[data-theme="retro-2bit"] .harvard-hei-bridge, html[data-theme="retro-2bit"] .harvard-plate-diagnostics, html[data-theme="retro-2bit"] .harvard-plate-explain, html[data-theme="retro-2bit"] .hp-companion-inline, html[data-theme="retro-2bit"] .hp-click-feedback { border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 4px 4px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .harvard-plate-head, html[data-theme="retro-2bit"] .harvard-plate-explain > summary, html[data-theme="retro-2bit"] .harvard-plate-diagnostics > summary, html[data-theme="retro-2bit"] .hp-active-panel h3, html[data-theme="retro-2bit"] .hp-active-kicker { color: var(--retro-ink) !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .harvard-plate-svg-shell, html[data-theme="retro-2bit"] .harvard-plate-visual, html[data-theme="retro-2bit"] .harvard-plate-companion-visual { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: inset 0 0 0 3px var(--retro-light) !important; } html[data-theme="retro-2bit"] .harvard-plate-svg-shell svg, html[data-theme="retro-2bit"] .harvard-plate-companion-visual svg, html[data-theme="retro-2bit"] .nr-diet-matrix-svg { filter: grayscale(1) contrast(1.35) brightness(.98); } html[data-theme="retro-2bit"] .hp-active-bar, html[data-theme="retro-2bit"] .hpacc-bar, html[data-theme="retro-2bit"] .hhb-bar, html[data-theme="retro-2bit"] .hpwi-bar { border: 1px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .hp-active-bar span, html[data-theme="retro-2bit"] .hpacc-bar i, html[data-theme="retro-2bit"] .hhb-bar i, html[data-theme="retro-2bit"] .hpwi-bar i, html[data-theme="retro-2bit"] .harvard-plate-auto-note::before, html[data-theme="retro-2bit"] .hp-companion-state-dot { background: var(--retro-ink) !important; box-shadow: none !important; } /* Mobile: stronger overflow discipline. */ @media (max-width: 760px) { html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix-zone, html[data-theme="retro-2bit"] .diet-matrix-zone, html[data-theme="retro-2bit"] .diet-matrix-zone-q, html[data-theme="retro-2bit"] .diet-matrix-score-badge, html[data-theme="retro-2bit"] .diet-matrix-threshold-button, html[data-theme="retro-2bit"] .search-result-card, html[data-theme="retro-2bit"] .gemini-ration-media-card, html[data-theme="retro-2bit"] .gemini-ration-draft-row, html[data-theme="retro-2bit"] .v40-mini-cart, html[data-theme="retro-2bit"] .card, html[data-theme="retro-2bit"] .accordion-item { overflow: hidden !important; } html[data-theme="retro-2bit"] .diet-matrix-actions, html[data-theme="retro-2bit"] .diet-matrix-control-chips, html[data-theme="retro-2bit"] .hpapply-actions, html[data-theme="retro-2bit"] .gemini-ration-import__actions, html[data-theme="retro-2bit"] .gemini-ration-import__upload-row, html[data-theme="retro-2bit"] .gemini-ration-draft__actions { gap: 8px !important; } } } /* ===== END theme-retro-2bit-v5.css ===== */ /* ===== BEGIN theme-retro-2bit-v6.css sha256=c3af9a0e32eafa24c6dc567d17f5b1dc1f3d385129690963f2e1fe8ef5d3c318 ===== */ /* nutrition calculator v5.3.152 — 2-bit mobile hierarchy and explicit selection pass Visual-only screen layer. */ @media screen { html[data-theme="retro-2bit"] .gemini-ration-draft__head #geminiRationDraftSummary { border:2px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-light) !important; color:var(--retro-ink) !important; box-shadow:2px 2px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row.is-included { border:3px solid var(--retro-ink) !important; background:var(--retro-paper) !important; box-shadow:6px 6px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row.is-excluded { border:3px dashed var(--retro-dark) !important; background:var(--retro-light) !important; box-shadow:3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row__include { border:3px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-ink) !important; color:var(--retro-paper) !important; box-shadow:3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row__include-box { border:3px solid var(--retro-paper) !important; border-radius:0 !important; background:var(--retro-paper) !important; box-shadow:none !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row__include input:checked + .gemini-ration-draft-row__include-box { border-color:var(--retro-paper) !important; background:var(--retro-paper) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row__include input:checked + .gemini-ration-draft-row__include-box::after { content:"✓"; color:var(--retro-ink) !important; font-family:ui-monospace,"SFMono-Regular",Consolas,monospace !important; font-size:24px !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row__include-text, html[data-theme="retro-2bit"] .gemini-ration-draft-row__include-state { color:var(--retro-paper) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row.is-excluded .gemini-ration-draft-row__include { border-color:var(--retro-dark) !important; background:var(--retro-paper) !important; color:var(--retro-ink) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row.is-excluded .gemini-ration-draft-row__include-box { border-color:var(--retro-ink) !important; background:var(--retro-paper) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row.is-excluded .gemini-ration-draft-row__include-text, html[data-theme="retro-2bit"] .gemini-ration-draft-row.is-excluded .gemini-ration-draft-row__include-state { color:var(--retro-ink) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row__include:focus-within { outline:3px dashed var(--retro-ink) !important; outline-offset:4px !important; } /* Strong, consistent hierarchy between major windows. */ html[data-theme="retro-2bit"] section.card, html[data-theme="retro-2bit"] #needsCompact, html[data-theme="retro-2bit"] #geminiRationImportSection, html[data-theme="retro-2bit"] #globalSearchSection, html[data-theme="retro-2bit"] #rationSection, html[data-theme="retro-2bit"] #heiPanel, html[data-theme="retro-2bit"] #totalsSection, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel, html[data-theme="retro-2bit"] #harvardPlatePanel, html[data-theme="retro-2bit"] #dataQualityPanel, html[data-theme="retro-2bit"] #presetsPanel, html[data-theme="retro-2bit"] #geminiAiSection, html[data-theme="retro-2bit"] #globalActions, html[data-theme="retro-2bit"] .legal-note { position:relative; isolation:isolate; border:3px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-paper) !important; box-shadow:7px 7px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .card .card, html[data-theme="retro-2bit"] .accordion-item, html[data-theme="retro-2bit"] details.fold, html[data-theme="retro-2bit"] .search-field-card, html[data-theme="retro-2bit"] .search-grams-card, html[data-theme="retro-2bit"] .total-card, html[data-theme="retro-2bit"] .micro, html[data-theme="retro-2bit"] .diet-domain-detail, html[data-theme="retro-2bit"] .hp-sector-card { border:2px solid var(--retro-dark) !important; border-radius:0 !important; background:var(--retro-paper) !important; box-shadow:3px 3px 0 var(--retro-light) !important; } html[data-theme="retro-2bit"] .accordion-head, html[data-theme="retro-2bit"] details.fold > summary, html[data-theme="retro-2bit"] .diet-matrix-inspect-accordion > summary, html[data-theme="retro-2bit"] .harvard-plate-explain > summary, html[data-theme="retro-2bit"] .harvard-plate-diagnostics > summary { border-bottom:2px solid var(--retro-ink) !important; background:var(--retro-light) !important; } html[data-theme="retro-2bit"] input, html[data-theme="retro-2bit"] select, html[data-theme="retro-2bit"] textarea, html[data-theme="retro-2bit"] button { max-width:100%; } html[data-theme="retro-2bit"] .table-wrap, html[data-theme="retro-2bit"] .ration-table-wrap, html[data-theme="retro-2bit"] .norm-region-help-table-wrap, html[data-theme="retro-2bit"] .composite-search-table-wrap { overflow-x:auto !important; overflow-y:visible; -webkit-overflow-scrolling:touch; } html[data-theme="retro-2bit"] [data-retro-section-icon] { padding-inline:0 !important; overflow:visible !important; } html[data-theme="retro-2bit"] [data-retro-section-icon]::before { margin-inline-start:0 !important; transform:none !important; } @media (max-width:760px) { html[data-theme="retro-2bit"] body { overflow-x:hidden; } html[data-theme="retro-2bit"] #mainContent { width:100%; max-width:100%; padding-inline:10px !important; border-inline:0 !important; box-shadow:none !important; } html[data-theme="retro-2bit"] section.card, html[data-theme="retro-2bit"] #needsCompact, html[data-theme="retro-2bit"] #geminiRationImportSection, html[data-theme="retro-2bit"] #globalSearchSection, html[data-theme="retro-2bit"] #rationSection, html[data-theme="retro-2bit"] #heiPanel, html[data-theme="retro-2bit"] #totalsSection, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel, html[data-theme="retro-2bit"] #harvardPlatePanel, html[data-theme="retro-2bit"] #dataQualityPanel, html[data-theme="retro-2bit"] #presetsPanel, html[data-theme="retro-2bit"] #geminiAiSection, html[data-theme="retro-2bit"] #globalActions, html[data-theme="retro-2bit"] .legal-note { width:100%; min-width:0; margin:22px 0 !important; padding:16px 13px !important; box-shadow:5px 5px 0 var(--retro-dark) !important; overflow:visible !important; } html[data-theme="retro-2bit"] section.card + section.card { margin-top:28px !important; } html[data-theme="retro-2bit"] h1, html[data-theme="retro-2bit"] h2, html[data-theme="retro-2bit"] h3, html[data-theme="retro-2bit"] .title { max-width:100%; overflow-wrap:anywhere; line-height:1.12; } html[data-theme="retro-2bit"] h2 { font-size:clamp(24px,8vw,36px) !important; } html[data-theme="retro-2bit"] .step-badge { display:inline-flex; margin-bottom:10px; padding:7px 10px !important; } html[data-theme="retro-2bit"] .gemini-ration-import__head, html[data-theme="retro-2bit"] .search-hero-head, html[data-theme="retro-2bit"] .diet-analysis-head, html[data-theme="retro-2bit"] .harvard-plate-head { display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:10px !important; align-items:start !important; } html[data-theme="retro-2bit"] .gemini-ration-import__badge, html[data-theme="retro-2bit"] .search-db-count { justify-self:start; max-width:100%; } html[data-theme="retro-2bit"] .gemini-ration-import__upload-row, html[data-theme="retro-2bit"] .gemini-ration-import__actions, html[data-theme="retro-2bit"] .gemini-ration-draft__actions, html[data-theme="retro-2bit"] .search-main-grid, html[data-theme="retro-2bit"] .search-line, html[data-theme="retro-2bit"] .diet-matrix-actions, html[data-theme="retro-2bit"] .diet-matrix-control-chips, html[data-theme="retro-2bit"] .hpapply-actions { display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:9px !important; } html[data-theme="retro-2bit"] .gemini-ration-import__upload-row > button, html[data-theme="retro-2bit"] .gemini-ration-import__actions > button, html[data-theme="retro-2bit"] .gemini-ration-draft__actions > button, html[data-theme="retro-2bit"] .diet-matrix-actions > button, html[data-theme="retro-2bit"] .diet-matrix-control-chips > button, html[data-theme="retro-2bit"] .hpapply-actions > button { width:100% !important; min-height:48px !important; white-space:normal !important; } html[data-theme="retro-2bit"] .gemini-ration-media-card, html[data-theme="retro-2bit"] .gemini-ration-draft-row, html[data-theme="retro-2bit"] .search-result-card, html[data-theme="retro-2bit"] .ration-row, html[data-theme="retro-2bit"] .total-card, html[data-theme="retro-2bit"] .micro, html[data-theme="retro-2bit"] .diet-overview-card, html[data-theme="retro-2bit"] .diet-matrix-card, html[data-theme="retro-2bit"] .harvard-plate-visual-wrap, html[data-theme="retro-2bit"] .harvard-plate-status { min-width:0 !important; max-width:100% !important; overflow:visible !important; } html[data-theme="retro-2bit"] .diet-analysis-redesigned .diet-matrix, html[data-theme="retro-2bit"] .diet-matrix-grid-v5337, html[data-theme="retro-2bit"] .diet-matrix-grid-v5338, html[data-theme="retro-2bit"] .diet-matrix-grid-v540 { width:100% !important; min-height:0 !important; aspect-ratio:1/1; overflow:hidden !important; } html[data-theme="retro-2bit"] .diet-matrix-score-badge, html[data-theme="retro-2bit"] .diet-matrix-threshold-button { max-width:42%; padding:4px 5px !important; font-size:9px !important; line-height:1.15 !important; white-space:normal !important; } html[data-theme="retro-2bit"] .diet-matrix-point-caption, html[data-theme="retro-2bit"] .diet-matrix-point-caption-v5337 { max-width:112px !important; padding:5px 6px !important; font-size:9.5px !important; line-height:1.2 !important; } html[data-theme="retro-2bit"] [data-retro-section-icon]::before { width:18px !important; height:18px !important; flex-basis:18px !important; margin-inline-end:7px !important; background-size:90px 72px !important; } html[data-theme="retro-2bit"] .v40-mini-cart { left:10px !important; right:10px !important; bottom:10px !important; width:auto !important; max-width:calc(100vw - 20px) !important; padding:9px !important; gap:8px !important; overflow:hidden !important; } html[data-theme="retro-2bit"] .v40-mini-cart-text { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } html[data-theme="retro-2bit"] body:has(.v40-mini-cart.is-visible) #mainContent { padding-bottom:106px !important; } } } /* ===== END theme-retro-2bit-v6.css ===== */ /* ===== BEGIN theme-retro-2bit-v7.css sha256=d09383f246bf058edab748f35d9febfb3c1e9a4e24e1d0914a31915b9e0cd25e ===== */ /* nutrition calculator v5.3.158 — live 2-bit matrix parity with PDF Scope: screen-only presentation of the HEI × structure matrix. Calculation, coordinates, zone selection and report generation remain untouched. */ @media screen { html[data-theme="retro-2bit"] .diet-matrix-card-v540 { color: var(--retro-ink) !important; background: var(--retro-paper) !important; border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; box-shadow: 6px 6px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-map-topline-v540, html[data-theme="retro-2bit"] .diet-map-topline-v540 > div, html[data-theme="retro-2bit"] .diet-map-topline-v540 strong, html[data-theme="retro-2bit"] .diet-map-topline-v540 small, html[data-theme="retro-2bit"] .diet-matrix-dashboard-v540, html[data-theme="retro-2bit"] .diet-matrix-axis-pill, html[data-theme="retro-2bit"] .diet-matrix-x-scale, html[data-theme="retro-2bit"] .diet-matrix-y-scale { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] .diet-map-topline-v540 { background: var(--retro-light) !important; border: 0 !important; border-bottom: 3px double var(--retro-ink) !important; padding: 12px 12px 10px !important; } html[data-theme="retro-2bit"] .diet-map-topline-v540 small { opacity: 1 !important; font-weight: 700 !important; } html[data-theme="retro-2bit"] .diet-matrix-title-icon-v5338 { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-matrix-title-icon-v5338 span, html[data-theme="retro-2bit"] .diet-matrix-title-icon-v5338 span::before, html[data-theme="retro-2bit"] .diet-matrix-title-icon-v5338 span::after { border-color: var(--retro-ink) !important; background-color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] .diet-map-topline-v540 > span#dietMatrixZoneLabel { display: inline-block !important; grid-column: 2; justify-self: start; margin-top: 7px; padding: 3px 7px !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; color: var(--retro-ink) !important; box-shadow: 2px 2px 0 var(--retro-dark) !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1.15 !important; } html[data-theme="retro-2bit"] .diet-matrix-dashboard-v540 .diet-matrix-axis-pill { border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; padding: 4px 6px !important; font-weight: 900 !important; text-transform: uppercase; letter-spacing: .025em; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540, html[data-theme="retro-2bit"] .diet-matrix-grid-v5337.diet-matrix-grid-v5338.diet-matrix-grid-v540 { position: relative; width: 100% !important; min-height: 0 !important; aspect-ratio: 4 / 3 !important; overflow: visible !important; isolation: isolate; border: 3px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; background-image: none !important; box-shadow: 5px 5px 0 var(--retro-dark) !important; } /* The mid-lines match the PDF's single 50/50 grid. */ html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540::before, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540::after { content: "" !important; position: absolute !important; z-index: 4 !important; display: block !important; background: var(--retro-ink) !important; opacity: 1 !important; pointer-events: none !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540::before { left: 50% !important; top: 0 !important; width: 1px !important; height: 100% !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540::after { left: 0 !important; top: 50% !important; width: 100% !important; height: 1px !important; } /* Four PDF-equivalent regions. The mature area begins at 70 on both axes. */ html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q { z-index: 1 !important; display: block !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; cursor: pointer; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-structure { left: 0 !important; right: auto !important; top: 0 !important; bottom: auto !important; width: 70% !important; height: 30% !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-strong { left: 70% !important; right: auto !important; top: 0 !important; bottom: auto !important; width: 30% !important; height: 30% !important; background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-complex { left: 0 !important; right: auto !important; top: 30% !important; bottom: auto !important; width: 70% !important; height: 70% !important; background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-quality { left: 70% !important; right: auto !important; top: 30% !important; bottom: auto !important; width: 30% !important; height: 70% !important; background: var(--retro-light) !important; } /* The PDF uses a clean field; zone names remain available to assistive tech and on focus. */ html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q b, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q span { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q.is-current-zone { outline: 2px dashed var(--retro-ink) !important; outline-offset: -7px !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-strong.is-current-zone { outline-color: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q:focus-visible, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-zone-q.is-selected-zone { outline: 3px double var(--retro-ink) !important; outline-offset: -10px !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-strong:focus-visible, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .zone-q-strong.is-selected-zone { outline-color: var(--retro-paper) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .threshold-x50, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .threshold-y50, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .label-x50, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .label-y50 { display: none !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .threshold-x70, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .threshold-y70 { z-index: 5 !important; display: block !important; background: transparent !important; opacity: 1 !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .threshold-x70 { left: 70% !important; top: 0 !important; width: 0 !important; height: 100% !important; border-left: 2px dashed var(--retro-ink) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .threshold-y70 { left: 0 !important; top: 30% !important; width: 100% !important; height: 0 !important; border-top: 2px dashed var(--retro-ink) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .label-x70, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .label-y70 { z-index: 8 !important; display: block !important; min-width: 0 !important; border: 0 !important; border-radius: 0 !important; background: var(--retro-paper) !important; color: var(--retro-ink) !important; box-shadow: none !important; padding: 1px 3px !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1 !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .label-x70 { left: 70% !important; right: auto !important; bottom: 4px !important; top: auto !important; transform: translateX(-50%) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .label-y70 { left: 4px !important; right: auto !important; top: 30% !important; bottom: auto !important; transform: translateY(-50%) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure { z-index: 7 !important; display: block !important; background: transparent !important; border-color: var(--retro-ink) !important; border-style: dashed !important; opacity: 1 !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .projection-hei { height: 0 !important; border-top-width: 1.5px !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .projection-structure { width: 0 !important; border-left-width: 1.5px !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-projection-badge { display: none !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337, html[data-theme="retro-2bit"] .diet-matrix-grid-v5338 .diet-matrix-point-v5337 { z-index: 12 !important; width: 18px !important; height: 18px !important; border: 3px solid var(--retro-paper) !important; border-radius: 50% !important; background: var(--retro-ink) !important; box-shadow: 0 0 0 7px var(--retro-light), 0 0 0 8px var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337::before, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337::after { content: none !important; display: none !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337 span { display: none !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337:hover, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337:focus-visible, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337.is-selected-inspect { outline: 2px dotted var(--retro-ink) !important; outline-offset: 12px !important; box-shadow: 0 0 0 9px var(--retro-light), 0 0 0 11px var(--retro-ink) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 { z-index: 11 !important; min-width: 0 !important; max-width: none !important; width: auto !important; transform: translate(12px, -22px) !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; color: var(--retro-ink) !important; box-shadow: none !important; padding: 3px 5px !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1 !important; white-space: nowrap !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540[data-point-side="left"] .diet-matrix-point-caption-v5337 { transform: translate(calc(-100% - 12px), -22px) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337::before { content: none !important; display: none !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b { display: block !important; margin: 0 !important; color: var(--retro-ink) !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0 !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 span { display: none !important; } /* The PDF presents only the endpoint labels; 70+ is shown on the threshold itself. */ html[data-theme="retro-2bit"] .diet-matrix-x-scale span:nth-child(2), html[data-theme="retro-2bit"] .diet-matrix-x-scale span:nth-child(3), html[data-theme="retro-2bit"] .diet-matrix-x-scale span:nth-child(4), html[data-theme="retro-2bit"] .diet-matrix-y-scale span:nth-child(2), html[data-theme="retro-2bit"] .diet-matrix-y-scale span:nth-child(3), html[data-theme="retro-2bit"] .diet-matrix-y-scale span:nth-child(4) { visibility: hidden !important; } html[data-theme="retro-2bit"] .diet-map-summary-strip-v540 .diet-map-score-card { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; color: var(--retro-ink) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-map-summary-strip-v540 .diet-map-score-card::before { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] .diet-map-summary-strip-v540 .diet-map-score-card, html[data-theme="retro-2bit"] .diet-map-summary-strip-v540 .diet-map-score-card span, html[data-theme="retro-2bit"] .diet-map-summary-strip-v540 .diet-map-score-card strong, html[data-theme="retro-2bit"] .diet-map-summary-strip-v540 .diet-map-score-card em, html[data-theme="retro-2bit"] .diet-map-summary-strip-v540 .diet-map-score-card i, html[data-theme="retro-2bit"] .diet-map-summary-strip-v540 .diet-map-score-card b { color: var(--retro-ink) !important; } } @media screen and (max-width: 760px) { html[data-theme="retro-2bit"] .diet-map-topline-v540 { padding: 10px 9px 9px !important; } html[data-theme="retro-2bit"] .diet-map-topline-v540 > span#dietMatrixZoneLabel { grid-column: 1 / -1; margin-left: 0; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540, html[data-theme="retro-2bit"] .diet-matrix-grid-v5337.diet-matrix-grid-v5338.diet-matrix-grid-v540 { aspect-ratio: 4 / 3 !important; overflow: visible !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-v5337 { width: 15px !important; height: 15px !important; border-width: 2px !important; box-shadow: 0 0 0 5px var(--retro-light), 0 0 0 6px var(--retro-dark) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 { transform: translate(9px, -18px) !important; padding: 2px 4px !important; font-size: 9.5px !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540[data-point-side="left"] .diet-matrix-point-caption-v5337 { transform: translate(calc(-100% - 9px), -18px) !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .diet-matrix-point-caption-v5337 b { font-size: 9.5px !important; } html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .label-x70, html[data-theme="retro-2bit"] .diet-profile-v540 .diet-matrix-grid-v540 .label-y70 { font-size: 9px !important; } } /* ID-level overrides for the design-audit layer, which intentionally uses !important. */ @media screen { html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-card-v540, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-topline-v540, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-topline-v540 strong, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-topline-v540 small, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.diet-matrix-axis-pill { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.diet-matrix-axis-pill { border: 0 !important; background: transparent !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.diet-matrix-zone-q { border: 0 !important; border-radius: 0 !important; color: var(--retro-ink) !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.zone-q-structure { background: var(--retro-light) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.zone-q-strong { background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.zone-q-complex { background: var(--retro-paper) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.zone-q-quality { background: var(--retro-light) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.diet-matrix-zone-q b, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.diet-matrix-zone-q span { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.diet-matrix-point-v5337 { width: 18px !important; height: 18px !important; border: 3px solid var(--retro-paper) !important; border-radius: 50% !important; background: var(--retro-ink) !important; color: var(--retro-paper) !important; box-shadow: 0 0 0 7px var(--retro-light), 0 0 0 8px var(--retro-dark) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-score-card, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-score-card strong, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-score-card span, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-score-card em { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-score-card { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } } @media screen and (max-width: 760px) { html[data-theme="retro-2bit"] #dietAnalysisProfilePanel button.diet-matrix-point-v5337 { width: 15px !important; height: 15px !important; border-width: 2px !important; box-shadow: 0 0 0 5px var(--retro-light), 0 0 0 6px var(--retro-dark) !important; } } @media screen { html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-grid-v540 .diet-matrix-zone-q.is-current-zone { outline: none !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-point-caption-v5337 { z-index: 14 !important; width: 58px !important; min-width: 58px !important; max-width: 58px !important; text-align: center !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-grid-v540[data-point-side="left"] .diet-matrix-point-caption-v5337 { transform: translate(calc(-100% - 18px), -20px) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-grid-v540:not([data-point-side="left"]) .diet-matrix-point-caption-v5337 { transform: translate(18px, -20px) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-summary-strip-v540 .diet-map-score-card::before { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-summary-strip-v540 .diet-map-score-card::after, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-summary-strip-v540 .diet-map-score-card-quality::after, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-summary-strip-v540 .diet-map-score-card-structure::after, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-map-summary-strip-v540 .diet-map-score-card-zone::after { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-insight-v540 { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; color: var(--retro-ink) !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-insight-v540 strong { border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-light) !important; color: var(--retro-ink) !important; } } @media screen and (max-width: 760px) { html[data-theme="retro-2bit"] #dietAnalysisMatrix { overflow: visible !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-point-caption-v5337 { width: 50px !important; min-width: 50px !important; max-width: 50px !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-grid-v540[data-point-side="left"] .diet-matrix-point-caption-v5337 { transform: translate(calc(-100% - 12px), -17px) !important; } html[data-theme="retro-2bit"] #dietAnalysisProfilePanel .diet-matrix-grid-v540:not([data-point-side="left"]) .diet-matrix-point-caption-v5337 { transform: translate(12px, -17px) !important; } } /* ===== END theme-retro-2bit-v7.css ===== */ /* ===== BEGIN theme-retro-2bit-v8.css sha256=a702c36de7d3c7acb046ba2dedb854cc3bd4b463b486e87ca3d1c04c166edc75 ===== */ /* nutrition calculator v5.3.159 — complete 2-bit accordion interior pass Screen-only. Restyles every expandable surface and all controls/cards rendered inside it. No calculation, state, report or print selectors are touched. */ @media screen { html[data-theme="retro-2bit"] { --retro-acc-stripes: repeating-linear-gradient(135deg,var(--retro-paper) 0 6px,var(--retro-light) 6px 7px); --retro-acc-dots: radial-gradient(circle at 1px 1px,var(--retro-dark) 1px,transparent 1.2px); } /* One visual grammar for native details and scripted category accordions. */ html[data-theme="retro-2bit"] #mainContent#mainContent details, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item { color:var(--retro-ink) !important; border:2px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-paper) !important; box-shadow:3px 3px 0 var(--retro-dark) !important; overflow:visible !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details details { border-color:var(--retro-dark) !important; box-shadow:2px 2px 0 var(--retro-light) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details > summary, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-head { color:var(--retro-ink) !important; border:0 !important; border-radius:0 !important; background:var(--retro-light) !important; background-image:none !important; box-shadow:inset 0 -2px 0 var(--retro-dark) !important; text-shadow:none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > summary, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item.open > .accordion-head { border-bottom:2px solid var(--retro-ink) !important; background:var(--retro-dark) !important; color:var(--retro-paper) !important; box-shadow:none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > summary *, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item.open > .accordion-head * { color:var(--retro-paper) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details > summary::before, html[data-theme="retro-2bit"] #mainContent#mainContent details > summary::after, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-head::before, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-head::after { border-radius:0 !important; color:currentColor !important; text-shadow:none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .ui-analysis-fold > summary::before, html[data-theme="retro-2bit"] #mainContent#mainContent .diet-domain-chevron, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-chevron, html[data-theme="retro-2bit"] #mainContent#mainContent .catalog-drawer-indicator { border:1px solid currentColor !important; border-radius:0 !important; background:transparent !important; color:inherit !important; box-shadow:none !important; } /* Expanded area itself must never fall back to a white/blue modern canvas. */ html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > :not(summary), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body, html[data-theme="retro-2bit"] #mainContent#mainContent .catalog-drawer-body { color:var(--retro-ink) !important; border-radius:0 !important; background-color:var(--retro-paper) !important; background-image:none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(h2,h3,h4,h5,h6,p,li,dt,dd,label,output,code,b,strong,span), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(h2,h3,h4,h5,h6,p,li,dt,dd,label,output,code,b,strong,span) { text-shadow:none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(h2,h3,h4,h5,h6,b,strong,code), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(h2,h3,h4,h5,h6,b,strong,code) { color:var(--retro-ink) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(p,li,dt,dd,label,output), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(p,li,dt,dd,label,output) { color:var(--retro-ink) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(small,em,.muted,.small,.footer-note,[class*="subtitle"],[class*="note"],[class*="meta"],[class*="hint"]), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(small,em,.muted,.small,.footer-note,[class*="subtitle"],[class*="note"],[class*="meta"],[class*="hint"]) { color:var(--retro-dark) !important; opacity:1 !important; } /* Inner cards, advice blocks and analytical panels. */ html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .rec,.alert,.hei-p1-strengths,.hei-p1-all,.hei-p2-component-context, .diet-personal-narrative,.diet-reliability-mini,.diet-limiter-item,.diet-personal-action, .diet-domain-intro,.diet-domain-detail-body,.diet-analysis-help-body,.diet-analysis-extra-harvard-body, .diet-gram-action,.diet-context-help-current,.diet-context-help-action, .hpacc-section,.hpacc-item,.hpacc-body,.hpacc-note,.hpacc-empty,.hpacc-flags, .hpsr-card,.hpsr-method,.hpwi-row,.hpwi-preview,.hpwi-intro,.hpwi-steps, .hpapply-cols section,.hpapply-status,.hpapply-lead,.data-quality-warning, .serving-unit-hint,.unit-quick-input,.catalog-mode-help,.meal-planner-intro ) { color:var(--retro-ink) !important; border:1px solid var(--retro-dark) !important; border-radius:0 !important; background:var(--retro-paper) !important; background-image:none !important; box-shadow:2px 2px 0 var(--retro-light) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .rec.warn,.rec.bad,.hei-p1-component.attention,.hei-p1-component.near, [data-tone="warn"],[data-tone="bad"],[data-severity="warn"],[data-severity="bad"], .hpacc-extra-cluster[data-cluster="attention"],.data-quality-warning,.hpapply-status[data-good="0"] ) { color:var(--retro-ink) !important; border-color:var(--retro-ink) !important; background:var(--retro-acc-stripes) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .rec.ok,.hei-p1-component.achieved,[data-tone="ok"],.hpapply-status[data-good="1"] ) { color:var(--retro-ink) !important; background-color:var(--retro-paper) !important; background-image:var(--retro-acc-dots) !important; background-size:8px 8px !important; } /* Tables and rows opened inside diagnostic sections. */ html[data-theme="retro-2bit"] #mainContent#mainContent details table, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body table { color:var(--retro-ink) !important; border-collapse:collapse !important; background:var(--retro-paper) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(th,td), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(th,td) { color:var(--retro-ink) !important; border-color:var(--retro-dark) !important; border-radius:0 !important; background:var(--retro-paper) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details th, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body th { background:var(--retro-light) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details tr.ok, html[data-theme="retro-2bit"] #mainContent#mainContent details tr.warn, html[data-theme="retro-2bit"] #mainContent#mainContent details tr.bad { background:transparent !important; } /* Inputs and actions rendered after an accordion is opened. */ html[data-theme="retro-2bit"] #mainContent#mainContent details :is(input,select,textarea), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(input,select,textarea) { color:var(--retro-ink) !important; border:2px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-paper) !important; box-shadow:inset 2px 2px 0 var(--retro-light) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(button,.btn,[role="button"]), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(button,.btn,[role="button"]) { color:var(--retro-paper) !important; border:2px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-ink) !important; background-image:none !important; box-shadow:3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(button.secondary,button.ghost,.btn.secondary), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(button.secondary,button.ghost,.btn.secondary) { color:var(--retro-ink) !important; background:var(--retro-paper) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details button.danger, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body button.danger { color:var(--retro-paper) !important; background:var(--retro-dark) !important; } /* Pills, category counts and status chips become square 2-bit labels. */ html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .pill,.chip,.badge,.cat-count,.diet-acc-chip,.diet-domain-status,.diet-domain-value, .hpacc-value,.hpacc-target,.hpsr-badge,.hpwi-status span,.data-quality-version, .unit-quick-input-btn,.catalog-drawer-indicator ), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-head .cat-count { color:var(--retro-ink) !important; border:1px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-paper) !important; background-image:none !important; box-shadow:1px 1px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item.open > .accordion-head .cat-count { color:var(--retro-paper) !important; border-color:var(--retro-paper) !important; background:var(--retro-dark) !important; box-shadow:1px 1px 0 var(--retro-paper) !important; } /* Progress bars and micro-scales retain meaning without modern colour. */ html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .progress,.bar,.diet-acc-microbar,.diet-domain-track,.diet-limiter-meter, .hhb-track,.hpacc-bar,.hpsr-progress,.hpwi-bar,.data-quality-meter ) { border:1px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-paper) !important; background-image:none !important; box-shadow:none !important; overflow:hidden !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .progress,.bar,.diet-acc-microbar,.diet-domain-track,.diet-limiter-meter, .hhb-track,.hpacc-bar,.hpsr-progress,.hpwi-bar,.data-quality-meter ) :is(i,b,span) { border-radius:0 !important; background:var(--retro-dark) !important; background-image:none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(.tick,.tick-label,.hei-p1-table-achieved,[class*="status"],[class*="tone"]) { color:var(--retro-ink) !important; } /* The large catalogue is a scripted accordion, not native details. */ html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item { margin-block:8px !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-head { border:0 !important; padding:10px 12px !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body { padding:12px !important; border-top:0 !important; } /* Keep semantic inner separators crisp instead of rounded modern tiles. */ html[data-theme="retro-2bit"] #mainContent#mainContent details :is(hr,.hpacc-items li,.hpapply-list li,.hpwi-deltas li) { border-color:var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details svg, html[data-theme="retro-2bit"] #mainContent#mainContent details canvas { filter:grayscale(1) contrast(1.15); } @media (max-width:760px) { html[data-theme="retro-2bit"] #mainContent#mainContent details, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item { max-width:100% !important; min-width:0 !important; box-shadow:3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details > summary, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-head { min-height:48px !important; padding:11px 10px !important; gap:8px !important; overflow-wrap:anywhere; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > :not(summary), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body, html[data-theme="retro-2bit"] #mainContent#mainContent .catalog-drawer-body { min-width:0 !important; max-width:100% !important; overflow-wrap:anywhere; } html[data-theme="retro-2bit"] #mainContent#mainContent details table, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body table { min-width:640px; } html[data-theme="retro-2bit"] #mainContent#mainContent details .table-wrap, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body .table-wrap { overflow-x:auto !important; max-width:100% !important; } } } @media screen { /* Final specificity shield against late runtime styles injected by analytical modules. */ html[data-theme="retro-2bit"] #mainContent#mainContent details :where(*) { border-color:var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > :not(summary) :where(*) { color:var(--retro-ink) !important; text-shadow:none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(div,section,article,aside,fieldset,dl,ul,ol,li,p,span,i,b,em,u,strong,small), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(div,section,article,aside,fieldset,dl,ul,ol,li,p,span,i,b,em,u,strong,small) { border-radius:0 !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > summary, html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > summary :where(*) { color:var(--retro-paper) !important; border-color:var(--retro-paper) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > summary :is(i,b,em,u,strong,span), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item.open > .accordion-head :is(i,b,em,u,strong,span) { border-radius:0 !important; background:transparent !important; background-image:none !important; box-shadow:none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > :not(summary) :is(small,em,.muted,.small,.footer-note,[class*="subtitle"],[class*="note"],[class*="meta"],[class*="hint"]) { color:var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(button,.btn,[role="button"]), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(button,.btn,[role="button"]) { color:var(--retro-paper) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(button.secondary,button.ghost,.btn.secondary), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(button.secondary,button.ghost,.btn.secondary) { color:var(--retro-ink) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .diet-zone-explain-grid > div,.diet-point-passport > div,.diet-method-facts > div, .hp-explain-group,.hpacc-extra-cluster,.hpacc-inline-feedback,.hhb-compact-weak, .diet-limiter-action,.diet-domain-profile,.additional-body > section.card ) { color:var(--retro-ink) !important; border:1px solid var(--retro-dark) !important; border-radius:0 !important; background:var(--retro-paper) !important; background-image:none !important; box-shadow:2px 2px 0 var(--retro-light) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .diet-gram-action > span,.diet-limiter-action > span,.hpacc-toggle-text, .hpacc-sector-conclusion,.diet-domain-profile span,.hpacc-inline-feedback span ) { color:var(--retro-ink) !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(.progress,.bar,.diet-acc-microbar,.diet-domain-track,.diet-limiter-meter,.hhb-track,.hpacc-bar,.hpwi-bar,.data-quality-meter) :is(i,b,span) { color:var(--retro-paper) !important; background:var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item.open > .accordion-head, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item.open > .accordion-head :where(*) { color:var(--retro-paper) !important; border-color:var(--retro-paper) !important; } } @media screen { html[data-theme="retro-2bit"] #mainContent#mainContent details .tick { background:var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(.diet-acc-microbar,.hpacc-bar,.hhb-track,.hpwi-bar) > em, html[data-theme="retro-2bit"] #mainContent#mainContent details .hpwi-bar em { color:var(--retro-paper) !important; border-radius:0 !important; background:var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details .diet-limiter-item > span { color:var(--retro-ink) !important; border:1px solid var(--retro-dark) !important; border-radius:0 !important; background:var(--retro-light) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details .hpacc-dot { border:1px solid var(--retro-ink) !important; border-radius:0 !important; background:var(--retro-dark) !important; box-shadow:none !important; } } @media screen { html[data-theme="retro-2bit"] #mainContent#mainContent details .diet-limiter-item span { color:var(--retro-ink) !important; border-color:var(--retro-dark) !important; border-radius:0 !important; background:var(--retro-light) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details.diet-context-help[open] > summary span, html[data-theme="retro-2bit"] #mainContent#mainContent details.diet-plant-balance-help[open] > summary span { color:var(--retro-paper) !important; border-color:var(--retro-paper) !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; } } /* ===== END theme-retro-2bit-v8.css ===== */ /* ===== BEGIN theme-retro-2bit-v9.css sha256=b13bfc476861d5f9d175ebaaacadee1895327c94e8ff3578667be71a589b9518 ===== */ /* nutrition calculator v5.3.161 — 2-bit visual-noise reduction Screen-only calming layer. Keeps the four-tone palette, square geometry and strong section hierarchy while removing high-frequency decoration from reading surfaces and nested controls. Calculation, layout and print logic are not touched. */ @media screen { html[data-theme="retro-2bit"] { --retro-calm-line: var(--retro-dark); --retro-calm-soft: var(--retro-light); } /* The retro identity is carried by geometry and hierarchy, not a tiled field. */ html[data-theme="retro-2bit"] body { background-color: var(--retro-light) !important; background-image: none !important; } /* Keep the main windows firm, but make their offset shadow less dominant. */ html[data-theme="retro-2bit"] section.card, html[data-theme="retro-2bit"] #needsCompact, html[data-theme="retro-2bit"] #geminiRationImportSection, html[data-theme="retro-2bit"] #globalSearchSection, html[data-theme="retro-2bit"] #rationSection, html[data-theme="retro-2bit"] #heiPanel, html[data-theme="retro-2bit"] #totalsSection, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel, html[data-theme="retro-2bit"] #harvardPlatePanel, html[data-theme="retro-2bit"] #dataQualityPanel, html[data-theme="retro-2bit"] #presetsPanel, html[data-theme="retro-2bit"] #geminiAiSection, html[data-theme="retro-2bit"] #globalActions, html[data-theme="retro-2bit"] .legal-note { box-shadow: 4px 4px 0 var(--retro-dark) !important; } /* One outline is enough for secondary expandable surfaces. */ html[data-theme="retro-2bit"] #mainContent#mainContent details, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item { border-width: 1px !important; border-color: var(--retro-dark) !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details details { border-width: 1px !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details > summary, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-head { border-bottom: 1px solid var(--retro-dark) !important; background: var(--retro-paper) !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > summary, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item.open > .accordion-head { color: var(--retro-ink) !important; border-bottom: 2px solid var(--retro-ink) !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > summary *, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item.open > .accordion-head * { color: var(--retro-ink) !important; border-color: var(--retro-dark) !important; } /* Major analytical accordions remain strong visual anchors. */ html[data-theme="retro-2bit"] #mainContent#mainContent #dietMatrixInspectAccordions > .diet-matrix-inspect-accordion[open] > summary, html[data-theme="retro-2bit"] #mainContent#mainContent #dietMatrixInspectAccordions > .diet-matrix-inspect-accordion.open > summary, html[data-theme="retro-2bit"] #mainContent#mainContent #heiFullRecsFold[open] > summary, html[data-theme="retro-2bit"] #mainContent#mainContent .ui-analysis-fold[open] > summary { color: var(--retro-paper) !important; border-color: var(--retro-paper) !important; background: var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent #dietMatrixInspectAccordions > .diet-matrix-inspect-accordion[open] > summary *, html[data-theme="retro-2bit"] #mainContent#mainContent #heiFullRecsFold[open] > summary *, html[data-theme="retro-2bit"] #mainContent#mainContent .ui-analysis-fold[open] > summary * { color: var(--retro-paper) !important; border-color: var(--retro-paper) !important; } /* Remove nested offset shadows: the previous version created borders inside borders inside patterned frames, especially in long mobile explanations. */ html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .rec,.alert,.hei-p1-strengths,.hei-p1-all,.hei-p2-component-context, .diet-personal-narrative,.diet-reliability-mini,.diet-limiter-item,.diet-personal-action, .diet-domain-intro,.diet-domain-detail-body,.diet-analysis-help-body,.diet-analysis-extra-harvard-body, .diet-gram-action,.diet-context-help-current,.diet-context-help-action, .hpacc-section,.hpacc-item,.hpacc-body,.hpacc-note,.hpacc-empty,.hpacc-flags, .hpsr-card,.hpsr-method,.hpwi-row,.hpwi-preview,.hpwi-intro,.hpwi-steps, .hpapply-cols section,.hpapply-status,.hpapply-lead,.data-quality-warning, .serving-unit-hint,.unit-quick-input,.catalog-mode-help,.meal-planner-intro, .diet-zone-explain-grid > div,.diet-point-passport > div,.diet-method-facts > div, .hp-explain-group,.hpacc-extra-cluster,.hpacc-inline-feedback,.hhb-compact-weak, .diet-limiter-action,.diet-domain-profile,.additional-body > section.card ) { border-width: 1px !important; border-color: var(--retro-dark) !important; background-color: var(--retro-paper) !important; background-image: none !important; box-shadow: none !important; } html[data-theme="retro-2bit"] :is( .diet-personal-plan,.diet-personal-item,.diet-step-card, .diet-analysis-card,.diet-overview-card,.diet-clinical-map-card, .diet-map-score-card,.diet-interpretation-card,.diet-domain-detail, .diet-limiter-panel,.diet-method-facts,.diet-context-help, .diet-plant-balance-help,.diet-matrix-zone-explain ) { border-width: 1px !important; border-color: var(--retro-dark) !important; box-shadow: none !important; } /* Warning/achievement texture is reduced to a semantic rail. Long patterned backgrounds were the largest source of high-frequency visual flicker. */ html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .rec.warn,.rec.bad,.hei-p1-component.attention,.hei-p1-component.near, [data-tone="warn"],[data-tone="bad"],[data-severity="warn"],[data-severity="bad"], .hpacc-extra-cluster[data-cluster="attention"],.data-quality-warning,.hpapply-status[data-good="0"], .diet-personal-note,.diet-matrix-insight-v540,.diet-matrix-reading-v5337,.diet-domain-placeholder ) { border: 1px solid var(--retro-dark) !important; border-left: 4px solid var(--retro-ink) !important; background: var(--retro-paper) !important; background-image: none !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .rec.ok,.hei-p1-component.achieved,[data-tone="ok"],.hpapply-status[data-good="1"] ) { border: 1px solid var(--retro-dark) !important; border-left: 4px solid var(--retro-dark) !important; background: var(--retro-paper) !important; background-image: none !important; box-shadow: none !important; } /* Inner action blocks read as part of the parent card instead of another floating window. */ html[data-theme="retro-2bit"] #mainContent#mainContent .diet-gram-action, html[data-theme="retro-2bit"] #mainContent#mainContent .diet-personal-action, html[data-theme="retro-2bit"] #mainContent#mainContent .diet-limiter-action { border: 0 !important; border-top: 1px solid var(--retro-dark) !important; padding-inline: 0 !important; background: transparent !important; box-shadow: none !important; } /* Small labels should not compete with titles and primary actions. */ html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .pill,.chip,.badge,.cat-count,.diet-acc-chip,.diet-domain-status,.diet-domain-value, .hpacc-value,.hpacc-target,.hpsr-badge,.hpwi-status span,.data-quality-version, .unit-quick-input-btn,.catalog-drawer-indicator ), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-head .cat-count { border-width: 1px !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(input,select,textarea), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(input,select,textarea) { border-width: 1px !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(button,.btn,[role="button"]), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(button,.btn,[role="button"]) { box-shadow: 2px 2px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is(button.secondary,button.ghost,.btn.secondary), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body :is(button.secondary,button.ghost,.btn.secondary) { box-shadow: none !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row.is-included { border-width: 2px !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .gemini-ration-draft-row.is-excluded { border-width: 1px !important; box-shadow: none !important; } /* Preserve the already approved matrix drawing itself. */ html[data-theme="retro-2bit"] :is( .diet-profile-v540 .diet-matrix-grid-v540,.diet-matrix-grid-v5337,.diet-matrix-grid-v5338, .diet-matrix-card,.diet-matrix-point-v5337,.diet-matrix-point ) { /* intentionally left to the matrix-specific v7 layer */ } @media (max-width:760px) { html[data-theme="retro-2bit"] section.card, html[data-theme="retro-2bit"] #needsCompact, html[data-theme="retro-2bit"] #geminiRationImportSection, html[data-theme="retro-2bit"] #globalSearchSection, html[data-theme="retro-2bit"] #rationSection, html[data-theme="retro-2bit"] #heiPanel, html[data-theme="retro-2bit"] #totalsSection, html[data-theme="retro-2bit"] #dietAnalysisProfilePanel, html[data-theme="retro-2bit"] #harvardPlatePanel, html[data-theme="retro-2bit"] #dataQualityPanel, html[data-theme="retro-2bit"] #presetsPanel, html[data-theme="retro-2bit"] #geminiAiSection, html[data-theme="retro-2bit"] #globalActions, html[data-theme="retro-2bit"] .legal-note { margin-block: 18px !important; box-shadow: 3px 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-item { box-shadow: none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details > summary, html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-head { min-height: 44px !important; padding: 10px !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details[open] > :not(summary), html[data-theme="retro-2bit"] #mainContent#mainContent .accordion-body, html[data-theme="retro-2bit"] #mainContent#mainContent .catalog-drawer-body { line-height: 1.5 !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details :is( .diet-personal-item,.diet-step-card,.diet-personal-plan,.diet-personal-note, .diet-zone-explain-grid > div,.diet-point-passport > div,.diet-method-facts > div, .diet-domain-detail-body,.diet-personal-narrative,.hpacc-item,.hpsr-card,.hpwi-row ) { margin-block: 10px !important; padding: 12px !important; } html[data-theme="retro-2bit"] h2 { font-size: clamp(22px,7vw,30px) !important; line-height: 1.16 !important; } html[data-theme="retro-2bit"] [data-retro-section-icon]::before { opacity: .72; } } } @media screen { /* Specificity correction for action blocks generated inside analytical details. */ html[data-theme="retro-2bit"] #mainContent#mainContent details .diet-gram-action, html[data-theme="retro-2bit"] #mainContent#mainContent details .diet-personal-action, html[data-theme="retro-2bit"] #mainContent#mainContent details .diet-limiter-action { border: 0 !important; border-top: 1px solid var(--retro-dark) !important; background: transparent !important; box-shadow: none !important; } @media (max-width:760px) { /* HEI summaries must not squeeze explanatory text into a one-word column. */ html[data-theme="retro-2bit"] #mainContent#mainContent details.hei-p1-all-fold > summary, html[data-theme="retro-2bit"] #mainContent#mainContent details.hei-p1-component > summary { display: grid !important; grid-template-columns: minmax(0,1fr) !important; align-items: start !important; justify-content: stretch !important; gap: 8px !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details.hei-p1-all-fold > summary > span, html[data-theme="retro-2bit"] #mainContent#mainContent details.hei-p1-all-fold > summary > b, html[data-theme="retro-2bit"] #mainContent#mainContent details.hei-p1-component > summary > span, html[data-theme="retro-2bit"] #mainContent#mainContent details.hei-p1-component > summary > b { width: 100% !important; min-width: 0 !important; max-width: 100% !important; white-space: normal !important; } html[data-theme="retro-2bit"] #mainContent#mainContent details.hei-p1-all-fold > summary > b, html[data-theme="retro-2bit"] #mainContent#mainContent details.hei-p1-component > summary > b { padding: 6px 8px !important; border-width: 1px !important; box-shadow: none !important; } } } @media screen { /* Runtime analytical modules inject equally specific card rules after load; this final shield keeps action blocks visually integrated with their parent. */ html[data-theme="retro-2bit"] #mainContent#mainContent#mainContent details .diet-gram-action, html[data-theme="retro-2bit"] #mainContent#mainContent#mainContent details .diet-personal-action, html[data-theme="retro-2bit"] #mainContent#mainContent#mainContent details .diet-limiter-action { border-top: 1px solid var(--retro-dark) !important; border-right-width: 0 !important; border-bottom-width: 0 !important; border-left-width: 0 !important; background: transparent !important; box-shadow: none !important; } } /* ===== END theme-retro-2bit-v9.css ===== */ /* ===== BEGIN theme-retro-2bit-v10.css sha256=614cfa77d34f4ff5e76cafa126bd25bdb18eab7d949fa5caae70dc02fa980163 ===== */ /* nutrition calculator v5.3.163 — 2-bit icon remaster Replaces the earlier ultra-primitive sprite with a more legible and more detailed pixel icon set while preserving the strict four-tone retro look. No logic, layout geometry or calculations are changed. */ @media screen { html[data-theme="retro-2bit"] { --retro-icon-size-v163: 18px; --retro-icon-gap-v163: 8px; --retro-section-icon-size-v163: 22px; } html[data-theme="retro-2bit"] [data-retro-icon], html[data-theme="retro-2bit"] [data-retro-section-icon] { --retro-icon-image-v163: none; } html[data-theme="retro-2bit"] [data-retro-icon]::before, html[data-theme="retro-2bit"] [data-retro-section-icon]::before { width: var(--retro-icon-size-v163) !important; height: var(--retro-icon-size-v163) !important; flex: 0 0 var(--retro-icon-size-v163) !important; margin-inline-end: var(--retro-icon-gap-v163) !important; background-image: var(--retro-icon-image-v163) !important; background-size: contain !important; background-position: center center !important; background-repeat: no-repeat !important; image-rendering: pixelated; image-rendering: crisp-edges; filter: none; } html[data-theme="retro-2bit"] [data-retro-section-icon]::before { width: var(--retro-section-icon-size-v163) !important; height: var(--retro-section-icon-size-v163) !important; flex-basis: var(--retro-section-icon-size-v163) !important; opacity: .88 !important; margin-top: .06em !important; } html[data-theme="retro-2bit"] button[data-retro-icon]:not(.secondary):not(.ghost)::before, html[data-theme="retro-2bit"] .btn[data-retro-icon]:not(.secondary):not(.ghost)::before, html[data-theme="retro-2bit"] [role="button"][data-retro-icon]:not(.secondary):not(.ghost)::before { filter: invert(1) contrast(1.03); } html[data-theme="retro-2bit"] .retro-icon-only { width: 46px !important; min-width: 46px !important; min-height: 44px !important; } html[data-theme="retro-2bit"] .retro-icon-only::before { width: 20px !important; height: 20px !important; } /* Individual icon mapping. */ html[data-theme="retro-2bit"] [data-retro-icon="info"], html[data-theme="retro-2bit"] [data-retro-section-icon="info"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/info.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="close"], html[data-theme="retro-2bit"] [data-retro-section-icon="close"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/close.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="search"], html[data-theme="retro-2bit"] [data-retro-section-icon="search"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/search.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="add"], html[data-theme="retro-2bit"] [data-retro-section-icon="add"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/add.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="remove"], html[data-theme="retro-2bit"] [data-retro-section-icon="remove"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/remove.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="edit"], html[data-theme="retro-2bit"] [data-retro-section-icon="edit"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/edit.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="print"], html[data-theme="retro-2bit"] [data-retro-section-icon="print"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/print.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="pdf"], html[data-theme="retro-2bit"] [data-retro-section-icon="pdf"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/pdf.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="calculate"], html[data-theme="retro-2bit"] [data-retro-section-icon="calculate"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/calculate.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="ration"], html[data-theme="retro-2bit"] [data-retro-section-icon="ration"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/ration.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="hei"], html[data-theme="retro-2bit"] [data-retro-section-icon="hei"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/hei.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="norms"], html[data-theme="retro-2bit"] [data-retro-section-icon="norms"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/norms.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="matrix"], html[data-theme="retro-2bit"] [data-retro-section-icon="matrix"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/matrix.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="plate"], html[data-theme="retro-2bit"] [data-retro-section-icon="plate"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/plate.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="ai"], html[data-theme="retro-2bit"] [data-retro-section-icon="ai"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/ai.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="upload"], html[data-theme="retro-2bit"] [data-retro-section-icon="upload"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/upload.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="camera"], html[data-theme="retro-2bit"] [data-retro-section-icon="camera"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/camera.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="audio"], html[data-theme="retro-2bit"] [data-retro-section-icon="audio"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/audio.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="reset"], html[data-theme="retro-2bit"] [data-retro-section-icon="reset"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/reset.svg"); } html[data-theme="retro-2bit"] [data-retro-icon="check"], html[data-theme="retro-2bit"] [data-retro-section-icon="check"] { --retro-icon-image-v163: url("../icons/retro-2bit-v2/check.svg"); } /* Checkboxes and radio buttons are also small theme symbols: give them a clearer pixel motif so they match the remastered icon family. */ html[data-theme="retro-2bit"] input[type="checkbox"]:checked { background-color: var(--retro-paper) !important; background-image: url("../icons/retro-2bit-v2/check.svg") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 12px 12px !important; } html[data-theme="retro-2bit"] input[type="radio"]:checked { background: linear-gradient(var(--retro-ink), var(--retro-ink)) center / 8px 8px no-repeat, var(--retro-paper) !important; } html[data-theme="retro-2bit"] input[type="checkbox"], html[data-theme="retro-2bit"] input[type="radio"] { box-shadow: 1px 1px 0 var(--retro-dark) !important; } /* Status symbols stay text-based, but the box becomes cleaner and more precise. */ html[data-theme="retro-2bit"] .alert::before, html[data-theme="retro-2bit"] [data-retro-state-glyph]::before { width: 17px !important; height: 17px !important; border-width: 1px !important; font-size: 11px !important; line-height: 1 !important; box-shadow: 1px 1px 0 currentColor; background: var(--retro-paper); } @media (max-width: 760px) { html[data-theme="retro-2bit"] { --retro-icon-size-v163: 17px; --retro-section-icon-size-v163: 20px; --retro-icon-gap-v163: 7px; } html[data-theme="retro-2bit"] .retro-icon-only { width: 44px !important; min-width: 44px !important; } } } /* ===== END theme-retro-2bit-v10.css ===== */ /* ===== BEGIN theme-retro-2bit-v11.css sha256=70edeb57856250b89423d427d0e62f87a637dfad01c329257127fc60adc760a9 ===== */ /* nutrition calculator v5.3.164 — retro clarity patch Scope: only the 2-bit theme. Fixes three issues reported from live mobile use: 1) Gemini working-state stripes and missing motion cue; 2) unreadable dark backgrounds inside strict Harvard plate sector cards; 3) clipped / awkward mobile layout inside HEI first-step cards. Logic is unchanged. */ @media screen { html[data-theme="retro-2bit"] { --retro-gemini-motion-duration-v164: 1.45s; } @keyframes retroGeminiScanV164 { 0% { transform: translateX(-130%); } 100% { transform: translateX(340%); } } @keyframes retroGeminiSpinV164 { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } /* ------------------------------------------------------------------ 1) Gemini: remove reading-obstructing hatch background and add a living motion indicator so the interface never looks frozen. ------------------------------------------------------------------ */ html[data-theme="retro-2bit"] .gemini-ration-import__status[data-state="working"], html[data-theme="retro-2bit"] .gemini-ai-status[data-state="working"], html[data-theme="retro-2bit"] .gemini-ration-import__privacy, html[data-theme="retro-2bit"] .gemini-ai-privacy, html[data-theme="retro-2bit"] .gemini-ai-caution, html[data-theme="retro-2bit"] .gemini-ai-strategy--caution { color: var(--retro-ink) !important; border: 1px solid var(--retro-dark) !important; border-left: 4px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; background-image: none !important; box-shadow: none !important; } html[data-theme="retro-2bit"] .gemini-ration-import__status[data-state="working"], html[data-theme="retro-2bit"] .gemini-ai-status[data-state="working"] { position: relative; min-height: 44px; padding: 10px 40px 10px 12px !important; line-height: 1.45 !important; } html[data-theme="retro-2bit"] .gemini-ration-import__status[data-state="working"]::after, html[data-theme="retro-2bit"] .gemini-ai-status[data-state="working"]::after { content: ""; position: absolute; top: 12px; right: 11px; width: 14px; height: 14px; border: 2px solid var(--retro-ink); border-right-color: transparent; animation: retroGeminiSpinV164 1s linear infinite; transform-origin: 50% 50%; } html[data-theme="retro-2bit"] .gemini-ration-import__progress, html[data-theme="retro-2bit"] .gemini-ai-progress { display: block !important; position: relative; height: 12px !important; margin-top: 8px !important; border: 1px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; background-image: none !important; box-shadow: none !important; overflow: hidden !important; } html[data-theme="retro-2bit"] .gemini-ration-import__progress[aria-hidden="true"], html[data-theme="retro-2bit"] .gemini-ai-progress[aria-hidden="true"] { display: none !important; } html[data-theme="retro-2bit"] .gemini-ration-import__progress::before, html[data-theme="retro-2bit"] .gemini-ai-progress::before { content: ""; position: absolute; top: 1px; bottom: 1px; left: 0; width: 32%; background: var(--retro-ink); animation: retroGeminiScanV164 var(--retro-gemini-motion-duration-v164) steps(18, end) infinite; } html[data-theme="retro-2bit"] .gemini-ration-import__progress span, html[data-theme="retro-2bit"] .gemini-ai-progress span { display: none !important; } /* ------------------------------------------------------------------ 2) Strict Harvard plate: keep sector cards readable in retro mode. The generic open-summary dark fill was too aggressive here. ------------------------------------------------------------------ */ html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-sector > summary[data-hp-sector-card], html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-item > summary { color: var(--retro-ink) !important; border: 1px solid var(--retro-dark) !important; border-radius: 0 !important; background: var(--retro-light) !important; background-image: none !important; box-shadow: inset 0 -1px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-sector[open] > summary[data-hp-sector-card], html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-sector[data-hpacc-selected="1"] > summary[data-hp-sector-card], html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-item[open] > summary { color: var(--retro-ink) !important; border-color: var(--retro-dark) !important; border-bottom: 1px solid var(--retro-dark) !important; background: var(--retro-paper) !important; background-image: none !important; box-shadow: inset 0 -1px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-sector > summary[data-hp-sector-card] *, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-item > summary * { color: inherit !important; border-color: currentColor !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-toggle-text, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-value, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-target { color: var(--retro-ink) !important; background: var(--retro-paper) !important; background-image: none !important; border: 1px solid var(--retro-dark) !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-main strong, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-main small, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-section-head h3, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-section-head p, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-sector-conclusion, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-sector-conclusion strong, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-extra-cluster > h4, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-extra-cluster > p, html[data-theme="retro-2bit"] #mainContent#mainContent .harvard-plate-caption { color: var(--retro-ink) !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-chevron { color: var(--retro-ink) !important; border: 1px solid var(--retro-dark) !important; background: var(--retro-paper) !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-body, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-inline-feedback, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-sector-conclusion, html[data-theme="retro-2bit"] #mainContent#mainContent .hpacc-extra-cluster { color: var(--retro-ink) !important; background: var(--retro-paper) !important; background-image: none !important; box-shadow: none !important; } /* ------------------------------------------------------------------ 3) HEI first-step cards: prevent narrow / clipped mobile composition. ------------------------------------------------------------------ */ html[data-theme="retro-2bit"] #heiLevers .hei-p1-action { min-height: 0 !important; overflow: visible !important; } html[data-theme="retro-2bit"] #heiLevers .hei-p1-step { margin-top: 10px !important; } html[data-theme="retro-2bit"] #heiLevers .hei-p1-calculation > summary { display: block !important; padding: 8px 10px !important; border: 1px solid var(--retro-dark) !important; background: var(--retro-paper) !important; color: var(--retro-ink) !important; } @media (max-width: 760px) { html[data-theme="retro-2bit"] #heiLevers .hei-p1-action-head { display: grid !important; grid-template-columns: 40px minmax(0, 1fr) !important; align-items: start !important; gap: 9px 10px !important; } html[data-theme="retro-2bit"] #heiLevers .hei-p1-action-head > div { min-width: 0 !important; } html[data-theme="retro-2bit"] #heiLevers .hei-p1-order { width: 34px !important; height: 34px !important; align-self: start !important; } html[data-theme="retro-2bit"] #heiLevers .hei-p1-potential { grid-column: 1 / -1 !important; justify-self: start !important; width: auto !important; max-width: 100% !important; margin-top: 1px !important; white-space: normal !important; text-align: left !important; line-height: 1.35 !important; } html[data-theme="retro-2bit"] #heiLevers .hei-p1-action h4, html[data-theme="retro-2bit"] #heiLevers .hei-p1-reason, html[data-theme="retro-2bit"] #heiLevers .hei-p1-step strong, html[data-theme="retro-2bit"] #heiLevers .hei-p1-calculation, html[data-theme="retro-2bit"] #heiLevers .hei-p1-calculation dd { max-width: none !important; white-space: normal !important; overflow-wrap: anywhere !important; } html[data-theme="retro-2bit"] #heiLevers .hei-p1-calculation dl > div { grid-template-columns: 1fr !important; gap: 3px !important; } } @media (prefers-reduced-motion: reduce) { html[data-theme="retro-2bit"] .gemini-ration-import__status[data-state="working"]::after, html[data-theme="retro-2bit"] .gemini-ai-status[data-state="working"]::after, html[data-theme="retro-2bit"] .gemini-ration-import__progress::before, html[data-theme="retro-2bit"] .gemini-ai-progress::before { animation: none !important; } } } /* v5.3.183: the JSON export action is always a labelled action, never an icon-only control. */ @media screen { html[data-theme="retro-2bit"] #exportRationJsonBtn.retro-icon-only { width:100% !important; min-width:0 !important; padding-inline:12px !important; overflow:visible !important; color:var(--retro-paper) !important; text-shadow:none !important; } html[data-theme="retro-2bit"] #exportRationJsonBtn.retro-icon-only::before { position:static !important; inset:auto !important; margin-inline-end:8px !important; transform:none !important; } } /* ===== END theme-retro-2bit-v11.css ===== */ /* ===== BEGIN theme-retro-2bit-v12.css sha256=f810f43ba8da250c9340a3a592a669c82e3a50311d0a19954ef49d094c863c9e ===== */ /* nutrition calculator v5.3.193 — 2-bit mobile vertical-rail reduction Screen-only visual layer. Long expanded containers keep horizontal pixel separators, while persistent side borders and lateral shadows are removed. Calculation, data, interaction and print/PDF behavior are untouched. */ @media screen and (max-width: 760px) { /* The page shell already frames the mobile screen. Major sections therefore use horizontal separators instead of adding another full-height frame. */ html[data-theme="retro-2bit"] #mainContent > section.card, html[data-theme="retro-2bit"] #mainContent > #needsCompact, html[data-theme="retro-2bit"] #mainContent > #globalActions, html[data-theme="retro-2bit"] #mainContent > .legal-note { border-left-width: 0 !important; border-right-width: 0 !important; box-shadow: 0 4px 0 var(--retro-dark) !important; } /* A long Gemini draft is content of the parent section, not another window. Keep its opening/closing rules but remove the two persistent side rails. */ html[data-theme="retro-2bit"] #geminiRationImportSection .gemini-ration-draft { margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; border-left-width: 0 !important; border-right-width: 0 !important; border-top-width: 2px !important; border-bottom-width: 2px !important; box-shadow: none !important; background: transparent !important; } html[data-theme="retro-2bit"] #geminiRationImportSection .gemini-ration-draft__head { padding: 12px !important; border-bottom: 2px solid var(--retro-ink) !important; background: var(--retro-light) !important; } html[data-theme="retro-2bit"] #geminiRationImportSection .gemini-ration-draft__rows { gap: 16px !important; padding: 0 !important; } /* Individual entries remain recognisable cards, but depth is shown below the card instead of as another vertical stripe down its right edge. */ html[data-theme="retro-2bit"] #geminiRationImportSection .gemini-ration-draft-row, html[data-theme="retro-2bit"] #geminiRationImportSection .gemini-ration-draft-row.is-included { margin-left: 0 !important; margin-right: 0 !important; box-shadow: 0 3px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] #geminiRationImportSection .gemini-ration-draft-row.is-excluded { box-shadow: none !important; } /* Tertiary information is integrated into the current entry. It no longer creates a fourth nested framed window. */ html[data-theme="retro-2bit"] #geminiRationImportSection .gemini-ration-draft-row__package, html[data-theme="retro-2bit"] #geminiRationImportSection .gemini-ration-draft-row__component, html[data-theme="retro-2bit"] #geminiRationImportSection .preparation-family-gemini-ui { border-left-width: 0 !important; border-right-width: 0 !important; box-shadow: none !important; } html[data-theme="retro-2bit"] #geminiRationImportSection .gemini-ration-draft-row__package, html[data-theme="retro-2bit"] #geminiRationImportSection .preparation-family-gemini-ui { padding-left: 0 !important; padding-right: 0 !important; background: transparent !important; } /* The same rule applies to long nested cards inside open accordions: the accordion owns the frame, while its reading surfaces use separators. */ html[data-theme="retro-2bit"] #mainContent details[open] .card .card, html[data-theme="retro-2bit"] #mainContent .accordion-item.open .card .card { border-left-width: 0 !important; border-right-width: 0 !important; box-shadow: none !important; } } /* ===== END theme-retro-2bit-v12.css ===== */ /* ===== BEGIN theme-switcher-v3.css sha256=0cc795a60ae2096964f47eb290d38cab2b54f3a143bba2a6b827c5706aab90a2 ===== */ /* nutrition calculator v5.3.155 — compact theme switcher, verified cascade One accessible switch with separate modern and authentic 2-bit visuals. The visible control stays compact; its interactive hit area is enlarged without allowing legacy mobile toolbar rules to stretch it to full width. */ @media screen { /* High-specificity structure: overrides legacy header mobile rules. */ header .toolbar > .theme-switcher, .toolbar > .theme-switcher, .theme-switcher { box-sizing: border-box; display: inline-flex !important; align-items: center !important; justify-content: flex-start !important; justify-self: start !important; flex: 0 0 auto !important; flex-wrap: nowrap !important; gap: 7px !important; width: max-content !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 3px 5px !important; overflow: visible !important; } .theme-switcher__label { flex: 0 0 auto; margin: 0 !important; white-space: nowrap; font-size: 10.5px !important; line-height: 1 !important; letter-spacing: .02em !important; text-transform: none !important; } header .toolbar .theme-switcher__toggle, .toolbar .theme-switcher__toggle, .theme-switcher__toggle { position: relative; display: inline-flex !important; align-items: center !important; justify-content: flex-start !important; flex: 0 0 auto !important; gap: 7px !important; width: auto !important; min-width: 0 !important; max-width: none !important; min-height: 34px !important; height: 34px !important; margin: 0 !important; padding: 3px 4px !important; border: 0 !important; border-radius: 9px !important; background: transparent !important; color: inherit !important; box-shadow: none !important; text-shadow: none !important; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; } /* A 44px-high touch area without making the visible switch bulky. */ .theme-switcher__toggle::after { content: ""; position: absolute; inset: -5px 0; } .theme-switcher__track { position: relative; display: block; flex: 0 0 auto; width: 36px; height: 20px; box-sizing: border-box; border: 1px solid #b8c5d3; border-radius: 999px; background: #dfe7ef; box-shadow: inset 0 1px 2px rgba(15,35,55,.12); transition: background-color 150ms ease, border-color 150ms ease; } .theme-switcher__thumb { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; box-sizing: border-box; border: 1px solid rgba(35,57,79,.16); border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(19,42,67,.25); transform: translateX(0); transition: transform 160ms cubic-bezier(.2,.8,.2,1), background-color 150ms ease; } .theme-switcher__current { display: block; flex: 0 0 auto; min-width: 68px; overflow: hidden; color: #33475d; font-size: 0; font-weight: 750; line-height: 1.1; text-align: left; text-overflow: ellipsis; white-space: nowrap; } .theme-switcher__current::before { content: "Современная"; font-size: 11px; } .theme-switcher__toggle[aria-checked="true"] .theme-switcher__track { border-color: #2167b7; background: #2674ca; } .theme-switcher__toggle[aria-checked="true"] .theme-switcher__thumb { transform: translateX(16px); } .theme-switcher__toggle:hover .theme-switcher__track { border-color: #7592af; } .theme-switcher__toggle:focus-visible { outline: 2px solid #1f63ad !important; outline-offset: 2px !important; box-shadow: none !important; } /* Modern theme: light, thin, unobtrusive. */ html:not([data-theme="retro-2bit"]) header .toolbar > .theme-switcher, html:not([data-theme="retro-2bit"]) .theme-switcher { border: 1px solid #d7e1eb !important; border-radius: 11px !important; background: rgba(255,255,255,.92) !important; box-shadow: 0 3px 10px rgba(31,55,79,.06) !important; } html:not([data-theme="retro-2bit"]) .theme-switcher__label { color: #68798c !important; } /* 2-bit theme: rectangular hardware-style pixel toggle. */ html[data-theme="retro-2bit"] header .toolbar > .theme-switcher, html[data-theme="retro-2bit"] .theme-switcher { grid-template-columns: none !important; border: 2px solid var(--retro-ink) !important; border-radius: 0 !important; background: var(--retro-paper) !important; box-shadow: 2px 2px 0 var(--retro-dark) !important; } html[data-theme="retro-2bit"] .theme-switcher__label { grid-column: auto !important; color: var(--retro-dark) !important; font-family: ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace !important; font-weight: 900 !important; letter-spacing: .04em !important; text-transform: uppercase !important; } html[data-theme="retro-2bit"] header .toolbar .theme-switcher__toggle, html[data-theme="retro-2bit"] .theme-switcher__toggle { min-height: 32px !important; height: 32px !important; padding: 3px 4px !important; border: 0 !important; border-radius: 0 !important; background: var(--retro-paper) !important; color: var(--retro-ink) !important; box-shadow: none !important; transition: none !important; } html[data-theme="retro-2bit"] .theme-switcher__toggle::after { inset: -6px 0; } html[data-theme="retro-2bit"] .theme-switcher__track { width: 38px; height: 20px; border: 2px solid var(--retro-ink); border-radius: 0; background: var(--retro-paper); box-shadow: 2px 2px 0 var(--retro-dark); transition: none; } html[data-theme="retro-2bit"] .theme-switcher__track::before { content: ""; position: absolute; inset: 2px 2px 2px 17px; background: repeating-linear-gradient(45deg,var(--retro-light) 0 2px,var(--retro-paper) 2px 4px); pointer-events: none; } html[data-theme="retro-2bit"] .theme-switcher__thumb { top: 2px; left: 2px; width: 12px; height: 12px; border: 0; border-radius: 0; background: var(--retro-ink); box-shadow: none; transform: translateX(18px); transition: none; } /* data-theme itself establishes the initial visual state before deferred JS runs. */ html[data-theme="retro-2bit"] .theme-switcher__toggle[aria-checked="false"] .theme-switcher__thumb, html[data-theme="retro-2bit"] .theme-switcher__toggle[aria-checked="true"] .theme-switcher__thumb { transform: translateX(18px); } html[data-theme="retro-2bit"] .theme-switcher__toggle[aria-checked="false"] .theme-switcher__track, html[data-theme="retro-2bit"] .theme-switcher__toggle[aria-checked="true"] .theme-switcher__track { border-color: var(--retro-ink); background: var(--retro-paper); } html[data-theme="retro-2bit"] .theme-switcher__current { min-width: 62px; color: var(--retro-ink) !important; font-family: ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace !important; font-size: 0; font-weight: 900; letter-spacing: .02em; text-transform: uppercase; } html[data-theme="retro-2bit"] .theme-switcher__current::before { content: "2-bit"; font-size: 10.5px; } html[data-theme="retro-2bit"] .theme-switcher__toggle:hover .theme-switcher__track { background: var(--retro-paper); } html[data-theme="retro-2bit"] .theme-switcher__toggle:focus-visible { outline: 2px dashed var(--retro-ink) !important; outline-offset: 2px !important; } @media (max-width: 760px) { header .toolbar > .theme-switcher, html[data-theme="retro-2bit"] header .toolbar > .theme-switcher, html:not([data-theme="retro-2bit"]) header .toolbar > .theme-switcher { width: max-content !important; min-width: 0 !important; max-width: 100% !important; justify-self: start !important; } header .toolbar .theme-switcher__toggle, html[data-theme="retro-2bit"] header .toolbar .theme-switcher__toggle { width: auto !important; min-width: 0 !important; max-width: none !important; flex: 0 0 auto !important; } } @media (prefers-reduced-motion: reduce) { .theme-switcher__track, .theme-switcher__thumb { transition: none !important; } } } /* ===== END theme-switcher-v3.css ===== */ /* ===== BEGIN theme-retro-2bit-print-v1.css sha256=ab56ba1845caaabf75c26df169df7c2fcf57a35c7791da68c9391c3ae2d4fa83 ===== */ /* nutrition calculator v5.3.148 — optional 2-bit print/PDF theme, pass 3 */ @page { size:A4; margin:13mm; } @media print { html[data-theme="retro-2bit"], html[data-theme="retro-2bit"] body { color:#111111 !important; background:#f4f4ef !important; font-family:ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace !important; print-color-adjust:exact; -webkit-print-color-adjust:exact; } html[data-theme="retro-2bit"] body { margin:0 !important; } html[data-theme="retro-2bit"] #mainContent, html[data-theme="retro-2bit"] .container { width:auto !important;max-width:none !important;border:0 !important;box-shadow:none !important;background:#f4f4ef !important; } html[data-theme="retro-2bit"] header, html[data-theme="retro-2bit"] .theme-switcher, html[data-theme="retro-2bit"] .toolbar, html[data-theme="retro-2bit"] button, html[data-theme="retro-2bit"] .btn, html[data-theme="retro-2bit"] .skip-link, html[data-theme="retro-2bit"] nav.workflow-steps, html[data-theme="retro-2bit"] #runtimeBootStatusOverlay { display:none !important; } html[data-theme="retro-2bit"] h1, html[data-theme="retro-2bit"] h2, html[data-theme="retro-2bit"] h3 { color:#111111 !important;break-after:avoid; } html[data-theme="retro-2bit"] h1 { border:4px solid #111111;padding:8px 10px;background:#b8b8b8 !important; } html[data-theme="retro-2bit"] h2 { border-bottom:3px double #111111;padding-bottom:5px; } html[data-theme="retro-2bit"] .card, html[data-theme="retro-2bit"] .pdf-section, html[data-theme="retro-2bit"] .nr-section, html[data-theme="retro-2bit"] .total-card, html[data-theme="retro-2bit"] details, html[data-theme="retro-2bit"] .alert, html[data-theme="retro-2bit"] .tile { color:#111111 !important; border:2px solid #111111 !important; border-radius:0 !important; background:#f4f4ef !important; box-shadow:none !important; break-inside:avoid; } html[data-theme="retro-2bit"] details { display:block !important; } html[data-theme="retro-2bit"] details > summary { list-style:none !important;border-bottom:1px solid #4a4a4a;padding-bottom:4px; } html[data-theme="retro-2bit"] table { width:100% !important;border-collapse:collapse !important; } html[data-theme="retro-2bit"] th { color:#f4f4ef !important;background:#111111 !important;border:1px solid #111111 !important; } html[data-theme="retro-2bit"] td { color:#111111 !important;background:#f4f4ef !important;border:1px solid #4a4a4a !important; } html[data-theme="retro-2bit"] tbody tr:nth-child(even) td { background:#b8b8b8 !important; } html[data-theme="retro-2bit"] .progress, html[data-theme="retro-2bit"] [class*="track"], html[data-theme="retro-2bit"] [class*="meter"] { border:1px solid #111111 !important;border-radius:0 !important;background:#f4f4ef !important; } html[data-theme="retro-2bit"] .bar, html[data-theme="retro-2bit"] [class*="fill"] { background:#4a4a4a !important; } html[data-theme="retro-2bit"] svg, html[data-theme="retro-2bit"] canvas, html[data-theme="retro-2bit"] img { filter:grayscale(1) contrast(1.12); } html[data-theme="retro-2bit"] [data-retro-icon]::before, html[data-theme="retro-2bit"] [data-retro-section-icon]::before { display:none !important; } html[data-theme="retro-2bit"] a { color:#111111 !important;text-decoration:underline !important; } html[data-theme="retro-2bit"] .muted, html[data-theme="retro-2bit"] small { color:#4a4a4a !important; } } /* ===== END theme-retro-2bit-print-v1.css ===== */ /* ===== BEGIN ai-nutrition-planner-v5.3.210.css sha256=fb8984ab103d9526ac1e9d72667402af1e38c39a2244da78f88d83c766081744 ===== */ /* v5.3.210 — deep multi-action correction and editable package preview */ .gemini-ai-section{overflow:visible;padding-bottom:max(34px,calc(env(safe-area-inset-bottom,0px) + 28px))} .gemini-ai-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.gemini-ai-head h2{margin:.35rem 0 .25rem;line-height:1.16}.gemini-ai-intro{max-width:82ch} .ai-planner-taskset,.ai-planner-scales,.ai-planner-constraints{border:0;padding:0;margin:18px 0}.ai-planner-taskset>legend,.ai-planner-scales>legend,.ai-planner-constraints>legend{font-weight:800;margin-bottom:9px} .ai-planner-task-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.ai-planner-task-card{display:block;position:relative}.ai-planner-task-card input{position:absolute;opacity:0;pointer-events:none}.ai-planner-task-card span{display:block;height:100%;border:1px solid var(--border,#c8ccd2);border-radius:14px;padding:13px;background:var(--surface,#fff);cursor:pointer}.ai-planner-task-card strong{display:block;margin-bottom:5px}.ai-planner-task-card small{display:block;line-height:1.35;opacity:.78}.ai-planner-task-card input:checked+span{border-color:var(--accent,#1668c7);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#1668c7) 18%,transparent);background:color-mix(in srgb,var(--accent,#1668c7) 7%,var(--surface,#fff))}.ai-planner-task-card input:focus-visible+span{outline:3px solid color-mix(in srgb,var(--accent,#1668c7) 28%,transparent);outline-offset:2px} .ai-planner-context-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.ai-planner-context-grid label{display:grid;gap:6px;font-weight:750}.ai-planner-context-grid select,.gemini-ai-constraint textarea{width:100%;border:1px solid var(--border,#c8ccd2);border-radius:12px;padding:11px 12px;background:var(--surface,#fff);color:inherit} .ai-planner-scale-grid{display:flex;flex-wrap:wrap;gap:8px}.ai-planner-scale-grid label{position:relative}.ai-planner-scale-grid input{position:absolute;opacity:0}.ai-planner-scale-grid span{display:block;border:1px solid var(--border,#c8ccd2);border-radius:999px;padding:9px 14px;cursor:pointer;font-weight:750}.ai-planner-scale-grid input:checked+span{background:var(--accent,#1668c7);border-color:var(--accent,#1668c7);color:#fff}.ai-planner-scale-help{margin:9px 0 0;max-width:76ch;font-size:.88rem;line-height:1.45;opacity:.76} .ai-planner-constraint-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 14px}.ai-planner-constraint-grid label{display:flex;gap:8px;align-items:flex-start;padding:9px 10px;border:1px solid var(--border,#d7dbe1);border-radius:11px;background:var(--surface-soft,#f7f8fa);line-height:1.35}.ai-planner-constraint-grid input{margin-top:3px} .ai-plan-summary,.ai-plan-empty{padding:15px 16px;border:1px solid var(--border,#d6d9de);border-radius:14px;background:var(--surface-soft,#f7f8fa);margin:16px 0}.ai-plan-summary p,.ai-plan-empty p{margin:.45rem 0 0}.ai-plan-summary-stats{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.ai-plan-summary-stats span{font-size:.82rem;padding:5px 8px;border-radius:999px;background:var(--surface,#fff);border:1px solid var(--border,#d9dde3)} .ai-plan-card{border:1px solid var(--border,#d6d9de);border-radius:17px;padding:16px;margin:16px 0;background:var(--surface,#fff);box-shadow:0 8px 24px rgba(0,0,0,.045)}.ai-plan-card header{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center}.ai-plan-card header span{font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;opacity:.68}.ai-plan-card header h3{margin:0;font-size:1.08rem}.ai-plan-card header b{font-size:.76rem;padding:4px 8px;border-radius:999px;background:#e8f5ec;color:#155b2e}.ai-plan-fixed-note{margin:10px 0 0;font-size:.9rem;opacity:.75}.ai-plan-ops{display:grid;gap:6px;margin:12px 0}.ai-plan-ops>div{padding:9px 11px;border-radius:10px;background:var(--surface-soft,#f6f7f8);font-weight:750}.ai-plan-why,.ai-plan-tradeoff{line-height:1.5} .ai-plan-macro-title{font-weight:850;margin:15px 0 8px}.ai-plan-macro-grid{display:grid;grid-template-columns:minmax(105px,1.25fr) repeat(4,minmax(72px,.78fr));border:1px solid var(--border,#d9dde3);border-radius:12px;overflow:hidden}.ai-plan-macro-grid>div{padding:8px 9px;border-right:1px solid var(--border,#e1e4e8);border-bottom:1px solid var(--border,#e1e4e8)}.ai-plan-macro-grid>div:nth-child(5n){border-right:0}.ai-plan-macro-grid>div:nth-last-child(-n+5){border-bottom:0}.ai-plan-macro-grid .head{font-size:.8rem;font-weight:800;background:var(--surface-soft,#f5f6f8)}.ai-plan-macro-grid .good{color:#19723a;font-weight:800}.ai-plan-macro-grid .warn{color:#9a6200;font-weight:800} .ai-plan-outcomes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0}.ai-plan-outcomes section{border:1px solid var(--border,#dde0e5);border-radius:12px;padding:11px;background:var(--surface-soft,#fafafa)}.ai-plan-outcomes h4{margin:0 0 7px;font-size:.92rem}.ai-plan-outcomes ul{margin:0;padding-left:18px}.ai-plan-outcomes li{margin:6px 0;line-height:1.35}.ai-plan-outcomes li span{opacity:.72}.ai-plan-none{font-size:.88rem;opacity:.72} .ai-plan-caution{padding:10px 12px;border-radius:10px;background:#fff3cd;color:#604800}.ai-plan-apply{width:100%;margin-top:10px}.ai-plan-full{margin-top:12px;border-top:1px solid var(--border,#ddd);padding-top:10px}.ai-plan-full summary{cursor:pointer;font-weight:800}.ai-plan-full-scroll{overflow:auto;margin-top:9px}.ai-plan-full table{width:100%;border-collapse:collapse;min-width:760px}.ai-plan-full th,.ai-plan-full td{padding:7px 8px;border-bottom:1px solid var(--border,#e1e4e8);text-align:left}.ai-plan-full th{position:sticky;top:0;background:var(--surface,#fff)}.ai-plan-full .status-low td:last-child,.ai-plan-full .status-high td:last-child{color:#9a6200;font-weight:800}.ai-plan-full .status-ok td:last-child{color:#19723a;font-weight:800} .ai-plan-candidates{margin-top:14px;border-top:1px solid var(--border,#ddd);padding-top:12px}.ai-plan-candidates>div{display:grid;grid-template-columns:1fr 1.3fr auto;gap:10px;padding:8px 0;border-bottom:1px dashed var(--border,#ddd)}.gemini-ai-output.is-stale{opacity:.62;position:relative}.gemini-ai-output.is-stale:before{content:'Рацион или нормы изменены — пересчитайте варианты';display:block;padding:10px 12px;border-radius:10px;background:#fff3cd;color:#6c5200;font-weight:800;margin-bottom:10px} @media(max-width:820px){.ai-planner-task-grid,.ai-plan-outcomes{grid-template-columns:1fr}.ai-planner-context-grid,.ai-planner-constraint-grid{grid-template-columns:1fr}.ai-plan-card header{grid-template-columns:1fr}.ai-plan-card header b{justify-self:start}.ai-plan-macro-grid{grid-template-columns:minmax(86px,1.1fr) repeat(4,minmax(62px,.76fr));font-size:.82rem}.ai-plan-macro-grid>div{padding:7px 6px}} @media(max-width:680px){.gemini-ai-section{padding-bottom:180px;padding-bottom:max(180px,calc(env(safe-area-inset-bottom,0px) + 168px))}.gemini-ai-head{display:block}.ai-planner-task-card span{padding:12px}.ai-plan-macro-grid{font-size:.8rem}.ai-plan-macro-grid .head{font-size:.72rem}.ai-plan-candidates>div{grid-template-columns:1fr}.ai-plan-card{padding:14px}} body[data-theme="retro-2bit"] .ai-plan-card,body[data-theme="retro-2bit"] .ai-plan-summary,body[data-theme="retro-2bit"] .ai-plan-empty,body[data-theme="retro-2bit"] .ai-planner-task-card span{border:2px solid currentColor;border-radius:0;box-shadow:4px 4px 0 currentColor}body[data-theme="retro-2bit"] .ai-plan-card header b,body[data-theme="retro-2bit"] .ai-plan-ops>div,body[data-theme="retro-2bit"] .ai-planner-scale-grid span{border-radius:0;border:1px solid currentColor} /* Deep correction scale */ .ai-planner-scale-grid span{min-width:148px;text-align:center}.ai-planner-scale-grid span strong,.ai-planner-scale-grid span small{display:block}.ai-planner-scale-grid span small{margin-top:2px;font-size:.74rem;font-weight:650;opacity:.82}.ai-planner-scale-grid input:checked+span small{opacity:.92} /* Editable complex actions */ .ai-plan-ops-editable{gap:9px}.ai-plan-op-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 12px;border:1px solid var(--border,#d9dde3);border-radius:12px;background:var(--surface-soft,#f6f7f8)}.ai-plan-op-enable{display:grid;grid-template-columns:22px minmax(0,1fr);gap:9px;align-items:start;cursor:pointer}.ai-plan-op-enable>input{position:absolute;opacity:0;pointer-events:none}.ai-plan-op-check{display:grid;place-items:center;width:20px;height:20px;border:2px solid var(--accent,#1668c7);border-radius:6px;background:var(--surface,#fff);margin-top:1px}.ai-plan-op-enable>input:checked+.ai-plan-op-check{background:var(--accent,#1668c7)}.ai-plan-op-enable>input:checked+.ai-plan-op-check:after{content:'✓';color:#fff;font-size:14px;font-weight:900;line-height:1}.ai-plan-op-enable>input:focus-visible+.ai-plan-op-check{outline:3px solid color-mix(in srgb,var(--accent,#1668c7) 25%,transparent);outline-offset:2px}.ai-plan-op-text{line-height:1.42}.ai-plan-op-amount{display:grid;grid-template-columns:auto minmax(70px,92px) auto;gap:6px;align-items:center;font-size:.78rem;font-weight:750}.ai-plan-op-amount>span{white-space:nowrap;opacity:.72}.ai-plan-op-amount input{width:100%;min-height:38px;padding:7px 8px;border:1px solid var(--border,#c8ccd2);border-radius:9px;background:var(--surface,#fff);color:inherit;font:inherit}.ai-plan-op-amount em{font-style:normal;opacity:.72}.ai-plan-op-replace-amounts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ai-plan-op-replace-amounts .ai-plan-op-amount{grid-template-columns:auto minmax(62px,78px) auto} .ai-plan-live-preview{margin-top:14px}.ai-plan-preview-ok,.ai-plan-preview-warning{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border-radius:11px;margin-bottom:12px}.ai-plan-preview-ok{background:#e8f5ec;color:#155b2e}.ai-plan-preview-warning{display:block;background:#fff3cd;color:#604800}.ai-plan-preview-ok strong{white-space:nowrap}.ai-plan-preview-warning p{margin:.35rem 0 0}.ai-plan-preview-warning ul{margin:.45rem 0 0;padding-left:19px}.ai-plan-apply:disabled{opacity:.5;cursor:not-allowed}.ai-plan-card[data-scenario-id^="sc_deep"]{border-width:2px}.ai-plan-card[data-scenario-id^="sc_deep"]>header span{font-weight:850;color:var(--accent,#1668c7)} @media(max-width:820px){.ai-plan-op-row{grid-template-columns:1fr}.ai-plan-op-amount{justify-self:stretch;grid-template-columns:1fr minmax(72px,110px) auto}.ai-plan-op-replace-amounts{grid-template-columns:1fr 1fr}.ai-plan-preview-ok{display:grid;gap:4px}} @media(max-width:520px){.ai-planner-scale-grid{display:grid;grid-template-columns:1fr}.ai-planner-scale-grid label,.ai-planner-scale-grid span{width:100%;min-width:0}.ai-plan-op-replace-amounts{grid-template-columns:1fr}.ai-plan-op-replace-amounts .ai-plan-op-amount{grid-template-columns:1fr minmax(72px,110px) auto}} body[data-theme="retro-2bit"] .ai-plan-op-row,body[data-theme="retro-2bit"] .ai-plan-op-check,body[data-theme="retro-2bit"] .ai-plan-op-amount input,body[data-theme="retro-2bit"] .ai-plan-preview-ok,body[data-theme="retro-2bit"] .ai-plan-preview-warning{border-radius:0}body[data-theme="retro-2bit"] .ai-plan-op-row{border:2px solid currentColor;box-shadow:3px 3px 0 currentColor} /* ===== END ai-nutrition-planner-v5.3.210.css ===== */ /* ===== BEGIN desktop-render-stability-v5.3.208.css sha256=f49f0d5488e55b7f127392296cfae5b173eee9d9ba603aa3303ba15b33022b81 ===== */ /* v5.3.208 — desktop render stability and unified content rail */ html{scrollbar-gutter:stable;} #heiPanel,#totalsSection,#dietAnalysisProfilePanel,#dataQualityPanel{overflow-anchor:none;} #heiLevers,#heiRecs,#heiTableBody,#totalsGrid,#microsGroups,#dietAnalysisProfilePanel, #heiLevers *,#heiRecs *,#totalsGrid *,#microsGroups *{ animation:none!important; } #heiLevers,#heiRecs,#totalsGrid,#microsGroups{transition:none!important;} @media (min-width:761px){ #mainContent.container{ width:min(100%,1200px)!important; max-width:1200px!important; margin-left:auto!important; margin-right:auto!important; padding-left:24px!important; padding-right:24px!important; box-sizing:border-box!important; overflow:visible!important; } #mainContent>.workflow-steps, #mainContent>section.card, #mainContent>details.card, #mainContent>#needsCompact, #mainContent>#geminiRationImportSection, #mainContent>#globalSearchSection, #mainContent>#rationSection, #mainContent>#heiPanel, #mainContent>#totalsSection, #mainContent>#dietAnalysisProfilePanel, #mainContent>#dataQualityPanel, #mainContent>#additionalToolsSection, #mainContent>#selectSection, #mainContent>#presetsPanel, #mainContent>#mealsSection, #mainContent>#geminiAiSection, #mainContent>#globalActions, #mainContent>#legal-note{ width:100%!important; max-width:none!important; min-width:0!important; margin-left:0!important; margin-right:0!important; transform:none!important; box-sizing:border-box!important; } #mainContent>section.card, #mainContent>details.card, #mainContent>#legal-note{clear:both!important;} #globalActions,#legal-note{max-width:none!important;} #heiPanel .table-wrap,#totalsSection .totals-grid,#dietAnalysisProfilePanel>*{min-width:0;} } @media (max-width:760px){ html{scrollbar-gutter:auto;} } @media (prefers-reduced-motion:reduce){ #heiPanel *,#totalsSection *,#dietAnalysisProfilePanel *{scroll-behavior:auto!important;transition-duration:0.01ms!important;} } /* ===== END desktop-render-stability-v5.3.208.css ===== */ /* ===== BEGIN release-gate-accessibility-v5.3.210-p0.5.css sha256=ffba0680c5fbe523087542c3b025534b8bbc52427296e1b61345e1c6682c2e7c ===== */ /* P0.5 release-gate accessibility corrections. Loaded last so the production bundle has one auditable contrast layer. */ html:not([data-theme="retro-2bit"]) #regionSeg button small { color: #40566f !important; opacity: 1 !important; } html:not([data-theme="retro-2bit"]) #regionSeg button.active small, html:not([data-theme="retro-2bit"]) #regionSeg button[aria-pressed="true"] small { color: #ffffff !important; opacity: 1 !important; } html:not([data-theme="retro-2bit"]) .theme-switcher__label, html:not([data-theme="retro-2bit"]) #strictHarvardPlateDetails > summary > span, html:not([data-theme="retro-2bit"]) .unit-tag, html:not([data-theme="retro-2bit"]) .sv-build-date { color: #4b5f75 !important; opacity: 1 !important; } html:not([data-theme="retro-2bit"]) .ai-planner-scale-grid input:checked + span { background: #08745a !important; border-color: #08745a !important; color: #ffffff !important; } html:not([data-theme="retro-2bit"]) .ai-planner-scale-grid input:checked + span strong, html:not([data-theme="retro-2bit"]) .ai-planner-scale-grid input:checked + span small { color: #ffffff !important; opacity: 1 !important; } /* ===== END release-gate-accessibility-v5.3.210-p0.5.css ===== */ /* ===== BEGIN professional-workflow-restoration-v5.3.210-rc2.css sha256=6cc7271e29c99053d99c7fe404d206cf24311a817ed8483b5589a3d38b6fe75c ===== */ /* v5.3.210-rc2 */ /* RC2 — restore the direct professional workflow and keep secondary tools secondary. */ .pc1-product-header,.p15-workflow,.p15-decision-summary,.pc1-scope-panel,.p15-result-overview,#p15CoreResults,#p15AdvancedAnalysis,#p15AiPlannerDrawer,#p20ValidationStatus{display:none!important} .rc2-professional-workflow #heiPanel,.rc2-professional-workflow #totalsSection,.rc2-professional-workflow #dietAnalysisProfilePanel,.rc2-professional-workflow #strictHarvardPlateDetails,.rc2-professional-workflow #dataQualityPanel{display:block!important;visibility:visible!important;opacity:1!important} .rc2-professional-workflow #heiPanel[aria-hidden="true"],.rc2-professional-workflow #totalsSection[aria-hidden="true"]{display:block!important} .rc2-current-ration-note{margin:8px 0 14px;color:#536273;font-size:14px;line-height:1.45}.rc2-current-ration-note[hidden]{display:none} .rc2-optional-input{margin:14px 0}.rc2-optional-input>summary{display:flex;align-items:center;justify-content:space-between;gap:14px;cursor:pointer;list-style:none}.rc2-optional-input>summary::-webkit-details-marker{display:none}.rc2-optional-input>summary>span:first-child{display:grid;gap:4px}.rc2-optional-input>summary small{color:#5d6b7c;font-weight:500;line-height:1.35}.rc2-optional-badge{padding:6px 10px;border-radius:999px;background:#eef4fb;color:#255789;font-size:12px;font-weight:800;white-space:nowrap}.rc2-optional-input__body{margin-top:12px}.rc2-optional-input__body>#geminiRationImportSection{margin:0!important;box-shadow:none!important} .rc2-protected-subdetails{margin:10px 0;border:1px solid #cbd7e3;border-radius:12px;background:#f8fbfe}.rc2-protected-subdetails>summary{display:grid;gap:3px;padding:12px 14px;cursor:pointer}.rc2-protected-subdetails>summary small{color:#5d6b7c;font-weight:500}.rc2-protected-subdetails__body{padding:0 14px 14px}.rc2-protected-subdetails__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.rc2-protected-subdetails__body>fieldset{margin:0!important;border:0!important;padding:0!important} .rc2-professional-workflow #needsProtectedModeContext:not([open])>*:not(summary){display:none!important} .rc2-professional-workflow #heiRecs,.rc2-professional-workflow #heiLevers,.rc2-professional-workflow #heiTable{display:revert!important;visibility:visible!important} @media(max-width:700px){.rc2-optional-input>summary{align-items:flex-start}.rc2-optional-badge{white-space:normal}.rc2-protected-subdetails__grid{grid-template-columns:1fr}.rc2-current-ration-note{font-size:13px}} @media print{.rc2-optional-input{display:none!important}.rc2-current-ration-note{display:block!important}.rc2-professional-workflow #heiPanel,.rc2-professional-workflow #totalsSection,.rc2-professional-workflow #dietAnalysisProfilePanel,.rc2-professional-workflow #strictHarvardPlateDetails,.rc2-professional-workflow #dataQualityPanel{display:block!important}} .rc2-professional-workflow #heiPanel #heiTableFold{display:block!important} .rc2-professional-workflow #heiTableFold[open]>.table-wrap{display:block!important} /* Contrast corrections for the restored HEI table. */ .rc2-professional-workflow #heiTableFold>summary small{color:#586879!important} .rc2-professional-workflow #heiTable thead th{color:#526174!important} /* ===== END professional-workflow-restoration-v5.3.210-rc2.css ===== */ /* ===== BEGIN release-support-v5.3.210-rc2.css sha256=6d5dff685b8d4cd9d4ec7faf4ebdfbf0f3a568d5f09b07230df0e7d01aa50366 ===== */ /* Nutrition Calculator v5.3.210-rc2 — release support */ /* RC2 deployment/support layer. */ .rc1-beta-support{margin:18px 0;border-color:#9fb7ce;background:linear-gradient(135deg,#f8fbff,#fff)} .rc1-beta-support>summary{display:flex;justify-content:space-between;align-items:center;gap:16px;cursor:pointer;list-style:none} .rc1-beta-support>summary::-webkit-details-marker{display:none}.rc1-beta-support>summary>span:first-child{display:grid;gap:3px}.rc1-beta-support>summary small{color:#526174;font-weight:500;line-height:1.35} .rc1-diag-badge{padding:6px 10px;border-radius:999px;background:#e9f2ff;color:#075a9c;font-size:12px;font-weight:900;white-space:nowrap}.rc1-diag-badge[data-tone="pass"]{background:#e4f7ed;color:#087443}.rc1-diag-badge[data-tone="warn"]{background:#fff0d6;color:#704000}.rc1-diag-badge[data-tone="fail"]{background:#fde8e5;color:#8f2f20} .rc1-beta-support__body{display:grid;gap:12px;margin-top:14px}.rc1-beta-support__body p{margin:0;line-height:1.5;color:#34495e}.rc1-release-line{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.rc1-release-line strong{color:#075a9c}.rc1-release-line span{font-size:12px;color:#526174} .rc1-support-actions{display:flex;gap:8px;flex-wrap:wrap}.rc1-support-actions button{min-height:40px}.rc1-diagnostic-results{display:grid;gap:10px}.rc1-diag-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.rc1-diag-summary span{padding:10px;border-radius:10px;border:1px solid #d7e1ec;background:#fff;text-align:center}.rc1-diag-summary span[data-tone="pass"]{border-color:#9dd7ba;background:#f3fbf7}.rc1-diag-summary span[data-tone="warn"]{border-color:#e1be7c;background:#fffaf1}.rc1-diag-summary span[data-tone="fail"]{border-color:#dfa69c;background:#fff9f7}.rc1-diag-summary strong{display:block;font-size:20px} .rc1-diag-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}.rc1-diag-list li{display:grid;grid-template-columns:minmax(170px,.45fr) minmax(0,1fr);gap:10px;padding:9px 10px;border-radius:10px;border-left:4px solid #5b7895;background:#f7f9fc}.rc1-diag-list li[data-status="pass"]{border-left-color:#087443}.rc1-diag-list li[data-status="warn"]{border-left-color:#a76300}.rc1-diag-list li[data-status="fail"]{border-left-color:#a43b28}.rc1-diag-list span{color:#526174;overflow-wrap:anywhere}.rc1-feedback-template{border:1px solid #d7e1ec;border-radius:10px;padding:9px 11px;background:#fff}.rc1-feedback-template summary{cursor:pointer;font-weight:800}.rc1-feedback-template ol{margin:9px 0 0;padding-left:22px;line-height:1.5;color:#43556a} @media(max-width:700px){.rc1-beta-support>summary,.rc1-release-line{align-items:flex-start}.rc1-diag-summary{grid-template-columns:1fr}.rc1-diag-list li{grid-template-columns:1fr}.rc1-support-actions{display:grid}.rc1-support-actions button{width:100%}} @media print{.rc1-beta-support{display:none!important}} /* ===== END release-support-v5.3.210-rc2.css ===== */ /* ===== BEGIN hei-assessment-v5.3.210-rc2-hf3.css sha256=d2caa7ff91337efe191bdc51e5fdc78a4c7d5234814e5736c36c2335a59a2e2e ===== */ /* HEI interpretation block — RC2 HOTFIX3: compact by default, details on demand. */ .hei-assessment{margin:10px 0 14px;padding:11px 12px;border:1px solid var(--line,#d8e0e8);border-radius:12px;background:var(--card,#fff);overflow-wrap:anywhere} .hei-assessment__head{display:flex;gap:8px;align-items:baseline;justify-content:space-between;margin-bottom:7px}.hei-assessment__head strong{font-size:14px}.hei-assessment__head span{font-size:11px;color:var(--muted-text,#667085);text-align:right} .hei-assessment__item{display:grid;grid-template-columns:minmax(190px,.42fr) minmax(0,1fr);gap:10px;align-items:start;padding:8px 10px;margin:6px 0;border-radius:9px;border-left:3px solid #b7791f;background:#fff8e8}.hei-assessment__item.is-critical{border-left-color:#b42318;background:#fff1f0}.hei-assessment__item p{margin:0;line-height:1.38;font-size:13px}.hei-assessment__item strong{font-size:13px;line-height:1.35} .hei-assessment__ok{margin:0;padding:7px 9px;border-radius:8px;background:#eef8f1;font-size:13px;line-height:1.35}.hei-assessment__more{margin:6px 0 0;font-size:12px;color:var(--muted-text,#667085)} .hei-assessment__limitations{margin-top:7px;border-top:1px solid var(--line,#d8e0e8);padding-top:7px}.hei-assessment__limitations>summary{cursor:pointer;font-size:12px;font-weight:750;color:#475467;list-style-position:inside}.hei-assessment__limitations ul{margin:7px 0 0;padding-left:20px;font-size:12px;line-height:1.4;color:#475467}.hei-assessment__limitations li+li{margin-top:4px}.hei-assessment__limitations p{margin:6px 0 0;font-size:12px;color:#667085} .hei-assessment__confidence{margin:7px 0 0;font-size:11px;line-height:1.35;color:var(--muted-text,#667085)} .hei-method-note{margin:0;font-size:13px;color:var(--muted-text,#667085)} @media(max-width:700px){.hei-assessment{padding:10px;margin:8px 0 12px}.hei-assessment__head{align-items:flex-start}.hei-assessment__head span{max-width:45%}.hei-assessment__item{grid-template-columns:1fr;gap:3px;padding:8px}.hei-assessment__item p{font-size:12px}.hei-assessment__ok{font-size:12px}} @media print{.hei-assessment__limitations{display:block}.hei-assessment__limitations>summary{list-style:none}.hei-assessment__limitations>summary::-webkit-details-marker{display:none}} /* Prevent the personalized HEI context row from extending the recommendation header beyond its card. */ .hei-p1-heading{min-width:0;flex-wrap:wrap}.hei-p2-profile-context{box-sizing:border-box;flex:1 1 100%;width:100%;max-width:100%;min-width:0}.hei-p2-profile-context>div{min-width:0} /* ===== END hei-assessment-v5.3.210-rc2-hf3.css ===== */ /* ===== BEGIN navigation-shell-v5.3.210-rc2-hf17.css sha256=0fb25859f3505c64d02741025b243f380f1a1adc50931bc10f66e0d2b58cc593 ===== */ /* Navigation shell v5.3.210 RC2 HF17. Stage 5A exposes one user interface and keeps the long page as a query-only technical fallback. */ .navigation-shell, .navigation-shell-context{display:none} .navigation-shell-long-return{display:none} html[data-navigation-shell="long"][data-navigation-long-fallback="technical"] .navigation-shell-long-return{ display:flex;position:sticky;top:8px;z-index:10090;align-items:center;justify-content:space-between;gap:16px;margin:0 0 12px;padding:12px 14px;border:1px solid #c9ddf5;border-radius:14px;background:#f6faff;box-shadow:0 8px 24px rgba(15,23,42,.08) } .navigation-shell-long-return>div{display:grid;gap:2px;min-width:0} .navigation-shell-long-return strong{color:#173d71;font-size:14px} .navigation-shell-long-return span{color:#60738c;font-size:12px;line-height:1.35} .navigation-shell-long-return button{flex:0 0 auto;min-height:44px!important;padding:9px 14px!important;border:1px solid #90baf0!important;border-radius:11px!important;background:#0b61d6!important;color:#fff!important;box-shadow:none!important;font-size:13px!important;font-weight:800!important} .navigation-shell-long-return button:focus-visible{outline:3px solid rgba(11,97,214,.3)!important;outline-offset:2px} html[data-navigation-shell="workspace"] body{--navshell-bottom-height:72px} html[data-navigation-shell="workspace"] #mainContent{ display:grid;grid-template-columns:minmax(156px,190px) minmax(0,1fr);column-gap:18px;align-items:start } html[data-navigation-shell="workspace"] #mainContent>header{grid-column:1/-1;margin-bottom:12px;padding:14px 16px} html[data-navigation-shell="workspace"] #mainContent>header>.title{font-size:clamp(20px,2.1vw,27px);line-height:1.08;max-width:620px} html[data-navigation-shell="workspace"] #mainContent>header>.toolbar{display:none;width:100%;margin-top:12px;padding-top:12px;border-top:1px solid #e4ebf3} html[data-navigation-shell="workspace"] #mainContent>header.navshell-settings-open>.toolbar{display:flex} html[data-navigation-shell="workspace"] #mainContent>.workflow-steps{display:none!important} html[data-navigation-shell="workspace"] #mainContent>.navshell-managed, html[data-navigation-shell="workspace"] #mainContent>#devPanel{grid-column:2;min-width:0} html[data-navigation-shell="workspace"] #mainContent>.navshell-managed[hidden]{display:none!important} html[data-navigation-shell="workspace"] #mainContent>.navshell-route-visible{scroll-margin-top:12px} html[data-navigation-shell="workspace"] .step-badge{display:none!important} html[data-navigation-shell="workspace"] #v40MiniCart{display:none!important} .navigation-shell{ grid-column:1;grid-row:2/span 80;display:flex;position:sticky;top:12px;z-index:70;align-self:start;flex-direction:column;gap:12px;padding:12px;border:1px solid #dbe5f0;border-radius:18px;background:rgba(255,255,255,.96);box-shadow:0 10px 30px rgba(15,23,42,.07);backdrop-filter:blur(12px) } .navigation-shell__brand{display:grid;gap:2px;padding:3px 5px 7px} .navigation-shell__brand strong{font-size:15px;color:#17243a} .navigation-shell__brand span{font-size:11px;color:#64748b} .navigation-shell__items{display:grid;gap:6px} .navigation-shell__items a{ display:flex;align-items:center;gap:10px;min-height:46px;padding:9px 10px;border:1px solid transparent;border-radius:12px;color:#40516a;text-decoration:none;font-size:14px;font-weight:750;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease } .navigation-shell__items a:hover,.navigation-shell__items a:focus-visible{background:#f2f7fd;border-color:#d6e5f7;color:#075bbd;transform:translateY(-1px)} .navigation-shell__items a.is-active{background:#eaf3ff;border-color:#bdd6f6;color:#075bbd} .navigation-shell__items svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto} .navigation-shell__secondary{display:grid;gap:6px;margin-top:auto;padding-top:10px;border-top:1px solid #e8eef5} .navigation-shell__secondary button{min-height:39px!important;padding:7px 8px!important;background:#fff!important;color:#40516a!important;border:1px solid #d7e2ef!important;border-radius:10px!important;box-shadow:none!important;font-size:12px!important} .navigation-shell-context{ grid-column:2;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;align-items:center;margin:0 0 14px;padding:14px 16px;border:1px solid #dbe5f0;border-radius:18px;background:linear-gradient(135deg,#fff 0%,#f6faff 100%);box-shadow:0 7px 22px rgba(15,23,42,.045);min-width:0 } .navigation-shell-context__copy{min-width:0} .navigation-shell-context__copy>span{display:block;margin-bottom:2px;color:#60738c;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase} .navigation-shell-context__copy h2{margin:0;color:#17243a;font-size:clamp(22px,2.5vw,31px);line-height:1.12;outline:none} .navigation-shell-context__copy p{margin:5px 0 0;color:#64748b;font-size:14px;line-height:1.42;max-width:780px} .navigation-shell-context__settings{min-height:40px!important;padding:8px 12px!important;background:#fff!important;color:#31577f!important;border:1px solid #cbdced!important;border-radius:11px!important;box-shadow:none!important;font-size:13px!important} .navigation-shell-context__kpi{ grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px!important;padding:9px 12px!important;border:1px solid #c9ddf5!important;border-radius:12px!important;background:#edf5ff!important;color:#173d71!important;box-shadow:none!important;text-align:left!important } .navigation-shell-context__kpi[hidden]{display:none!important} .navigation-shell-context__kpi span{font-size:12px;font-weight:700;color:#5d7592} .navigation-shell-context__kpi strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px} .navigation-shell-context__views,.navigation-shell-context__links{grid-column:1/-1;display:flex;gap:6px;flex-wrap:wrap;padding-top:2px} .navigation-shell-context__views[hidden],.navigation-shell-context__links[hidden]{display:none!important} .navigation-shell-context__views button,.navigation-shell-context__links button{ min-height:38px!important;min-width:0!important;padding:7px 13px!important;border:1px solid #d4e1ef!important;border-radius:999px!important;background:#fff!important;color:#40516a!important;box-shadow:none!important;font-size:13px!important } .navigation-shell-context__views button.is-active{border-color:#90baf0!important;background:#eaf3ff!important;color:#075bbd!important;font-weight:800!important} /* In correction view the existing HEI section becomes a focused recommendation projection. The full component table remains available in Analysis -> HEI. */ html[data-navigation-route="correction"] #heiPanel .hei-method-row, html[data-navigation-route="correction"] #heiPanel>#heiSummary, html[data-navigation-route="correction"] #heiPanel>#heiTableFold, html[data-navigation-route="correction"] #heiPanel .table-wrap, html[data-navigation-route="correction"] #heiPanel>#heiReference, html[data-navigation-route="correction"] #heiPanel>#heiMobileDashboard, html[data-navigation-route="correction"] #heiPanel>#whatifHint{display:none!important} html[data-navigation-route="correction"] #heiPanel{padding-top:16px!important} html[data-navigation-route="correction"] #heiPanel .section-title-block{margin-bottom:8px} @media(max-width:860px){ html[data-navigation-shell="workspace"] #mainContent{display:block;padding-bottom:calc(94px + env(safe-area-inset-bottom,0px))!important} html[data-navigation-shell="workspace"] #mainContent>header{margin-bottom:10px;padding:12px} html[data-navigation-shell="workspace"] #mainContent>header>.title{font-size:21px;max-width:calc(100% - 8px)} html[data-navigation-shell="workspace"] #mainContent>header>.toolbar{max-height:70vh;overflow:auto;overscroll-behavior:contain} .navigation-shell{ position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));top:auto;z-index:10080;display:block;padding:6px;border-radius:18px;box-shadow:0 13px 36px rgba(15,23,42,.22) } .navigation-shell__brand,.navigation-shell__secondary{display:none} .navigation-shell__items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px} .navigation-shell__items a{display:grid;justify-items:center;align-content:center;gap:2px;min-height:56px;padding:5px 2px;border-radius:13px;font-size:10.5px;line-height:1.1;text-align:center} .navigation-shell__items svg{width:22px;height:22px} .navigation-shell__items a:hover,.navigation-shell__items a:focus-visible{transform:none} .navigation-shell-context{display:grid;margin-bottom:10px;padding:12px;border-radius:15px;grid-template-columns:minmax(0,1fr) auto;gap:8px 10px} .navigation-shell-context__copy h2{font-size:23px} .navigation-shell-context__copy p{font-size:13px;line-height:1.38} .navigation-shell-context__settings{min-height:38px!important;padding:7px 10px!important} .navigation-shell-context__kpi{min-height:46px!important} .navigation-shell-context__kpi span{display:none} .navigation-shell-context__kpi strong{width:100%;font-size:13px} html[data-navigation-shell="workspace"] #globalActions{margin-bottom:12px!important} } @media(max-width:860px){ html[data-navigation-shell="long"][data-navigation-long-fallback="technical"] #mainContent>header{ display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;align-items:start!important;min-width:0!important;max-width:100%!important } html[data-navigation-shell="long"][data-navigation-long-fallback="technical"] #mainContent>header>.title, html[data-navigation-shell="long"][data-navigation-long-fallback="technical"] #mainContent>header>.toolbar{ width:100%!important;min-width:0!important;max-width:100%!important } html[data-navigation-shell="long"][data-navigation-long-fallback="technical"] #mainContent>header>.toolbar{ display:grid!important;grid-template-columns:minmax(0,1fr)!important;overflow:hidden!important } html[data-navigation-shell="long"][data-navigation-long-fallback="technical"] #mainContent>header>.toolbar>*, html[data-navigation-shell="long"][data-navigation-long-fallback="technical"] #normRegionSwitcher, html[data-navigation-shell="long"][data-navigation-long-fallback="technical"] #themeSwitcher{ width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important } } @media(max-width:620px){ html[data-navigation-shell="long"][data-navigation-long-fallback="technical"] .navigation-shell-long-return{position:relative;top:auto;display:grid;gap:10px;padding:12px} .navigation-shell-long-return button{width:100%} } @media(max-width:430px){ html[data-navigation-shell="workspace"] #mainContent>header{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;align-items:start} html[data-navigation-shell="workspace"] #mainContent>header>.title{font-size:20px;max-width:100%;min-width:0} .navigation-shell-context{grid-template-columns:minmax(0,1fr)} .navigation-shell-context__settings{grid-row:1;justify-self:end;position:absolute;right:22px;margin-top:0} .navigation-shell-context__copy{padding-right:76px} .navigation-shell-context__copy p{padding-right:0} .navigation-shell-context__views,.navigation-shell-context__links{overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px;scrollbar-width:none} .navigation-shell-context__views::-webkit-scrollbar,.navigation-shell-context__links::-webkit-scrollbar{display:none} .navigation-shell-context__views button,.navigation-shell-context__links button{white-space:nowrap;flex:0 0 auto} } @media print{ .navigation-shell,.navigation-shell-context,.navigation-shell-long-return{display:none!important} } html[data-theme="retro-2bit"] .navigation-shell, html[data-theme="retro-2bit"] .navigation-shell-context, html[data-theme="retro-2bit"] .navigation-shell-long-return{border-radius:0!important;backdrop-filter:none;box-shadow:4px 4px 0 rgba(10,31,56,.26)!important} html[data-theme="retro-2bit"] .navigation-shell__items a, html[data-theme="retro-2bit"] .navigation-shell__secondary button, html[data-theme="retro-2bit"] .navigation-shell-context button, html[data-theme="retro-2bit"] .navigation-shell-long-return button{border-radius:0!important} /* The workspace shell is the ordinary interface; the long page is visible only in the technical fallback. */ html:not([data-navigation-shell="workspace"]) .navigation-shell, html:not([data-navigation-shell="workspace"]) .navigation-shell-context{display:none!important} /* Specificity guards against the legacy global button theme. */ html[data-navigation-shell="workspace"] #navigationShell .navigation-shell__secondary button{ background:#fff!important;color:#40516a!important;border:1px solid #d7e2ef!important;box-shadow:none!important } html[data-navigation-shell="workspace"] #navigationShellContext #navigationShellRationKpi{ background:#edf5ff!important;color:#173d71!important;border-color:#c9ddf5!important;box-shadow:none!important } html[data-navigation-shell="workspace"] #navigationShellContext #navigationShellRationKpi span{color:#4d6989!important} html[data-navigation-shell="workspace"] #navigationShellContext #navigationShellRationKpi strong{color:#173d71!important} html[data-navigation-shell="workspace"] #navigationShellContext .navigation-shell-context__views button, html[data-navigation-shell="workspace"] #navigationShellContext .navigation-shell-context__links button{ background:#fff!important;color:#40516a!important;border-color:#d4e1ef!important;box-shadow:none!important } html[data-navigation-shell="workspace"] #navigationShellContext .navigation-shell-context__views button.is-active{ background:#0b61d6!important;color:#fff!important;border-color:#0b61d6!important;font-weight:800!important } html[data-navigation-shell="workspace"] #needsCompact::before{content:none!important;display:none!important} @media(max-width:430px){ html[data-navigation-shell="workspace"] .navigation-shell-context__copy{padding-right:112px} } /* HF13 route isolation: late renderers may alter the hidden attribute, but they must never leak inactive workspaces back into the current route. */ html[data-navigation-shell="workspace"] #mainContent>.navshell-managed:not(.navshell-route-visible){display:none!important} html[data-navigation-shell="workspace"] #mainContent>.navshell-managed.navshell-route-visible{grid-column:2;min-width:0} /* HF13 profile-first route and compact person context. */ html[data-navigation-route="profile"] #navigationShellRationKpi{display:none!important} html[data-navigation-route="profile"] .navigation-shell-context__copy{padding-right:0!important} html[data-navigation-route="profile"] #navigationShellProfileButton{display:none!important} html[data-navigation-route="profile"] #needsCompact{margin:0 0 14px!important} @media(max-width:720px){html[data-navigation-route="profile"] .navigation-shell-context__copy{padding-right:0!important}} /* ===== END navigation-shell-v5.3.210-rc2-hf17.css ===== */ /* ===== BEGIN workspace-ration-overview-v5.3.210-rc2-hf8.css sha256=d9d07285434a6002601f2ee2ebcaf03471023da38d9c0c0a0f2a2f0a10f4e795 ===== */ /* HF8 ration and concise overview: profile and needs live in their own route. */ #workspaceRationInlineSummary,#workspaceOverviewPanel,#workspaceRationSecondary,#workspaceRationEmpty{display:none} html[data-navigation-shell="workspace"] #workspaceRationInlineSummary{ grid-column:1/-1;display:grid;gap:12px;padding-top:12px;border-top:1px solid #dbe6f2 } html[data-navigation-shell="workspace"] .workspace-ration-inline__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px} html[data-navigation-shell="workspace"] .workspace-ration-inline__head>div{display:grid;gap:2px;min-width:0} html[data-navigation-shell="workspace"] .workspace-ration-inline__head span{color:#60738c;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase} html[data-navigation-shell="workspace"] .workspace-ration-inline__head strong{color:#17243a;font-size:17px;line-height:1.2} html[data-navigation-shell="workspace"] .workspace-ration-inline__head small{color:#64748b;font-size:12px;line-height:1.35} html[data-navigation-shell="workspace"] #workspaceRationAttention{ min-height:38px!important;max-width:290px;padding:7px 11px!important;border:1px solid #c9dced!important;border-radius:10px!important;background:#fff!important;color:#31577f!important;box-shadow:none!important;font-size:12px!important;text-align:center } html[data-navigation-shell="workspace"] #workspaceRationAttention.has-attention{border-color:#edc16b!important;background:#fff8e8!important;color:#80520c!important} html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px} html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics>div{ display:grid;gap:2px;min-width:0;padding:10px 11px;border:1px solid #dce7f2;border-radius:11px;background:#fff } html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics span{color:#64748b;font-size:11px;font-weight:700} html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics strong{overflow:hidden;color:#183654;font-size:16px;line-height:1.15;text-overflow:ellipsis;white-space:nowrap} html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics small{color:#7b8da2;font-size:10.5px} html[data-navigation-shell="workspace"] .workspace-ration-inline__actions{display:flex;gap:8px;flex-wrap:wrap} html[data-navigation-shell="workspace"] .workspace-ration-inline__actions button{min-height:39px!important;padding:8px 13px!important;font-size:13px!important} /* The context header becomes the true compact ration header. */ html[data-navigation-route="ration"] #navigationShellContext{margin-bottom:12px} html[data-navigation-route="ration"] #navigationShellRationKpi{display:none!important} /* Ration route order: action first, working list second, secondary controls last. */ html[data-navigation-route="ration"] #globalSearchSection{order:10} html[data-navigation-route="ration"] #rationSection{order:20} html[data-navigation-route="ration"] #workspaceRationSecondary{order:30} html[data-navigation-route="ration"] #geminiRationImportSection{order:50} html[data-navigation-route="ration"] #rc2AlternativeInput{order:51} html[data-navigation-route="ration"] #additionalToolsSection{order:52} html[data-navigation-route="ration"] #globalSearchSection, html[data-navigation-route="ration"] #rationSection{margin:0 0 12px!important} html[data-navigation-route="ration"] #globalSearchSection{padding:16px!important} html[data-navigation-route="ration"] #globalSearchSection .search-hero-head{margin-bottom:10px} html[data-navigation-route="ration"] #globalSearchSection .search-lead{max-width:760px;margin-top:4px;font-size:13px;line-height:1.4} html[data-navigation-route="ration"] #globalSearchSection .search-field-hint{font-size:11.5px} html[data-navigation-route="ration"] #globalSearchSection .search-db-count{align-self:start} html[data-navigation-route="ration"] #rationSection{padding:16px!important} html[data-navigation-route="ration"] #rationSection .ration-subtitle{font-size:13px;line-height:1.4} html[data-navigation-route="ration"] #rationSection #rationUiLegend{display:none!important} html[data-navigation-route="ration"] #rationSection>.toolbar{justify-content:flex-start!important;padding-top:10px;border-top:1px solid #e6edf5} html[data-navigation-route="ration"] #rationSection>.toolbar button:not(#clearRationBtn){display:none!important} html[data-navigation-route="ration"] #rationSection>.footer-note{display:none} html[data-navigation-route="ration"] #rationSection #clearRationBtn{min-height:38px!important;padding:7px 11px!important;background:#fff7f7!important;color:#a33a3a!important;border:1px solid #f0caca!important;box-shadow:none!important} html[data-navigation-route="ration"] #workspaceRationEmpty{display:grid;justify-items:start;gap:7px;margin:8px 0 12px;padding:18px;border:1px dashed #b9cce0;border-radius:14px;background:#f7fbff} html[data-navigation-route="ration"] #workspaceRationEmpty[hidden]{display:none!important} html[data-navigation-route="ration"] #workspaceRationEmpty strong{color:#1c334e;font-size:16px} html[data-navigation-route="ration"] #workspaceRationEmpty p{margin:0;color:#64748b;font-size:13px;line-height:1.45} html[data-navigation-route="ration"] #workspaceRationEmpty button{min-height:38px!important;padding:7px 12px!important;font-size:13px!important} html[data-navigation-route="ration"] #rationTable.workspace-ration-table-empty{display:none!important} html[data-navigation-route="ration"] #workspaceRationSecondary{display:block!important;margin:0 0 12px!important;padding:0!important;overflow:hidden} html[data-navigation-route="ration"] #workspaceRationSecondary>summary{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;cursor:pointer;list-style:none} html[data-navigation-route="ration"] #workspaceRationSecondary>summary::-webkit-details-marker{display:none} html[data-navigation-route="ration"] #workspaceRationSecondary>summary>span{display:grid;gap:2px} html[data-navigation-route="ration"] #workspaceRationSecondary>summary strong{color:#203650;font-size:14px} html[data-navigation-route="ration"] #workspaceRationSecondary>summary small{color:#596d84;font-size:11.5px;line-height:1.35} html[data-navigation-route="ration"] #workspaceRationSecondary>summary b{color:#0b61d6;font-size:12px} html[data-navigation-route="ration"] #workspaceRationSecondary[open]>summary b{font-size:0} html[data-navigation-route="ration"] #workspaceRationSecondary[open]>summary b:after{content:"Свернуть";font-size:12px} html[data-navigation-route="ration"] .workspace-ration-secondary__note{padding:0 16px 14px;color:#64748b;font-size:12px;line-height:1.45} html[data-navigation-route="ration"][data-workspace-secondary-open="0"] #geminiRationImportSection, html[data-navigation-route="ration"][data-workspace-secondary-open="0"] #rc2AlternativeInput, html[data-navigation-route="ration"][data-workspace-secondary-open="0"] #additionalToolsSection, html[data-navigation-route="ration"]:not([data-workspace-secondary-open]) #geminiRationImportSection, html[data-navigation-route="ration"]:not([data-workspace-secondary-open]) #rc2AlternativeInput, html[data-navigation-route="ration"]:not([data-workspace-secondary-open]) #additionalToolsSection{display:none!important} /* A purpose-built overview replaces reuse of the long report blocks. */ html[data-navigation-route="analysis/overview"] #workspaceOverviewPanel{display:grid!important;gap:16px;margin:0 0 14px;padding:18px!important} .workspace-overview__head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px} .workspace-overview__head>div{min-width:0} .workspace-overview__head>div>span,.workspace-overview__section-head span{display:block;color:#60738c;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase} .workspace-overview__head h2{margin:2px 0 5px;color:#17243a;font-size:22px;line-height:1.18} .workspace-overview__head p{max-width:790px;margin:0;color:#52667e;font-size:14px;line-height:1.48} .workspace-overview__head>button{flex:0 0 auto;min-height:39px!important;padding:7px 12px!important;font-size:13px!important} .workspace-overview__metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px} .workspace-overview__metrics article{display:grid;gap:3px;padding:13px;border:1px solid #dbe6f1;border-radius:13px;background:#f9fbfe} .workspace-overview__metrics span{color:#64748b;font-size:11px;font-weight:750} .workspace-overview__metrics strong{color:#183654;font-size:21px;line-height:1.15} .workspace-overview__metrics small{color:#596d84;font-size:11px;line-height:1.3} .workspace-overview__issues{display:grid;gap:10px} .workspace-overview__section-head{display:flex;align-items:end;justify-content:space-between;gap:14px;padding-top:2px} .workspace-overview__section-head h3{margin:2px 0 0;color:#17243a;font-size:18px} .workspace-overview__section-head>small{color:#596d84;font-size:12px} #workspaceOverviewIssueList{display:grid;gap:8px} .workspace-issue{display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;padding:12px;border:1px solid #dde6f0;border-radius:12px;background:#fff} .workspace-issue>span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#eaf2fb;color:#31577f;font-size:12px;font-weight:800} .workspace-issue strong{display:block;color:#263a52;font-size:14px;line-height:1.35} .workspace-issue p{margin:3px 0 0;color:#5e7188;font-size:12.5px;line-height:1.42} .workspace-issue small{display:block;margin-top:4px;color:#7b5d1e;font-size:11.5px;line-height:1.35} .workspace-issue.is-critical{border-color:#efc1c1;background:#fff8f8}.workspace-issue.is-critical>span{background:#f8dada;color:#8c2424} .workspace-issue.is-high{border-color:#edcf91;background:#fffaf0}.workspace-issue.is-high>span{background:#f8e5b8;color:#80520c} .workspace-issue.is-low,.workspace-issue.is-structure{border-color:#cadbef;background:#f8fbff} .workspace-issue.is-ok{border-color:#c7dfcf;background:#f7fcf8}.workspace-issue.is-ok>span{background:#dcefe2;color:#2c6840} .workspace-overview__empty{display:grid;justify-items:start;gap:6px;padding:16px;border:1px dashed #b9cce0;border-radius:12px;background:#f7fbff} .workspace-overview__empty p{margin:0;color:#64748b;font-size:13px}.workspace-overview__empty button{min-height:38px!important;padding:7px 12px!important} .workspace-overview__quality{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:12px 14px;border:1px solid #dce6ef;border-radius:12px;background:#f7f9fc} .workspace-overview__quality strong{color:#30465f;font-size:13px}.workspace-overview__quality span{max-width:710px;color:#64748b;font-size:12px;line-height:1.42;text-align:right} .workspace-overview__actions{display:flex;gap:8px;flex-wrap:wrap;padding-top:2px}.workspace-overview__actions button{min-height:40px!important;padding:8px 13px!important;font-size:13px!important} @media(max-width:860px){ html[data-navigation-shell="workspace"] #mainContent{display:flex!important;flex-direction:column!important} html[data-navigation-shell="workspace"] #mainContent>header{order:-100} html[data-navigation-shell="workspace"] #navigationShellContext{order:-90} html[data-navigation-shell="workspace"] #navigationShell{order:1000} html[data-navigation-shell="workspace"] #mainContent>.navshell-route-visible{width:100%;min-width:0} html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics{grid-template-columns:repeat(2,minmax(0,1fr))} html[data-navigation-shell="workspace"] .workspace-ration-inline__head{display:grid;gap:8px} html[data-navigation-shell="workspace"] #workspaceRationAttention{max-width:none;width:100%} .workspace-overview__metrics{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:560px){ html[data-navigation-shell="workspace"] #navigationShellContext{padding:12px!important} html[data-navigation-shell="workspace"] #workspaceRationInlineSummary{gap:10px;padding-top:10px} html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics{gap:6px} html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics>div{padding:9px} html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics strong{font-size:15px} html[data-navigation-shell="workspace"] .workspace-ration-inline__actions{display:grid;grid-template-columns:1fr 1fr} html[data-navigation-route="ration"] #globalSearchSection,html[data-navigation-route="ration"] #rationSection{padding:13px!important} html[data-navigation-route="ration"] #globalSearchSection .search-hero-head{display:block} html[data-navigation-route="ration"] #globalSearchSection .search-db-count{display:none} html[data-navigation-route="ration"] #globalSearchSection .search-lead{font-size:12.5px} html[data-navigation-route="ration"] #globalSearchSection .quick-searches{display:none} .workspace-overview__head{display:grid;gap:10px}.workspace-overview__head>button{width:100%} .workspace-overview__metrics{grid-template-columns:1fr 1fr;gap:7px}.workspace-overview__metrics article{padding:10px}.workspace-overview__metrics strong{font-size:18px} .workspace-overview__quality{display:grid;gap:4px}.workspace-overview__quality span{text-align:left} .workspace-overview__actions{display:grid;grid-template-columns:1fr}.workspace-overview__actions button{width:100%} } @media print{#workspaceRationInlineSummary,#workspaceOverviewPanel,#workspaceRationSecondary,#workspaceRationEmpty{display:none!important}} html[data-theme="retro-2bit"] #workspaceRationInlineSummary .workspace-ration-inline__metrics>div, html[data-theme="retro-2bit"] #workspaceOverviewPanel, html[data-theme="retro-2bit"] #workspaceRationSecondary, html[data-theme="retro-2bit"] #workspaceRationEmpty, html[data-theme="retro-2bit"] .workspace-overview__metrics article, html[data-theme="retro-2bit"] .workspace-issue{border-radius:0!important;box-shadow:3px 3px 0 rgba(10,31,56,.18)!important} /* HF8 review refinement: keep the ration summary in its own route, make settings reserve real space on narrow screens, and keep legacy controls out of the working surface until the user opens Settings. */ html[data-navigation-shell="workspace"] #mainContent>header>.toolbar{display:none!important} html[data-navigation-shell="workspace"] #mainContent>header.navshell-settings-open>.toolbar{display:grid!important} html[data-navigation-shell="workspace"] #workspaceRationInlineSummary{display:none!important} html[data-navigation-shell="workspace"][data-navigation-route="ration"] #workspaceRationInlineSummary{display:grid!important} @media(max-width:430px){ html[data-navigation-shell="workspace"] .navigation-shell-context{grid-template-columns:minmax(0,1fr) auto!important} html[data-navigation-shell="workspace"] .navigation-shell-context__copy{grid-column:1;grid-row:1;padding-right:0!important} html[data-navigation-shell="workspace"] .navigation-shell-context__settings{position:static!important;grid-column:2;grid-row:1;align-self:start;justify-self:end;right:auto!important;margin:0!important} html[data-navigation-shell="workspace"] .navigation-shell-context__views, html[data-navigation-shell="workspace"] .navigation-shell-context__links, html[data-navigation-shell="workspace"] #workspaceRationInlineSummary{grid-column:1/-1} } /* WCAG contrast refinement after automated review. */ html[data-navigation-shell="workspace"] .workspace-ration-inline__metrics small, html[data-navigation-route="ration"] #workspaceRationSecondary>summary small{color:#566b83} /* ===== END workspace-ration-overview-v5.3.210-rc2-hf8.css ===== */ /* ===== BEGIN workspace-profile-needs-v5.3.210-rc2-hf8.css sha256=921ebe9237487d2950ad8b53b399b52fd48d1cc648ac63523ea9b77e13a2268a ===== */ /* HF8: profile and calculated needs precede ration work. */ #workspaceProfilePanel,#workspacePersonContext{display:none} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #workspaceProfilePanel{ display:grid!important;gap:16px;margin:0 0 14px;padding:18px!important } .workspace-profile-panel__tools{display:flex;align-items:center;justify-content:space-between;gap:12px} .workspace-profile-panel__tools span{color:#526b87;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase} .workspace-profile-panel__tools button{flex:0 0 auto;min-height:36px!important;padding:7px 10px!important;font-size:12px!important} .workspace-profile-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none} .workspace-profile-steps li{display:flex;align-items:center;gap:9px;min-width:0;padding:11px;border:1px solid #dce6f0;border-radius:12px;background:#f9fbfd} .workspace-profile-steps li b{display:grid;place-items:center;flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:#e5edf6;color:#365675;font-size:12px} .workspace-profile-steps li span{display:grid;min-width:0} .workspace-profile-steps li strong{color:#263a52;font-size:13px;line-height:1.25} .workspace-profile-steps li small{color:#60738a;font-size:11px;line-height:1.25} .workspace-profile-steps li.is-current{border-color:#91b8e5;background:#f2f8ff} .workspace-profile-steps li.is-current b{background:#0b61d6;color:#fff} .workspace-profile-steps li.is-complete{border-color:#b9d9c3;background:#f5fbf7} .workspace-profile-steps li.is-complete b{background:#2d7a46;color:#fff} .workspace-profile-steps li.is-current{border-color:#91b8e5;background:#f2f8ff} .workspace-profile-status{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;border:1px solid #d8e4ef;border-radius:13px;background:#fff} .workspace-profile-status>div{display:grid;gap:2px;min-width:0} .workspace-profile-status span{color:#526b87;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase} .workspace-profile-status strong{color:#203650;font-size:16px;line-height:1.3} .workspace-profile-status small{color:#52667e;font-size:12px;line-height:1.4} .workspace-profile-status button{flex:0 0 auto;min-height:40px!important;padding:8px 13px!important;font-size:13px!important} .workspace-profile-panel.is-ready .workspace-profile-status{border-color:#b9d9c3;background:#f6fcf8} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needsCompact{ display:block!important;padding:18px!important;border:1px solid #dbe6f1!important;background:#fff!important } html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needsCompact #v40NeedsSummary{display:none!important} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needsCompact.v40-needs-collapsed>#needs, html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needsCompact.v40-needs-collapsed>#needs-method-notice, html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needsCompact.v40-needs-collapsed>.small{display:block!important} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needsCompact>#needs{padding-top:0!important} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needs .section-title-row h1{font-size:20px!important} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needs>.row:first-child{margin-bottom:12px!important} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needs_person_name{min-width:0!important;width:min(100%,420px)!important} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needs_out{scroll-margin-top:18px} .workspace-profile-next{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px;padding:14px;border:1px solid #b9d9c3;border-radius:13px;background:#f6fcf8} .workspace-profile-next[hidden]{display:none!important} .workspace-profile-next>div{display:grid;gap:2px;min-width:0} .workspace-profile-next span{color:#3e6f4d;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase} .workspace-profile-next strong{color:#214d2e;font-size:15px;line-height:1.3} .workspace-profile-next small{color:#4e6656;font-size:12px;line-height:1.4} .workspace-profile-next button{flex:0 0 auto;min-height:40px!important;padding:8px 13px!important;font-size:13px!important} html[data-navigation-shell="workspace"] #workspacePersonContext{ display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,auto) auto;align-items:center;gap:12px;margin-top:12px;padding:12px 13px;border:1px solid #d8e4ef;border-radius:12px;background:#f8fbfe } html[data-navigation-shell="workspace"] #workspacePersonContext[hidden]{display:none!important} .workspace-person-context__copy{display:grid;gap:1px;min-width:0} .workspace-person-context__copy span{color:#526b87;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase} .workspace-person-context__copy strong{overflow:hidden;color:#203650;font-size:14px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap} .workspace-person-context__copy small{overflow:hidden;color:#52667e;font-size:11.5px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap} .workspace-person-context__targets{color:#294866;font-size:12px;font-weight:700;line-height:1.4;text-align:right} .workspace-person-context button{min-height:36px!important;padding:7px 10px!important;font-size:12px!important} .workspace-person-context.is-pending{border-color:#e6c883;background:#fffaf0} .workspace-person-context.is-pending .workspace-person-context__targets{color:#75510b} @media(max-width:860px){ html[data-navigation-shell="workspace"] #workspacePersonContext{grid-column:1/-1} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #mainContent{padding-bottom:22px!important} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #navigationShell{display:none!important} } @media(max-width:720px){ html[data-navigation-shell="workspace"][data-navigation-route="profile"] #workspaceProfilePanel{gap:13px;padding:14px!important} .workspace-profile-steps{grid-template-columns:1fr} .workspace-profile-steps li{padding:9px 10px} .workspace-profile-status,.workspace-profile-next{display:grid;gap:10px} .workspace-profile-status button,.workspace-profile-next button{width:100%} html[data-navigation-shell="workspace"][data-navigation-route="profile"] #needsCompact{padding:14px!important} html[data-navigation-shell="workspace"] #workspacePersonContext{grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:10px;padding:10px} .workspace-person-context__targets{grid-column:1/-1;text-align:left;font-size:11.5px} .workspace-person-context__copy strong,.workspace-person-context__copy small{white-space:normal} } @media(max-width:420px){ html[data-navigation-shell="workspace"] #workspacePersonContext{grid-template-columns:1fr} .workspace-person-context button{width:100%} } @media print{#workspaceProfilePanel,#workspacePersonContext,.workspace-profile-next{display:none!important}} /* ===== END workspace-profile-needs-v5.3.210-rc2-hf8.css ===== */ /* ===== BEGIN workspace-analysis-detail-v5.3.210-rc2-hf7.css sha256=6eb1bd63e67578a3844b73b2533ceaef94d442efd34cb1a4e921fb1c7c9fd6ae ===== */ /* HF7 dedicated nutrient and HEI workspace views. */ #workspaceNutrientsPanel,#workspaceHeiPanel{display:none} html[data-navigation-route="analysis/nutrients"] #workspaceNutrientsPanel, html[data-navigation-route="analysis/hei"] #workspaceHeiPanel{display:grid!important} .workspace-analysis-detail{gap:16px;margin:0 0 14px;padding:18px!important} .workspace-analysis-detail__head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px} .workspace-analysis-detail__head>div{min-width:0} .workspace-analysis-detail__head>div>span, .workspace-analysis-section-head span{display:block;color:#5d7189;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase} .workspace-analysis-detail__head h2{margin:2px 0 5px;color:#17243a;font-size:22px;line-height:1.18} .workspace-analysis-detail__head p{max-width:790px;margin:0;color:#52667e;font-size:14px;line-height:1.48} .workspace-analysis-detail__head>button{flex:0 0 auto;min-height:39px!important;padding:7px 12px!important;font-size:13px!important} .workspace-analysis-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .workspace-analysis-summary article{display:grid;gap:3px;min-width:0;padding:13px;border:1px solid #dbe6f1;border-radius:13px;background:#f9fbfe} .workspace-analysis-summary span{color:#596d85;font-size:11px;font-weight:750} .workspace-analysis-summary strong{color:#183654;font-size:22px;line-height:1.1} .workspace-analysis-summary small{color:#596d84;font-size:11px;line-height:1.3} .workspace-analysis-guidance,.workspace-analysis-quality{display:grid;gap:3px;padding:12px 14px;border:1px solid #d7e4f1;border-radius:12px;background:#f5f9fd} .workspace-analysis-guidance strong,.workspace-analysis-quality strong{color:#203650;font-size:13.5px} .workspace-analysis-guidance span,.workspace-analysis-quality span{color:#5c7088;font-size:12px;line-height:1.45} .workspace-analysis-toolbar{display:grid;gap:9px;padding:12px;border:1px solid #e0e8f1;border-radius:13px;background:#fff} .workspace-analysis-filters{display:flex;flex-wrap:wrap;gap:7px} .workspace-analysis-filters button{min-height:36px!important;padding:7px 11px!important;border:1px solid #cbd9e7!important;border-radius:999px!important;background:#fff!important;color:#36516d!important;box-shadow:none!important;font-size:12px!important;font-weight:700!important} .workspace-analysis-filters button:hover{border-color:#97b5d3!important;background:#f4f8fc!important} .workspace-analysis-filters button.is-active{border-color:#245f9d!important;background:#eaf3fc!important;color:#174f88!important} .workspace-analysis-filters--groups{padding-top:9px;border-top:1px solid #e6edf4} .workspace-analysis-filters button:focus-visible{outline:3px solid rgba(23,95,165,.24)!important;outline-offset:2px} .workspace-analysis-list{display:grid;gap:14px} .workspace-analysis-group{display:grid;gap:9px} .workspace-analysis-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:2px 2px 0} .workspace-analysis-section-head h3{margin:2px 0 0;color:#17243a;font-size:18px;line-height:1.2} .workspace-analysis-section-head>small{color:#62768e;font-size:12px;white-space:nowrap} .workspace-analysis-group__rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .workspace-analysis-row{display:grid;align-content:start;gap:11px;min-width:0;padding:14px;border:1px solid #dce6ef;border-left:4px solid #8ba6c0;border-radius:13px;background:#fff} .workspace-analysis-row.is-critical{border-left-color:#b43b3b;background:#fffafa} .workspace-analysis-row.is-high{border-left-color:#c35e34;background:#fffaf6} .workspace-analysis-row.is-medium{border-left-color:#c28a21;background:#fffdf7} .workspace-analysis-row.is-unavailable{border-left-color:#6b7280;background:#fafbfc} .workspace-analysis-row.is-provisional{border-left-color:#7189a2;background:#f9fbfd} .workspace-analysis-row.is-ok{border-left-color:#3f8068} .workspace-analysis-row.is-info,.workspace-analysis-row.is-empty{border-left-color:#8194a7} .workspace-analysis-row__top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px} .workspace-analysis-row__top>div{min-width:0} .workspace-analysis-row__group{display:block;margin-bottom:2px;color:#60748c;font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase} .workspace-analysis-row h4{margin:0;color:#1b314a;font-size:16px;line-height:1.25} .workspace-status{flex:0 0 auto;max-width:160px;padding:5px 8px;border:1px solid #c9d7e5;border-radius:999px;background:#f3f7fb;color:#3e5872;font-size:10.5px;font-weight:800;line-height:1.25;text-align:center} .is-critical .workspace-status{border-color:#edbcbc;background:#fff0f0;color:#932d2d} .is-high .workspace-status{border-color:#efc2a8;background:#fff3eb;color:#98441f} .is-medium .workspace-status{border-color:#ead39a;background:#fff8e5;color:#79520c} .is-ok .workspace-status{border-color:#b8d8ca;background:#eff8f4;color:#2c6753} .is-unavailable .workspace-status{border-color:#d1d5db;background:#f3f4f6;color:#4b5563} .workspace-analysis-row__values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .workspace-analysis-row__values>div{display:grid;gap:3px;min-width:0;padding:9px 10px;border-radius:10px;background:#f6f9fc} .workspace-analysis-row__values span{color:#64778e;font-size:10.5px;font-weight:700} .workspace-analysis-row__values strong{overflow-wrap:anywhere;color:#1c3a58;font-size:13px;line-height:1.3} .workspace-analysis-progress{position:relative;height:8px;border-radius:999px;background:#e7edf4;overflow:visible} .workspace-analysis-progress i{display:block;height:100%;max-width:100%;border-radius:999px;background:#567fa8} .workspace-analysis-progress b{position:absolute;top:-3px;width:2px;height:14px;margin-left:-1px;border-radius:2px;background:#273f58} .is-critical .workspace-analysis-progress i,.is-high .workspace-analysis-progress i{background:#c96545} .is-medium .workspace-analysis-progress i{background:#c3902b} .is-ok .workspace-analysis-progress i{background:#4c8b72} .workspace-analysis-row__note{margin:0;color:#536980;font-size:12px;line-height:1.45} .workspace-contributors{border-top:1px solid #e5ebf2;padding-top:9px} .workspace-contributors>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:34px;cursor:pointer;color:#24577f;list-style:none;font-size:12px;font-weight:800} .workspace-contributors>summary::-webkit-details-marker{display:none} .workspace-contributors>summary:after{content:"Открыть";flex:0 0 auto;color:#607890;font-size:10.5px;font-weight:700} .workspace-contributors[open]>summary:after{content:"Свернуть"} .workspace-contributors>summary small{overflow:hidden;color:#708399;font-size:10.5px;font-weight:600;text-overflow:ellipsis;white-space:nowrap} .workspace-contributors__body{display:grid;gap:7px;padding-top:9px} .workspace-contributor{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:7px 9px;border-radius:9px;background:#f6f9fc} .workspace-contributor strong{min-width:0;color:#233e59;font-size:11.5px;line-height:1.35} .workspace-contributor span{flex:0 0 auto;max-width:58%;color:#60748b;font-size:10.5px;line-height:1.35;text-align:right} .workspace-contributors__empty,.workspace-contributors__quality{margin:0;color:#60748b;font-size:11px;line-height:1.45} .workspace-contributor-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px} .workspace-contributor-columns>div{display:grid;align-content:start;gap:7px;padding:9px;border:1px solid #e1e8f0;border-radius:10px} .workspace-contributor-columns>div>strong{color:#27425d;font-size:11.5px} .workspace-analysis-empty{display:grid;justify-items:start;gap:7px;padding:18px;border:1px dashed #b9cce0;border-radius:14px;background:#f7fbff} .workspace-analysis-empty strong{color:#1c334e;font-size:16px} .workspace-analysis-empty p{margin:0;color:#60748b;font-size:13px;line-height:1.45} .workspace-analysis-empty button{min-height:38px!important;padding:7px 12px!important;font-size:13px!important} .workspace-analysis-actions{display:flex;flex-wrap:wrap;gap:8px;padding-top:2px} .workspace-analysis-actions button{min-height:40px!important;padding:8px 13px!important;font-size:13px!important} .workspace-hei-hero{display:grid;grid-template-columns:auto minmax(160px,1fr);gap:8px 18px;align-items:center;padding:15px;border:1px solid #cbddec;border-radius:14px;background:#f3f8fd} .workspace-hei-hero>div:first-child{display:grid;grid-row:1/3;gap:2px;min-width:130px} .workspace-hei-hero span{color:#5e7289;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em} .workspace-hei-hero strong{color:#163d63;font-size:30px;line-height:1.05} .workspace-hei-hero small{color:#536c85;font-size:11.5px;line-height:1.35} .workspace-hei-hero__bar{height:11px;border-radius:999px;background:#dce7f1;overflow:hidden} .workspace-hei-hero__bar i{display:block;height:100%;border-radius:999px;background:#386f9f} .workspace-hei-hero p{margin:0;color:#526a82;font-size:12px;line-height:1.45} .workspace-hei-scoreline{display:flex;align-items:baseline;justify-content:space-between;gap:12px} .workspace-hei-scoreline strong{color:#1a3958;font-size:14px} .workspace-hei-scoreline span{color:#61768d;font-size:11px;text-align:right} .workspace-guardrails{display:grid;gap:9px} #workspaceGuardrailList{display:grid;gap:8px} .workspace-guardrail{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 12px;border:1px solid #dce5ee;border-left:4px solid #8799aa;border-radius:11px;background:#fff} .workspace-guardrail>div{min-width:0} .workspace-guardrail strong{display:block;color:#203a54;font-size:13px} .workspace-guardrail p{margin:2px 0 0;color:#5d7188;font-size:11.5px;line-height:1.4} .workspace-guardrail button{flex:0 0 auto;min-height:35px!important;padding:6px 10px!important;border:1px solid #c9d8e6!important;background:#fff!important;color:#315c82!important;box-shadow:none!important;font-size:11.5px!important} .workspace-guardrail.is-critical{border-left-color:#b43b3b;background:#fffafa} .workspace-guardrail.is-high{border-left-color:#c35e34;background:#fffaf6} .workspace-guardrail.is-unavailable{border-left-color:#6b7280;background:#fafbfc} .workspace-guardrail.is-ok{border-left-color:#3f8068;background:#f6fbf8} .workspace-guardrail.is-neutral{border-left-color:#7591ab;background:#f7fafc} .workspace-issue__link{justify-self:start;min-height:34px!important;margin-top:7px;padding:5px 9px!important;border:1px solid #c8d9e8!important;background:#fff!important;color:#245a84!important;box-shadow:none!important;font-size:11.5px!important} @media (max-width:900px){ .workspace-analysis-group__rows{grid-template-columns:1fr} } @media (max-width:680px){ .workspace-analysis-detail{gap:13px;padding:14px!important} .workspace-analysis-detail__head{display:grid;gap:10px} .workspace-analysis-detail__head h2{font-size:20px} .workspace-analysis-detail__head p{font-size:13px} .workspace-analysis-detail__head>button{justify-self:start} .workspace-analysis-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px} .workspace-analysis-summary article{padding:9px 8px} .workspace-analysis-summary span{font-size:9.5px;line-height:1.25} .workspace-analysis-summary strong{font-size:19px} .workspace-analysis-summary small{font-size:9.5px;line-height:1.25} .workspace-analysis-toolbar{padding:10px} .workspace-analysis-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px} .workspace-analysis-filters--groups{grid-template-columns:repeat(2,minmax(0,1fr))} .workspace-analysis-filters button{min-width:0;min-height:38px!important;padding:6px!important;border-radius:10px!important;font-size:10.5px!important;line-height:1.2} .workspace-analysis-row{gap:9px;padding:12px} .workspace-analysis-row__top{display:grid;gap:7px} .workspace-status{justify-self:start;max-width:none} .workspace-analysis-row__values{grid-template-columns:1fr 1fr;gap:6px} .workspace-analysis-row__values>div{padding:8px} .workspace-analysis-row__values strong{font-size:12px} .workspace-contributors>summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 8px} .workspace-contributors>summary small{grid-column:1/2;grid-row:2;white-space:normal} .workspace-contributors>summary:after{grid-column:2;grid-row:1/3;align-self:center} .workspace-contributor{display:grid;gap:2px} .workspace-contributor span{max-width:none;text-align:left} .workspace-contributor-columns{grid-template-columns:1fr} .workspace-hei-hero{grid-template-columns:1fr;gap:9px} .workspace-hei-hero>div:first-child{grid-row:auto;min-width:0} .workspace-hei-hero strong{font-size:28px} .workspace-hei-scoreline{display:grid;gap:2px} .workspace-hei-scoreline span{text-align:left} .workspace-guardrail{display:grid;gap:8px} .workspace-guardrail button{justify-self:start} } @media (max-width:390px){ .workspace-analysis-summary{grid-template-columns:1fr} .workspace-analysis-summary article{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 8px} .workspace-analysis-summary strong{grid-column:2;grid-row:1/3} .workspace-analysis-summary small{grid-column:1;grid-row:2} .workspace-analysis-filters{grid-template-columns:1fr 1fr} .workspace-analysis-filters button:first-child:last-child{grid-column:1/-1} .workspace-analysis-row__values{grid-template-columns:1fr} } html[data-theme^="retro"] .workspace-analysis-row, html[data-theme^="retro"] .workspace-analysis-toolbar, html[data-theme^="retro"] .workspace-analysis-summary article, html[data-theme^="retro"] .workspace-hei-hero, html[data-theme^="retro"] .workspace-guardrail{border-radius:2px;box-shadow:none} @media print{ #workspaceNutrientsPanel,#workspaceHeiPanel{display:none!important} } .workspace-analysis-pager{display:grid;grid-template-columns:minmax(112px,auto) minmax(90px,1fr) minmax(112px,auto);align-items:center;gap:10px;margin-top:2px;padding:10px 11px;border:1px solid #dbe5ef;border-radius:12px;background:#f8fbfe} .workspace-analysis-pager button{min-height:38px!important;padding:7px 11px!important;border:1px solid #c7d8e7!important;background:#fff!important;color:#285879!important;box-shadow:none!important;font-size:12px!important;font-weight:750!important} .workspace-analysis-pager button:not(:disabled):hover{border-color:#8eb0cc!important;background:#f2f7fb!important} .workspace-analysis-pager button:disabled{cursor:default;opacity:.5} .workspace-analysis-pager span{color:#4f6780;font-size:12px;font-weight:800;text-align:center} .workspace-analysis-group-picker{display:grid;gap:10px;padding:16px;border:1px solid #d7e3ef;border-radius:13px;background:#f8fbfe} .workspace-analysis-group-picker>strong{color:#1d3853;font-size:15px} .workspace-analysis-group-picker>p{margin:0;color:#5b7087;font-size:12.5px;line-height:1.45} .workspace-analysis-group-picker>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .workspace-analysis-group-picker button{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px!important;padding:9px 11px!important;border:1px solid #cbdbe9!important;background:#fff!important;color:#274a69!important;box-shadow:none!important;text-align:left} .workspace-analysis-group-picker button span{font-size:12px;font-weight:800} .workspace-analysis-group-picker button small{color:#687e94;font-size:10.5px;white-space:nowrap} @media(max-width:520px){.workspace-analysis-group-picker>div{grid-template-columns:1fr}} @media(max-width:420px){ .workspace-analysis-pager{grid-template-columns:1fr 1fr;gap:7px} .workspace-analysis-pager span{grid-column:1/-1;grid-row:1} .workspace-analysis-pager button{grid-row:2;min-width:0;padding:7px 6px!important;font-size:11px!important} } /* ===== END workspace-analysis-detail-v5.3.210-rc2-hf7.css ===== */ /* ===== BEGIN workspace-correction-v5.3.210-rc2-hf11.css sha256=58f3a2823256dd89f77024bd42714133c49cbc4de29ebe5f85372d971140f5db ===== */ /* HF11: final clarity and scenario-quality polish for the Improve workspace. */ #workspaceCorrectionPanel{display:none} html[data-navigation-shell="workspace"][data-navigation-route="correction"] #workspaceCorrectionPanel{display:grid!important} .workspace-correction{gap:14px;margin:0 0 14px;padding:16px!important} .workspace-correction-status:empty{display:none} .workspace-correction-status>div{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:3px 14px;padding:12px 13px;border:1px solid #d7e4f1;border-left:4px solid #71879d;border-radius:12px;background:#f7fafe} .workspace-correction-status strong{color:#203650;font-size:14px;line-height:1.35} .workspace-correction-status span{color:#526a82;font-size:12px;line-height:1.45} .workspace-correction-status button{grid-column:2;grid-row:1/3;min-height:38px!important;padding:7px 11px!important;font-size:12px!important} .workspace-correction-status small{grid-column:1/-1;color:#6a5b35;font-size:11px;line-height:1.4} .workspace-correction-status .is-warning{border-left-color:#b68019;background:#fffaf0} .workspace-correction-status .is-ok{border-left-color:#3f8068;background:#f5fbf8} .workspace-correction-status .is-applied{border-left-color:#2d7a46;background:#f2fbf5} .workspace-correction-workbench,.workspace-correction-priorities{display:grid;gap:10px} .workspace-correction-workbench{padding:14px;border:1px solid #dce6ef;border-radius:14px;background:#fbfdff;scroll-margin-top:16px;scroll-margin-bottom:112px} .workspace-correction-priorities[hidden]{display:none!important} .workspace-correction-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:1px 1px 0} .workspace-correction-section-head h3{margin:0;color:#17243a;font-size:18px;line-height:1.2} .workspace-correction-section-head>small{max-width:48%;color:#62768e;font-size:11.5px;text-align:right;line-height:1.35} #workspaceCorrectionEditor{display:grid;gap:10px} .workspace-correction-active{display:grid;gap:4px;padding:12px 13px;border:1px solid #d6e3ee;border-left:4px solid #3975aa;border-radius:11px;background:#fff} .workspace-correction-active>span{color:#4e637a;font-size:10.5px;font-weight:800;letter-spacing:.035em;text-transform:uppercase} .workspace-correction-active>strong{color:#1e3852;font-size:16px;line-height:1.28} .workspace-correction-active>p{margin:0;color:#526981;font-size:12px;line-height:1.45} .workspace-correction-selection-note{margin:0;padding:9px 11px;border-radius:9px;background:#f3f7fb;color:#4e667e;font-size:11.5px;line-height:1.45} .workspace-correction-variants{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px} .workspace-correction-variant{display:grid;gap:4px;min-height:112px!important;padding:12px!important;border:1px solid #cfdae5!important;border-radius:11px!important;background:#fff!important;background-image:none!important;color:#29465f!important;box-shadow:none!important;text-align:left!important} .workspace-correction-variant:hover{border-color:#91abc1!important;background:#f8fbfe!important;background-image:none!important} .workspace-correction-variant.is-active{border-color:#2f6fa8!important;background:#eef6fd!important;background-image:none!important;box-shadow:0 0 0 2px rgba(47,111,168,.1)!important} .workspace-correction-variant strong{color:#203650;font-size:14px;line-height:1.3} .workspace-correction-variant span{color:#35546e;font-size:12px;line-height:1.35} .workspace-correction-variant small{color:#5b7087;font-size:10.5px;line-height:1.35} .workspace-correction-variant em{margin-top:auto;color:#355d48;font-size:10.5px;font-style:normal;font-weight:750;line-height:1.35} .workspace-correction-variant em.is-review{color:#825615} .workspace-correction-no-simple{display:grid;justify-items:start;gap:6px;padding:13px;border:1px solid #e1d7be;border-left:4px solid #b68019;border-radius:11px;background:#fffaf0} .workspace-correction-no-simple strong{color:#493a1f;font-size:14px;line-height:1.35} .workspace-correction-no-simple p{margin:0;color:#665638;font-size:12px;line-height:1.5} .workspace-correction-no-simple button{min-height:36px!important;padding:6px 10px!important;font-size:12px!important} .workspace-correction-manual-toggle{justify-self:start;min-height:34px!important;padding:5px 7px!important;border:0!important;background:transparent!important;background-image:none!important;color:#285979!important;box-shadow:none!important;font-size:12px!important;text-decoration:underline;text-underline-offset:3px} .workspace-correction-manual{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(190px,.8fr);gap:9px;align-items:end;padding:12px;border:1px solid #d7e2ec;border-radius:11px;background:#fff} .workspace-correction-manual[hidden]{display:none!important} .workspace-correction-manual label{display:grid;gap:5px;color:#445d76;font-size:11.5px;font-weight:750} .workspace-correction-manual select,.workspace-correction-manual input{width:100%;min-height:42px;border:1px solid #bdcddd;border-radius:9px;background:#fff;color:#1f3953;font:inherit;font-size:13px} .workspace-correction-manual select{padding:8px 34px 8px 10px}.workspace-correction-manual input{padding:8px;text-align:center} .workspace-correction-manual>small{grid-column:1/-1;color:#62768e;font-size:10.5px} .workspace-correction-grams{display:grid;grid-template-columns:52px minmax(70px,1fr) 52px;gap:5px} .workspace-correction-grams button{min-width:0!important;min-height:42px!important;padding:6px!important;border:1px solid #c8d7e5!important;background:#f7fafc!important;background-image:none!important;color:#315775!important;box-shadow:none!important;font-size:12px!important} .workspace-correction-empty{display:grid;justify-items:start;gap:7px;padding:17px;border:1px dashed #b9cce0;border-radius:12px;background:#f7fbff} .workspace-correction-empty strong{color:#1c334e;font-size:15px}.workspace-correction-empty p{margin:0;color:#60748b;font-size:12.5px;line-height:1.45} .workspace-correction-preview{display:grid;gap:9px} .workspace-correction-preview:empty{display:none} .workspace-correction-decision{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr) auto;gap:12px;align-items:center;padding:14px;border:1px solid #cdddeb;border-left:5px solid #3f8068;border-radius:12px;background:#f5fbf8;scroll-margin-bottom:112px} .workspace-correction-decision.is-review{border-left-color:#b27a18;background:#fffaf0} .workspace-correction-decision.is-blocked,.workspace-correction-decision.is-not-helpful{border-left-color:#a7583d;background:#fff8f4} .workspace-correction-decision__copy{display:grid;gap:3px;min-width:0} .workspace-correction-decision__copy>span{color:#5c7087;font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase} .workspace-correction-decision__copy strong{color:#203650;font-size:15px;line-height:1.3} .workspace-correction-decision__copy p{margin:0;color:#536981;font-size:11.5px;line-height:1.45} .workspace-correction-brief{display:grid;gap:5px;margin:0;padding:0;list-style:none} .workspace-correction-brief li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;padding:6px 8px;border-radius:8px;background:#fff;color:#3f5b74;font-size:10.5px} .workspace-correction-brief li.is-worse{background:#fff4ed}.workspace-correction-brief li.is-better,.workspace-correction-brief li.is-ok{background:#eff8f3} .workspace-correction-brief strong{font-size:10.5px}.workspace-correction-brief span{text-align:right} .workspace-correction-decision>button{min-height:42px!important;padding:8px 13px!important;font-size:13px!important;white-space:nowrap} .workspace-correction-decision>button.is-review{border-color:#ae7a1f!important;background:#fff!important;background-image:none!important;color:#694914!important;box-shadow:none!important} .workspace-correction-next{display:grid;gap:3px;max-width:230px;padding:8px 10px;border-radius:9px;background:#fff1ea;color:#6b3d2f;font-size:11px;line-height:1.4} .workspace-correction-next strong{font-size:11.5px}.workspace-correction-next span{color:#704a3c} .workspace-correction-details{border:1px solid #dce6ef;border-radius:11px;background:#fff;scroll-margin-bottom:112px} .workspace-correction-details>summary{cursor:pointer;padding:11px 12px;color:#285979;font-size:12px;font-weight:800} .workspace-correction-details[open]>summary{border-bottom:1px solid #e4ebf1} .workspace-correction-details>.workspace-correction-summary,.workspace-correction-details>.workspace-correction-tradeoffs{margin:11px} .workspace-correction-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px} .workspace-correction-summary article{display:grid;gap:3px;padding:10px;border:1px solid #dce6ef;border-radius:10px;background:#fff} .workspace-correction-summary span{color:#60748a;font-size:10.5px;font-weight:750}.workspace-correction-summary strong{color:#1f3d59;font-size:14px;line-height:1.25}.workspace-correction-summary small{color:#5d7288;font-size:10.5px} .workspace-correction-tradeoffs{display:grid;gap:8px}.workspace-correction-tradeoffs h4{margin:0;color:#203650;font-size:14px}.workspace-correction-tradeoffs>p{margin:0;padding:10px;border-radius:9px;background:#f3f8f5;color:#355d48;font-size:12px}.workspace-correction-tradeoffs>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.workspace-correction-tradeoffs article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:9px;border:1px solid #dce6ef;border-left:4px solid #71879d;border-radius:9px;background:#fff}.workspace-correction-tradeoffs article.is-worse{border-left-color:#b15834;background:#fff9f5}.workspace-correction-tradeoffs article.is-better{border-left-color:#3f8068;background:#f6fbf8}.workspace-correction-tradeoffs strong{color:#203a54;font-size:12px}.workspace-correction-tradeoffs span{color:#405d78;font-size:11.5px;text-align:right}.workspace-correction-tradeoffs small{grid-column:1/-1;color:#687b8f;font-size:10px} #workspaceCorrectionPriorityList{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .workspace-priority-chip{display:grid;gap:3px;min-width:0;min-height:78px!important;padding:10px 11px!important;border:1px solid #d7e2ec!important;border-left:4px solid #899daf!important;border-radius:10px!important;background:#fff!important;background-image:none!important;color:#29465f!important;box-shadow:none!important;text-align:left!important} .workspace-priority-chip:hover{border-color:#9cb6ce!important;background:#f8fbfe!important;background-image:none!important} .workspace-priority-chip.is-critical{border-left-color:#a93b3b!important}.workspace-priority-chip.is-high{border-left-color:#bd5b34!important}.workspace-priority-chip.is-medium{border-left-color:#b8841f!important} .workspace-priority-chip strong{color:#203650;font-size:13px;line-height:1.25}.workspace-priority-chip small{color:#60748a;font-size:10.5px;line-height:1.3}.workspace-priority-chip span{color:#4d667d;font-size:10.5px;line-height:1.35} .workspace-correction-method{border-top:1px solid #e2e9f0;padding-top:9px}.workspace-correction-method summary{cursor:pointer;color:#285979;font-size:12px;font-weight:800}.workspace-correction-method p{max-width:850px;margin:8px 0 0;color:#5b7087;font-size:12px;line-height:1.5} .workspace-correction-ai{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.workspace-correction-ai .link-button{display:inline!important;min-height:0!important;padding:0!important;border:0!important;background:transparent!important;background-image:none!important;color:#285979!important;box-shadow:none!important;font:inherit!important;font-size:12px!important;font-weight:800!important;text-decoration:underline;text-underline-offset:3px}.workspace-correction-ai small{color:#65798e;font-size:10.5px} .workspace-correction-person-summary{display:none} html[data-navigation-shell="workspace"][data-navigation-route="correction"] #workspacePersonContext{grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;margin-top:8px;padding:8px 10px} html[data-navigation-shell="workspace"][data-navigation-route="correction"] #workspacePersonContext .workspace-person-context__copy,html[data-navigation-shell="workspace"][data-navigation-route="correction"] #workspacePersonContext .workspace-person-context__targets{display:none!important} html[data-navigation-shell="workspace"][data-navigation-route="correction"] #workspaceCorrectionPersonSummary{display:block;align-self:center;min-width:0;overflow:hidden;color:#233f5a;font-size:12px;font-weight:800;line-height:1.35;text-overflow:ellipsis;white-space:nowrap} html[data-navigation-shell="workspace"][data-navigation-route="correction"] #workspacePersonContext button{grid-column:2;grid-row:1;align-self:center;min-height:32px!important;padding:5px 9px!important;font-size:11px!important} @media(max-width:1120px){.workspace-correction-decision{grid-template-columns:1fr 1fr}.workspace-correction-decision>button,.workspace-correction-next{grid-column:1/-1;justify-self:start}.workspace-correction-summary{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:760px){ html[data-navigation-route="correction"]{scroll-padding-bottom:112px} .workspace-correction{gap:12px;padding:13px 13px calc(100px + env(safe-area-inset-bottom))!important} .workspace-correction-workbench{padding:12px} .workspace-correction-section-head{align-items:flex-start}.workspace-correction-section-head>small{max-width:46%} .workspace-correction-variants,#workspaceCorrectionPriorityList{grid-template-columns:1fr} .workspace-correction-manual{grid-template-columns:1fr}.workspace-correction-manual>small{grid-column:1} .workspace-correction-decision{grid-template-columns:1fr}.workspace-correction-decision>button,.workspace-correction-next{grid-column:auto;width:100%;max-width:none} .workspace-correction-summary{grid-template-columns:1fr 1fr}.workspace-correction-tradeoffs>div{grid-template-columns:1fr} .workspace-correction-status>div{grid-template-columns:1fr}.workspace-correction-status button{grid-column:auto;grid-row:auto;width:100%} .workspace-correction-brief li{grid-template-columns:1fr}.workspace-correction-brief span{text-align:left} .workspace-priority-chip{min-height:0!important} } @media(max-width:430px){.workspace-correction-summary{grid-template-columns:1fr}.workspace-correction-section-head h3{font-size:17px}} html[data-theme^="retro"] .workspace-correction-workbench,html[data-theme^="retro"] .workspace-correction-active,html[data-theme^="retro"] .workspace-correction-variant,html[data-theme^="retro"] .workspace-correction-decision,html[data-theme^="retro"] .workspace-correction-summary article{border-radius:2px;box-shadow:none!important} @media print{#workspaceCorrectionPanel{display:none!important}} html[data-navigation-shell="workspace"] #workspaceCorrectionPanel button.workspace-correction-variant,html[data-navigation-shell="workspace"] #workspaceCorrectionPanel button.workspace-priority-chip{background:#fff!important;background-image:none!important;box-shadow:none!important} html[data-navigation-shell="workspace"] #workspaceCorrectionPanel button.workspace-correction-variant.is-active{background:#eef6fd!important;background-image:none!important;color:#203650!important;border-color:#2f6fa8!important} html[data-navigation-shell="workspace"] #workspaceCorrectionPanel button.workspace-correction-manual-toggle{background:transparent!important;background-image:none!important;color:#285979!important;border:0!important} /* ===== END workspace-correction-v5.3.210-rc2-hf11.css ===== */ /* ===== BEGIN workspace-correction-stage3b-v5.3.210-rc2-hf12.css sha256=bb24e5df6a013e33269313831847d3bc6d7b567377960953d9dacd541e8978f2 ===== */ .workspace-correction-alternative{margin-top:16px;border:1px solid var(--border,#d8e1ea);border-radius:16px;background:var(--surface,#fff);padding:16px}.workspace-alternative-intro,.workspace-alternative-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.workspace-alternative-intro span,.workspace-alternative-head span,.workspace-alternative-decision>span,.workspace-alternative-card>div>span{display:block;font-size:.78rem;font-weight:700;letter-spacing:.02em;color:#526273;margin-bottom:4px}.workspace-alternative-intro strong,.workspace-alternative-head strong{display:block;font-size:1.05rem}.workspace-alternative-intro p,.workspace-alternative-decision p,.workspace-alternative-empty p{margin:6px 0 0;color:#48586a;line-height:1.45}.workspace-alternative-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}.workspace-alternative-card{border:1px solid #d8e1ea;border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:12px;min-width:0}.workspace-alternative-card.is-selected{border-color:#2f6fb3;box-shadow:0 0 0 2px rgba(47,111,179,.12)}.workspace-alternative-card strong{display:block}.workspace-alternative-card p{margin:5px 0 0;color:#526273}.workspace-alternative-card ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}.workspace-alternative-card li{display:flex;justify-content:space-between;gap:8px;font-size:.84rem}.workspace-alternative-card li span{text-align:right;color:#526273}.workspace-alternative-card li.is-worse strong{color:#9a3d2f}.workspace-alternative-card li.is-better strong{color:#286b4c}.workspace-alternative-card button{margin-top:auto}.workspace-alternative-decision{margin-top:14px;border-radius:14px;padding:14px;border:1px solid #d8e1ea;background:#f7f9fb}.workspace-alternative-decision.is-clear{border-color:#9fc9b4;background:#f4faf7}.workspace-alternative-decision.is-review{border-color:#d9bd79;background:#fffaf0}.workspace-alternative-decision button{margin-top:12px}.workspace-alternative-empty{text-align:left}.workspace-alternative-empty button{margin-top:12px}@media(max-width:760px){.workspace-correction-alternative{padding:14px;margin-bottom:96px;scroll-margin-bottom:112px}.workspace-alternative-intro,.workspace-alternative-head{display:block}.workspace-alternative-intro button{width:100%;margin-top:12px}.workspace-alternative-head .link-button{margin-top:6px}.workspace-alternative-list{grid-template-columns:1fr}.workspace-alternative-card li{align-items:flex-start}.workspace-alternative-decision button{width:100%}} .workspace-alternative-applied{display:flex;align-items:center;justify-content:space-between;gap:14px}.workspace-alternative-applied span{display:block;font-size:.78rem;font-weight:700;color:#526273;margin-bottom:4px}@media(max-width:760px){.workspace-alternative-applied{display:block}.workspace-alternative-applied button{width:100%;margin-top:12px}} /* ===== END workspace-correction-stage3b-v5.3.210-rc2-hf12.css ===== */ /* ===== BEGIN workspace-report-v5.3.210-rc2-hf14.css sha256=ce59bed8332b078fc36a7cb0d05f05d2dbf8c332182c2abbe2c06875274709b8 ===== */ /* HOTFIX14 stage 4.5: the HF13 report model is unchanged; print and narrow-layout resilience are polished. */ #workspaceReportPanel{display:grid;gap:16px;scroll-margin-top:118px;padding-bottom:calc(94px + env(safe-area-inset-bottom,0px))} .workspace-report-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:16px;border:1px solid var(--border,#d8e3ee);border-radius:18px;background:var(--card,#fff);box-shadow:0 8px 24px rgba(15,23,42,.05)} .workspace-report-toolbar__copy{min-width:0}.workspace-report-toolbar__copy>span,.workspace-report-section__head span,.workspace-report-option__copy span{display:block;color:var(--muted-text,#64748b);font-size:.76rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase} .workspace-report-toolbar__copy strong{display:block;margin-top:3px;font-size:1.08rem}.workspace-report-toolbar__copy p{margin:.35rem 0 0;color:var(--muted-text,#64748b)} .workspace-report-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.workspace-report-actions button{min-height:44px} .workspace-report-options{border:1px solid var(--border,#d8e3ee);border-radius:16px;background:var(--card,#fff);overflow:hidden}.workspace-report-options>summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;font-weight:800}.workspace-report-options>summary small{color:var(--muted-text,#64748b);font-weight:600}.workspace-report-options__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:0 16px 16px}.workspace-report-option{display:flex;align-items:flex-start;gap:10px;padding:11px;border:1px solid var(--border,#d8e3ee);border-radius:13px;background:var(--surface-subtle,#f8fafc)}.workspace-report-option input{margin-top:3px}.workspace-report-option__copy strong{display:block}.workspace-report-option__copy small{display:block;margin-top:2px;color:var(--muted-text,#64748b)} .workspace-report-document{display:grid;gap:16px}.workspace-report-section{break-inside:avoid;border:1px solid var(--border,#d8e3ee);border-radius:18px;background:var(--card,#fff);padding:17px;box-shadow:0 8px 24px rgba(15,23,42,.04)}.workspace-report-section__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.workspace-report-section__head h3{margin:2px 0 0;font-size:1.13rem}.workspace-report-section__head small{color:var(--muted-text,#64748b);text-align:right} .workspace-report-cover{background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(14,165,233,.035))}.workspace-report-cover h2{margin:.2rem 0 .35rem;font-size:1.45rem}.workspace-report-cover p{margin:0;color:var(--muted-text,#64748b)} .workspace-report-kv-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:14px}.workspace-report-kv{min-width:0;padding:10px;border:1px solid var(--border,#d8e3ee);border-radius:12px;background:rgba(255,255,255,.76)}.workspace-report-kv span{display:block;color:var(--muted-text,#64748b);font-size:.78rem}.workspace-report-kv strong{display:block;margin-top:2px;overflow-wrap:anywhere} .workspace-report-lead{margin:.2rem 0 12px;font-size:1.03rem;line-height:1.55}.workspace-report-priorities,.workspace-report-strengths,.workspace-report-changes,.workspace-report-guardrails{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.workspace-report-card{padding:11px;border:1px solid var(--border,#d8e3ee);border-radius:13px;background:var(--surface-subtle,#f8fafc)}.workspace-report-card>span{display:block;color:var(--muted-text,#64748b);font-size:.76rem;font-weight:800;text-transform:uppercase}.workspace-report-card strong{display:block;margin-top:3px;overflow-wrap:anywhere}.workspace-report-card p{margin:.35rem 0 0;color:var(--muted-text,#64748b);font-size:.9rem}.workspace-report-card em{display:block;margin-top:.45rem;font-style:normal;font-weight:700} .workspace-report-table-wrap{overflow-x:auto;border:1px solid var(--border,#d8e3ee);border-radius:13px}.workspace-report-table{width:100%;border-collapse:collapse;font-size:.91rem}.workspace-report-table th,.workspace-report-table td{padding:9px 10px;text-align:left;vertical-align:top;border-bottom:1px solid var(--border,#d8e3ee);overflow-wrap:anywhere}.workspace-report-table th{background:var(--surface-subtle,#f8fafc);font-size:.78rem}.workspace-report-table tr:last-child td{border-bottom:0}.workspace-report-table small{display:block;color:var(--muted-text,#64748b)} .workspace-report-mobile-list{display:none}.workspace-report-mobile-row{padding:11px;border:1px solid var(--border,#d8e3ee);border-radius:13px}.workspace-report-mobile-row__top{display:flex;justify-content:space-between;gap:10px}.workspace-report-mobile-row dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:9px 0 0}.workspace-report-mobile-row dt{color:var(--muted-text,#64748b);font-size:.75rem}.workspace-report-mobile-row dd{margin:0;font-weight:700}.workspace-report-contributors{margin-top:6px;color:var(--muted-text,#64748b);font-size:.84rem} .workspace-report-status{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 8px;background:#eef6ff;color:#174d82;font-size:.78rem;font-weight:800}.workspace-report-status.is-attention{background:#fff7ed;color:#9a3412}.workspace-report-status.is-ok{background:#ecfdf5;color:#166534}.workspace-report-status.is-neutral{background:#f1f5f9;color:#475569} .workspace-report-quality{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.workspace-report-note{margin:.7rem 0 0;padding:10px 12px;border-left:4px solid #94a3b8;background:var(--surface-subtle,#f8fafc);color:var(--muted-text,#64748b)} .workspace-report-empty{padding:24px;text-align:center;border:1px dashed var(--border,#d8e3ee);border-radius:16px;background:var(--surface-subtle,#f8fafc)}.workspace-report-empty p{color:var(--muted-text,#64748b)} @media(max-width:900px){.workspace-report-kv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace-report-priorities,.workspace-report-strengths,.workspace-report-changes,.workspace-report-guardrails{grid-template-columns:1fr}.workspace-report-quality{grid-template-columns:1fr}} @media(max-width:680px){.workspace-report-toolbar{display:grid}.workspace-report-actions{justify-content:stretch}.workspace-report-actions button{flex:1 1 120px}.workspace-report-options__grid{grid-template-columns:1fr}.workspace-report-section{padding:14px}.workspace-report-kv-grid{grid-template-columns:1fr 1fr}.workspace-report-table-wrap{display:none}.workspace-report-mobile-list{display:grid;gap:8px}.workspace-report-section__head{display:grid}.workspace-report-section__head small{text-align:left}.workspace-report-cover h2{font-size:1.28rem}} @media print{#workspaceReportPanel{padding:0}.workspace-report-toolbar,.workspace-report-options{display:none!important}.workspace-report-document{gap:10px}.workspace-report-section{box-shadow:none;border-color:#cbd5e1;padding:12px}.workspace-report-table-wrap{overflow:visible}.workspace-report-table{font-size:10pt;table-layout:fixed}.workspace-report-table thead{display:table-header-group}.workspace-report-table tr{break-inside:avoid;page-break-inside:avoid}.workspace-report-mobile-list{display:none!important}.workspace-report-section{break-inside:auto}.workspace-report-card,.workspace-report-kv{break-inside:avoid}} /* ===== END workspace-report-v5.3.210-rc2-hf14.css ===== */ /* ===== BEGIN workspace-daily-cycle-v5.3.210-rc2-hf15.css sha256=04f625f2c3d96d7bfc178d6dd829b26cd71a7e6e8837ca8f594c92b6dbdc925f ===== */ /* Nutrition Calculator v5.3.210 RC2 HF15 — stage 4.6 daily-cycle polish. */ .search-added-toast.show{ display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; } .search-added-toast__message{min-width:0;line-height:1.35;} .search-added-toast__action{ min-width:0!important; min-height:44px!important; padding:8px 12px!important; border:1px solid currentColor!important; border-radius:10px!important; background:#fff!important; color:inherit!important; box-shadow:none!important; white-space:nowrap; } .search-added-toast__action:focus-visible{outline:3px solid currentColor;outline-offset:2px;} html[data-navigation-shell="workspace"]{ scroll-padding-bottom:calc(96px + env(safe-area-inset-bottom,0px)); } html[data-navigation-shell="workspace"] #globalSearchSection, html[data-navigation-shell="workspace"] #rationSection, html[data-navigation-shell="workspace"] #workspaceOverviewPanel, html[data-navigation-shell="workspace"] #workspaceCorrectionPanel, html[data-navigation-shell="workspace"] #workspaceReportPanel{ scroll-margin-bottom:calc(96px + env(safe-area-inset-bottom,0px)); } @media(max-width:360px){ .search-added-toast.show{grid-template-columns:1fr;} .search-added-toast__action{width:100%;white-space:normal;} } @media print{.search-added-toast{display:none!important;}} /* ===== END workspace-daily-cycle-v5.3.210-rc2-hf15.css ===== */ /* ===== BEGIN workspace-entry-ux-v5.3.210-rc2-hf21.css sha256=04cc29abf4c06cefbdb2e0bdebe5550e7b2a18a7fa4c0b47b26ceed87a24afc2 ===== */ /* HF21: visible entry methods with explicit consent for camera, microphone and file access. */ .workspace-view-switcher{display:inline-flex;align-items:center;gap:4px;min-width:0;padding:4px;border:1px solid #d2deeb;border-radius:12px;background:#f6f9fc} .workspace-view-switcher>span{padding:0 5px;color:#586d85;font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase} .workspace-view-switcher button{min-height:34px!important;padding:6px 10px!important;border:1px solid transparent!important;border-radius:8px!important;background:transparent!important;color:#405670!important;box-shadow:none!important;font-size:12px!important;font-weight:750!important} .workspace-view-switcher button.is-active,.workspace-view-switcher button[aria-pressed="true"]{border-color:#8fb8e6!important;background:#fff!important;color:#075dbf!important;box-shadow:0 1px 3px rgba(27,60,94,.08)!important} .workspace-view-switcher button:focus-visible{outline:3px solid rgba(11,97,214,.24)!important;outline-offset:2px} html[data-navigation-shell="workspace"] #mainContent>header{grid-template-columns:minmax(220px,1fr) auto!important} html[data-navigation-shell="workspace"] #mainContent>header>.title{grid-column:1;grid-row:1;align-self:center} html[data-navigation-shell="workspace"] #workspaceViewSwitcher{grid-column:2;grid-row:1;justify-self:end;align-self:center} html[data-navigation-shell="workspace"] #mainContent>header>.toolbar{grid-column:1/-1;grid-row:2} html[data-navigation-shell="long"] #workspaceViewSwitcher{margin-left:auto} .workspace-profile-back-action{align-self:start;min-height:38px!important;padding:7px 11px!important;border:1px solid #c8daec!important;border-radius:10px!important;background:#fff!important;color:#24577f!important;box-shadow:none!important;font-size:12px!important;font-weight:800!important;white-space:nowrap} .workspace-profile-back-action[hidden]{display:none!important} html[data-navigation-shell="workspace"] #navigationShellContext .workspace-profile-back-action:hover{border-color:#8fb4d8!important;background:#f5f9fd!important} .workspace-ration-entry-methods{display:grid;grid-template-columns:minmax(190px,.72fr) minmax(0,1.7fr);gap:12px;margin:2px 0 14px;padding:13px;border:1px solid #d6e3ef;border-radius:14px;background:#f7fafc} .workspace-ration-entry-methods__copy{display:grid;align-content:center;gap:2px;min-width:0;padding:2px 4px} .workspace-ration-entry-methods__copy>span{color:#5c7189;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase} .workspace-ration-entry-methods__copy>strong{color:#1d3650;font-size:15px;line-height:1.25} .workspace-ration-entry-methods__copy>small{color:#5d7188;font-size:11.5px;line-height:1.4} .workspace-ration-entry-methods__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;min-width:0} .workspace-ration-entry-methods__grid button{display:grid;grid-template-columns:28px minmax(0,1fr);align-items:center;gap:8px;min-width:0;min-height:58px!important;padding:8px 9px!important;border:1px solid #ceddea!important;border-radius:11px!important;background:#fff!important;color:#284964!important;box-shadow:none!important;text-align:left!important} .workspace-ration-entry-methods__grid button:hover{border-color:#8eb6df!important;background:#f5f9fd!important} .workspace-ration-entry-methods__grid button:focus-visible{outline:3px solid rgba(11,97,214,.22)!important;outline-offset:2px} .workspace-ration-entry-methods__grid svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .workspace-ration-entry-methods__grid button>span{display:grid;gap:1px;min-width:0} .workspace-ration-entry-methods__grid b{overflow:hidden;font-size:12px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap} .workspace-ration-entry-methods__grid small{overflow:hidden;color:#64798e;font-size:10.5px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap} .workspace-ration-entry-methods__grid button[data-ration-entry-method="photo"],.workspace-ration-entry-methods__grid button[data-ration-entry-method="voice"]{border-color:#a9c9e8!important;background:#f3f8fe!important;color:#175f9c!important} html[data-navigation-route="ration"] #workspaceRationSecondary>summary strong{font-size:15px} html[data-navigation-route="ration"] #workspaceRationSecondary>summary small{font-size:12px} @media(max-width:980px){ .workspace-ration-entry-methods{grid-template-columns:1fr} .workspace-ration-entry-methods__grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:860px){ html[data-navigation-shell="workspace"] #mainContent>header{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important} html[data-navigation-shell="workspace"] #workspaceViewSwitcher{max-width:100%} html[data-navigation-shell="long"] #mainContent>header{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important} html[data-navigation-shell="long"] #mainContent>header>.title{grid-column:1;grid-row:1} html[data-navigation-shell="long"] #workspaceViewSwitcher{grid-column:2;grid-row:1;justify-self:end;margin:0} html[data-navigation-shell="long"] #mainContent>header>.toolbar{grid-column:1/-1;grid-row:2} .workspace-profile-back-action{grid-column:1/-1;justify-self:start} } @media(max-width:560px){ html[data-navigation-shell="workspace"] #mainContent>header,html[data-navigation-shell="long"] #mainContent>header{grid-template-columns:1fr!important} html[data-navigation-shell="workspace"] #mainContent>header>.title,html[data-navigation-shell="long"] #mainContent>header>.title{grid-column:1;grid-row:1} html[data-navigation-shell="workspace"] #workspaceViewSwitcher,html[data-navigation-shell="long"] #workspaceViewSwitcher{grid-column:1;grid-row:2;justify-self:start;width:100%;box-sizing:border-box} .workspace-view-switcher button{flex:1 1 0} html[data-navigation-shell="workspace"] #mainContent>header>.toolbar,html[data-navigation-shell="long"] #mainContent>header>.toolbar{grid-column:1;grid-row:3} .workspace-profile-back-action{width:100%;justify-self:stretch} .workspace-ration-entry-methods{padding:11px} .workspace-ration-entry-methods__grid{grid-template-columns:1fr 1fr;gap:6px} .workspace-ration-entry-methods__grid button{grid-template-columns:24px minmax(0,1fr);min-height:56px!important;padding:8px!important} .workspace-ration-entry-methods__grid svg{width:22px;height:22px} .workspace-ration-entry-methods__grid small{white-space:normal} } @media(max-width:380px){ .workspace-ration-entry-methods__grid{grid-template-columns:1fr} } @media print{#workspaceViewSwitcher,#workspaceProfileBackAction,#workspaceRationEntryMethods{display:none!important}} html[data-theme="retro-2bit"] #workspaceViewSwitcher,html[data-theme="retro-2bit"] #workspaceRationEntryMethods,html[data-theme="retro-2bit"] #workspaceProfileBackAction,html[data-theme="retro-2bit"] .workspace-ration-entry-methods__grid button{border-radius:0!important;box-shadow:3px 3px 0 rgba(10,31,56,.18)!important} /* The workspace shell uses dedicated overview panels. Legacy long-canvas analysis sections must only reappear when the user explicitly selects “Полотно”; otherwise they leak below every current section. */ html[data-navigation-shell="workspace"] #mainContent>#heiPanel, html[data-navigation-shell="workspace"] #mainContent>#totalsSection, html[data-navigation-shell="workspace"] #mainContent>#dietAnalysisProfilePanel, html[data-navigation-shell="workspace"] #mainContent>#strictHarvardPlateDetails, html[data-navigation-shell="workspace"] #mainContent>#dataQualityPanel{display:none!important} /* ===== END workspace-entry-ux-v5.3.210-rc2-hf21.css ===== */ /* HF21 security/transparency hardening. */ .workspace-ration-entry-methods__copy>em{display:block;margin-top:5px;color:#526a80;font-size:10.5px;font-style:normal;line-height:1.4} #geminiRationImportSection .workspace-entry-target{outline:3px solid rgba(11,97,214,.30)!important;outline-offset:3px!important;box-shadow:0 0 0 6px rgba(11,97,214,.08)!important} @media(prefers-reduced-motion:no-preference){#geminiRationImportSection .workspace-entry-target{animation:workspaceEntryGuideHF21 1.1s ease-in-out 2}} @keyframes workspaceEntryGuideHF21{0%,100%{transform:translateZ(0)}50%{transform:translateY(-1px)}}