/* ========================================================================== GRIDROP · OVERTAKE — the tuning bench's dress (loads with tweak.js; every rule is gated on body.ot-tweak, which only the flagged bench sets). The opacity/transform knobs live here as CSS variables the bench writes on — the painter never has to know about them. ========================================================================== */ body.ot-tweak .board .pcard{opacity:var(--twCardOp,1)} /* .45 matches the baked felt.css value — the bench must not undo the bake */ body.ot-tweak .ofelt-slots{opacity:var(--twSlotOp,.45)} body.ot-tweak .ofelt-table{opacity:var(--twTableOp,1)} body.ot-tweak:not(.ot-lbhide) .ofelt-lb{opacity:var(--twRailOp,1)} body.ot-tweak .hand{opacity:var(--twHandOp,1)} /* the plate's transform lives in bigcards.css and already carries the bench vars COMPOSED with its -50% centring — repeating it here (without the centring) is exactly what stranded the plate off-screen once. Opacity only. */ body.ot-tweak .bcword{opacity:var(--twWordOp,1)} body.ot-tweak .ofelt-clock{opacity:var(--twClockOp,1);transform-origin:top left; transform:translate(var(--twClockX,0px),var(--twClockY,0px)) scale(var(--twClockS,1))} /* ---- the wrench chip (glass, standing style) ---------------------------- */ .twz-fab{position:fixed;left:8px;bottom:8px;z-index:600;width:38px;height:38px; display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer; color:#bfe6ec;border-radius:10px;border:1px solid rgba(255,255,255,.14); background:rgba(13,20,27,.72)} .twz-fab:active{transform:scale(.93)} /* ---- the panel — on the RIGHT, over the players rail, so the clock and the word plate in the LEFT column stay visible while their sliders move (the owner tuned the timer blind because the panel was standing on it) ---- */ .twz-pan{position:fixed;right:8px;top:8px;bottom:8px;z-index:601;width:min(310px,46vw); display:none;flex-direction:column;border-radius:12px;overflow:hidden; border:1px solid rgba(255,255,255,.12);background:rgba(9,15,20,.94); font-family:Cairo,Inter,sans-serif;color:#eaf4f5} .twz-pan.on{display:flex} .twz-hd{flex:none;display:flex;align-items:center;gap:6px;padding:8px 10px; border-bottom:1px solid rgba(255,255,255,.1);background:rgba(13,20,27,.8)} .twz-hd b{flex:1;font-size:14px} .twz-b{flex:none;padding:5px 9px;border-radius:7px;cursor:pointer;font:700 11px Cairo,sans-serif; color:#bfe6ec;border:1px solid rgba(120,214,226,.4);background:rgba(6,16,21,.7)} .twz-x{width:26px;padding:2px 0;font-size:15px;line-height:1} .twz-body{flex:1;min-height:0;overflow-y:auto;padding:6px 10px 10px} .twz-gt{font:800 12px Cairo,sans-serif;color:#45eded;margin:12px 0 4px;letter-spacing:.3px} .twz-grp:first-child .twz-gt{margin-top:2px} .twz-row{display:grid;grid-template-columns:1fr 44px;grid-template-areas:"lb val" "rng rng"; align-items:center;column-gap:6px;padding:3px 0} .twz-lb{grid-area:lb;font-size:11.5px;color:#c9dde3} .twz-val{grid-area:val;font:700 11px "JetBrains Mono",monospace;color:#45eded;text-align:left; direction:ltr;font-variant-numeric:tabular-nums} .twz-row input[type=range]{grid-area:rng;width:100%;margin:2px 0 0;accent-color:#45eded} .twz-out{flex:none;display:none;height:110px;margin:0;padding:8px;border:0;resize:none; border-top:1px solid rgba(255,255,255,.1);background:#060c10;color:#9fd6de; font:11px "JetBrains Mono",monospace} /* ---- MOVE MODE (v3: a PICKER — only the chosen element moves) ------------ */ .twz-move.twz-on{background:rgba(69,237,237,.28);color:#eafcff;border-color:#45eded} body.ot-move{cursor:move} /* only the CHOSEN element wears the dashed ring — the rest are locked */ body[data-move="clock"] .ofelt-clock, body[data-move="word"] .bcword{ outline:2px dashed rgba(69,237,237,.85);outline-offset:3px} body[data-move="hand"] .hand{outline:2px dashed rgba(69,237,237,.6);outline-offset:6px} body[data-move="table"] .ofelt-slots{ outline:2px dashed rgba(69,237,237,.45);outline-offset:14px} .twz-hint{position:fixed;left:50%;bottom:8px;transform:translateX(-50%);z-index:602; display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px; border:1px solid rgba(120,214,226,.4);background:rgba(9,15,20,.94); font:700 12px Cairo,sans-serif;color:#bfe6ec;white-space:nowrap} .twz-hint b{font-size:11px;color:#9fd6de} .twz-hint .twz-tg{padding:5px 10px;border-radius:999px;cursor:pointer; font:700 11px Cairo,sans-serif;color:#bfe6ec; border:1px solid rgba(120,214,226,.4);background:rgba(6,16,21,.7)} .twz-hint .twz-tg.twz-on{background:#45eded;color:#082026;border-color:#45eded} .twz-hint .twz-end{padding:5px 10px;border-radius:999px;cursor:pointer; font:700 11px Cairo,sans-serif;color:#082026;border:0;background:#f0c04f}