:root{color-scheme:light;font-family:Trebuchet MS,Lucida Grande,Lucida Sans,sans-serif;--bg: #f6f1e8;--bg-deep: #e8dcc8;--ink: #1f1b16;--muted: #6b5b4a;--accent: #d86b3f;--accent-soft: rgba(216, 107, 63, .2);--card: #fffaf2;--stroke: rgba(31, 27, 22, .2);--shadow: 0 18px 40px rgba(31, 27, 22, .12)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#fff6e4 0%,var(--bg) 45%,var(--bg-deep) 100%);color:var(--ink)}#app{max-width:1200px;margin:0 auto;padding:32px 24px 48px}.header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:16px 20px;border:1px solid var(--stroke);border-radius:18px;background:linear-gradient(120deg,#fffaf2e6,#f6e1ccb3);box-shadow:var(--shadow)}.eyebrow{text-transform:none;letter-spacing:.12em;font-size:.75rem;margin:0 0 6px;color:var(--muted)}.header h1{margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(1.8rem,3vw,2.5rem)}.repo-link{display:inline-flex;align-items:center;gap:6px;margin-left:12px;padding:6px 12px;border-radius:999px;border:1px solid var(--stroke);background:#fffaf2cc;color:var(--accent);font-size:.85rem;text-decoration:none;letter-spacing:.04em;text-transform:none}.repo-link:hover{background:#d86b3f26}.badge{padding:8px 14px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:.9rem;letter-spacing:.08em}.deck{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:24px 0}.layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr);gap:20px;align-items:stretch;margin-top:16px}.card{padding:16px 18px;border-radius:16px;background:var(--card);border:1px solid var(--stroke);box-shadow:var(--shadow)}.card h2{margin:0 0 8px;font-family:Georgia,Times New Roman,serif}.card p{margin:0;color:var(--muted)}.stage{position:relative;height:clamp(420px,70vh,560px);border-radius:22px;background:linear-gradient(140deg,#fef6ea,#f0d8c2);border:1px solid var(--stroke);box-shadow:var(--shadow);overflow:hidden}#viewport{display:block;width:100%;height:100%}.panel{margin-top:24px;padding:18px 20px;border-radius:18px;background:#1f1b16;color:#f9f2e7;box-shadow:var(--shadow);max-width:100%;overflow:hidden}.panel h3{margin:0 0 12px;font-family:Georgia,Times New Roman,serif}.panel pre{margin:0;font-size:.8rem;line-height:1.5;max-height:520px;overflow:auto;white-space:pre-wrap;word-break:break-word;color:#f0e0cc}.controls{margin-top:0;padding:18px 20px 20px;border-radius:18px;background:var(--card);border:1px solid var(--stroke);box-shadow:var(--shadow);max-height:clamp(420px,70vh,560px);overflow:auto}.controls-groups{display:grid;gap:16px}.control-group{padding:12px 12px 14px;border-radius:14px;border:1px dashed var(--stroke);background:#fffaf2b3}.control-group h4{margin:0 0 10px;font-family:Georgia,Times New Roman,serif;font-size:.95rem;color:var(--ink)}.controls-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}.controls-header h3{margin:0;font-family:Georgia,Times New Roman,serif}.apply-button{padding:8px 16px;border-radius:999px;border:1px solid var(--accent);background:var(--accent);color:#fff7f0;font-weight:700;letter-spacing:.02em;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.apply-button:hover{transform:translateY(-1px);box-shadow:0 8px 18px #d86b3f4d}.controls-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px 18px}.control{display:grid;gap:6px;font-size:.85rem;color:var(--muted)}.control span{font-weight:600;color:var(--ink)}.control input[type=range]{width:100%}.control .value{font-variant-numeric:tabular-nums;color:var(--muted)}@media (max-width: 720px){.header,.controls-header{flex-direction:column;align-items:flex-start}.layout{grid-template-columns:1fr}}
