.mk{--mk-max: 1120px;--mk-display: clamp(2.4rem, 1.4rem + 3.4vw, 4rem);--mk-h2: clamp(1.6rem, 1.2rem + 1.4vw, 2.25rem);color:var(--ink);background:var(--bg);background-image:radial-gradient(120% 60% at 50% -10%,var(--primary-weak),transparent 60%);min-height:100dvh}.mk-wrap{max-width:var(--mk-max);margin:0 auto;padding-inline:var(--s5)}.mk-nav{position:sticky;top:0;z-index:var(--z-sticky);height:64px;display:flex;align-items:center;gap:var(--s4);background:color-mix(in oklab,var(--bg) 86%,transparent);-webkit-backdrop-filter:saturate(140%) blur(8px);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--border)}.mk-brand{display:flex;align-items:center;gap:var(--s2);font-weight:650;letter-spacing:-.01em;text-decoration:none;color:var(--ink)}.mk-mark{width:26px;height:26px;border-radius:8px;background:var(--primary);color:var(--on-primary);display:grid;place-items:center;font-family:var(--font-mono);font-size:14px;font-weight:600}.mk-nav-links{margin-left:auto;display:flex;align-items:center;gap:var(--s5)}.mk-nav-links a:not(.btn){color:var(--ink-muted);text-decoration:none;font-size:var(--text-sm)}.mk-nav-links a:not(.btn):hover{color:var(--ink)}@media (max-width: 640px){.mk-nav-hide{display:none}}.mk-section{padding-block:clamp(3.5rem,2rem + 7vw,6.5rem)}.mk-eyebrow{font-size:var(--text-xs);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--primary)}.mk-h2{font-size:var(--mk-h2);letter-spacing:-.02em;line-height:1.1;text-wrap:balance;max-width:20ch}.mk-lead{color:var(--ink-muted);font-size:var(--text-lg);line-height:1.5;max-width:60ch;margin-top:var(--s3)}.mk-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(var(--s5),4vw,var(--s8));align-items:center;padding-top:clamp(2.5rem,1.5rem + 4vw,5rem);padding-bottom:clamp(3rem,2rem + 5vw,6rem)}.mk-hero h1{font-size:var(--mk-display);line-height:1.03;letter-spacing:-.035em;text-wrap:balance}.mk-hero .accent{color:var(--primary)}.mk-hero-actions{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s5)}@media (max-width: 860px){.mk-hero{grid-template-columns:1fr}.mk-hero-visual{order:-1}}.mk a.btn,.mk a.btn:hover{text-decoration:none}.mk-btn-lg{height:46px;padding:0 var(--s5);font-size:var(--text-base);border-radius:var(--r-md)}.mk-preview{border-radius:var(--r-lg);border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-pop);padding:var(--s4);display:grid;gap:var(--s3)}.mk-preview-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s2)}.mk-preview-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2)}.mk-preview-stat{border:1px solid var(--border);border-radius:var(--r-md);padding:var(--s2) var(--s3);background:var(--bg)}.mk-preview-stat .k{font-size:.62rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-muted)}.mk-preview-stat .v{font-size:var(--text-lg);font-weight:650;font-variant-numeric:tabular-nums}.mk-bars{display:grid;grid-template-columns:repeat(7,1fr);align-items:end;gap:6px;height:90px}.mk-bars i{display:block;background:var(--primary);border-radius:4px 4px 0 0;transform-origin:bottom;animation:grow-y .62s var(--ease) both}.mk-code{font-family:var(--font-mono);font-size:.72rem;line-height:1.7;background:var(--editor-bg);color:var(--editor-ink);border-radius:var(--r-md);padding:var(--s3);overflow-x:auto}.mk-code .kw{color:#4eccd3}.mk-code .fn{color:#b4de89}.mk-code .mut{color:var(--ink-faint)}.mk-strip{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface)}.mk-strip-inner{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);padding-block:var(--s5)}.mk-strip-label{font-size:var(--text-sm);color:var(--ink-muted);margin-right:var(--s2)}.mk-chip{font-family:var(--font-mono);font-size:var(--text-sm);padding:6px var(--s3);border-radius:999px;border:1px solid var(--border-strong);background:var(--bg);color:var(--ink)}.mk-bento{margin-top:var(--s6);display:grid;grid-template-columns:repeat(6,1fr);gap:var(--s3)}.mk-tile{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);padding:var(--s5);display:flex;flex-direction:column;gap:var(--s2)}.mk-tile h3{font-size:var(--text-lg);letter-spacing:-.01em}.mk-tile p{color:var(--ink-muted);font-size:var(--text-sm);line-height:1.55}.mk-tile.col-4{grid-column:span 4}.mk-tile.col-3{grid-column:span 3}.mk-tile.col-2{grid-column:span 2}.mk-tile.tint{background:var(--primary-weak);border-color:transparent}.mk-tile.dark{background:var(--editor-bg);border-color:transparent;color:var(--editor-ink)}.mk-tile.dark p{color:#b2b8bd}@media (max-width: 860px){.mk-bento{grid-template-columns:repeat(2,1fr)}.mk-tile.col-4,.mk-tile.col-3,.mk-tile.col-2{grid-column:span 2}}.mk-typelist{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s1)}.mk-steps{margin-top:var(--s6);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5);counter-reset:step}.mk-step{position:relative;padding-top:var(--s5);border-top:2px solid var(--border)}.mk-step:before{counter-increment:step;content:counter(step);position:absolute;top:-.9rem;left:0;width:1.8rem;height:1.8rem;border-radius:999px;background:var(--primary);color:var(--on-primary);display:grid;place-items:center;font-size:var(--text-sm);font-weight:650;font-variant-numeric:tabular-nums}.mk-step h3{font-size:var(--text-lg);margin-bottom:var(--s1)}.mk-step p{color:var(--ink-muted);font-size:var(--text-sm);line-height:1.55}@media (max-width: 720px){.mk-steps{grid-template-columns:1fr}}.mk-cta{background:var(--editor-bg);color:var(--editor-ink);border-radius:var(--r-lg);padding:clamp(2.5rem,1.5rem + 4vw,4.5rem);text-align:center;background-image:radial-gradient(90% 120% at 50% 0%,oklch(.32 .06 152),transparent 70%)}.mk-cta h2{font-size:var(--mk-h2);letter-spacing:-.02em;text-wrap:balance;max-width:24ch;margin:0 auto}.mk-cta p{color:#bbc8be;margin:var(--s3) auto 0;max-width:50ch}.mk-cta .mk-hero-actions{justify-content:center}.mk-footer{border-top:1px solid var(--border);padding-block:var(--s6);color:var(--ink-muted);font-size:var(--text-sm);display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;justify-content:space-between}.mk-reveal.in{animation:rise .56s var(--ease) both}@media (prefers-reduced-motion: reduce){.mk-reveal.in,.mk-bars i{animation:none}}.mk-auth{min-height:100dvh;display:grid;grid-template-columns:1fr .85fr}.mk-auth-form{display:grid;align-content:center;justify-items:stretch;padding:clamp(var(--s5),4vw,var(--s8))}.mk-auth-form .inner{width:100%;max-width:420px;margin-inline:auto}.mk-auth-aside{background:var(--editor-bg);color:var(--editor-ink);padding:clamp(var(--s5),4vw,var(--s8));display:grid;align-content:center;gap:var(--s5);background-image:radial-gradient(90% 70% at 20% 0%,oklch(.32 .06 152),transparent 65%)}.mk-aside-point{display:grid;gap:2px}.mk-aside-point .t{font-weight:600}.mk-aside-point .d{color:#b5c2b7;font-size:var(--text-sm)}@media (max-width: 820px){.mk-auth{grid-template-columns:1fr}.mk-auth-aside{display:none}}.mk-form-error{color:var(--error);font-size:var(--text-xs);margin-top:4px;min-height:1em}.mk-form-note{color:var(--ink-muted);font-size:var(--text-xs);margin-top:var(--s2)}:root{--bg: oklch(1 0 0);--surface: oklch(.985 .003 155);--surface-2: oklch(.965 .004 155);--border: oklch(.915 .005 155);--border-strong: oklch(.86 .006 155);--ink: oklch(.22 .012 155);--ink-muted: oklch(.44 .012 155);--ink-faint: oklch(.55 .01 155);--primary: oklch(.5 .13 152);--primary-hover: oklch(.44 .13 152);--primary-weak: oklch(.95 .03 152);--on-primary: oklch(1 0 0);--ring: oklch(.58 .13 152);--success: oklch(.52 .13 152);--success-weak: oklch(.95 .03 152);--error: oklch(.54 .18 25);--error-weak: oklch(.95 .04 25);--warning: oklch(.7 .14 75);--info: oklch(.55 .12 240);--editor-bg: oklch(.2 .012 240);--editor-panel: oklch(.255 .012 240);--editor-ink: oklch(.93 .006 240);--editor-border: oklch(.32 .012 240);--font-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", "Cascadia Code", monospace;--text-xs: .75rem;--text-sm: .8125rem;--text-base: .9375rem;--text-lg: 1.125rem;--text-xl: 1.375rem;--text-2xl: 1.75rem;--s1: .25rem;--s2: .5rem;--s3: .75rem;--s4: 1rem;--s5: 1.5rem;--s6: 2rem;--s8: 3rem;--r-sm: 6px;--r-md: 10px;--r-lg: 14px;--shadow-sm: 0 1px 2px oklch(.22 .01 155 / .06);--shadow-md: 0 4px 16px -4px oklch(.22 .01 155 / .1);--shadow-pop: 0 12px 32px -8px oklch(.22 .01 155 / .18);--ease: cubic-bezier(.22, 1, .36, 1);--z-dropdown: 1000;--z-sticky: 1100;--z-backdrop: 1200;--z-modal: 1300;--z-toast: 1400;--z-tooltip: 1500}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-ui);font-size:var(--text-base);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3{margin:0;font-weight:600;line-height:1.25;text-wrap:balance;letter-spacing:-.01em}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}:focus-visible{outline:3px solid var(--ring);outline-offset:2px;border-radius:var(--r-sm)}::selection{background:var(--primary-weak)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);height:36px;padding:0 var(--s4);border-radius:var(--r-md);border:1px solid transparent;font:inherit;font-size:var(--text-sm);font-weight:500;cursor:pointer;white-space:nowrap;transition:background .12s var(--ease),border-color .12s var(--ease),transform .12s var(--ease),opacity .12s var(--ease)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-sm{height:32px;padding:0 var(--s3)}.btn-primary{background:var(--primary);color:var(--on-primary)}.btn-primary:hover:not(:disabled){background:var(--primary-hover)}.btn-secondary{background:var(--surface);border-color:var(--border-strong);color:var(--ink)}.btn-secondary:hover:not(:disabled){background:var(--surface-2)}.btn-ghost{background:transparent;color:var(--ink-muted)}.btn-ghost:hover:not(:disabled){background:var(--surface);color:var(--ink)}.btn-danger{background:var(--error);color:var(--on-primary)}.field{display:flex;flex-direction:column;gap:var(--s2)}.field label{font-size:var(--text-sm);font-weight:500;color:var(--ink-muted)}.input,.textarea,.select{width:100%;min-height:36px;padding:var(--s2) var(--s3);border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--bg);color:var(--ink);font:inherit;font-size:var(--text-sm);transition:border-color .12s var(--ease)}.input:focus,.textarea:focus,.select:focus{border-color:var(--ring);outline:none;box-shadow:0 0 0 3px var(--primary-weak)}.textarea{font-family:var(--font-mono);resize:vertical;line-height:1.5}.badge{display:inline-flex;align-items:center;gap:var(--s1);height:22px;padding:0 var(--s2);border-radius:999px;font-size:var(--text-xs);font-weight:500;border:1px solid var(--border);background:var(--surface);color:var(--ink-muted)}.badge-pass{background:var(--success-weak);color:var(--success);border-color:transparent}.badge-fail{background:var(--error-weak);color:var(--error);border-color:transparent}.badge-dot{width:7px;height:7px;border-radius:999px;background:currentColor}.badge-running .badge-dot{animation:pulse 1.1s var(--ease) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.25}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes grow-y{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}@keyframes pop-in{0%{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}@media (max-width: 560px){.grid-2{grid-template-columns:1fr}}.muted{color:var(--ink-muted)}.mono{font-family:var(--font-mono)}.card-link{display:block;text-decoration:none;color:inherit;transition:border-color .14s var(--ease),box-shadow .14s var(--ease),transform .14s var(--ease)}.card-link:hover{border-color:var(--border-strong);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.card-link:active{transform:translateY(0)}.rise{animation:rise .26s var(--ease) both}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s3)}.stat{padding:var(--s4)}.stat-label{font-size:var(--text-xs);color:var(--ink-muted);text-transform:uppercase;letter-spacing:.04em}.stat-value{font-size:var(--text-xl);font-weight:650;margin-top:var(--s1);font-variant-numeric:tabular-nums}.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface)}table.table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}table.table th,table.table td{padding:var(--s3) var(--s4);text-align:left;white-space:nowrap;border-bottom:1px solid var(--border)}table.table th{font-size:var(--text-xs);font-weight:600;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.03em;background:var(--surface-2);position:sticky;top:0}table.table tbody tr:last-child td{border-bottom:none}table.table tbody tr:hover td{background:var(--surface-2)}table.table td.num,table.table th.num{text-align:right;font-variant-numeric:tabular-nums}.bar-track{height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden;min-width:80px}.bar-fill{height:100%;width:100%;border-radius:999px;background:var(--primary);transform-origin:left center;transform:scaleX(0);transition:transform .5s var(--ease)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.badge-running .badge-dot{animation:none}}.workspace{display:grid;grid-template-columns:minmax(320px,4fr) 6fr;height:100%;min-height:0}.workspace-problem{border-right:1px solid var(--border);min-height:0;background:var(--bg)}.workspace-editor{display:grid;grid-template-rows:auto 1fr auto minmax(180px,38%);min-height:0;background:var(--editor-bg)}.workspace-editor.code-only{grid-template-rows:auto 1fr auto}.editor-toolbar{display:flex;align-items:center;gap:var(--s2);padding:var(--s2) var(--s3);background:var(--editor-panel);border-bottom:1px solid var(--editor-border)}.editor-surface{min-height:0}.editor-io{display:flex;flex-direction:column;gap:var(--s1);padding:var(--s2) var(--s3);background:var(--editor-panel);border-top:1px solid var(--editor-border)}.editor-result{min-height:0}@media (max-width: 900px){.workspace{grid-template-columns:1fr;grid-template-rows:minmax(220px,40%) 1fr;overflow-y:auto}.workspace-problem{border-right:none;border-bottom:1px solid var(--border)}.workspace-editor{grid-template-rows:auto minmax(260px,1fr) auto minmax(160px,auto)}}
