body{background:#0f172a;margin:0}.app{color:#e2e8f0;max-width:640px;margin:40px auto;padding:16px;font-family:system-ui,sans-serif}.app h1{font-size:20px}.box{background:#1e293b;border:2px solid;border-radius:8px;margin:10px 0;padding:12px;font-size:14px}.box--provider{border-color:#6366f1}.box--consumer{border-color:#22c55e}.box--nonconsumer{border-color:#f59e0b}.box--memo{border-color:#14b8a6}.box--children{border-color:#a855f7}.btn{color:#fff;cursor:pointer;background:#6366f1;border:none;border-radius:6px;margin-left:8px;padding:4px 12px;font-weight:600}.btn:hover{background:#4f46e5}