/*
Theme Name: MIGRA Sprievodca
Theme URI: https://migra.tdshift.info
Author: MIGRA
Description: Custom WordPress theme for MIGRA, compatible with Yoast SEO.
Version: 1.0.0
Text Domain: migra
*/

:root{
  --bg:#141a1b; --bg-2:#182022; --panel:#1a2224; --panel-2:#1f2a2c;
  --line:#26322f; --line-2:#2f3d3a;
  --text:#e8efec; --muted:#9fb0aa; --dim:#7d8d88;
  --accent:#5cd6a6; --accent-ink:#0f2a20; --accent-soft:#1d3a31;
  --sos-bg:#3a1f20; --sos:#f08a78; --sos-num:#ff9d88;
  --radius:16px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
.sub{display:block;color:var(--muted);font-size:.86em;font-weight:400}
body.mode-vi .sub,body.mode-sk .sub,body.mode-en .sub{display:none}
.tagline .sub{display:none}

/* Header */
.top{position:sticky;top:0;z-index:20;background:rgba(20,26,27,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top-in{max-width:1480px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:16px}
.logo{font-weight:800;letter-spacing:.14em;font-size:21px;text-decoration:none;white-space:nowrap}
.logo b{color:var(--accent)}
.tagline{color:var(--muted);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.langs{margin-left:auto;display:flex;gap:4px;padding:5px;border:1px solid var(--line-2);border-radius:999px;background:var(--bg-2)}
.langs button{border:0;background:none;padding:6px 14px;border-radius:999px;font-weight:600;font-size:14px;color:var(--muted)}
.langs button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.menu-btn{display:none;border:1px solid var(--line-2);background:var(--bg-2);border-radius:10px;padding:7px 11px;font-size:18px;line-height:1}

/* Layout */
.wrap{max-width:1480px;margin:0 auto;padding:32px 24px 64px;display:grid;grid-template-columns:300px minmax(0,1fr) 480px;gap:48px;align-items:start}
.wrap.no-panel{grid-template-columns:300px minmax(0,1fr)}

/* Sidebar */
nav.side{position:sticky;top:88px;max-height:calc(100vh - 110px);overflow:auto;padding-right:6px}
nav.side ol{list-style:none;margin:0;padding:0}
nav.side a{display:grid;grid-template-columns:28px 1fr;gap:8px;padding:10px 12px;border-radius:12px;text-decoration:none;font-size:16px;font-weight:500}
nav.side a:hover{background:var(--panel)}
nav.side a.active{background:var(--accent-soft)}
nav.side .n{color:var(--dim);font-size:14px;padding-top:2px;text-align:center}
nav.side a.active .n{color:var(--accent)}
nav.side .sub{font-size:13px}

/* Main */
main{min-width:0}
.hero h1{font-size:clamp(38px,5.2vw,72px);line-height:1.08;margin:0 0 14px;color:var(--accent);font-weight:800;letter-spacing:-.01em}
.hero h1 .sub{color:#b9c6c1;font-size:.46em;font-weight:700;margin-top:10px;letter-spacing:0}
.lead{font-size:clamp(17px,1.5vw,21px);color:var(--muted);margin:20px 0 0;max-width:640px}
.lead .sub{font-size:.85em;margin-top:10px;color:#b9c6c1}
.sos{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.sos a{display:inline-flex;align-items:baseline;gap:10px;background:var(--sos-bg);color:var(--sos);padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:500}
.sos a strong{color:var(--sos-num);font-size:19px;font-weight:700}
.sos a:hover{filter:brightness(1.15)}

.section h1{font-size:clamp(32px,4vw,52px);line-height:1.1;margin:0 0 10px;color:var(--accent)}
.section h1 .sub{font-size:.5em;color:#b9c6c1;margin-top:8px}
.section .intro{font-size:18px;color:var(--muted);max-width:680px}
.topics{display:grid;gap:12px;margin-top:28px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.topic{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.topic h3{margin:0 0 6px;font-size:17px}
.topic p{margin:0;color:var(--dim);font-size:14px}
.back{display:inline-block;margin-bottom:22px;color:var(--muted);text-decoration:none;font-size:14px}
.back:hover{color:var(--accent)}

/* Status panel */
aside.panel{position:sticky;top:88px;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:26px}
aside h2{margin:0;font-size:24px;font-weight:700}
aside h2 .sub{font-size:16px}
.help{margin:12px 0 0;color:var(--muted);font-size:16px}
.help .sub{font-size:13px;margin-top:4px}
.label{margin:24px 0 10px;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.label .sub{font-size:11px;margin-top:2px;letter-spacing:.12em}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1px solid var(--line-2);background:var(--bg-2);border-radius:999px;padding:8px 16px;text-align:left;font-size:16px;font-weight:500;line-height:1.3;transition:background .15s,color .15s}
.chip .sub{font-size:13px}
.chip:hover{border-color:#456159}
.chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.chip[aria-pressed="true"] .sub{color:#1e4a3a}
.chip.static{background:var(--accent-soft);border-color:transparent;cursor:default}
.recs-head{border-top:1px dashed var(--line-2);margin-top:24px;padding-top:22px}
.recs-head h3{margin:0;font-size:20px}
.recs-head h3 .sub{font-size:15px;margin-top:2px}
ol.recs{margin:14px 0 0;padding-left:26px}
ol.recs li{margin:0 0 10px;font-size:19px;color:var(--text)}
ol.recs li::marker{font-weight:600}
ol.recs a{color:var(--accent);text-underline-offset:4px;text-decoration-thickness:1px}
ol.recs a .sub{color:var(--accent);opacity:.75;font-size:15px;text-decoration:underline;text-underline-offset:4px}
.empty{color:var(--dim);font-size:15px;margin-top:12px}

footer{max-width:1480px;margin:0 auto;padding:24px;border-top:1px solid var(--line);color:var(--dim);font-size:13px}

/* Responsive */
@media (max-width:1280px){
  .wrap{grid-template-columns:260px minmax(0,1fr);gap:36px}
  aside.panel{grid-column:2;position:static}
}
@media (max-width:860px){
  .wrap,.wrap.no-panel{grid-template-columns:1fr;padding:20px 16px 48px;gap:28px}
  aside.panel{grid-column:auto;padding:20px}
  .menu-btn{display:block}
  .top-in{padding:12px 16px;gap:10px;flex-wrap:wrap}
  .tagline{display:none}
  .langs button{padding:5px 10px;font-size:13px}
  nav.side{display:none;position:static;max-height:none}
  nav.side.open{display:block}
}

/* WordPress content page adjustments */
.entry-content{font-size:17px;line-height:1.8;max-width:790px}
.entry-content a{color:var(--accent);text-underline-offset:3px}
.entry-content img{max-width:100%;height:auto}
@media(max-width:860px){.wrap.no-panel nav.side{display:block;position:static;max-height:220px;overflow:auto}}

.home-categories{margin-top:44px}
.home-categories h2{font-size:24px;color:var(--text)}
.topic-link{display:block;text-decoration:none;transition:border-color .15s,transform .15s}
.topic-link:hover{border-color:var(--accent);transform:translateY(-2px)}
.topic-link h3{color:var(--accent)}

/* Keep navigation labels in the wide column instead of the icon column. */
nav.side{min-width:0;width:100%}
nav.side a{grid-template-columns:28px minmax(0,1fr);align-items:start;overflow-wrap:normal;word-break:normal}
nav.side a .side-label{min-width:0;overflow-wrap:break-word;line-height:1.55}
.wrap.no-panel{grid-template-columns:minmax(245px,280px) minmax(0,1fr);gap:40px}
@media(max-width:860px){
  .wrap.no-panel{grid-template-columns:minmax(0,1fr);gap:20px}
  .wrap.no-panel nav.side{width:100%;max-height:none;overflow:visible}
  .wrap.no-panel nav.side ol{display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin;padding-bottom:8px}
  .wrap.no-panel nav.side li{flex:0 0 auto}
  .wrap.no-panel nav.side a{display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:14px;padding:9px 12px}
  .wrap.no-panel nav.side a .side-label{white-space:nowrap}
}

/* Subtle YouTube-style sidebar scrollbar */
nav.side{
  scrollbar-width:thin;
  scrollbar-color:transparent transparent;
  scrollbar-gutter:stable;
}
nav.side:hover,
nav.side:focus-within{
  scrollbar-color:rgba(165,184,177,.35) transparent;
}
nav.side::-webkit-scrollbar{width:7px;height:7px}
nav.side::-webkit-scrollbar-track{background:transparent}
nav.side::-webkit-scrollbar-thumb{
  background:transparent;
  border-radius:999px;
}
nav.side:hover::-webkit-scrollbar-thumb,
nav.side:focus-within::-webkit-scrollbar-thumb{
  background:rgba(165,184,177,.35);
}
nav.side::-webkit-scrollbar-thumb:hover{
  background:rgba(165,184,177,.55);
}

/* Editable WordPress homepage content and section cards */
.migra-home .entry-content h1{font-size:clamp(36px,5vw,68px);line-height:1.13;color:var(--accent);margin:0 0 18px}
.migra-home .entry-content p{font-size:clamp(16px,1.5vw,20px);color:var(--muted)}

/* Multilingual page URLs and optional bilingual reading mode */
.migra-language-switch{display:flex;flex-wrap:nowrap;gap:3px;align-items:center;margin-left:auto}
.lang-item{padding:6px 11px;border-radius:999px;color:var(--muted);font-weight:600;text-decoration:none;font-size:13px;white-space:nowrap}
.lang-item:hover{color:var(--text);background:var(--panel-2)}
.lang-item.active{background:var(--accent);color:var(--accent-ink)}
.migra-sk-translation{display:none}
body.mode-visk .migra-sk-translation{display:block;color:var(--muted);font-size:.85em;margin-top:4px}
@media(max-width:860px){.top-in{flex-wrap:wrap}.migra-language-switch{margin-left:0}}

/* MIGRA chapter 03 — WordPress-editable article */
.migra-guide{max-width:850px}
.migra-guide .guide-lead{font-size:18px;color:var(--text);margin:4px 0 8px}
.migra-guide .guide-updated{font-size:13px;color:var(--dim);margin:0 0 20px}
.migra-guide .guide-toc{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 26px}
.migra-guide .guide-toc a{font-size:13px;text-decoration:none;border:1px solid var(--line-2);padding:7px 12px;border-radius:99px;color:var(--text)}
.migra-guide .guide-toc a:hover{border-color:var(--accent);color:var(--accent)}
.migra-guide .guide-section{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:clamp(18px,3vw,26px);margin:16px 0;scroll-margin-top:100px}
.migra-guide .guide-section h2{font-size:21px;color:var(--text);margin:0 0 16px;line-height:1.4}
.migra-guide .guide-section h2 span{font-size:14px;color:var(--accent);margin-right:8px}
.migra-guide .guide-section p,.migra-guide .guide-section li{font-size:15px;line-height:1.8;color:var(--text)}
.migra-guide .guide-section li{margin:0 0 8px}
.migra-guide .guide-section ul{padding-left:22px}
.migra-guide .guide-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:10px;margin-top:20px}
.migra-guide .guide-facts div{padding:14px;background:var(--bg-2);border:1px solid var(--line);border-radius:10px}
.migra-guide .guide-facts small{display:block;color:var(--muted);font-size:12px}
.migra-guide .guide-facts strong{display:block;font-size:14px}
.migra-guide .guide-resources{margin:26px 0}
.migra-guide .guide-next{display:flex;justify-content:space-between;gap:14px;margin:26px 0}
.migra-guide .guide-next a{width:50%;padding:14px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--text)}
.migra-guide .guide-next a:last-child{text-align:right}
.migra-guide .guide-next small{display:block;color:var(--muted);font-size:12px}
.migra-guide .guide-disclaimer{font-size:13px;color:var(--muted);border-top:1px solid var(--line);padding-top:18px}
@media(max-width:600px){.migra-guide .guide-next{flex-direction:column}.migra-guide .guide-next a{width:100%}}

/* Mobile: vertical collapsible navigation, overrides older horizontal rail rules. */
.mobile-nav-toggle{display:none}
@media(max-width:860px){
  .wrap.no-panel{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
  .mobile-nav-toggle{
    display:flex;align-items:center;gap:12px;width:100%;padding:13px 16px;
    border:1px solid var(--line-2);border-radius:12px;background:var(--panel);
    font-size:15px;font-weight:600;text-align:left;color:var(--text);
  }
  .mobile-nav-icon{font-size:19px;color:var(--accent)}
  .mobile-nav-chevron{margin-left:auto;transition:transform .2s;color:var(--muted);font-size:20px}
  .mobile-nav-toggle[aria-expanded="true"] .mobile-nav-chevron{transform:rotate(180deg)}
  .wrap.no-panel nav.side{display:none;position:static;width:100%;max-height:min(65vh,560px);overflow-y:auto;overflow-x:hidden;min-width:0;padding-right:3px}
  .wrap.no-panel nav.side.open{display:block}
  .wrap.no-panel nav.side ol{display:flex;flex-direction:column;gap:4px;overflow:visible;padding:0;margin:0}
  .wrap.no-panel nav.side li{flex:none;width:100%;min-width:0}
  .wrap.no-panel nav.side a{
    display:grid;grid-template-columns:28px minmax(0,1fr);align-items:start;
    width:100%;padding:12px 14px;gap:10px;white-space:normal;font-size:14px;
  }
  .wrap.no-panel nav.side .side-label{white-space:normal;overflow-wrap:break-word;line-height:1.45}
  .wrap.no-panel nav.side a .n{padding-top:1px}
}

/* MIGRA: mobile sidebar must remain vertical and collapsible. */
@media(max-width:860px){
  .wrap.no-panel nav.side{display:none;max-height:65vh;overflow-y:auto;overflow-x:hidden}
  .wrap.no-panel nav.side.open{display:block}
  .wrap.no-panel nav.side ol{display:flex;flex-direction:column;overflow:visible;gap:2px}
  .wrap.no-panel nav.side li{flex:none;width:100%}
  .wrap.no-panel nav.side a{display:grid;grid-template-columns:28px minmax(0,1fr);white-space:normal}
  .wrap.no-panel nav.side a .side-label{white-space:normal}
}

/* Prototype-inspired homepage; actual WordPress Page content remains editable. */
.migra-home-hub{margin-top:35px}.migra-home-hub h2{font-size:clamp(22px,3vw,28px);margin:30px 0 18px;color:var(--text)}
.migra-home-group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.migra-home-group{background:var(--panel);border:1px solid var(--line-2);border-radius:14px;padding:18px}
.migra-home-group h3{font-size:18px;line-height:1.4;margin:0 0 12px;color:var(--accent)}
.migra-home-group ul{list-style:none;margin:0;padding:0}
.migra-home-group li+li{border-top:1px solid var(--line)}
.migra-home-group a{display:flex;align-items:center;justify-content:space-between;text-decoration:none;padding:10px 0;font-size:14px}
.migra-home-group a:hover,.migra-home-topics a:hover{color:var(--accent)}
.migra-home-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px}
.migra-home-steps a{background:var(--accent-soft);border-top:3px solid var(--accent);border-radius:8px;padding:16px 12px;color:var(--text);text-decoration:none;font-weight:600}
.migra-home-topics{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.migra-home-topics a{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px;text-decoration:none;display:flex;gap:12px;align-items:start;font-size:14px}
.migra-home-topics a span{color:var(--accent);font-weight:700;min-width:20px}
.migra-home-disclaimer{padding-top:18px;border-top:1px solid var(--line);font-size:13px;color:var(--muted);margin-top:28px}

/* MIGRA 2026 native WordPress experience. No prototype HTML runtime. */
:root{--bg:#f5f8f6;--bg-2:#eaf1ed;--panel:#fff;--panel-2:#f1f6f3;--line:#e0e9e3;--line-2:#d1dfd6;--text:#142a22;--muted:#577166;--dim:#789184;--accent:#117a59;--accent-ink:#fff;--accent-soft:#e2f3e9;--sos-bg:#fff0eb;--sos:#b4452d;--sos-num:#9c3520}
body{background:var(--bg);color:var(--text)}
.top{background:rgba(255,255,255,.94);border-bottom-color:var(--line);box-shadow:0 2px 18px rgba(17,55,38,.04)}
.top-in{max-width:1500px;padding-top:17px;padding-bottom:17px}
.logo{letter-spacing:-.06em;font-size:26px;color:#163d2d}.logo b{color:#11986d}
.tagline{color:var(--muted)}
.wrap.no-panel{max-width:1500px;grid-template-columns:minmax(236px,270px) minmax(0,1fr);gap:36px;padding-top:30px}
nav.side{background:#fff;border:1px solid var(--line);border-radius:19px;padding:14px 9px;top:92px}
nav.side a{font-size:13px;line-height:1.4;border-radius:10px;padding:11px 12px}
nav.side a:hover{background:#f1f7f3}
nav.side a.active{background:var(--accent-soft);color:#06553a;font-weight:700}
nav.side .n{color:#8da69b}
.migra-home .entry-content{display:none}
.migra-landing{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(280px,.78fr);gap:18px}
.migra-welcome{background:linear-gradient(135deg,#0b5f49,#0a473b);color:#fff;border-radius:24px;padding:clamp(24px,4vw,52px);position:relative;overflow:hidden}
.migra-welcome:after{content:"";position:absolute;right:-100px;bottom:-170px;width:350px;height:350px;border:1px solid rgba(255,255,255,.14);border-radius:50%;pointer-events:none}
.migra-eyebrow,.migra-mini-label{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.migra-eyebrow{color:#b7e9d7}.migra-status-dot{height:8px;width:8px;background:#70ebae;border-radius:100%;box-shadow:0 0 0 4px rgba(112,235,174,.18)}
.migra-welcome h2{font-size:clamp(30px,3.4vw,47px);line-height:1.2;letter-spacing:-.05em;margin:32px 0 17px;color:#fff}
.migra-welcome h2 em{font-style:normal;color:#b8e7ca}
.migra-welcome p{font-size:15px;line-height:1.85;color:#d8ede3;max-width:560px}
.migra-quick-actions{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0}
.migra-quick-actions a{display:inline-flex;gap:14px;align-items:center;padding:13px 17px;border-radius:11px;text-decoration:none;font-size:13px;font-weight:700}
.migra-btn-primary{background:#fff;color:#0c664b}.migra-btn-secondary{background:rgba(255,255,255,.11);color:#fff;border:1px solid rgba(255,255,255,.27)}
.migra-hero-stats{border-top:1px solid rgba(255,255,255,.2);padding-top:23px;display:flex;gap:clamp(16px,2.5vw,40px);flex-wrap:wrap}
.migra-hero-stats span{display:flex;flex-direction:column;gap:4px;font-size:11px;color:#c3e2d3}.migra-hero-stats strong{font-size:18px;color:#fff}
.migra-guide-start{background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(20px,2.5vw,30px)}
.migra-mini-label{color:#128360}
.migra-guide-start h3{margin:12px 0 21px;font-size:23px;line-height:1.35;letter-spacing:-.025em}
.migra-roadmap-step{display:flex;align-items:center;gap:12px;padding:15px 0;border-top:1px solid var(--line);text-decoration:none}
.migra-roadmap-step:hover strong,.migra-native-topic:hover strong{color:var(--accent)}
.migra-step-number{border-radius:12px;background:#eaf6ee;color:#137a55;font-weight:800;font-size:13px;min-width:42px;text-align:center;padding:12px 4px}
.migra-roadmap-step strong{display:block;font-size:14px;margin-bottom:4px}
.migra-roadmap-step small{display:block;font-size:12px;color:var(--muted)}
.migra-step-arrow{margin-left:auto;color:var(--accent)}
.migra-native-topics{padding-top:25px}
.migra-section-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:18px}
.migra-section-heading h2{font-size:clamp(24px,3vw,31px);letter-spacing:-.04em;margin:9px 0 0}
.migra-topic-count{font-size:12px;color:var(--muted)}
.migra-native-topic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.migra-native-topic{background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px;display:flex;gap:12px;align-items:center;text-decoration:none;transition:transform .15s,box-shadow .15s}
.migra-native-topic:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(16,70,43,.07)}
.migra-topic-glyph{height:43px;min-width:43px;display:grid;place-items:center;background:#eaf5ef;border-radius:12px;color:#13805c;font-size:19px}
.migra-topic-body{min-width:0;flex:1}.migra-topic-body small{display:block;color:#8aa399;font-size:10px;margin-bottom:4px}
.migra-topic-body strong{display:block;font-size:13px;line-height:1.45;overflow-wrap:break-word}
.migra-topic-arrow{align-self:flex-start;color:#91afa1}
.migra-help-banner{margin-top:30px;border-radius:19px;background:#e5f1e9;border:1px solid #cce5d5;padding:25px 29px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.migra-help-banner h2{font-size:23px;margin:8px 0;color:#175a41}.migra-help-banner p{color:#547669;font-size:14px;margin:0}
.migra-help-banner>a{background:#117a59;color:#fff;border-radius:10px;padding:12px 17px;text-decoration:none;font-weight:700;font-size:13px;white-space:nowrap}
.migra-home-disclaimer{border:0;color:#83998d}
.migra-article-layout{min-width:0}.migra-reading-page{max-width:960px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(20px,4vw,44px)}
.migra-article-kicker{font-size:11px;font-weight:800;color:#168261;letter-spacing:.12em;margin-bottom:17px}
.migra-article-layout h1{color:#153c2e;font-size:clamp(28px,4vw,43px);line-height:1.2}
.migra-reading-page .entry-content{font-size:15px;line-height:1.85;overflow-wrap:anywhere}
.migra-reading-page .entry-content h2{color:#174d39}
.migra-article-end{border-top:1px solid var(--line);padding-top:20px;margin-top:35px;color:#698175;font-size:12px}
.lang-item{color:#527063}.lang-item:hover{background:#eaf3ec}.lang-item.active{background:#137a59;color:#fff}
footer{color:var(--muted)}
@media(max-width:1250px){.migra-landing{grid-template-columns:1fr}.migra-native-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){
 .wrap.no-panel{grid-template-columns:minmax(0,1fr);padding:16px 14px 40px;gap:16px}
 .wrap.no-panel nav.side{position:static;max-height:min(70vh,580px);overflow-y:auto}
 .mobile-nav-toggle{background:#fff;border-color:var(--line);color:var(--text)}
 .migra-landing{grid-template-columns:1fr}.migra-guide-start{padding:20px}
 .migra-native-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:540px){.migra-native-topic-grid{grid-template-columns:1fr}.migra-help-banner{flex-direction:column;align-items:flex-start}.migra-welcome{padding:28px 23px}.migra-hero-stats{gap:19px}.migra-topic-count{display:none}}

/* MIGRA visual parity with the supplied Prototype, implemented natively in WordPress. */
:root{--bg:#F3F6F4;--bg-2:#F3F6F4;--panel:#fff;--panel-2:#fff;--line:#DCE5E1;--line-2:#DCE5E1;--text:#132A26;--muted:#5B6E69;--dim:#5B6E69;--accent:#0A7458;--accent-soft:#E2F0EA;--accent-ink:#fff;--sos:#B8322A;--sos-bg:#FBE5E2;--sos-num:#B8322A}
body{font-size:16px;line-height:1.6}
.top{background:rgba(243,246,244,.94);box-shadow:none;border-bottom:1px solid var(--line)}
.top-in{max-width:1240px;padding:10px 16px;gap:12px}
.logo{font-weight:800;letter-spacing:.14em;font-size:18px}
.tagline{font-size:13px}
.langs{background:#fff;border-radius:99px;padding:3px}
.lang-item{font-size:13px;padding:5px 11px}
.wrap.no-panel.migra-proto-shell{max-width:1240px;padding:28px 16px 60px;grid-template-columns:250px minmax(0,1fr);gap:40px}
.migra-proto-shell nav.side{border:0;background:transparent;border-radius:0;box-shadow:none;padding:0 4px 0 0;top:70px}
.migra-proto-shell nav.side a{grid-template-columns:26px 1fr;gap:6px;padding:7px 8px;font-size:14px;line-height:1.35;border-radius:8px}
.migra-proto-shell nav.side a:hover{background:var(--accent-soft)}
.migra-proto-shell nav.side a.active{background:var(--accent-soft)}
.migra-proto-shell nav.side .n{font-size:12px}
.migra-proto-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:28px;align-items:start;margin-bottom:44px}
.migra-home .entry-content{display:none}
.migra-proto-intro h1{font-size:clamp(32px,5vw,54px);font-weight:800;letter-spacing:-.02em;color:var(--accent);line-height:1.2;margin:0 0 16px}
.migra-proto-sub{display:block;color:var(--muted);font-size:.5em;font-weight:600;letter-spacing:0;margin-top:8px}
.migra-proto-intro p{font-size:18px;color:var(--muted);margin:0;line-height:1.7}
.migra-proto-sos{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.migra-proto-sos a{display:flex;align-items:baseline;gap:8px;padding:6px 12px;background:var(--sos-bg);color:var(--sos);border-radius:99px;text-decoration:none}
.migra-proto-sos a strong{font-size:16px}.migra-proto-sos a span{font-size:13px}
.migra-proto-panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px}
.migra-proto-panel h2{font-size:20px;margin:0}.migra-proto-panel p{font-size:14px;color:var(--muted);margin:8px 0 16px}
.migra-proto-chiplist{display:flex;flex-wrap:wrap;gap:8px}
.migra-proto-chiplist a{border:1px solid var(--line);border-radius:99px;background:var(--bg);padding:6px 12px;color:var(--text);font-size:13px;text-decoration:none}
.migra-proto-chiplist a:hover{background:var(--accent-soft);border-color:var(--accent)}
.migra-proto-panel-footer{margin-top:18px;border-top:1px dashed var(--line);padding-top:15px;display:flex;flex-direction:column;gap:8px;font-size:14px}
.migra-proto-panel-footer a{color:var(--accent);font-weight:700}
.migra-proto-block{margin-bottom:44px}
.migra-proto-heading h2{margin:0 0 16px;font-size:24px;color:var(--text);font-weight:800}
.migra-proto-needs{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.migra-proto-need{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px}
.migra-proto-need.migra-urgent{border-color:#d9a5a0}
.migra-proto-need h3{font-size:17px;margin:0 0 10px}.migra-proto-need.migra-urgent h3{color:var(--sos)}
.migra-proto-need ul{list-style:none;margin:0;padding:0}
.migra-proto-need li a{display:block;padding:5px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--text);text-decoration:none}
.migra-proto-need li:last-child a{border:0}.migra-proto-need li a:after{content:" →";color:var(--accent)}
.migra-proto-timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));counter-reset:proto;gap:0}
.migra-proto-timeline a{border-top:3px solid var(--accent);position:relative;padding:14px 10px 0 0;text-decoration:none;color:var(--text);font-weight:600;font-size:14px}
.migra-proto-timeline a:before{counter-increment:proto;content:counter(proto);display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--accent);color:white;font-size:13px;margin-top:-28px;margin-bottom:9px}
.migra-proto-allgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.migra-proto-allgrid a{display:grid;grid-template-columns:34px 1fr;gap:8px;padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:10px;color:var(--text);text-decoration:none;font-size:15px;font-weight:600}
.migra-proto-allgrid a span{color:var(--accent)}
.migra-reading-page{background:transparent;border:none;padding:0;max-width:850px}
.migra-article-layout h1{color:var(--text)}
.migra-proto-shell .migra-reading-page .entry-content{line-height:1.7}
@media(max-width:860px){
 .wrap.no-panel.migra-proto-shell{grid-template-columns:minmax(0,1fr);gap:15px;padding:16px 16px 44px}
 .migra-proto-shell nav.side{position:static;border:1px solid var(--line);border-radius:10px;background:#fff;padding:8px;max-height:min(65vh,560px);overflow-y:auto}
 .migra-proto-shell nav.side ol{display:flex;flex-direction:column;overflow:visible}
 .migra-proto-shell nav.side li{width:100%;flex:none}
 .migra-proto-shell nav.side a{display:grid;grid-template-columns:26px minmax(0,1fr);white-space:normal}
 .migra-proto-shell nav.side .side-label{white-space:normal}
 .migra-proto-hero{grid-template-columns:1fr;gap:22px}
 .migra-proto-timeline{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}
}
@media(max-width:520px){.migra-proto-timeline{grid-template-columns:1fr;row-gap:26px}.migra-proto-sos a{font-size:12px}}

/* Prototype background palette. Matches MIGRA-web/src/styles.css, including OS dark mode. */
:root{
  --bg:#F3F6F4;
  --bg-2:#F3F6F4;
  --surface:#FFFFFF;
  --panel:var(--surface);
  --panel-2:var(--surface);
  --ink:#132A26;
  --text:var(--ink);
  --muted:#5B6E69;
  --dim:var(--muted);
  --line:#DCE5E1;
  --line-2:var(--line);
  --accent:#0A7458;
  --accent-ink:#FFFFFF;
  --accent-soft:#E2F0EA;
  --sos:#B8322A;
  --sos-bg:#FBE5E2;
  --sos-num:#B8322A;
}
html,body{background:var(--bg);color:var(--ink)}
.top{background:color-mix(in srgb,var(--bg) 88%,transparent);border-color:var(--line)}
.migra-proto-panel,.migra-proto-need,.migra-proto-allgrid a{background:var(--surface);border-color:var(--line)}
.migra-proto-chiplist a{background:var(--bg)}
.migra-proto-sos a{background:var(--sos-bg);color:var(--sos)}
.migra-proto-shell nav.side{background:transparent}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0E1715;--bg-2:#0E1715;
    --surface:#15211F;--panel:var(--surface);--panel-2:var(--surface);
    --ink:#E3EDE9;--text:var(--ink);
    --muted:#9AAEA8;--dim:var(--muted);
    --line:#26342F;--line-2:var(--line);
    --accent:#42C29C;--accent-ink:#06211A;--accent-soft:#163129;
    --sos:#F2796E;--sos-bg:#381C19;--sos-num:#F2796E;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0E1715;--bg-2:#0E1715;--surface:#15211F;
  --panel:var(--surface);--panel-2:var(--surface);
  --ink:#E3EDE9;--text:var(--ink);--muted:#9AAEA8;--dim:var(--muted);
  --line:#26342F;--line-2:var(--line);
  --accent:#42C29C;--accent-ink:#06211A;--accent-soft:#163129;
  --sos:#F2796E;--sos-bg:#381C19;--sos-num:#F2796E;
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .migra-proto-shell nav.side,
  :root:not([data-theme="light"]) .migra-proto-panel,
  :root:not([data-theme="light"]) .migra-proto-need,
  :root:not([data-theme="light"]) .migra-proto-allgrid a,
  :root:not([data-theme="light"]) .mobile-nav-toggle,
  :root:not([data-theme="light"]) .migra-reading-page{color:var(--ink);border-color:var(--line)}
}
:root[data-theme="dark"] .migra-proto-panel,
:root[data-theme="dark"] .migra-proto-need,
:root[data-theme="dark"] .migra-proto-allgrid a,
:root[data-theme="dark"] .mobile-nav-toggle{background:var(--surface);color:var(--ink);border-color:var(--line)}

/* Light / Dark switch: override legacy hard-coded white backgrounds across pages */
.migra-theme-toggle{display:inline-flex;align-items:center;gap:7px;flex-shrink:0;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--text);padding:8px 12px;font-size:13px;font-weight:700}
.migra-theme-toggle:hover{border-color:var(--accent)}
.migra-theme-icon{font-size:17px;line-height:1}
.migra-status-guide{max-width:900px}
.migra-status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin:22px 0}
.migra-status-option{display:flex;align-items:center;gap:12px;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:14px;text-decoration:none;color:var(--text);transition:border-color .15s,transform .15s}
.migra-status-option:hover{border-color:var(--accent);transform:translateY(-2px)}
.migra-status-symbol{font-size:24px;flex-shrink:0}
.migra-status-copy{flex:1;min-width:0}.migra-status-copy strong{display:block;font-size:15px}.migra-status-copy small{display:block;font-size:12px;color:var(--muted);margin-top:6px;line-height:1.5}
.migra-status-arrow{color:var(--accent);font-size:19px}
.migra-status-note{font-size:13px;color:var(--muted)}
:root[data-theme="dark"] body,:root[data-theme="light"] body{background:var(--bg);color:var(--text)}
:root[data-theme="dark"] .top,:root[data-theme="dark"] .migra-proto-shell nav.side,:root[data-theme="dark"] .migra-proto-panel,:root[data-theme="dark"] .migra-proto-need,:root[data-theme="dark"] .migra-proto-allgrid a,:root[data-theme="dark"] .migra-reading-page,:root[data-theme="dark"] .migra-proto-card,:root[data-theme="dark"] .migra-proto-item,:root[data-theme="dark"] .migra-home-group,:root[data-theme="dark"] .migra-native-topic,:root[data-theme="dark"] .migra-guide-start,:root[data-theme="dark"] .migra-status-option,:root[data-theme="dark"] .mobile-nav-toggle{background:var(--surface);color:var(--text);border-color:var(--line)}
:root[data-theme="dark"] .migra-proto-chiplist a,:root[data-theme="dark"] .migra-proto-timeline a,:root[data-theme="dark"] .migra-step-number{background:var(--accent-soft);color:var(--text);border-color:var(--line)}
:root[data-theme="dark"] .migra-proto-intro h1,:root[data-theme="dark"] .migra-article-layout h1,:root[data-theme="dark"] .migra-proto-heading h2,:root[data-theme="dark"] .migra-proto-need h3{color:var(--text)}
:root[data-theme="dark"] .migra-proto-sos a{background:var(--sos-bg);color:var(--sos)}
:root[data-theme="dark"] .migra-theme-toggle{background:var(--surface);color:var(--text)}
@media(max-width:650px){.migra-status-grid{grid-template-columns:1fr}.migra-theme-toggle{padding:7px 9px}.migra-theme-label{display:none}}

/* Restore visible article/card surfaces in both themes, matching the Prototype. */
:root{--migra-reading-bg:#FFFFFF;--migra-reading-border:#DCE5E1;--migra-reading-shadow:0 8px 30px rgba(12,70,52,.045)}
:root[data-theme="dark"]{--migra-reading-bg:#192823;--migra-reading-border:#33473E;--migra-reading-shadow:0 8px 28px rgba(0,0,0,.16)}
@media(prefers-color-scheme:dark){
 :root:not([data-theme="light"]){--migra-reading-bg:#192823;--migra-reading-border:#33473E;--migra-reading-shadow:0 8px 28px rgba(0,0,0,.16)}
}
.migra-proto-shell .migra-reading-page,
:root[data-theme="dark"] .migra-proto-shell .migra-reading-page{
 background:var(--migra-reading-bg);border:1px solid var(--migra-reading-border);
 border-radius:20px;padding:clamp(20px,3vw,36px);max-width:100%;
 box-shadow:var(--migra-reading-shadow);color:var(--text)
}
.migra-proto-shell .migra-reading-page .entry-content .migra-proto-card,
.migra-proto-shell .migra-reading-page .entry-content .migra-ch1-card{
 background:var(--surface);border:1px solid var(--line);border-radius:16px;
 margin:18px 0;padding:clamp(16px,2.4vw,24px)
}
.migra-proto-shell .migra-reading-page .entry-content h2,
.migra-proto-shell .migra-reading-page .entry-content .migra-proto-card h2,
.migra-proto-shell .migra-reading-page .entry-content .migra-ch1-card h2{color:var(--text);line-height:1.4}
.migra-proto-shell .migra-reading-page .entry-content p,
.migra-proto-shell .migra-reading-page .entry-content li{color:var(--text)}
.migra-proto-shell .migra-reading-page .entry-content .migra-proto-toc a,
.migra-proto-shell .migra-reading-page .entry-content .migra-ch1-toc a{
 color:var(--accent);border:1px solid var(--line);border-radius:999px;
 background:var(--surface);padding:7px 11px;text-decoration:none
}
@media(max-width:600px){.migra-proto-shell .migra-reading-page{padding:18px 15px;border-radius:14px}}
