:root{--bg:#f5f5f7;--card:#fff;--border:#e5e5ea;--border-strong:#c8c8cd;--text:#1d1d1f;--text-muted:#6e6e73;--primary:#0071e3;--primary-dark:#0056b3;--danger:#ff3b30;--danger-dark:#c30000;--shadow-sm:0 1px 2px rgba(0,0,0,.04);--shadow:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.03);--radius:10px;--radius-sm:6px}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.5;margin:0;padding:24px 16px;-webkit-font-smoothing:antialiased}.ksg{margin:0 auto;max-width:1100px}.ksg h1{font-size:28px;font-weight:600;letter-spacing:-.02em;margin:0 0 24px}.ksg-section{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);margin-bottom:16px;padding:16px 20px}.ksg-section h2{color:var(--text-muted);font-size:12px;font-weight:600;letter-spacing:.06em;margin:0 0 14px;text-transform:uppercase}.ksg-grid{display:grid;gap:12px 16px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.ksg label{color:var(--text-muted);display:flex;flex-direction:column;font-size:13px;gap:4px;margin:0}.ksg input[type=number],.ksg input[type=text]{background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius-sm);color:var(--text);font-family:inherit;font-size:14px;padding:6px 10px;transition:border-color .15s,box-shadow .15s;width:100%}.ksg input[type=number]:focus,.ksg input[type=text]:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(0,113,227,.15);outline:none}.ksg input[type=color]{border:1px solid var(--border-strong);height:34px;padding:2px;width:100%}.ksg button,.ksg input[type=color]{background:#fff;border-radius:var(--radius-sm);cursor:pointer}.ksg button{border:1px solid var(--border-strong);color:var(--text);font-family:inherit;font-size:14px;font-weight:500;padding:8px 14px;transition:background .15s,border-color .15s,transform .05s}.ksg button:hover{background:#f9f9fb;border-color:var(--text-muted)}.ksg button:active{transform:translateY(1px)}.ksg-btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}.ksg-btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark)}.ksg-actions{margin-bottom:12px}.ksg-actions,.ksg-function-row{display:flex;flex-wrap:wrap;gap:8px}.ksg-function-row{align-items:center;border-radius:var(--radius-sm);margin:4px 0;padding:6px 8px;transition:background .15s}.ksg-function-row:hover{background:#f9f9fb}.ksg-fn-vis{cursor:pointer;margin:0 4px 0 0;transform:scale(1.2)}.ksg-fn-label{min-width:60px}.ksg-fn-expr,.ksg-fn-label{color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:14px}.ksg-fn-expr{background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius-sm);flex:1;min-width:220px;padding:6px 10px}.ksg-fn-expr:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(0,113,227,.15);outline:none}.ksg-fn-color{background:#fff;cursor:pointer;height:28px;padding:2px;width:38px}.ksg-fn-color,.ksg-fn-width{border:1px solid var(--border-strong);border-radius:var(--radius-sm)}.ksg-fn-width{font-family:inherit;font-size:14px;padding:6px 8px;width:70px}.ksg-fn-remove{align-items:center;background:var(--danger);border:none;border-radius:50%;color:#fff;cursor:pointer;display:inline-flex;font-size:16px;font-weight:700;height:24px;justify-content:center;line-height:1;padding:0;width:24px}.ksg-fn-remove:hover{background:var(--danger-dark)}.ksg-fn-error{color:var(--danger);font-size:12px;font-weight:600;min-width:80px}.ksg-syntax-hint{color:var(--text-muted);font-size:12px;line-height:1.6;margin:12px 0 0}.ksg-syntax-hint code{background:#f0f0f3;border-radius:4px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:12px;padding:1px 5px}.ksg-hint{color:var(--text-muted);font-size:13px;font-style:italic;margin:4px 0 12px}.ksg-error{color:var(--danger);font-size:13px;font-weight:600;margin-bottom:8px;min-height:1.4em}.ksg-preview{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:auto;padding:12px;text-align:center}.ksg-preview svg{display:inline-block;height:auto;max-width:100%}.ksg-preview svg text[data-draggable]{cursor:move;transition:fill .15s;user-select:none;-webkit-user-select:none}.ksg-preview svg text[data-draggable]:hover{fill:var(--primary)}@media (max-width:600px){body{padding:16px 8px}.ksg-section{padding:12px 14px}.ksg h1{font-size:22px;margin-bottom:16px}}