/* 768px - 1199px: tablet / küçük laptop */
.topbar {
    position: sticky;
    top: 10px;
    z-index: 70;
    margin-inline: 14px;
    border-radius: 24px;
}
.mobile-menu {
    display: inline-grid;
}
.layout {
    grid-template-columns: 1fr;
    padding-inline: 14px;
}
.sidebar {
    position: fixed;
    inset: 86px auto 16px 16px;
    z-index: 80;
    width: min(370px, calc(100vw - 32px));
    overflow: auto;
    transform: translateX(calc(-100% - 28px));
    transition: transform .22s ease;
}
.sidebar.is-open {
    transform: translateX(0);
}
.main-panel {
    padding: 18px;
}
.hero-grid {
    grid-template-columns: 1fr;
}
.hero-copy {
    padding: 28px;
}
.grid.three,
.grid.two,
.toggle-grid,
.toggle-grid.compact,
.control-grid,
.scoreboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.field.wide,
.chart-box {
    grid-column: 1 / -1;
}
.chute-grid.modern {
    grid-template-columns: repeat(3, 1fr);
}
.section-head {
    align-items: flex-start;
    flex-wrap: wrap;
}