#gameApp { background:var(--surface-page,#f6f5f2); color:var(--ink,#303437); }
#gameApp .game-content { flex:1; min-height:0; overflow-y:auto; padding:12px 14px calc(24px + var(--sab,0px)); }
#gameApp .game-list { display:flex; flex-direction:column; gap:12px; }
#gameApp .game-import-bar { display:flex; gap:8px; margin-bottom:12px; }
#gameApp .game-import-bar button { display:flex; align-items:center; justify-content:center; gap:6px; min-height:38px; padding:0 14px; border:1px solid var(--border-light,#ddd8d1); border-radius:6px; background:var(--surface-card,#fff); color:var(--ink-light,#62696d); font-size:13px; cursor:pointer; }
#gameApp .game-import-bar button.primary { flex:1; border-color:var(--monet-blue,#638da5); background:var(--monet-blue,#638da5); color:#fff; }
.game-preview-card { display:grid; grid-template-columns:minmax(112px,38%) minmax(0,1fr); min-height:148px; overflow:hidden; border:1px solid var(--border-light,#e1ddd7); border-radius:8px; background:var(--surface-card,#fff); cursor:pointer; }
.game-preview-frame { position:relative; min-width:0; overflow:hidden; background:#111; }
.game-preview-frame iframe { position:absolute; inset:0; width:200%; height:200%; border:0; background:#fff; pointer-events:none; transform:scale(.5); transform-origin:top left; }
.game-preview-shield { position:absolute; inset:0; background:linear-gradient(90deg,transparent 60%,rgba(0,0,0,.08)); }
.game-preview-info { display:flex; min-width:0; flex-direction:column; padding:12px; }
.game-preview-heading { display:flex; align-items:center; gap:8px; min-width:0; }
.game-preview-icon { display:flex; align-items:center; justify-content:center; width:32px; height:32px; flex:none; border-radius:6px; background:var(--surface-input,#f0f0ed); font-size:17px; }
.game-preview-heading > div { min-width:0; }
.game-preview-heading strong { display:block; overflow:hidden; color:var(--ink,#303437); font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.game-preview-heading small { display:block; margin-top:2px; overflow:hidden; color:var(--ink-subtle,#8a9094); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.game-preview-info p { display:-webkit-box; flex:1; overflow:hidden; margin:8px 0; color:var(--ink-light,#636a6e); font-size:12px; line-height:1.5; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.game-preview-actions { display:flex; align-items:center; gap:6px; }
.game-preview-actions button { min-height:30px; padding:0 12px; border:0; border-radius:5px; background:var(--monet-blue,#638da5); color:#fff; font-size:11px; cursor:pointer; }
.game-preview-actions button.icon { width:30px; padding:0; background:var(--surface-input,#f0f0ed); color:var(--ink-subtle,#8a9094); font-size:17px; }
.game-empty { display:flex; min-height:58vh; align-items:center; justify-content:center; flex-direction:column; text-align:center; color:var(--ink-subtle,#8a9094); }
.game-empty-icon { display:flex; align-items:center; justify-content:center; width:56px; height:56px; margin-bottom:12px; border:1px solid var(--border-light,#dedad4); border-radius:50%; color:var(--monet-blue,#638da5); font-size:26px; }
.game-empty strong { color:var(--ink,#303437); font-size:15px; }
.game-empty span { max-width:260px; margin:6px 0 14px; font-size:12px; line-height:1.6; }
.game-empty button { padding:9px 14px; border:0; border-radius:5px; background:var(--monet-blue,#638da5); color:#fff; font-size:12px; }
.game-role-game { display:flex; align-items:center; gap:10px; margin-bottom:16px; padding:10px; border:1px solid var(--border-light,#dedad4); border-radius:7px; background:var(--surface-input,#f3f2ef); }
.game-role-game > span { font-size:26px; }
.game-role-game strong, .game-role-game small { display:block; }
.game-role-game strong { color:var(--ink,#303437); font-size:14px; }
.game-role-game small, .game-role-dialog p { margin-top:3px; color:var(--ink-subtle,#8a9094); font-size:11px; line-height:1.5; }
.game-role-dialog label { display:block; margin-bottom:6px; color:var(--ink-light,#636a6e); font-size:12px; }
@media (max-width:360px) { .game-preview-card { grid-template-columns:108px minmax(0,1fr); } .game-preview-info { padding:10px; } }