.modal-overlay:has(.platform-sync) { z-index: 230; }
.platform-sync { width:min(900px,100%); max-width:900px; max-height:min(92dvh,1000px); display:flex; flex-direction:column; padding:0; overflow:hidden; background:var(--surface,#111118); border:1px solid var(--border2); border-radius:24px; box-shadow:0 28px 100px #0009; font-family:Inter,sans-serif; color:var(--text); text-align:left; }
.platform-sync h2,.platform-sync h3,.platform-sync h4 { font-family:'Plus Jakarta Sans',Inter,sans-serif; }
.platform-sync button,.platform-sync input,.platform-sync select { font:inherit; }
.platform-sync :is(button,a,input,select) { touch-action:manipulation; }
.platform-sync :is(button,a,input,select):focus-visible { outline:2px solid var(--accent2); outline-offset:3px; }
.platform-sync button:disabled { opacity:.45; cursor:default; }
.sync-header { padding:25px 28px 18px; display:flex; align-items:flex-start; justify-content:space-between; gap:15px; background:radial-gradient(ellipse at top left,var(--accent-glow),transparent 80%); }
.sync-eyebrow { color:var(--accent2); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.13em; }
.sync-header h2 { margin:8px 0; font-size:clamp(21px,3vw,27px); line-height:1.25; }
.sync-copy { color:var(--text2); font-size:13px; line-height:1.65; margin:0; overflow-wrap:anywhere; }
.sync-platforms { display:flex; margin:0 28px; padding:4px; background:var(--bg); border:1px solid var(--border); border-radius:13px; gap:5px; }
.sync-platforms button { flex:1; display:flex; align-items:center; justify-content:center; gap:10px; background:transparent; color:var(--text2); border:0; border-radius:9px; padding:12px; font-weight:700; cursor:pointer; }
.sync-platforms img { width:22px; height:22px; object-fit:contain; }
.sync-platforms [aria-selected=true] { background:var(--accent); color:var(--accent-contrast,#fff); }
.sync-platforms [aria-selected=true]:disabled { opacity:1; }
.sync-steps { display:flex; list-style:none; padding:18px 28px; gap:12px; margin:0; border-bottom:1px solid var(--border); }
.sync-steps li { flex:1; display:flex; gap:8px; align-items:center; font-size:12px; color:var(--text3); }
.sync-steps li>span { border:1px solid var(--border2); display:grid; place-items:center; flex-shrink:0; width:25px; height:25px; border-radius:50%; font-weight:800; }
.sync-steps .active { color:var(--text); font-weight:700; }
.sync-steps .active>span { background:var(--accent); color:var(--accent-contrast,#fff); border-color:transparent; }
.sync-steps .completed>span { color:var(--green); }
.sync-body { overflow-y:auto; overscroll-behavior:contain; min-height:0; padding:24px 28px; display:flex; flex-direction:column; gap:18px; }
.sync-body h3 { font-size:19px; line-height:1.4; margin:0; }
.sync-connect { display:flex; flex-direction:column; gap:14px; }
.sync-field { display:flex; flex-direction:column; gap:8px; font-size:12px; font-weight:600; color:var(--text2); min-width:0; }
.sync-field .form-input { width:100%; box-sizing:border-box; min-height:44px; font-size:13px; }
.sync-link { color:var(--accent2); background:none; padding:4px 0; border:0; font-size:12px; font-weight:650; cursor:pointer; align-self:flex-start; text-decoration:none; text-align:left; }
.sync-link:hover { text-decoration:underline; }
.sync-guide { display:flex; flex-direction:column; gap:10px; padding:15px 18px; background:var(--accent-glow); border:1px solid var(--border2); border-radius:13px; font-size:13px; }
.sync-ready { color:var(--green); padding:12px 15px; border:1px solid var(--border2); border-radius:12px; font-size:13px; line-height:1.6; }
.sync-actions { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.sync-primary { min-height:46px; margin-top:6px; }
.sync-toggle { display:flex; align-items:flex-start; gap:12px; padding:12px 0; cursor:pointer; font-size:13px; line-height:1.5; }
.sync-toggle input { accent-color:var(--accent); width:18px; height:18px; flex-shrink:0; margin-top:1px; }
.sync-option-list .sync-toggle+.sync-toggle { border-top:1px solid var(--border); }
.sync-profile { background:var(--accent-glow); padding:16px 18px; border-radius:13px; display:flex; flex-direction:column; gap:6px; overflow-wrap:anywhere; }
.sync-profile strong { font-size:18px; }
.sync-profile span { font-size:13px; color:var(--text2); }
.sync-summary { color:var(--accent2); font-size:14px; margin:0; font-weight:700; }
.sync-games { display:grid; gap:14px; }
.sync-game { border:1px solid var(--border); border-radius:15px; padding:16px; display:flex; flex-direction:column; gap:12px; min-width:0; }
.sync-game.sync-conflict { border-color:#e4a84870; }
.sync-game-heading { display:flex; gap:13px; align-items:flex-start; }
.sync-game-heading>div:last-child { min-width:0; }
.sync-game h4 { font-size:14px; margin:0; line-height:1.6; overflow-wrap:anywhere; }
.sync-game-heading p { color:var(--text3); font-size:12px; margin:3px 0 5px; line-height:1.5; overflow-wrap:anywhere; }
.sync-cover { width:45px; height:62px; border-radius:7px; flex-shrink:0; background:var(--bg); display:grid; place-items:center; color:var(--text3); overflow:hidden; }
.sync-cover img { width:100%; height:100%; object-fit:cover; }
.sync-status { color:var(--accent2); font-size:11px; font-weight:700; }
.sync-choices { display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; border:0; }
.sync-choices label { flex:1 1 150px; display:flex; gap:9px; align-items:center; border:1px solid var(--border2); border-radius:10px; padding:10px 12px; cursor:pointer; font-size:12px; min-height:42px; box-sizing:border-box; }
.sync-choices label:has(input:checked) { background:var(--accent-glow); border-color:var(--accent); }
.sync-choices input { accent-color:var(--accent); flex-shrink:0; }
.sync-status-field { flex-direction:row; align-items:center; flex-wrap:wrap; }
.sync-status-field select { flex:1; min-width:140px; }
.sync-pagination { display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:15px; font-size:12px; color:var(--text2); }
.sync-footer { border-top:1px solid var(--border); display:flex; gap:12px; align-items:center; justify-content:flex-end; padding:17px 28px; flex-shrink:0; background:var(--surface); }
.sync-footer>span { font-size:12px; color:var(--text2); margin-right:auto; }
.sync-footer .btn { white-space:normal; text-align:center; min-height:44px; }
.sync-progress { display:flex; flex-direction:column; gap:15px; align-items:flex-start; padding:25px 0; }
.sync-progress strong { font-size:16px; }
.sync-progress>span { color:var(--text2); font-size:13px; overflow-wrap:anywhere; }
.sync-progress progress { width:100%; accent-color:var(--accent); height:8px; }
.sync-error { background:#f0485812; border:1px solid #f0485850; padding:13px; font-size:13px; line-height:1.6; border-radius:12px; color:var(--text); }
.sync-result-icon { display:grid; place-items:center; width:50px; height:50px; background:var(--accent-glow); color:var(--accent2); border-radius:50%; font-size:26px; font-weight:800; }
.sync-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }
@media(max-width:620px) {
  .modal-overlay:has(.platform-sync) { padding:10px; }
  .platform-sync { max-height:96dvh; border-radius:18px; }
  .sync-header { padding:20px 17px 15px; }
  .sync-platforms { margin:0 17px; }
  .sync-steps { padding:15px 17px; gap:6px; }
  .sync-steps li { font-size:11px; gap:5px; }
  .sync-body { padding:20px 17px; }
  .sync-footer { padding:13px 17px; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
  .sync-footer>span { display:none; }
  .sync-footer .btn { font-size:12px; padding:10px; }
  .sync-pagination .btn { font-size:11px; padding:10px; }
  .sync-choices label { flex-basis:100%; }
}