.HtmlPlayground-module__HWR7-a__wrapper{border:1px solid var(--border);background:radial-gradient(circle at top right, #6366f114, transparent 30%), var(--card);border-radius:1.25rem;margin:2rem 0;padding:1.5rem;box-shadow:0 18px 45px -30px #0f172a80}.HtmlPlayground-module__HWR7-a__fullscreenWrapper{z-index:9998;background:radial-gradient(circle at top right, #6366f11a, transparent 28%), var(--background);border-radius:0;margin:0;padding:1.5rem;position:fixed;inset:0;overflow:auto}.HtmlPlayground-module__HWR7-a__header{justify-content:space-between;gap:1rem;margin-bottom:1rem;display:flex}.HtmlPlayground-module__HWR7-a__badge{background:rgba(var(--primary-rgb), .12);color:var(--primary);text-transform:uppercase;letter-spacing:.05em;border-radius:999px;align-items:center;gap:.4rem;margin-bottom:.75rem;padding:.35rem .75rem;font-size:.75rem;font-weight:700;display:inline-flex}.HtmlPlayground-module__HWR7-a__title{color:var(--foreground);margin:0 0 .4rem;font-size:1.5rem;font-weight:800}.HtmlPlayground-module__HWR7-a__description{color:var(--sidebar-fg);margin:0;line-height:1.6}.HtmlPlayground-module__HWR7-a__meta{flex-wrap:wrap;place-content:flex-start flex-end;gap:.75rem;display:flex}.HtmlPlayground-module__HWR7-a__meta span{border:1px solid var(--border);color:var(--sidebar-fg);background:var(--background);border-radius:999px;padding:.45rem .75rem;font-size:.8rem;font-weight:600}.HtmlPlayground-module__HWR7-a__headerButton{border:1px solid rgba(var(--primary-rgb), .2);background:rgba(var(--primary-rgb), .1);color:var(--primary);cursor:pointer;border-radius:999px;align-items:center;gap:.45rem;padding:.55rem .9rem;font-size:.85rem;font-weight:700;transition:background .15s,border-color .15s,transform .15s;display:inline-flex}.HtmlPlayground-module__HWR7-a__headerButton:hover{background:rgba(var(--primary-rgb), .16);border-color:rgba(var(--primary-rgb), .3);transform:translateY(-1px)}.HtmlPlayground-module__HWR7-a__highlights{flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;display:flex}.HtmlPlayground-module__HWR7-a__highlightChip{color:#7c3aed;background:#a855f71f;border-radius:.8rem;padding:.45rem .7rem;font-size:.8rem;font-weight:600}.HtmlPlayground-module__HWR7-a__grid{grid-template-columns:minmax(0,1.15fr) 14px minmax(0,.85fr);align-items:stretch;gap:1rem;display:grid}.HtmlPlayground-module__HWR7-a__fullscreenWrapper .HtmlPlayground-module__HWR7-a__grid{grid-template-columns:minmax(0,1fr) 14px minmax(0,1fr);min-height:calc(100vh - 12rem)}.HtmlPlayground-module__HWR7-a__editorPanel{min-width:0}.HtmlPlayground-module__HWR7-a__resizeHandle{cursor:col-resize;touch-action:none;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:flex}.HtmlPlayground-module__HWR7-a__resizeGrip{background:linear-gradient(#6366f133,#6366f18c,#6366f133);border-radius:999px;width:6px;height:72px;transition:transform .15s,box-shadow .15s,background .15s;display:block;box-shadow:inset 0 0 0 1px #6366f11f}.HtmlPlayground-module__HWR7-a__resizeHandle:hover .HtmlPlayground-module__HWR7-a__resizeGrip,.HtmlPlayground-module__HWR7-a__resizeHandleActive .HtmlPlayground-module__HWR7-a__resizeGrip{background:linear-gradient(#6366f147,#6366f1cc,#6366f147);transform:scaleX(1.15);box-shadow:inset 0 0 0 1px #6366f138,0 0 0 6px #6366f114}.HtmlPlayground-module__HWR7-a__actions{flex-wrap:wrap;justify-content:flex-end;gap:.75rem;margin-top:.75rem;display:flex}.HtmlPlayground-module__HWR7-a__secondaryButton{border:1px solid var(--border);background:var(--background);color:var(--foreground);cursor:pointer;border-radius:.75rem;align-items:center;gap:.45rem;padding:.65rem .9rem;font-size:.85rem;font-weight:600;display:inline-flex}.HtmlPlayground-module__HWR7-a__previewPanel{border:1px solid var(--border);background:#fff;border-radius:1rem;flex-direction:column;min-height:430px;display:flex;overflow:hidden}.HtmlPlayground-module__HWR7-a__fullscreenWrapper .HtmlPlayground-module__HWR7-a__previewPanel{min-height:calc(100vh - 16rem)}.HtmlPlayground-module__HWR7-a__previewHeader{background:#f8fafc;border-bottom:1px solid #e2e8f0;justify-content:space-between;align-items:center;gap:.75rem;padding:.8rem 1rem;display:flex}.HtmlPlayground-module__HWR7-a__previewLabel{color:#334155;text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:.45rem;font-size:.8rem;font-weight:700;display:inline-flex}.HtmlPlayground-module__HWR7-a__previewNote{color:#64748b;font-size:.8rem}.HtmlPlayground-module__HWR7-a__previewIframe{background:#fff;border:0;width:100%;height:100%;min-height:390px}@media (max-width:960px){.HtmlPlayground-module__HWR7-a__grid{grid-template-columns:1fr}.HtmlPlayground-module__HWR7-a__fullscreenWrapper .HtmlPlayground-module__HWR7-a__grid{min-height:auto}.HtmlPlayground-module__HWR7-a__resizeHandle{display:none}.HtmlPlayground-module__HWR7-a__previewPanel{min-height:360px}.HtmlPlayground-module__HWR7-a__fullscreenWrapper .HtmlPlayground-module__HWR7-a__previewPanel{min-height:420px}}@media (max-width:640px){.HtmlPlayground-module__HWR7-a__wrapper{padding:1rem}.HtmlPlayground-module__HWR7-a__header{flex-direction:column}.HtmlPlayground-module__HWR7-a__meta{gap:.5rem}}