:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#263e49;background:#f6f8f8;--accent:#167c80;--border:#dce5e5;--editor-width:50%}*{box-sizing:border-box}body{margin:0;height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}button,input,textarea,select{font:inherit}button{cursor:pointer;border:1px solid var(--border);border-radius:6px;padding:8px 12px;background:#fff;color:#3b535c;font-size:12px;min-height:34px;white-space:nowrap}button:hover{background:#edf5f3;border-color:#a9cac5}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #76b8b6;outline-offset:2px}button.primary{background:var(--accent);color:white;border-color:var(--accent);font-weight:650;min-width:85px}button.primary:hover{background:#12676c}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}input[type=text],input:not([type]),input[readonly]{border:1px solid var(--border);border-radius:6px;padding:9px;min-width:0;background:white}input[type=checkbox]{accent-color:var(--accent);width:15px;height:15px}.header{height:66px;display:flex;align-items:center;padding:0 24px;gap:28px;background:white;border-bottom:1px solid var(--border);flex-shrink:0}.brand{display:flex;align-items:center;gap:10px;color:#203b45;font-size:21px;font-weight:750;letter-spacing:-.7px}.brand:hover{text-decoration:none}.brand-light{font-weight:400}.tagline{color:#819094;font-size:12px}.github{margin-left:auto;font-size:12px}.toolbar{display:flex;align-items:center;gap:8px;padding:12px 20px;flex-shrink:0;background:#fbfcfc;border-bottom:1px solid var(--border)}.check{display:flex;align-items:center;gap:6px;font-size:12px;white-space:nowrap;min-height:34px}.toolbar-separator{height:24px;border-left:1px solid var(--border);margin:0 4px}#more-toggle{margin-left:auto}.more{padding:12px 20px;background:#f0f5f4;border-bottom:1px solid var(--border)}.more[hidden]{display:none}.control-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.control-row+.control-row{margin-top:12px}.control-row input{flex:1}.docs{gap:22px;font-size:12px}#hashbin-status,#package-status{font-size:12px;color:#627a82}.mobile-tabs{display:none}#workspace{flex:1;min-height:0;display:flex;overflow:hidden}#code-pane{width:var(--editor-width);min-width:200px;display:flex;flex-direction:column;background:white}#splitter{width:7px;flex-shrink:0;cursor:col-resize;background:#edf1f1;border-inline:1px solid var(--border)}#splitter:hover,#splitter:focus{background:#a7ccc9}.pane-heading{display:flex;align-items:center;justify-content:space-between;padding:0 18px;min-height:44px;border-bottom:1px solid var(--border);font-size:12px;font-weight:600;color:#49616b;background:#fbfcfc}.pane-heading a{font-size:11px;font-weight:400}.file-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#e3b557;margin-right:7px}.pane-heading button{border:0;background:none;font-size:11px;padding:4px 8px;min-height:30px}#editor{flex:1;min-height:100px;font-size:14px}#input-pane{border-top:1px solid var(--border)}summary{padding:12px 18px;cursor:pointer;font-size:12px;font-weight:600;background:#f8faf9}.badge{font-size:10px;font-weight:400;border:1px solid var(--border);border-radius:12px;padding:2px 6px;margin-left:8px}.input-hint{float:right;font-weight:400;color:#8b999e;font-size:10px;padding-top:2px}#stdin{display:block;border:0;resize:vertical;width:100%;height:108px;max-height:35vh;min-height:60px;padding:12px 20px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px;line-height:1.6;color:#34515a;background:#fff;outline:none}#output-pane{flex:1;min-width:0;display:flex;flex-direction:column;background:#fff}#output{flex:1;overflow:auto;overflow-wrap:anywhere;padding:22px;min-width:0}.console{font:13px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;margin:0;color:#34515a}.stderr{color:#bd4148}.traceback-link{font:inherit;color:inherit;padding:0;border:0;min-height:0;background:none;white-space:pre-wrap;text-decoration:underline}.output-item{margin:20px 0;min-width:0}.output-item img{max-width:100%;height:auto;cursor:zoom-in;display:block}.output-item img.zoomed{max-width:none;cursor:zoom-out}.output-item iframe{border:1px solid var(--border);width:100%;height:250px;display:block;border-radius:7px;margin-top:8px;background:white}.output-item iframe.expanded{height:70vh}.turtle-canvas{width:100%;height:clamp(220px,45vh,600px);overflow:hidden}.turtle-canvas svg{display:block;width:100%;height:100%}.output-controls{display:flex;gap:6px;justify-content:flex-end}.empty-state{color:#96a5a9;font-size:13px;text-align:center;padding:60px 15px}footer{min-height:36px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:7px 18px;border-top:1px solid var(--border);font-size:10px;color:#87969b;background:#f8faf9;flex-shrink:0}.run-status{display:flex;align-items:center;gap:7px;min-width:0;color:#5c747b}#status{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#status-dot{width:6px;height:6px;border-radius:50%;background:#a5b7ba;flex-shrink:0}body[data-state=running] #status-dot{background:#d5a239;animation:pulse 1s infinite}body[data-state=done] #status-dot{background:#43a288}body[data-state=error] #status-dot{background:#cb5b63}.environment{display:flex;gap:20px;white-space:nowrap}.offline{display:flex;gap:8px;align-items:center}.offline button{font-size:10px;min-height:22px;padding:2px 5px}.editor-hidden #code-pane,.editor-hidden #splitter{display:none}dialog{border:1px solid var(--border);border-radius:14px;padding:24px;width:min(580px,calc(100vw - 28px));color:#34515a;box-shadow:0 20px 80px #183e4933}dialog::backdrop{background:#17384066;backdrop-filter:blur(3px)}.dialog-title{display:flex;justify-content:space-between;align-items:center;gap:12px}.dialog-title h2{font-size:20px;margin:0}.dialog-title button{font-size:20px;border:0}dialog p{font-size:13px;line-height:1.7;white-space:pre-wrap}dialog .control-row{margin:14px 0}#share-url{width:100%;font-size:12px}#qr-image{text-align:center;margin:20px}#qr-image svg{width:min(100%,330px);height:auto}.download-options{display:grid;gap:10px;margin-top:20px}.ace_gutter-cell.error-line{background:#ffe6e6!important}@keyframes pulse{50%{opacity:.3}}
@media(max-width:1000px){.tagline{display:none}.environment{gap:10px;font-size:9px}.input-hint{display:none}.toolbar{padding:10px;gap:6px}.toolbar button{padding-inline:9px}}
@media(max-width:760px),(max-height:500px){.header{height:52px;padding:0 14px}.brand{font-size:19px}.brand img{width:27px;height:27px}.github{font-size:10px}.mobile-tabs{display:flex;background:white;border-bottom:1px solid var(--border);padding:0 12px;gap:15px}.mobile-tabs button{border:0;border-radius:0;min-height:42px;background:none;flex:1}.mobile-tabs .selected{color:var(--accent);border-bottom:3px solid var(--accent);font-weight:650}.toolbar{padding:8px;gap:6px}.toolbar button{min-height:40px;padding:8px 11px;font-size:12px}#download-open,#share-open,#qr-open,#hide-editor,.toolbar-separator{display:none}.more{padding:10px}.more .control-row input{font-size:16px;flex-basis:100%;order:-1}.more button,.more a{min-height:40px;display:inline-flex;align-items:center}.more .docs{gap:8px 20px}#workspace{position:relative}#code-pane{width:100%;min-width:0}#output-pane{width:100%}#splitter{display:none}#workspace[data-tab=output] #code-pane{display:none}#workspace[data-tab=code] #output-pane,#workspace[data-tab=input] #output-pane{display:none}#workspace[data-tab=code] #input-pane{display:none}#workspace[data-tab=input] #editor,#workspace[data-tab=input] #code-pane>.pane-heading{display:none}#workspace[data-tab=input] #input-pane{flex:1;border:0}#workspace[data-tab=input] details{height:100%;display:flex;flex-direction:column}#workspace[data-tab=input] #stdin{height:calc(100% - 45px);max-height:none;resize:none}#stdin{font-size:16px}.pane-heading{min-height:42px;padding:0 12px}.pane-heading button{min-height:40px}#output{padding:16px}.check{font-size:11px;min-height:40px}#more-toggle{margin-left:auto}.environment{display:none}footer{min-height:32px;font-size:10px;padding:6px 12px}dialog button{min-height:40px}dialog input{font-size:16px!important}.mobile-actions{display:flex!important;gap:8px;flex-wrap:wrap}#editor{font-size:16px}.editor-hidden #code-pane{display:flex}.toolbar{flex-shrink:0}}

.figure-canvas{width:100%;height:clamp(240px,50vh,650px);overflow:hidden}.figure-canvas svg{width:100%;height:100%;display:block}
