:root{--bg1:#0b0426;--bg2:#17093f;--fg:#f2ecff;--mut:#b7a9e6;--acc:#8b5cf6;--acc2:#22d3ee;--card:rgba(255,255,255,.07);--line:rgba(255,255,255,.14);--bar:52px}
@media (prefers-color-scheme:light){:root{--bg1:#f5f1ff;--bg2:#e8e0ff;--fg:#1b1233;--mut:#5b4d85;--card:rgba(255,255,255,.75);--line:rgba(60,30,120,.18)}}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--fg);background:linear-gradient(160deg,var(--bg1),var(--bg2));background-attachment:fixed;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0);padding-bottom:env(safe-area-inset-bottom,0)}
.em-bar{flex:0 0 auto;display:flex;align-items:center;gap:12px;min-height:var(--bar);padding:6px 12px;border-bottom:1px solid var(--line);background:rgba(10,4,30,.55);backdrop-filter:blur(8px)}
@media (prefers-color-scheme:light){.em-bar{background:rgba(255,255,255,.7)}}
.em-logo{color:var(--fg);text-decoration:none;font-weight:700;white-space:nowrap}
#em-nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin;flex:1;padding-bottom:2px}
#em-nav a{flex:0 0 auto;color:var(--mut);text-decoration:none;padding:6px 12px;border-radius:999px;border:1px solid transparent;font-size:.92rem;white-space:nowrap}
#em-nav a:hover{color:var(--fg);border-color:var(--line)}
#em-nav a[aria-current="page"]{color:#fff;background:var(--acc);border-color:var(--acc)}
main{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.em-home{max-width:68rem;margin:0 auto;padding:28px 16px 48px;overflow:auto;width:100%}
.em-home h1{margin:0 0 4px;font-size:1.9rem}
.em-home>p{margin:0 0 20px;color:var(--mut)}
.em-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.em-card{display:block;color:inherit;text-decoration:none;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;transition:transform .15s,border-color .15s}
.em-card:hover,.em-card:focus-visible{transform:translateY(-2px);border-color:var(--acc2);outline:none}
.em-card .ic{font-size:1.8rem;line-height:1}
.em-card h2{margin:8px 0 4px;font-size:1.05rem}
.em-card p{margin:0;color:var(--mut);font-size:.9rem}
.em-stage{flex:1 1 auto;min-height:0;position:relative}
#em-frame{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff}
[hidden]{display:none!important}