.dhrNYa_root{max-width:87.5rem;padding:var(--size-20) var(--size-24) var(--size-24);margin:0 auto}.dhrNYa_playground{height:calc(100vh - var(--top) - 5.25rem);border:var(--hairline) solid var(--line);border-radius:var(--size-14);background:var(--bg);min-height:32.5rem;box-shadow:var(--shadow);flex-direction:column;display:flex;overflow:hidden}.dhrNYa_playgroundToolbar{align-items:center;gap:var(--size-16);padding:var(--size-8) var(--size-10) var(--size-8) var(--size-14);border-bottom:var(--hairline) solid var(--line);flex-wrap:wrap;display:flex}.dhrNYa_languagePicker,.dhrNYa_themePicker{align-items:center;gap:var(--size-8);color:var(--faint);display:flex}.dhrNYa_languagePicker select,.dhrNYa_themePicker select{color:var(--ink);height:var(--size-32);padding:0 var(--size-32) 0 var(--size-10);border:var(--hairline) solid var(--line);border-radius:var(--size-8);background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238b909a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right var(--size-10) center / var(--size-12);font-size:var(--size-14);font-weight:var(--weight-medium);cursor:pointer;appearance:none;transition:border-color var(--duration-fast)}.dhrNYa_languagePicker select:hover,.dhrNYa_themePicker select:hover{border-color:var(--line-strong);background-color:var(--soft)}.dhrNYa_themePicker .dhrNYa_paletteSwatch{width:var(--size-12);height:var(--size-12);border-radius:var(--radius-round);background:linear-gradient(135deg, var(--kirari-background) 50%, var(--kirari-keyword) 50%);box-shadow:0 0 0 var(--hairline) var(--line-strong);flex:none}.dhrNYa_editorActions{gap:var(--size-2);margin-left:auto;display:flex}.dhrNYa_editorPanes{flex:1;grid-template-columns:1fr 1fr;min-height:0;display:grid}.dhrNYa_sourcePane,.dhrNYa_previewPane{flex-direction:column;min-width:0;min-height:0;display:flex}.dhrNYa_sourcePane{background:var(--soft);border-right:var(--hairline) solid var(--line)}.dhrNYa_previewPane{background:var(--kirari-background);color:var(--kirari-text)}.dhrNYa_paneLabel{height:var(--size-40);padding:0 var(--size-18);font-size:var(--size-12);color:var(--faint);flex:none;justify-content:space-between;align-items:center;display:flex}.dhrNYa_previewPane .dhrNYa_paneLabel{color:color-mix(in srgb, var(--kirari-text) 75%, transparent)}.dhrNYa_sourceFilename,.dhrNYa_tokenCount{font:var(--size-12) var(--mono)}.dhrNYa_source{resize:none;width:100%;padding:var(--size-4) var(--size-18) var(--size-18);color:var(--muted);font:var(--size-14) / var(--leading-code-relaxed) var(--mono);tab-size:2;white-space:pre;background:0 0;border:0;flex:1;overflow:auto}.dhrNYa_source:focus-visible{outline-offset:calc(-1 * var(--size-2));border-radius:0}.dhrNYa_source:hover:not(:focus){background:var(--soft-2)}.dhrNYa_previewCode{scroll-padding:var(--size-8);padding:var(--size-4) var(--size-18) var(--size-18);font:var(--size-14) / var(--leading-code-relaxed) var(--mono);tab-size:2;white-space:pre;flex:1;margin:0;overflow:auto}.dhrNYa_outputSwitch{--segmented-control-color:var(--kirari-text);--segmented-control-surface:var(--kirari-background)}.dhrNYa_inspectable{font:inherit;white-space:inherit;text-align:inherit;cursor:pointer;border-radius:var(--size-3);background:0 0;border:0;padding:0;display:inline}.dhrNYa_inspectable:hover{background:color-mix(in srgb, var(--kirari-text) 8%, transparent)}.dhrNYa_inspector{align-items:center;gap:var(--size-12);min-height:var(--size-48);padding:var(--size-8) var(--size-14);border-top:var(--hairline) solid var(--line);flex:none;display:flex}.dhrNYa_inspector>code{font-size:var(--size-13);color:var(--muted)}.dhrNYa_inspectorEnd{align-items:center;gap:var(--size-16);margin-left:auto;display:flex}.dhrNYa_tokenOffset{font:var(--size-12) var(--mono);color:var(--faint)}.dhrNYa_colorControl{align-items:center;gap:var(--size-8);font-size:var(--size-13);color:var(--muted);cursor:pointer;display:flex}:where(.dhrNYa_root) input[type=color]{width:var(--size-24);height:var(--size-24);padding:var(--size-2);border:var(--hairline) solid var(--line-strong);border-radius:var(--radius-round);background:var(--bg);cursor:pointer}:where(.dhrNYa_root) input[type=color]::-webkit-color-swatch-wrapper{padding:0}:where(.dhrNYa_root) input[type=color]::-webkit-color-swatch{border-radius:var(--radius-round);border:0}.dhrNYa_colorControl:hover input{border-color:var(--ink);box-shadow:0 0 0 var(--size-2) var(--soft-2)}.dhrNYa_editorHelp{margin:var(--size-14) 0 0;text-align:center;font-size:var(--size-14);color:var(--faint)}@media (max-width:53.75rem){.dhrNYa_editorPanes{grid-template-rows:1fr 1fr;grid-template-columns:1fr}.dhrNYa_sourcePane{border-right:0;border-bottom:var(--hairline) solid var(--line)}.dhrNYa_playground{height:auto;min-height:0}.dhrNYa_source,.dhrNYa_previewCode{min-height:13.75rem}.dhrNYa_editorActions{margin-left:0}}@media (max-width:35rem){.dhrNYa_root{padding:var(--size-12)}.dhrNYa_colorControl>span,.dhrNYa_tokenOffset{display:none}}
.PIVNxG_root{min-width:0;color:var(--faint);align-items:center;display:flex}.PIVNxG_input{min-width:0;color:var(--ink);background:0 0;border:0;outline:none;flex:1;padding:0}.PIVNxG_outline{gap:var(--size-8);height:var(--size-40);padding:0 var(--size-12);border:var(--hairline) solid var(--line);border-radius:var(--size-10)}.PIVNxG_outline .PIVNxG_input{font-size:var(--size-16)}.PIVNxG_outline:hover:not(:focus-within){border-color:var(--line-strong);background:var(--soft)}.PIVNxG_outline:focus-within{border-color:var(--accent);box-shadow:0 0 0 var(--size-3) var(--accent-soft)}.PIVNxG_bare{gap:var(--size-12)}.PIVNxG_bare .PIVNxG_input{font-size:var(--size-17)}
.yPKArG_root{--divider-color:var(--line-strong);border:var(--hairline) solid var(--line-strong);border-radius:var(--size-7);background:var(--bg);flex:none;margin-left:auto;display:inline-flex}.yPKArG_copy,.yPKArG_menu>summary{height:var(--size-28);color:var(--muted);background:0 0;border:0;align-items:center;display:inline-flex}.yPKArG_copy:hover,.yPKArG_menu>summary:hover,.yPKArG_menu[open]>summary{background:var(--soft);color:var(--ink)}.yPKArG_copy{gap:var(--size-6);padding:0 var(--size-9);border-radius:var(--size-6) 0 0 var(--size-6);font-size:var(--size-12);font-weight:var(--weight-medium)}.yPKArG_menu{position:relative}.yPKArG_menu>summary{width:var(--size-28);border-radius:0 var(--size-6) var(--size-6) 0;cursor:pointer;justify-content:center;list-style:none}.yPKArG_menu>summary::-webkit-details-marker{display:none}.yPKArG_menuPanel{top:calc(100% + var(--size-6));z-index:20;width:15.875rem;padding:var(--size-5);border:var(--hairline) solid var(--line);border-radius:var(--size-10);background:var(--bg);box-shadow:var(--shadow);position:absolute;right:0}.yPKArG_menuItem{align-items:center;gap:var(--size-10);width:100%;padding:var(--size-9);border-radius:var(--size-6);color:var(--ink);text-align:left;display:flex}.yPKArG_menuItem:hover{background:var(--soft)}.yPKArG_menuItem svg{color:var(--muted);flex:none}.yPKArG_menuItem strong,.yPKArG_menuItem small{display:block}.yPKArG_menuItem strong{font-size:var(--size-13);font-weight:var(--weight-medium)}.yPKArG_menuItem small{color:var(--muted);font-size:var(--size-12)}