:root{font-size:16px;color-scheme:dark light;--primary-color: #ff3d00;--secondary-color: #fff;--body-color: #fff;--body-bg: #263038;--header-bg: #0d161b;--footer-bg: #0d161b;--footer-color: #ccc;--surface-bg: #1a1a1a;--surface-fg: #fff;--surface-muted-bg: rgba(0, 0, 0, .15);--popover-bg: #fff;--popover-fg: #222;--popover-border: #ccc;--code-header-bg: #222;--code-header-fg: #fff;--code-block-bg: #000;--code-block-fg: #fff;--tile-color: #ccc;--tile-stripe-bg: rgba(0, 0, 0, .1);--tile-hover-bg: rgba(0, 0, 0, .3);--menu-item-hover-bg: rgba(255, 255, 255, .1);--menu-item-active-bg: rgba(255, 255, 255, .12);--menu-footer-bg: rgba(0, 0, 0, .13);--border-color: rgba(255, 255, 255, .15);--border-color-strong: rgba(255, 255, 255, .3);--icon-button-bg: #000;--icon-button-fg: #fff;--error-bg: #2a0d0d;--error-fg: #ffb4a8;--error-border: #5a1f1f;--error-button-bg: #ffb4a8;--error-button-fg: #2a0d0d}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;width:100%}body{background-color:var(--body-bg);color:var(--body-color);font-family:Poppins,sans-serif;font-size:1rem;line-height:1.5;font-weight:400;font-style:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}.abs{position:absolute}._tile_no128_1{min-width:200px;width:33.33%;height:360px;padding:10px;position:relative;display:flex;align-items:center;justify-content:center;color:var(--tile-color);cursor:pointer;transition:.2s linear;overflow:hidden}._tile_no128_1:nth-child(odd){background:var(--tile-stripe-bg)}._tile_no128_1:hover{background:var(--tile-hover-bg)}@media screen and (max-width:900px){._tile_no128_1{width:50%}}@media screen and (max-width:600px){._tile_no128_1{width:100%}}._menu_f3kfy_1{width:18rem;background:var(--header-bg);position:sticky;top:0rem;height:100vh;z-index:10}._menu_toggle_f3kfy_9{display:none}@media screen and (max-width:800px){._menu_f3kfy_1{width:100%;height:auto;overflow:hidden;max-height:4.5rem}._menu_open_f3kfy_19{max-height:100vh}._menu_f3kfy_1 ._menu_footer_f3kfy_22{position:static}._menu_f3kfy_1 ._menu_header_f3kfy_25{display:flex;align-items:center;justify-content:space-between}._menu_f3kfy_1 ._menu_toggle_f3kfy_9{display:flex;height:1rem;width:1.5rem;border:none;background:none;border-bottom:1px solid;border-top:1px solid;position:relative}._menu_f3kfy_1 ._menu_toggle_f3kfy_9:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:1.5rem;height:1px;background:currentColor}}._menu_header_f3kfy_25{padding:1rem}._menu_header_f3kfy_25 ._brand_f3kfy_54{color:var(--secondary-color);font-size:2rem;display:inline-block;position:relative}._menu_header_f3kfy_25 ._brand_f3kfy_54:before{content:"";position:absolute;left:1.25rem;top:1rem;border:3px solid var(--secondary-color);border-bottom-color:var(--primary-color);width:20px;height:20px;border-radius:50%;animation:_spin_f3kfy_1 .6s linear infinite}._menu_item_f3kfy_72{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem 1rem;color:var(--secondary-color);margin-bottom:.5rem;transition:.2s linear;text-decoration:none;text-transform:capitalize;border-left:3px solid transparent}._menu_item_f3kfy_72:hover{background:var(--menu-item-hover-bg)}._menu_item_f3kfy_72._active_f3kfy_88{background:var(--menu-item-active-bg);border-left-color:var(--primary-color);font-weight:600}._menu_item_count_f3kfy_93{font-size:.75rem;font-weight:500;padding:.1rem .5rem;border-radius:999px;background:var(--menu-item-hover-bg);color:var(--secondary-color);opacity:.8;min-width:1.5rem;text-align:center}._menu_footer_f3kfy_22{position:absolute;bottom:0;width:100%;padding:.5rem 1rem;display:flex;flex-direction:column;gap:1rem;align-items:center;justify-content:center;background:var(--menu-footer-bg)}._menu_footer_f3kfy_22 ._developer_f3kfy_116{text-decoration:none;color:inherit;display:flex;justify-content:center;text-align:center;font-size:.8rem}._menu_footer_f3kfy_22 ._developer_f3kfy_116 a{font-weight:700;display:inline-block;margin-left:5px;color:inherit;text-decoration:none}._menu_footer_f3kfy_22 ._developer_f3kfy_116 a:hover{text-decoration:underline}._menu_footer_f3kfy_22 ._social_links_f3kfy_134{display:flex;align-items:center;justify-content:center;gap:1rem}._menu_footer_f3kfy_22 ._social_links_f3kfy_134>a{display:flex;align-items:center;justify-content:center;border-radius:50%;width:1.5rem;height:1.5rem;background:var(--secondary-color);background-size:108% auto;background-position:center;background-repeat:no-repeat}@keyframes _spin_f3kfy_1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._overlay_1y5i9_1{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:grid;place-items:center}._overlay_1y5i9_1:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background-color:var(--surface-muted-bg)}._modal_1y5i9_17{position:relative;z-index:10;display:flex;align-items:stretch;gap:.5rem;width:clamp(300px,95vw,1200px);background:var(--surface-bg);color:var(--surface-fg);padding:1rem}@media screen and (max-width:800px){._modal_1y5i9_17{flex-direction:column-reverse}}._modal_1y5i9_17 h2{margin-bottom:1rem}._modal_1y5i9_17 ._closeButton_1y5i9_36{position:absolute;bottom:100%;left:100%;height:2rem;width:2rem;transform:translate(-50%,50%);border:none;color:var(--icon-button-fg);font-size:1.5rem;padding:0;cursor:pointer;background:var(--icon-button-bg);border-radius:50%}._subtitle_1y5i9_52{font-size:1rem;font-weight:600;margin:0}._subtitle_1y5i9_52 span{font-family:monospace;font-weight:600;display:inline-block;margin-left:5px;font-size:.8rem}._inspect_1y5i9_65{display:flex;flex-direction:column;justify-content:space-between;gap:1rem;width:40%;height:calc(100vh - 200px)}@media screen and (max-width:800px){._inspect_1y5i9_65{width:100%;gap:.5rem;height:100%}}._inspect_code_1y5i9_80{width:100%;display:flex;flex-direction:column;gap:.5rem}._color_variable_1y5i9_87{display:flex;flex-wrap:wrap;gap:.5rem}._color_variable_switch_1y5i9_92{width:2rem;height:2rem;border:1px solid var(--border-color-strong);border-radius:50%;cursor:pointer;padding:0}._color_picker_popover_1y5i9_100{position:absolute;top:calc(100% + 4px);left:0;z-index:20;padding:.5rem;background:var(--popover-bg);color:var(--popover-fg);border-radius:6px;box-shadow:0 4px 16px #00000040;display:flex;flex-direction:column;gap:.5rem}._color_value_input_1y5i9_114{width:100%;padding:.25rem .4rem;font-family:monospace;font-size:.75rem;border:1px solid var(--popover-border);border-radius:3px;box-sizing:border-box;background:var(--popover-bg);color:var(--popover-fg)}._size_control_1y5i9_126{margin-top:1rem;display:flex;flex-direction:column;gap:.35rem}._size_slider_1y5i9_132{width:100%}._preview_1y5i9_136{position:relative;width:100%;min-height:20rem;height:calc(100vh - 200px);background:var(--body-bg);display:grid;place-items:center;flex:1;transition:background-color .2s ease,color .2s ease}._preview_dark_1y5i9_147{background:#1a1a1a;color:#fff}._preview_light_1y5i9_151{background:#f5f5f5;color:#222}._preview_theme_toggle_1y5i9_155{position:absolute;top:.5rem;right:.5rem;width:2rem;height:2rem;border-radius:50%;border:1px solid var(--border-color, rgba(127, 127, 127, .3));background:var(--icon-button-bg);color:var(--icon-button-fg);font-size:1rem;line-height:1;padding:0;cursor:pointer;display:grid;place-items:center;transition:transform .15s ease,background-color .15s ease}._preview_theme_toggle_1y5i9_155:hover{transform:scale(1.05)}._preview_theme_toggle_1y5i9_155:active{transform:scale(.95)}._preview_theme_toggle_1y5i9_155:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px}._code_panel_header_1y5i9_184{display:flex;align-items:center;gap:.5rem;padding:.25rem .5rem;background:var(--code-header-bg);color:var(--code-header-fg);font-size:.75rem;position:relative}._code_title_1y5i9_195{flex:1}._code_copy_button_1y5i9_199{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid transparent;background:transparent;color:inherit;font:inherit;font-size:.7rem;line-height:1;padding:.25rem .5rem;border-radius:3px;cursor:pointer;transition:background-color .15s ease,color .15s ease,border-color .15s ease,transform .15s ease}._code_copy_button_1y5i9_199:hover{background:#ffffff1a}._code_copy_button_1y5i9_199:focus-visible{outline:none;border-color:var(--primary-color)}._code_copy_button_1y5i9_199:active{transform:scale(.96)}._code_copy_button_copied_1y5i9_222{background:var(--primary-color);border-color:var(--primary-color)}._code_block_1y5i9_227{font-size:.8rem;width:100%;max-height:calc(100vh - 35rem);display:block;white-space:pre-wrap;word-break:break-all;overflow:auto;padding:.5rem;background:var(--code-block-bg);color:var(--code-block-fg)}._code_block_1y5i9_227[data-title=HTML]{color:#ff006e}._code_block_1y5i9_227[data-title=CSS]{color:#00f7ff}@media screen and (max-width:800px){._code_block_1y5i9_227{max-height:5rem}}.layout{min-height:100vh;display:flex}@media screen and (max-width:800px){.layout{flex-direction:column}}.container{position:relative;width:100%;min-height:calc(100vh - 7.1rem)}.section{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between}.load-error{width:100%;padding:1rem 1.5rem;margin:1rem;background:var(--error-bg);color:var(--error-fg);border:1px solid var(--error-border);border-radius:4px;display:flex;align-items:center;gap:1rem;justify-content:space-between}.load-error button{padding:.4rem .9rem;background:var(--error-button-bg);color:var(--error-button-fg);border:none;border-radius:3px;cursor:pointer;font-weight:600}