:root{--bg:#f8f9fb;--fg:#111;--muted:#666;--accent:#2563eb}
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial;margin:0;background:var(--bg);color:var(--fg)}
.inner{max-width:1000px;margin:0 auto;padding:1rem}
.site-header{background:white;border-bottom:1px solid #e6e9ee}
.site-header .inner{display:flex;align-items:center;gap:1rem}
.brand{margin:0;font-size:1.25rem}
.brand a{color:inherit;text-decoration:none}
.main-nav{margin-left:1rem;display:flex;gap:1rem}
.main-nav a{color:var(--fg);text-decoration:none}
.content{padding:2rem}
.btn{display:inline-block;padding:.6rem 1rem;background:var(--accent);color:white;text-decoration:none;border-radius:6px}
.announce{margin-top:.5rem;color:var(--accent);font-weight:600}
.release-note{display:block;margin-top:.25rem;color:var(--muted);font-size:0.9rem}
.compat-table{width:100%;border-collapse:collapse;margin-top:1rem}
.compat-table th,.compat-table td{padding:.6rem;border:1px solid #e6e9ee;text-align:left}

/* Style for markdown-generated tables inside content */
.content table{width:100%;border-collapse:collapse;margin-top:1rem}
.content table th,.content table td{padding:.6rem;border:1px solid #e6e9ee;text-align:left;background:white}
.content table th{background:#f1f5f9}
.screens-grid{display:flex;gap:1rem;margin-top:1rem;overflow-x:auto;padding:0.5rem 0;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.screens-grid::-webkit-scrollbar{height:10px}
.screens-grid::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:6px}
.screenshot{flex:0 0 auto;height:30vh;max-height:50vh;width:auto;object-fit:contain;background:white;border:1px solid #e6e9ee;padding:4px;border-radius:6px;scroll-snap-align:start}
.placeholder{color:#9aa6bd}
.site-footer {
    padding: 2.5rem 0;
    background: linear-gradient(180deg,#f6f8fa 0%,#eef2f6 100%);
    border-top: 1px solid rgba(14,20,30,0.04);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), 0 -6px 18px rgba(16,24,40,0.03);
    font-size: 16px;
    color: var(--muted);
}

.site-footer .wrapper{max-width:1000px;margin:0 auto;padding:0 1rem}
.footer-col-wrapper{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.footer-col-2{flex-basis:100%}
.footer-col-2 .social-media-list{margin:0;padding:0;list-style:none}
.footer-col-2 .social-media-list li{margin:0}
.footer-col{flex:1 1 180px}
.site-footer a{
    color: var(--accent);
    text-decoration: underline;
    font-weight: 600;
}
.site-footer a:hover{
    opacity: 0.9;
    text-decoration: none;
}
.site-footer .copyright{margin:0}
.site-footer .copyright a{display:block;margin-top:0.25rem}

.footer-divider {
    border: 0;
    border-top: 1px solid #eee;
    margin: 20px 0;
}

.footer-disclaimer {
    font-size: 0.85rem;
    color: #828282;
    line-height: 1.5;
}

.footer-disclaimer p {
    margin-bottom: 10px;
}

.warning-text strong {
    color: #d9534f;
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
