/* Reference 1800 x 1320: existing 253px shell, 2.15:1 workspace and side panel. */
body[data-feature^="api-game."]{background:#edf3fb}
body[data-feature^="api-game."] .page-heading{margin-bottom:4px}
body[data-feature^="api-game."] .page-heading-meta{display:none}
.api-game-page{position:relative;color:#315781;--ag-border:#dce7f8;--ag-muted:#8299ba;display:grid;gap:13px;min-width:0;padding-bottom:22px}
.api-game-page .ag-contextline{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:22px;margin-bottom:0}
.api-game-page .ag-contextline p{margin:0;color:var(--ag-muted);font-size:12px}
.api-game-page .ag-demo-badge{white-space:nowrap;background:#fff7e8;border:1px solid #ffd58c;border-radius:5px;padding:5px 10px;color:#a66b08;font-size:11px;font-weight:600}
.api-game-page .ag-metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:0}
.api-game-page .metric-card{min-height:104px;border:1px solid var(--ag-border);box-shadow:none;border-radius:8px;padding:17px}
.api-game-page .metric-icon{height:48px;width:48px;border-radius:15px}
.api-game-page .metric-label{font-size:12px;color:#6e8bb2}
.api-game-page .metric-value{font-size:25px;line-height:1.4;color:#12325e}
.api-game-page .metric-content small{font-size:11px;color:#8fa5c2}
.api-game-page .ag-filter-area{min-width:0}
.api-game-page .filter-bar{margin:0;min-height:75px;border:1px solid var(--ag-border);box-shadow:none;border-radius:8px;padding:16px;gap:12px;align-items:flex-end;display:flex;flex-wrap:wrap;background:#fff}
.api-game-page .filter-bar .field{flex:1 1 155px;min-width:0;margin:0}
.api-game-page .filter-actions{margin-left:0;flex-shrink:0;gap:8px}
.api-game-page .form-control,.api-game-page .form-select{border-color:#cddffd;border-radius:5px;min-width:0;color:#315781;font-size:12px;min-height:38px;background-color:#f8fbff}
.api-game-page .filter-bar .field>span{font-size:11px}
.api-game-page .ag-columns{display:grid;grid-template-columns:minmax(0,2.15fr) minmax(300px,1fr);gap:13px;align-items:stretch}
.api-game-page .panel{border:1px solid var(--ag-border);border-radius:9px;box-shadow:0 3px 7px #143b6510;margin:0;min-width:0;overflow:hidden}
.api-game-page .panel-heading{min-height:51px;padding:13px 16px;border-bottom:1px solid var(--ag-border)}
.api-game-page .panel-heading h2{font-size:15px;font-weight:700;color:#153761;gap:10px;min-width:0}
.api-game-page .panel-body{padding:15px}
.api-game-page .ag-main-panel,.api-game-page .ag-side-panel{min-height:674px}
.api-game-page .ag-main-panel>.panel-body{padding:0 14px 14px}
.api-game-page .ag-workspace{padding-top:12px;min-width:0}
.api-game-page .page-tabs{border-bottom:1px solid #e5edf8;margin:0;gap:22px;min-height:45px;overflow-x:auto;flex-wrap:nowrap}
.api-game-page .page-tab{font-size:12px;padding:12px 0;white-space:nowrap;color:#6b8bb8}
.api-game-page .page-tab.active{color:#1671ff;font-weight:600}
.api-game-page .table-scroll{max-width:100%;border:1px solid #e1ebfb;border-radius:7px;overflow:auto;overscroll-behavior-x:contain}
.api-game-page .data-table{font-size:11px;min-width:660px}
.api-game-page .data-table th{font-size:11px;background:#edf3fb;color:#527299;padding:11px 10px;font-weight:600;white-space:nowrap}
.api-game-page .data-table td{padding:6px 10px;border-bottom:1px solid #e6edf8;line-height:1.6}
.api-game-page .data-table tbody tr:nth-child(even){background:#fbfdff}
.api-game-page .data-table .btn{padding:4px 8px;min-height:26px;font-size:11px;white-space:nowrap}
.api-game-page .data-table .form-control,.api-game-page .data-table .form-select{height:30px;min-height:30px;font-size:11px;padding:4px 6px}
.api-game-page .ag-edit-input{min-width:75px;max-width:100%}
body[data-feature="api-game.5"] .api-game-page .data-table .form-select{min-width:108px;padding-right:28px;background-position:right 8px center}
.api-game-page .ag-pairs{margin:0;font-size:12px}
.api-game-page .ag-pairs>div{display:grid;grid-template-columns:minmax(90px,.9fr) minmax(0,1.1fr);gap:12px;padding:9px 0;border-bottom:1px solid #e8eff9;align-items:start}
.api-game-page .ag-pairs dt{color:#7c99bd;font-weight:400}
.api-game-page .ag-pairs dd{margin:0;text-align:right;color:#315781;font-weight:600;overflow-wrap:anywhere}
.api-game-page .ag-bottom{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(360px,1fr);gap:13px}
.api-game-page .ag-bottom .panel{min-height:176px}
.api-game-page .ag-bottom .panel-heading{min-height:38px;border:0;padding:13px 16px 4px}
.api-game-page .ag-bottom .panel-body{padding:8px 16px 16px}
.api-game-page .ag-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.api-game-page .ag-guide-item{border:1px solid #dce8fb;border-radius:5px;background:#f8fbff;padding:9px 10px;font-size:11px;display:grid;gap:4px;min-width:0}
.api-game-page .ag-guide-item strong{color:#24558d}
.api-game-page .ag-guide-item span{color:#7996bc;line-height:1.5}
.api-game-page .ag-action-hint{font-size:12px;color:#718fb8;margin:0 0 16px;line-height:1.7}
.api-game-page .ag-action-buttons{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.api-game-page .btn{font-size:12px;min-height:36px;border-radius:5px}
.api-game-page .notice{font-size:11px;padding:10px;margin-bottom:10px;border:1px solid #d8e7ff;box-shadow:none}
.api-game-page .pagination-row{font-size:11px;padding:10px 0;gap:10px;flex-wrap:wrap;color:#809ec8}
.api-game-page .status-pill{font-size:10px;border-radius:3px;padding:3px 7px;white-space:nowrap}
.api-game-page .chart-box{border:1px solid #dce8fb;border-radius:6px;padding:10px;margin-bottom:10px}
.api-game-page .ag-balance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px}
.api-game-page .ag-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}
.api-game-page .ag-form-grid .field{min-width:0;margin:0}
.api-game-page .ag-form-grid .field>span{font-size:11px;color:#6e8bb2;margin-bottom:5px}
.ag-draft-diff{display:grid;gap:12px;font-size:12px;overflow-wrap:anywhere}
.ag-draft-diff section{border:1px solid #dce7f8;padding:12px;border-radius:6px}
.ag-draft-diff dl{display:grid;grid-template-columns:130px minmax(0,1fr);gap:8px;margin:10px 0 0}
.ag-draft-diff dd{margin:0}
@media(max-width:1400px){.api-game-page .ag-columns{grid-template-columns:minmax(0,1fr)}.api-game-page .ag-main-panel{min-height:600px}.api-game-page .ag-side-panel{min-height:0}.api-game-page .ag-side-panel .ag-pairs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}.api-game-page .ag-bottom{grid-template-columns:1fr 1fr}.api-game-page .ag-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.api-game-page{gap:10px}.api-game-page .ag-contextline{align-items:flex-start;flex-direction:column;gap:8px}.api-game-page .ag-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.api-game-page .metric-card{padding:12px;min-height:92px;gap:9px}.api-game-page .metric-icon{width:34px;height:34px;flex-shrink:0}.api-game-page .metric-value{font-size:21px}.api-game-page .ag-columns,.api-game-page .ag-bottom{grid-template-columns:minmax(0,1fr)}.api-game-page .ag-main-panel{min-height:0}.api-game-page .filter-bar{padding:12px;gap:10px}.api-game-page .filter-bar .field{flex-basis:100%}.api-game-page .filter-actions{width:100%;justify-content:flex-end}.api-game-page .ag-side-panel .ag-pairs{grid-template-columns:1fr}.api-game-page .ag-guide-grid,.api-game-page .ag-balance-grid,.api-game-page .ag-form-grid{grid-template-columns:1fr}.api-game-page .ag-main-panel>.panel-body{padding:0 10px 10px}.api-game-page .panel-heading{padding:12px}.api-game-page .ag-action-buttons .btn{flex:1 1 120px}.ag-draft-diff dl{grid-template-columns:1fr}.api-game-page .pagination-controls{flex-wrap:wrap}}

/* Dense editable rows retain accessible names without duplicating headings in each cell. */
.api-game-page .data-table .field{position:relative;margin:0;gap:0}
.api-game-page .data-table .field>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.api-game-page .data-table small{display:block;font-size:10px;line-height:12px;margin-top:2px}
@media(min-width:701px){
 .api-game-page .filter-bar .field{position:relative;gap:0}
 .api-game-page .filter-bar .field>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
 .api-game-page .filter-bar .form-control,.api-game-page .filter-bar .form-select{height:40px;min-height:40px}
}
@media(min-width:1401px){
 .api-game-page{padding-top:5px}
 .api-game-page .ag-contextline{position:absolute;left:0;right:0;top:0;height:0;min-height:0}
 .api-game-page .ag-contextline p{position:absolute;top:-26px;left:430px;right:250px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .api-game-page .ag-demo-badge{position:absolute;right:0;top:-64px}
 .api-game-page .metric-card{height:104px;min-height:104px;padding:15px 17px}
}/* Empty-placeholder filters keep their caption inside the compact native input group. */
@media(min-width:701px){
 .api-game-page .filter-bar .field:has(>input[placeholder=""]){display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;height:40px;padding:0 10px;border:1px solid #cddffd;border-radius:5px;background:#f8fbff}
 .api-game-page .filter-bar .field:has(>input[placeholder=""])>span{position:static;width:auto;height:auto;padding:0;margin:0;overflow:visible;clip-path:none;white-space:nowrap;color:#6e8bb2}
 .api-game-page .filter-bar .field:has(>input[placeholder=""])>input{height:36px;min-height:36px;border:0;background:transparent;padding:4px 0;box-shadow:none}
}
/* Two native dates need a complete row when the filter grid becomes narrow. */
@media(min-width:701px){
 .api-game-page .filter-bar .date-field{flex:1 1 155px;min-width:260px}
 .api-game-page .filter-bar .date-range{width:100%;max-width:100%}
}