:root{--fg:#0f172a;--bg:#fff;--accent:#2563eb}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans JP,sans-serif}.app{max-width:480px;margin:0 auto;padding:16px}.header{justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;display:flex}.title{font-size:20px;font-weight:700}.stats{opacity:.8;font-size:14px}.toolbar{gap:8px;margin:8px 0;display:flex}.btn{cursor:pointer;background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;padding:10px 12px;font-weight:600}.btn:active{transform:translateY(1px)}.canvasWrap{background:#eef2ff;border:1px solid #e5e7eb;border-radius:16px;position:relative;overflow:hidden}.help{opacity:.75;margin-top:8px;font-size:12px}.footer{opacity:.75;text-align:center;margin-top:10px;font-size:12px}.badge{background:#e2e8f0;border-radius:8px;padding:2px 6px;font-size:12px;display:inline-block}.controls{background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;gap:8px;padding:10px;display:grid}.controls .row{grid-template-columns:72px 1fr auto;align-items:center;gap:8px;display:grid}.controls .row.small label{opacity:.8;font-size:12px}.controls input[type=range]{width:100%}.seg{border:1px solid #e5e7eb;border-radius:10px;display:inline-flex;overflow:hidden}.segbtn{cursor:pointer;background:#fff;border:0;padding:8px 10px;font-weight:600}.segbtn.on{background:#e2e8f0}