.jam{position:relative;background:#333;color:#ddd;font:13px tahoma,arial,sans-serif;padding:10px;-webkit-user-select:none;user-select:none;overflow:hidden;}
.jam *{box-sizing:border-box;}
.jam button{font:inherit;color:#ddd;background:#4a4a4a;border:1px solid #5a5a5a;border-radius:4px;padding:4px 9px;cursor:pointer;line-height:1.2;}
.jam button:hover{background:#565656;}
.jam button.on{background:#ddd;color:#222;border-color:#ddd;}
.jam-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:8px;}
.jam-lbl{color:#999;margin-right:4px;}
.jam-num{display:inline-flex;align-items:center;gap:3px;}
.jam-num b{min-width:2.2em;text-align:center;color:#fff;}
.jam-num button{padding:3px 8px;}
.jam-play{width:44px;height:44px;padding:0 !important;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.jam-play svg{display:block;fill:#ddd;}
.jam-play.on{background:#e8653f !important;border-color:#e8653f !important;}
.jam-play.on svg{fill:#fff;}
.jam-instrs{display:inline-flex;flex-wrap:wrap;gap:5px;}
.jam-status{margin-left:auto;width:18px;height:18px;flex:none;border:2px solid #555;border-top-color:#e8653f;border-radius:50%;visibility:hidden;}
.jam-status.busy{visibility:visible;animation:jam-spin .8s linear infinite;}
@keyframes jam-spin{to{transform:rotate(360deg);}}
.jam-instr{border-left:4px solid var(--ic) !important;}
.jam-instr.on{background:var(--ic) !important;border-color:var(--ic) !important;color:#222 !important;}
.jam-gridbox{width:100%;}
.jam-grid{display:block;touch-action:pan-y;cursor:crosshair;}
.jam-info{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:baseline;margin:8px 0 12px;}
.jam-activity{color:#ccc;text-decoration:none;cursor:pointer;}
.jam-activity:hover .jam-more{text-decoration:underline;}
.jam-more{color:#999;margin-left:8px;border-bottom:1px dotted #777;}
.jam-online{margin-left:auto;color:#999;}
.jam-who{margin-left:6px;font-weight:bold;}
.jam-who.guest{color:#999;font-weight:normal;}
.jam-dtools{margin-bottom:6px;}
.jam-icon{width:36px;height:30px;display:inline-flex;align-items:center;justify-content:center;padding:0 !important;}
.jam-icon svg{display:block;fill:#ddd;}
.jam-icon.on{background:#666 !important;border-color:#999 !important;}
.jam-doodle-wrap{background:#444;overflow:hidden;}
.jam-doodle{display:block;width:100%;aspect-ratio:6/1;height:auto;cursor:crosshair;}
.jam-cursors{position:absolute;left:0;top:0;width:0;height:0;pointer-events:none;z-index:5;}
.jam-cur{position:absolute;left:0;top:0;will-change:transform;transition:opacity .4s;}
.jam-cur svg{display:block;fill:var(--pc);stroke:#111;stroke-width:1.2;filter:drop-shadow(0 1px 1px rgba(0,0,0,.6));}
.jam-cur.down svg{transform:scale(.85);transform-origin:0 0;}
.jam-cur.down::before{content:"";position:absolute;left:-7px;top:-7px;width:14px;height:14px;border-radius:50%;border:2px solid var(--pc);opacity:.8;}
.jam-cur.idle{opacity:.45;}
.jam-cur-name{position:absolute;left:14px;top:16px;white-space:nowrap;background:var(--pc);color:#111;font-size:11px;font-weight:bold;padding:1px 5px;border-radius:3px;}
.jam-cur-tool{font-style:normal;font-weight:normal;margin-left:5px;padding:0 4px;border-radius:2px;background:rgba(0,0,0,.25);color:#111;}
.jam-cur-tool.none,.jam-cur-tool:empty{display:none;}
.jam-toast{position:absolute;left:50%;top:10px;transform:translate(-50%,-150%);visibility:hidden;transition:transform .25s,visibility .25s;background:#fbf7aa;color:#6b4a2b;padding:8px 12px;border-radius:5px;box-shadow:0 3px 10px rgba(0,0,0,.5);z-index:10;display:flex;gap:10px;align-items:center;max-width:calc(100% - 20px);}
.jam-toast.show{transform:translate(-50%,0);visibility:visible;}
.jam-toast button{background:#e8653f;border-color:#e8653f;color:#fff;font-weight:bold;white-space:nowrap;}
.jam-modal{position:absolute;inset:0;background:rgba(0,0,0,.55);z-index:20;display:flex;align-items:flex-start;justify-content:center;padding:30px 10px;}
.jam-modal[hidden]{display:none;}
.jam-modal-box{position:relative;background:#3a3a3a;border-radius:6px;padding:14px 18px;width:100%;max-width:460px;max-height:100%;overflow:auto;box-shadow:0 5px 20px rgba(0,0,0,.6);-webkit-user-select:text;user-select:text;}
.jam-modal-box h3{margin:0 0 10px;font-size:15px;color:#fff;}
.jam-close{position:absolute;right:8px;top:8px;padding:2px 9px !important;}
.jam-log-row{display:flex;gap:10px;padding:4px 0;border-bottom:1px solid #444;}
.jam-log-time{color:#999;min-width:9.5em;}
.jam-log-row span:last-child{margin-left:auto;color:#bbb;}
@media (max-width:600px){
	.jam{padding:8px;}
	.jam-online{margin-left:0;}
}