.smc{--bg:#fff;--fg:#1d2733;--pn:#f3f5f8;--ln:#d5dbe3;--vp:#e6ebf1;--ac:#1976d2;--dm:#1e63c4;--hl:#7b3fe4;--cg:#d32f2f;display:grid;grid-template-columns:310px 1fr;height:720px;border:1px solid var(--ln);border-radius:8px;overflow:hidden;background:var(--bg);color:var(--fg);font:14px/1.5 -apple-system,"Hiragino Sans","Noto Sans JP",sans-serif;box-sizing:border-box}
@media (prefers-color-scheme:dark){.smc{--bg:#161b22;--fg:#e4e9ef;--pn:#1e252e;--ln:#333c48;--vp:#10151b;--ac:#4a9be8;--dm:#5aa2f0;--hl:#a98bf5;--cg:#ff6b6b}}
.smc *{box-sizing:border-box}
.smc-panel{background:var(--pn);padding:12px;overflow:auto;border-right:1px solid var(--ln)}
.smc-view{position:relative;background:var(--vp);min-height:360px;overflow:hidden}
.smc-view canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}
.smc-labels{position:absolute;inset:0;pointer-events:none}
.smc-dim{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;cursor:text;padding:1px 6px;border-radius:4px;background:var(--bg);color:var(--dm);border:1px solid var(--dm);font-size:12px;font-weight:600;white-space:nowrap;user-select:none}
.smc-dim:hover{background:var(--dm);color:#fff}
.smc-dim.smc-ang{color:var(--ac);border-color:var(--ac)}
.smc-dim.smc-ang:hover{background:var(--ac);color:#fff}
.smc-dim.smc-hl{color:var(--hl);border-color:var(--hl)}
.smc-dim.smc-hl:hover{background:var(--hl);color:#fff}
.smc-dim.smc-cg,.smc-dim.smc-cg:hover{color:var(--cg);border-color:var(--cg);background:var(--bg);cursor:default}
.smc-dim input{width:80px;padding:0 2px;border:0;outline:0;background:transparent;color:var(--fg);font:inherit}
.smc-msg{position:absolute;top:10px;left:50%;transform:translateX(-50%);max-width:92%;padding:6px 12px;border-radius:6px;background:#b45309;color:#fff;font-size:13px;opacity:0;transition:opacity .2s;pointer-events:none}
.smc-msg.show{opacity:1}
.smc-hint{position:absolute;left:8px;right:330px;top:10px;font-size:11px;opacity:.7;pointer-events:none}
.smc h4{margin:14px 0 6px;font-size:12px;opacity:.7;font-weight:600}
.smc label{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:4px 0}
.smc input,.smc select{width:110px;padding:4px 6px;border:1px solid var(--ln);border-radius:4px;background:var(--bg);color:var(--fg);font:inherit}
.smc select[data-m]{width:170px}
.smc button{padding:6px 10px;border:1px solid var(--ln);border-radius:6px;background:var(--bg);color:var(--fg);font:inherit;cursor:pointer}
.smc button.on,.smc-btns button:not(.smc-sub){background:var(--ac);border-color:var(--ac);color:#fff}
.smc-tabs,.smc-btns,.smc-row{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.smc-row select{width:80px}
.smc-btns{margin-top:12px}
.smc-card{margin-top:8px;padding:6px 8px;border:1px solid var(--ln);border-radius:6px;background:var(--bg);cursor:pointer}
.smc-card.sel{border-color:var(--hl);box-shadow:0 0 0 1px var(--hl)}
.smc-hh{display:flex;align-items:center;gap:6px}
.smc-hh b{flex:1;font-size:13px;color:var(--hl)}
.smc-fl .smc-hh b{flex:0 0 auto;color:var(--dm)}
.smc-hh small{flex:1;font-size:11px;opacity:.7}
.smc-hh select{width:76px}
.smc-hh button{padding:2px 8px}
.smc-card label span{font-size:12px}
.smc-card input{width:90px}
.smc-card{cursor:default}.smc-hole{cursor:pointer}
.smc-info{margin-top:12px;padding:8px;border:1px dashed var(--ln);border-radius:6px;font-size:13px}
.smc-info small{opacity:.75;line-height:1.4}
@media (max-width:720px){.smc{grid-template-columns:1fr;height:auto!important}.smc-view{height:440px}.smc-panel{border-right:0;border-bottom:1px solid var(--ln);max-height:none}}
.smc-row{margin:4px 0}
.smc-row select.smc-wide{flex:1;width:auto;min-width:0}
.smc-lab{font-size:12px;opacity:.75}
.smc-tabs .smc-reset{margin-left:auto}
.smc-btns button.smc-sub.on,.smc-row button.smc-sub.on{background:var(--pn);border-color:var(--ac);color:var(--ac)}
.smc-dim.smc-add{color:#fff;background:var(--ac);border-color:var(--ac);border-radius:50%;width:22px;height:22px;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.smc-dim.smc-add:hover{transform:translate(-50%,-50%) scale(1.15);background:var(--dm)}
.smc-viewbtns{position:absolute;top:10px;right:10px;z-index:3;display:flex;gap:6px}
.smc-viewbtn{padding:6px 12px;border:1px solid var(--ac);border-radius:6px;background:var(--bg);color:var(--ac);font:inherit;font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.smc-viewbtn:hover,.smc-viewbtn.on{background:var(--ac);color:#fff}
.smc-dim.smc-note,.smc-dim.smc-note:hover{color:var(--fg);border-color:var(--ln);background:var(--bg);cursor:default;font-weight:500}
.smc-dim.smc-tag,.smc-dim.smc-tag:hover{background:#334155;color:#fff;border-color:#334155;border-radius:10px;font-size:11px;padding:1px 7px;cursor:default;opacity:.85}
.smc-dim.smc-flip{margin-left:46px;background:var(--bg);color:#c2410c;border-color:#c2410c;border-radius:10px;font-size:11px;padding:1px 7px;cursor:pointer}
.smc-dim.smc-flip:hover{background:#c2410c;color:#fff}
.smc label.smc-chk{justify-content:flex-start;gap:6px;font-size:13px}
.smc label.smc-chk input{width:auto;margin:0}
.smc-dim.smc-cogm,.smc-dim.smc-cogm:hover{width:22px;height:22px;padding:0;border:1px solid #111;border-radius:50%;background:conic-gradient(#fff 0 90deg,#111 0 180deg,#fff 0 270deg,#111 0);cursor:default;box-shadow:none}
.smc-dim.smc-cg{transform:translate(-50%,16px)}
.smc-symbox{position:absolute;display:none;z-index:4;padding:5px 9px;border:1px solid var(--ac);border-radius:6px;background:var(--bg);box-shadow:0 2px 8px rgba(0,0,0,.2);font-size:12px;white-space:nowrap}
.smc-symbox.show{display:block}
.smc-symbox label{display:flex;align-items:center;gap:6px;margin:0;cursor:pointer}
.smc-symbox input{width:auto;margin:0}
.smc-note2{font-size:11px;opacity:.7;margin:2px 0 4px}
.smc-tools{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid var(--ln);border-radius:8px;background:var(--bg);box-shadow:0 2px 8px rgba(0,0,0,.15);max-width:calc(100% - 20px);flex-wrap:wrap;justify-content:center}
.smc-tools select{width:auto;max-width:150px}
.smc-tools button{padding:5px 9px;font-size:13px}
.smc-tools button.on{background:#c2410c;border-color:#c2410c;color:#fff}
.smc-sep{width:1px;align-self:stretch;background:var(--ln);margin:0 2px}
.smc-dim.smc-del{color:#fff;background:#b91c1c;border-color:#b91c1c;border-radius:50%;width:22px;height:22px;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.smc-dim.smc-del:hover{transform:translate(-50%,-50%) scale(1.15)}
.smc-dim.smc-pick{width:18px;height:18px;padding:0;border-radius:50%;border:3px solid #f59e0b;background:rgba(245,158,11,.35);cursor:pointer;animation:smcPulse 1.2s ease-in-out infinite}
.smc-dim.smc-pick:hover{background:#f59e0b}
@keyframes smcPulse{0%,100%{box-shadow:0 0 0 0 rgba(245,158,11,.6)}50%{box-shadow:0 0 0 7px rgba(245,158,11,0)}}
.smc-dim.smc-cr{color:#b45309;border-color:#b45309}
.smc-dim.smc-cr:hover{background:#b45309;color:#fff}
.smc-crc .smc-hh b{color:#b45309}
.smc-crc .smc-hh select{width:110px}
@media (max-width:720px){.smc-hint{right:8px;top:auto;bottom:64px}}
.smc-dim.smc-axis,.smc-dim.smc-axis:hover{background:transparent;border:0;padding:0;color:#d32f2f;font-weight:700;font-size:13px;cursor:default}
.smc-dim.smc-axisp,.smc-dim.smc-axisp:hover{font-size:10px;font-weight:600;opacity:.85}
.smc-dim.smc-axiso,.smc-dim.smc-axiso:hover{font-size:11px;transform:translate(-105%,4px)}
.smc-dirbtns{position:absolute;top:46px;right:10px;z-index:3;display:flex;gap:4px}
.smc-dirbtns button{padding:4px 9px;border:1px solid var(--ln);border-radius:6px;background:var(--bg);color:var(--fg);font:inherit;font-size:12px;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.smc-dirbtns button:hover{border-color:var(--ac);color:var(--ac)}
