.sg-dp{border:1px solid #dcdcde;background:#fff;padding:14px 16px;max-width:860px;margin:14px 0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif}
.sg-dp-title{margin:0 0 10px 0;font-size:16px;font-weight:800;color:#0f172a}
.sg-dp-sub{margin:0 0 10px 0;color:#475569;font-size:13px}
.sg-dp-row{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}

.sg-dp-play{appearance:none;border:0;border-radius:10px;background:#2271b1;color:#fff;font-weight:900;padding:12px 14px;cursor:pointer;width:100%;max-width:240px}
.sg-dp-play:hover{background:#135e96}
.sg-dp-play:active{background:#0a4b78}

.sg-dp-play.sg-dp-play-disabled,
.sg-dp-play[disabled]{
	opacity:.55;
	cursor:not-allowed;
}

.sg-dp-grid{display:grid;gap:4px;touch-action:none;user-select:none}
.sg-dp-cell{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid #c3c4c7;background:#f8fafc;font-weight:800;color:#0f172a;line-height:1;border-radius:6px}
.sg-dp-cell.sg-dp-cell-active{background:#e0f2fe;border-color:#38bdf8}
.sg-dp-cell.sg-dp-cell-found{background:#dcfce7;border-color:#22c55e}

.sg-dp-words{min-width:190px}
.sg-dp-words ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr;gap:6px}
.sg-dp-words li{padding:6px 8px;border:1px solid #e5e7eb;border-radius:6px;background:#fff;color:#0f172a;font-weight:700;font-size:13px}
.sg-dp-words li.sg-dp-word-found{opacity:.45;text-decoration:line-through}

.sg-dp-words-flow{min-width:unset}
.sg-dp-words-flow ul{display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start}
.sg-dp-words-flow li{border-radius:999px;padding:7px 10px;background:#f1f5f9;border-color:#e2e8f0}
.sg-dp-words-flow li.sg-dp-word-found{background:#dcfce7;border-color:#22c55e;text-decoration:none;opacity:1}

.sg-dp-tiles{display:flex;gap:6px;flex-wrap:wrap;touch-action:none;user-select:none}
.sg-dp-tile{width:clamp(34px,13.5vw,48px);height:clamp(44px,16vw,56px);border:1px solid #c3c4c7;border-radius:10px;background:#f8fafc;font-weight:900;font-size:clamp(16px,5vw,19px);display:flex;align-items:center;justify-content:center;cursor:grab;position:relative;touch-action:none;user-select:none}
.sg-dp-tile:active{cursor:grabbing}
.sg-dp-tile.sg-dp-tile-dragging{opacity:.75;transform:scale(1.03);z-index:10}
.sg-dp-tile.sg-dp-tile-ghost{position:fixed;left:0;top:0;transform:none;z-index:1000000;cursor:grabbing;pointer-events:none;box-shadow:0 18px 40px rgba(0,0,0,.18)}
.sg-dp-tile.sg-dp-tile-placeholder{visibility:hidden}

.sg-dp-status{margin-top:10px;padding:10px 12px;border-radius:8px;background:#f6f7f7;border:1px solid #dcdcde;color:#0f172a;font-weight:700}
.sg-dp-status.sg-dp-status-done{background:#e7f7ed;border-color:#b7e2c5}

.sg-dp-lock{overflow:hidden}

.sg-dp-overlay{position:fixed;inset:0;z-index:999999;display:flex;align-items:stretch;justify-content:center}
.sg-dp-overlay-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.78)}
.sg-dp-overlay-dialog{position:relative;z-index:1;width:min(980px,100vw);height:100vh;background:#fff;display:flex;flex-direction:column}
.sg-dp-overlay-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid #e5e7eb}
.sg-dp-overlay-title{font-weight:900;color:#0f172a}
.sg-dp-overlay-close{appearance:none;border:1px solid #c3c4c7;background:#f6f7f7;color:#0f172a;font-weight:800;border-radius:10px;padding:8px 10px;cursor:pointer}
.sg-dp-overlay-close:hover{background:#f0f0f1}
.sg-dp-overlay-body{padding:12px 14px 28px 14px;overflow:auto;-webkit-overflow-scrolling:touch}

.sg-dp-leaderboard-table{
	width:100%;
	border-collapse:collapse;
	margin-top:8px;
}

.sg-dp-leaderboard-table th,
.sg-dp-leaderboard-table td{
	border:1px solid #dcdcde;
	padding:8px 10px;
	text-align:left;
}

.sg-dp-row-full{flex-direction:column;gap:12px}
.sg-dp-wordsearch-full .sg-dp-grid{justify-content:center}

@media (max-width:640px){
	.sg-dp-cell{width:28px;height:28px;font-size:14px}
	.sg-dp{padding:12px 12px}
	.sg-dp-anagram{padding:12px 10px}
	.sg-dp-tiles{gap:5px;justify-content:center}
	.sg-dp-tile{width:clamp(28px,11.2vw,38px);height:clamp(40px,14.5vw,50px);border-radius:9px}
	.sg-dp-overlay-body{padding:10px 10px}
	.sg-dp-overlay-dialog{width:100vw}
	.sg-dp-play{max-width:unset}
}