:root{
  --tsw-primary:#e30613;
  --tsw-dark:#111111;
  --tsw-light:#ffffff;
}
.tsw-wrap{max-width:980px;margin:18px auto}
.tsw-card{display:grid;grid-template-columns: 1fr 1.1fr;gap:18px;align-items:stretch;background:var(--tsw-light);border:1px solid #e8e8e8;border-radius:16px;box-shadow:0 8px 28px rgba(0,0,0,.06);padding:18px}
@media (max-width: 860px){.tsw-card{grid-template-columns:1fr}}
.tsw-left{display:flex;flex-direction:column;align-items:center;gap:12px}
.tsw-wheel{position:relative;max-width:100%}
.tsw-canvas{width:100%;height:auto;border-radius:50%;border:10px solid #f5f5f5;box-shadow:0 10px 22px rgba(0,0,0,.12);transition:transform 0s}
.tsw-pointer{position:absolute;top:-8px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-bottom:22px solid #f5b400;filter:drop-shadow(0 4px 3px rgba(0,0,0,.25))}

.tsw-wheel.tsw-glow .tsw-canvas{animation:tswGlow 1.1s ease-out}
@keyframes tswGlow{
  0%{box-shadow:0 10px 22px rgba(0,0,0,.12)}
  35%{box-shadow:0 10px 28px rgba(0,0,0,.18),0 0 0 10px rgba(255,214,0,.12),0 0 18px rgba(255,214,0,.45)}
  100%{box-shadow:0 10px 22px rgba(0,0,0,.12)}
}
.tsw-note{width:100%;font-size:13px;color:#444;background:#fafafa;border:1px dashed #ddd;border-radius:12px;padding:10px;line-height:1.35}
.tsw-right{display:flex;flex-direction:column;gap:10px}
.tsw-title .tsw-h1{font-size:22px;font-weight:800;margin-bottom:4px}
.tsw-title .tsw-sub{font-size:14px;color:#666}
.tsw-form{display:flex;flex-direction:column;gap:10px}
.tsw-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:540px){.tsw-grid{grid-template-columns:1fr}}
.tsw-row label{display:block;font-size:13px;font-weight:700;margin-bottom:4px}
.tsw-row input{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:12px;font-size:14px}
.tsw-row input:focus{outline:none;border-color:var(--tsw-primary);box-shadow:0 0 0 3px rgba(227,6,19,.12)}
.tsw-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 14px;border-radius:12px;border:1px solid var(--tsw-primary);background:var(--tsw-primary);color:#fff;font-weight:800;text-decoration:none;cursor:pointer}
.tsw-btn:hover{filter:brightness(.95)}
.tsw-btn:disabled{opacity:.6;cursor:not-allowed}
.tsw-result{margin-top:8px;border-top:1px solid #f0f0f0;padding-top:10px}
.tsw-winline{font-size:14px;font-weight:800;margin-bottom:8px}
.tsw-codebox{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tsw-code{padding:10px 12px;border-radius:12px;background:var(--tsw-dark);color:#fff;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-weight:800;letter-spacing:.5px}
.tsw-actions{margin-top:10px}
.tsw-copy{background:var(--tsw-dark);border-color:var(--tsw-dark)}
.tsw-wa{background:#25D366;border-color:#25D366}
.tsw-small{font-size:12px;color:#666;line-height:1.35}
.tsw-legal{margin-top:6px}


/* Popup / modal mode */
.tsw-trigger{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  padding:12px 16px;
  border-radius:12px;
  border:0;
  cursor:pointer;
  font-weight:700;
}

.tsw-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  display:none;
  z-index:99999;
  padding:18px;
}
.tsw-overlay.is-open{ display:flex; align-items:center; justify-content:center; }

.tsw-modal{
  width:min(980px, 100%);
  max-height:90vh;
  overflow:auto;
  background:#fff;
  border-radius:18px;
  position:relative;
  box-shadow:0 20px 60px rgba(0,0,0,.35);
  padding:14px;
}

.tsw-close{
  position:absolute;
  top:10px;
  right:10px;
  width:38px;
  height:38px;
  border-radius:12px;
  border:0;
  cursor:pointer;
  font-size:22px;
  line-height:1;
}

