:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:#fff4e6;color:#2a1230}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 100% 0,#ffd2b5 0,transparent 27rem),#fff4e6}main{max-width:1380px;margin:0 auto;padding:3.5rem 2rem 2rem}h1,p{margin:0}.hero{display:flex;align-items:center;justify-content:space-between;min-height:190px;padding:0 .5rem 1.25rem}.eyebrow{color:#e85a6b;font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}h1{max-width:760px;margin-top:.55rem;font-size:clamp(1.8rem,3.5vw,3.1rem);line-height:1.03;letter-spacing:-.05em}.intro{max-width:480px;margin-top:1rem;color:#654561;font-size:1.05rem;line-height:1.5}.project-meta{display:flex;flex-wrap:wrap;gap:.5rem;align-items:stretch;margin-top:.8rem}.warning{width:fit-content;max-width:650px;padding:.42rem .65rem;border-left:3px solid #E85A6B;border-radius:7px;background:#ffe3db;color:#7d3041;font-size:.76rem;font-weight:700;line-height:1.35}.github-link{display:inline-flex;align-items:center;padding:.42rem .65rem;border-radius:7px;background:#2a1230;color:#fff4e6;font-size:.76rem;font-weight:750;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease}.github-link:hover{transform:translateY(-1px);box-shadow:0 6px 14px #2a123033}.github-link:focus-visible{outline:3px solid #FF7A8A55;outline-offset:2px}.mascot{width:165px;height:165px;margin-right:1rem;object-fit:cover;object-position:top;border-radius:32px;box-shadow:0 16px 40px #e85a6b31;mix-blend-mode:multiply}.toolbar{display:flex;gap:.6rem;align-items:center;margin:.8rem 0 1.1rem;padding:.65rem;border:1px solid #efd7c2;border-radius:16px;background:#fffaf3cc;box-shadow:0 8px 24px #2a12300b}.toolbar-spacer{flex:1}.example-picker{color:#654561;font-size:.85rem;font-weight:700}button,select{border:0;border-radius:10px;font:inherit;font-weight:750;cursor:pointer}select{margin-left:.35rem;padding:.48rem .25rem;color:#2a1230;background:transparent}button{padding:.58rem .85rem;transition:transform .15s ease,box-shadow .15s ease}button:hover:not(:disabled){transform:translateY(-1px)}button:disabled{cursor:default;opacity:.42}.primary{color:#fff;background:#e85a6b;box-shadow:0 5px 12px #e85a6b55}.primary:hover:not(:disabled){background:#d94d5f;box-shadow:0 8px 16px #e85a6b66}.secondary{color:#9e4152;background:#ffe3db}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.pane{display:grid;gap:.5rem;color:#2a1230;font-size:.9rem;font-weight:800}.pane>span{display:flex;justify-content:space-between;align-items:center;padding:0 .25rem}small{color:#a47b82;font-size:.72rem;font-weight:700}.editor{position:relative;min-height:35rem}textarea,pre,#highlight{min-height:35rem;margin:0;padding:1rem 1.1rem;border:1px solid #ead3c8;border-radius:16px;background:#2a1230;color:#fff4e6;box-shadow:0 12px 28px #2a123014;font:14px/1.6 DejaVu Sans Mono,Noto Sans Mono,ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow:auto}textarea:focus{outline:3px solid #FF7A8A55;border-color:#ff7a8a}#highlight,#source{position:absolute;inset:0;width:100%;height:100%}#highlight{pointer-events:none}#highlight pre{min-height:100%;padding:0;border:0;border-radius:0;background:transparent!important;box-shadow:none;overflow:visible}#source{resize:none}.syntax-ready #source{color:transparent;caret-color:#fff4e6;background:transparent}#source::selection{background:#ff7a8a80}@media(max-width:760px){main{padding:1.25rem 1rem}.hero{min-height:0;padding:1rem 0}h1{font-size:2.05rem}.mascot{width:82px;height:82px;margin:0;border-radius:20px}.workspace{grid-template-columns:1fr}.toolbar{flex-wrap:wrap}.toolbar-spacer{display:none}.editor,textarea,pre,#highlight{min-height:20rem}}