.tw{margin:22px 0 10px;padding:22px 24px;background:var(--surface,#14161B);border:1px solid var(--line-soft,#262932);border-left:3px solid var(--accent,#38bdf8);border-radius:var(--radius-lg,14px);color:var(--text,#f0f2f5)}
.tw h2{font-family:Montserrat,"Noto Sans",sans-serif;font-size:22px;font-weight:700;margin:0 0 8px;letter-spacing:-0.01em;color:var(--text,#f0f2f5)}
.tw .tw-sub{font-size:15px;line-height:1.6;color:var(--text-2,#c7ccd4);margin:0 0 14px}
.tw-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.tw-tab{background:transparent;border:1px solid var(--line-soft,#262932);color:var(--text-2,#c7ccd4);border-radius:999px;padding:6px 14px;font-size:14px;cursor:pointer;line-height:1.2;font-family:inherit}
.tw-tab[aria-selected="true"]{background:var(--accent,#38bdf8);border-color:var(--accent,#38bdf8);color:#0b1220;font-weight:600}
.tw-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tw textarea,.tw-out{width:100%;min-height:190px;box-sizing:border-box;background:#0f1115;border:1px solid var(--line-soft,#262932);border-radius:10px;color:var(--text,#f0f2f5);font-family:inherit;font-size:15px;line-height:1.55;padding:12px 14px;resize:vertical;margin:0}
.tw textarea::placeholder{color:#6b7280}
.tw textarea:focus{outline:none;border-color:var(--accent,#38bdf8);box-shadow:0 0 0 3px rgba(56,189,248,.15)}
.tw-out{white-space:pre-wrap;overflow:auto}
.tw-out:empty:before{content:attr(data-placeholder);color:#6b7280}
.tw-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:10px}
.tw-opts{display:flex;flex-wrap:wrap;gap:6px}
.tw-opt{background:transparent;border:1px solid var(--line-soft,#262932);color:var(--text-2,#c7ccd4);border-radius:8px;padding:5px 10px;font-size:13px;cursor:pointer;font-family:inherit}
.tw-opt[aria-pressed="true"]{border-color:var(--accent,#38bdf8);color:var(--text,#f0f2f5)}
.tw-run{margin-left:auto;background:var(--accent,#38bdf8);color:#0b1220;border:0;border-radius:10px;padding:10px 22px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit}
.tw-run:hover{filter:brightness(1.08)}
.tw-run:disabled{opacity:.55;cursor:default;filter:none}
.tw-ghost{background:transparent;border:1px solid var(--line-soft,#262932);color:var(--text-2,#c7ccd4);border-radius:8px;padding:6px 12px;font-size:13px;cursor:pointer;font-family:inherit}
.tw-ghost:hover{border-color:var(--accent,#38bdf8)}
.tw-meta{font-size:13px;color:#8b93a1;margin-top:8px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.tw-msg{font-size:14px;color:#ffb454;margin-top:8px}
.tw-msg.ok{color:#5ccf8a}
.tw-cnt{margin-left:auto}
.tw-how{margin-top:16px;padding-top:14px;border-top:1px solid var(--line-soft,#262932);font-size:14px;line-height:1.6;color:var(--text-2,#c7ccd4)}
.tw-how h3{font-family:Montserrat,"Noto Sans",sans-serif;font-size:15px;font-weight:600;color:var(--text,#f0f2f5);margin:0 0 6px}
.tw-how p{margin:0 0 8px}
.tw-how p:last-child{margin-bottom:0}
.tw-how ol{margin:0 0 8px;padding-left:20px}
.tw-how li{margin:0 0 3px}
@media (max-width:720px){.tw-grid{grid-template-columns:1fr}.tw{padding:16px}.tw h2{font-size:19px}.tw textarea,.tw-out{min-height:150px}.tw-run{margin-left:0;width:100%}}