.kupeli-code-block{position:relative;border-radius:8px;overflow:hidden;margin:2em 0;font-family:"Fira Code",Consolas,Monaco,monospace;background-color:var(--code-bg);color:var(--code-fg);box-shadow:0 4px 12px rgb(0 0 0 / .1);border:1px solid rgb(0 0 0 / .05)}.kupeli-code-block pre{margin:0;padding:20px;overflow-x:auto;font-size:14px;line-height:1.6}.code-header{display:flex;justify-content:space-between;align-items:center;padding:8px 15px;background:var(--header-bg);border-bottom:1px solid rgb(0 0 0 / .05);user-select:none}.header-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.lang{font-weight:700;font-size:12px;color:var(--header-fg);opacity:.7}.file-name{font-size:12px;color:var(--header-fg);background:rgb(128 128 128 / .15);padding:4px 10px;border-radius:4px;font-family:monospace;cursor:pointer;transition:all 0.2s ease;position:relative}.file-name:hover{background:rgb(128 128 128 / .25);transform:translateY(-1px)}.file-name:active{transform:translateY(0)}.file-name::before{content:"📄";margin-right:4px;font-size:11px}.file-name:hover::before{content:"⬇️"}.copy-btn{background:#fff0;color:var(--header-fg);border:1px solid rgb(128 128 128 / .3);padding:4px 10px;font-size:12px;border-radius:4px;cursor:pointer;transition:all 0.2s ease;opacity:.8}.copy-btn:hover{background:var(--btn-hover);color:#fff;border-color:var(--btn-hover);opacity:1}.copy-btn.copied{background:#28a745;color:#fff;border-color:#28a745}.upload-controls{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}.upload-btn{background:var(--btn-bg);color:#fff;border:none;padding:6px 12px;font-size:12px;border-radius:4px;cursor:pointer;transition:all 0.2s ease}.upload-btn:hover{background:var(--btn-hover)}.upload-btn:disabled{opacity:.5;cursor:not-allowed}.file-input-wrapper{position:relative;overflow:hidden;display:inline-block}.file-input-wrapper input[type="file"]{position:absolute;left:-9999px}.file-status{font-size:11px;color:var(--header-fg);opacity:.7;margin-left:8px}.kupeli-code-block.is-editor .editor-flex{display:grid;grid-template-columns:1fr;gap:0}@media (min-width:780px){.kupeli-code-block.is-editor .editor-flex{grid-template-columns:1fr 1fr}}.kupeli-code-block.is-editor textarea.code-textarea{min-height:300px!important;font-family:"Fira Code",monospace!important;background:#fff;border:none;border-right:1px solid #ddd;border-radius:0;padding:15px;font-size:13px;line-height:1.5}.kupeli-code-block.is-editor .preview-area{max-height:500px;overflow-y:auto}:root{--code-bg:#f8f9fa;--code-fg:#24292e;--header-bg:#e1e4e8;--header-fg:#24292e;--btn-bg:#0366d6;--btn-fg:#fff;--btn-hover:#005cc5}@media (prefers-color-scheme:dark){:root{--code-bg:#1e1e1e;--code-fg:#d4d4d4;--header-bg:#2d2d2d;--header-fg:#e1e4e8;--btn-bg:#3178c6;--btn-fg:#fff;--btn-hover:#409fff}.kupeli-code-block.is-editor textarea.code-textarea{background:#252526;color:#d4d4d4;border-color:#333}}