/* Minimal styles */
.gw-ssr-form { background:#fff; border:1px solid #e5e7eb; border-radius:10px; padding:12px; }
.gw-row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:10px; }
.gw-row label { min-width:120px; font-weight:600; }
.gw-row input, .gw-row select { min-width:120px; }
.gw-legend { background:#fff7ed; border:1px solid #fed7aa; border-radius:10px; padding:8px 10px; margin:6px 0; }
.gw-actions { display:flex; gap:8px; align-items:center; }
.gw-sketch-wrap { margin-top:10px; }
.gw-ssr-result { margin-top:12px; }
.gw-table { width:100%; border-collapse:collapse; }
.gw-table th, .gw-table td { padding:6px 8px; border-bottom:1px solid #eee; text-align:left; }
.gw-ssr-version { margin-left:auto; font-size:11px; color:#6b7280; }
.notice { background:#f8fafc; border:1px solid #e5e7eb; padding:8px 10px; border-radius:6px; }
.notice-error { background:#fef2f2; border-color:#fecaca; }

.gw-sketch-wrap svg{ background:#fff; border-radius:8px; box-shadow:0 6px 18px rgba(0,0,0,0.06); }


/* Cinematic UI */
.gw-controls { gap:10px; }
.gw-switch { display:flex; align-items:center; gap:6px; cursor:pointer; user-select:none; }
#gw-ssr-cinematic { transform: scale(1.1); accent-color: var(--gw-ral, #DE5307); }
.gw-sketch-wrap { position: relative; border-radius:12px; overflow:hidden; }
#gw-ssr-canvas { display:block; width:100%; height:300px; background: radial-gradient(ellipse at 20% 10%, rgba(0,0,0,0.03), transparent 60%), #ffffff; }
.gw-sketch-wrap::before {
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(0deg, rgba(0,0,0,0.06), rgba(0,0,0,0.02)),
    linear-gradient(90deg, rgba(0,0,0,0.03) 1px, transparent 1px),
    linear-gradient(0deg, rgba(0,0,0,0.03) 1px, transparent 1px);
  background-size: 100% 100%, 40px 40px, 40px 40px;
  pointer-events:none; mix-blend-mode: multiply;
}
:root { --gw-ral: #DE5307; }
.gw-ssr .button { border-radius:10px; }



/* --- Modern UI 2.4.0 --- */
.gw-row--card { background:#ffffff; border:1px solid #e5e7eb; border-radius:14px; padding:12px 12px; box-shadow:0 8px 24px rgba(0,0,0,0.04); }
.gw-row label { font-weight:600; color:#111827; }
.gw-row input, .gw-row select { appearance:none; background:#fff; border:1px solid #d1d5db; border-radius:10px; padding:10px 12px; outline:none; transition:border-color .15s, box-shadow .15s; }
.gw-row input:focus, .gw-row select:focus { border-color: var(--gw-ral,#DE5307); box-shadow:0 0 0 4px rgba(222,83,7,0.15); }
.gw-actions .button-primary { background: linear-gradient(180deg, var(--gw-ral,#DE5307), #bf3f05); border:none; color:#fff; padding:10px 14px; border-radius:10px; }
.gw-actions .button-primary[disabled] { opacity:.5; cursor:not-allowed; }
.gw-actions .button { border:1px solid #e5e7eb; background:#fff; padding:9px 12px; border-radius:10px; }
.gw-legend { border-radius:12px; background:linear-gradient(180deg, #fffaf5, #fff7ed); border-color:#fed7aa; }
.gw-ssr-result .gw-table th { width: 40%; color:#374151; }
.gw-ssr-result .gw-table td { color:#111827; font-weight:600; }



/* Dark mode */
@media (prefers-color-scheme: dark){
  .gw-ssr-form { background:#0f1115; border-color:#1f2430; }
  .gw-row--card { background:#121621; border-color:#1f2430; box-shadow:0 8px 24px rgba(0,0,0,0.35); }
  .gw-row label { color:#e5e7eb; }
  .gw-row input, .gw-row select { background:#0f1115; color:#e5e7eb; border-color:#2a3140; }
  .gw-legend { background:linear-gradient(180deg, #121621, #10131a); border-color:#2a3140; color:#e5e7eb; }
  .gw-table th, .gw-table td { border-color:#263044; color:#e5e7eb; }
  .gw-actions .button { background:#0f1115; color:#e5e7eb; border-color:#2a3140; }
  #gw-ssr-canvas { background: radial-gradient(ellipse at 20% 10%, rgba(255,255,255,0.02), transparent 60%), #0b0e14; }
}



/* Ensure disabled submit stays visible in all themes */
.gw-actions .button[disabled] { display:inline-block !important; opacity:.55; filter:none !important; }