:root{--font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-size: 14px;--line-height: 1.3;--text-color: #1a1a1a;--bg-color: #fafafa;--sidebar-bg: #ffffff;--sidebar-border: #e5e5e5;--accent: #2563eb;--accent-hover: #1d4ed8;--accent-light: #2563eb12;--muted: #6b7280;--status-bg: #f3f4f6;--status-border: #e5e5e5;--challenge-accent: #d97706;--shadow: 0 1px 3px rgba(0,0,0,.05);--selection-bg: #a8d1ff;--selection-fg: #1a1a1a}::selection{background:var(--selection-bg);color:var(--selection-fg)}::-moz-selection{background:var(--selection-bg);color:var(--selection-fg)}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;font-family:var(--font-family);background:var(--bg-color);color:var(--text-color);-webkit-tap-highlight-color:transparent}body{display:flex;flex-direction:column}#app{flex:1;display:flex;min-height:0}#editor-pane{flex:1;display:flex;flex-direction:column;min-width:0;position:relative}#editor-stack{flex:1;position:relative;min-height:0}#editor,#editor-mirror,#search-highlights{position:absolute;inset:0;margin:0;padding:16px 20px;font-family:var(--font-family);font-size:calc(var(--font-size) * var(--editor-zoom, 1));line-height:var(--line-height);box-sizing:border-box;tab-size:4;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word}#cm-host{position:absolute;inset:0;z-index:2;display:none}#cm-host.active{display:block}#editor-pane.cm-active #editor,#editor-pane.cm-active #editor-mirror,#editor-pane.cm-active #search-highlights{display:none}#cm-host .cm-editor{height:100%}#cm-host .cm-editor.cm-focused{outline:none}#editor{border:none;outline:none;resize:none;color:var(--text-color);background:transparent;overflow-y:auto;overflow-x:hidden;z-index:1}#editor-stack{background:var(--bg-color)}#editor.no-wrap{white-space:pre;overflow-x:auto;word-wrap:normal}#editor-mirror{color:transparent;pointer-events:none;opacity:0;overflow:hidden;user-select:none;z-index:0}#editor-mirror.no-wrap{white-space:pre;word-wrap:normal}#search-highlights{color:transparent;pointer-events:none;user-select:none;overflow:hidden;z-index:0}#search-highlights.no-wrap{white-space:pre;word-wrap:normal}#search-highlights mark{background:#ffd54f8c;color:transparent;border-radius:2px}#search-highlights mark.current{background:#ff9800b3}#editor-pane.dragging #editor-mirror{pointer-events:auto;z-index:4}#editor-pane.dragging:before{content:"";position:absolute;inset:8px;border:2px dashed var(--accent);border-radius:6px;pointer-events:none;z-index:3}#editor-pane.dragging:after{content:"Drop to insert at cursor";position:absolute;top:12px;left:50%;transform:translate(-50%);background:var(--accent);color:#fff;font-size:11px;font-weight:600;letter-spacing:.02em;padding:4px 10px;border-radius:999px;pointer-events:none;z-index:5;text-transform:uppercase}#drop-caret{position:absolute;width:2px;background:var(--accent);box-shadow:0 0 6px var(--accent);pointer-events:none;display:none;z-index:5;border-radius:1px;animation:drop-caret-blink 1s step-end infinite}#editor-pane.dragging #drop-caret{display:block}@keyframes drop-caret-blink{50%{opacity:.35}}#status-bar{flex-shrink:0;display:flex;align-items:center;gap:6px;padding:4px 16px;font-size:12px;color:var(--muted);background:var(--status-bg);border-top:1px solid var(--status-border);user-select:none}#status-bar.hidden{display:none}#status-bar .counts{flex:1}@media (max-width: 300px){#status-bar .counts{display:none}}.status-select{appearance:none;-webkit-appearance:none;background:transparent;border:none;color:var(--muted);font:inherit;font-size:12px;padding:0 14px 0 0;cursor:pointer;outline:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 7px) 50%,calc(100% - 3px) 50%;background-size:4px 4px,4px 4px;background-repeat:no-repeat;margin:0 0 0 auto}.status-select:hover{color:var(--text-color)}.status-select:focus{color:var(--text-color)}.status-select option{color:var(--text-color);background:var(--modal-bg)}.status-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;color:var(--muted)}.status-icon svg{width:16px;height:16px;display:none}.status-icon.saving .icon-saving{display:block;animation:status-icon-spin .9s linear infinite}.status-icon.file:not(.saving) .icon-file{display:block}.status-icon.cloud:not(.saving) .icon-cloud{display:block}.status-icon.dirty{opacity:.4}.status-icon.dirty:hover{opacity:.7}@keyframes status-icon-spin{to{transform:rotate(360deg)}}.status-icon.flash{color:var(--text-color);animation:status-icon-flash .7s ease-out}@keyframes status-icon-flash{0%{transform:scale(1)}40%{transform:scale(1.25)}to{transform:scale(1)}}.btn{border:1px solid var(--sidebar-border);background:var(--sidebar-bg);color:var(--text-color);padding:6px 12px;border-radius:6px;font-size:13px;cursor:pointer;font-family:inherit}.btn:hover{background:var(--status-bg)}.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}.btn.primary:hover{background:var(--accent-hover)}.btn:disabled{opacity:.5;cursor:not-allowed}#find-bar{position:absolute;top:8px;right:16px;background:var(--sidebar-bg);border:1px solid var(--sidebar-border);border-radius:8px;padding:8px;box-shadow:0 4px 12px #0000001a;display:none;gap:6px;align-items:center;z-index:100}#find-bar.visible{display:flex}#find-bar input{border:1px solid var(--sidebar-border);border-radius:4px;padding:4px 8px;font-size:13px;font-family:inherit;width:140px}#find-bar .find-info{font-size:11px;color:var(--muted);min-width:50px;text-align:center}#editor-pane{position:relative;margin-top:36px}#window-actions{position:fixed;top:4px;right:7px;z-index:999999;display:flex;gap:2px;align-items:center}#window-actions button{appearance:none;background:transparent;border:1px solid transparent;color:var(--muted);width:26px;height:26px;padding:0;border-radius:6px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .12s ease,color .12s ease}#window-actions button:hover{background:var(--status-bg);color:var(--text-color)}#window-actions button.active{background:var(--status-bg);color:var(--accent)}#window-actions svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}body.puter-app #window-actions{display:none}#about-modal{position:fixed;inset:0;margin:auto;width:min(620px,calc(100vw - 32px));max-height:calc(100vh - 64px);padding:28px 32px;border:1px solid var(--sidebar-border);border-radius:12px;background:var(--sidebar-bg);color:var(--text-color);box-shadow:0 20px 60px #00000040;font-family:var(--font-family);overflow:auto}#about-modal::backdrop{background:#00000059}#about-modal h1{margin:0 0 12px;font-size:22px;font-weight:600}#about-modal h2{margin:20px 0 10px;font-size:15px;font-weight:600;color:var(--text-color)}#about-modal p{margin:0 0 12px;font-size:14px;line-height:1.55}#about-modal ul{margin:0 0 12px;padding-left:20px;font-size:14px;line-height:1.6}#about-modal .faq{border-top:1px solid var(--status-border);padding:10px 0}#about-modal .faq:last-of-type{border-bottom:1px solid var(--status-border);margin-bottom:16px}#about-modal .faq summary{cursor:pointer;font-size:14px;font-weight:500;line-height:1.4;list-style:none;padding-right:24px;position:relative}#about-modal .faq summary::-webkit-details-marker{display:none}#about-modal .faq summary:after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:18px;line-height:1;transition:transform .15s ease}#about-modal .faq[open] summary:after{content:"−"}#about-modal .faq p{margin:8px 0 4px;color:var(--muted)}#about-modal a{color:var(--accent);text-decoration:none}#about-modal a:hover{text-decoration:underline}#about-modal .about-credit{color:var(--muted);font-size:13px;margin-bottom:0}#about-modal .about-close{position:absolute;top:8px;right:8px;width:28px;height:28px;border:none;background:transparent;color:var(--muted);font-size:16px;line-height:1;border-radius:6px;cursor:pointer}#about-modal .about-close:hover{background:var(--status-bg);color:var(--text-color)}#about-title{display:flex;align-items:center;gap:8px}@media (max-width: 490px){#editor{padding:16px 20px}}@media (max-width: 768px){#editor,#editor-mirror,#search-highlights{font-size:max(16px,calc(var(--font-size) * var(--editor-zoom, 1)))}#cm-host .cm-scroller,#cm-host .cm-content,#cm-host .cm-editor{font-size:max(16px,calc(var(--font-size) * .86 * var(--editor-zoom, 1)))!important}#find-bar input,.status-select{font-size:16px}}#print-root{display:none}@media print{@page{margin:.6in .6in .7in}html,body{margin:0;padding:0;height:auto;min-height:0;overflow:visible;background:#fff;display:block}body>*:not(#print-root){display:none!important}#print-root{display:block;color:#000;box-sizing:border-box;padding:0}#print-root .print-body{margin:0}}puter-ai-sidebar{--ai-bg: var(--sidebar-bg);--ai-surface: var(--status-bg);--ai-surface-active: var(--status-border);--ai-border: var(--sidebar-border);--ai-text: var(--text-color);--ai-text-muted: var(--muted);--ai-accent: #3478f6;--ai-input-bg: var(--input-bg);--ai-shadow: rgba(0, 0, 0, .08);--ai-font: var(--font-family)}@media (max-width: 768px){puter-menubar{transform:translateY(var(--viewport-offset-top, 0))}puter-ai-sidebar{position:fixed;left:0;right:0;bottom:var(--keyboard-inset, 0);top:auto;width:100%;--ai-width: 100vw;z-index:50}#window-actions button{width:32px;height:32px}#window-actions #btn-toggle-sidebar{transform:rotate(90deg)}#window-actions svg{width:20px;height:20px}#window-actions button:hover{background-color:transparent}}