.playground-page{background:#f6f8fa}.playground-main{width:min(1500px,calc(100% - 40px));margin:0 auto;padding:42px 0 60px}.playground-intro{text-align:center;margin-bottom:28px}.playground-intro p{font-size:13px;letter-spacing:3px;color:#28a878;font-weight:700}.playground-intro h1{font-size:38px;line-height:1.3;margin:7px 0;color:#202b33}.playground-intro span{font-size:16px;color:#75808a}.runner-shell{display:grid;grid-template-columns:1fr 1fr;min-height:610px;background:#fff;border:1px solid #dde3e8;border-radius:10px;overflow:hidden;box-shadow:0 10px 35px rgba(34,61,80,.09)}.runner-pane{display:flex;flex-direction:column;min-width:0}.editor-pane{border-right:1px solid #dde3e8}.runner-toolbar{height:66px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:#f8fafb;border-bottom:1px solid #dde3e8;gap:12px}.runner-toolbar strong{font-size:16px;color:#687681;white-space:nowrap}.runner-toolbar em{font-style:normal;color:#e54d42}.runner-actions{display:flex;align-items:center;gap:8px}.runner-toolbar button,.language-picker{box-sizing:border-box;height:36px;display:inline-flex;align-items:center;padding:0 13px;border:1px solid #dfe4e8;border-radius:18px;background:#fff;color:#34414a;font-size:14px;white-space:nowrap}.language-picker i{width:8px;height:8px;border-radius:50%;background:#3776ab;box-shadow:0 0 0 3px rgba(55,118,171,.14);margin-right:8px}.language-picker select{max-width:170px;border:0;outline:0;background:transparent;color:#34414a;font:inherit;cursor:pointer}.runner-toolbar .run-code{border:0;background:linear-gradient(135deg,#35b985,#249766);color:#fff;font-weight:600}.runner-toolbar button:hover{border-color:#28a878;color:#16845c}.runner-toolbar .run-code:hover{color:#fff;filter:brightness(.96)}.runner-toolbar button:disabled{opacity:.65;cursor:wait}.runner-toolbar kbd{margin-left:7px;padding:1px 5px;border-radius:4px;background:rgba(255,255,255,.2);font:11px ui-monospace,monospace}.editor-area{position:relative;flex:1;background:#fff}.line-label{position:absolute;left:0;top:0;bottom:0;width:48px;padding:20px 10px;text-align:right;color:#a9b2b9;background:#f5f7f8;border-right:1px solid #e5e8eb;font:16px/28px ui-monospace,monospace;user-select:none}.editor-area textarea{box-sizing:border-box;width:100%;height:100%;min-height:543px;padding:20px 22px 20px 66px;border:0;outline:0;resize:none;color:#25323b;background:transparent;font:16px/28px ui-monospace,SFMono-Regular,Menlo,monospace;tab-size:4}.output-pane #result-area{display:flex;flex:1;min-height:0}.output-pane pre{box-sizing:border-box;flex:1;margin:0;padding:24px;overflow:auto;background:#111820;color:#e6edf3;border-top:3px solid #ffd343;font:15px/1.75 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap}.output-pane iframe{width:100%;min-height:543px;border:0;background:#fff}.output-pane.fullscreen{position:fixed;inset:0;z-index:1000}.output-pane.fullscreen #result-area{height:calc(100vh - 66px)}@media(max-width:1350px) and (min-width:901px){.editor-pane .runner-toolbar>strong{display:none}}@media(max-width:900px){.playground-main{width:calc(100% - 20px);padding-top:24px}.runner-shell{grid-template-columns:1fr;min-height:0}.editor-pane{border-right:0;border-bottom:1px solid #dde3e8}.runner-actions{overflow-x:auto}.runner-toolbar{padding:0 10px}.language-picker{max-width:150px}.runner-shell .editor-area textarea{min-height:430px}.output-pane pre{min-height:350px}}