:root{--bg:#0c1512;--panel:#13201b;--panel2:#182720;--side:#111d18;--line:rgba(236,242,234,.76);--text:#eef3ed;--muted:#a5aea8;--green:#72ee8f;--shadow:0 28px 90px rgba(0,0,0,.42);--home-color:#ff5d6c;--away-color:#60b8ff;--neutral-color:#dfff66;--pitch-color:#101d32;--line-color:#d7ddd7;--draw-color:#dfff66;--side-color:#111d18;--panel-color:#13201b}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#0b1511;color:var(--text);font-family:"Segoe UI","Noto Kufi Arabic","Cairo",Tahoma,Arial,sans-serif;letter-spacing:.01em}body::before{content:"";position:fixed;inset:0;z-index:-1;background-image:radial-gradient(rgba(220,235,220,.13) 1.2px,transparent 1.2px);background-size:28px 28px;background-color:#0d1a15}button,input,select{font:inherit}button{border:0;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}.hidden-input{display:none}.primary-button,.ghost-button,.ghost-link,.board-controls button{height:40px;padding:0 14px;border-radius:4px;font-weight:800;letter-spacing:.03em}.primary-button{background:#e6e8e3;color:#18201b}.ghost-button,.ghost-link,.board-controls button{display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05)}.toast{position:fixed;left:22px;bottom:22px;z-index:30;min-width:220px;padding:12px 14px;border:1px solid rgba(255,255,255,.18);border-radius:6px;background:#101a16;font-weight:800;box-shadow:var(--shadow);opacity:0;transform:translateY(12px);transition:.18s}.toast.show{opacity:1;transform:translateY(0)}
.home-shell{width:min(1560px,calc(100vw - 38px));margin:46px auto}.home-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:126px}.brand-script{font-size:34px;font-weight:900;font-style:italic}.home-nav nav{display:flex;gap:92px;color:#ecf0ec;font-weight:900;letter-spacing:.13em}.launch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}.launch-card{display:grid;justify-items:center;min-height:510px;padding:40px 34px 32px;border:1px solid rgba(255,255,255,.06);border-bottom:4px solid rgba(255,255,255,.75);border-radius:8px;background:var(--panel);box-shadow:var(--shadow);text-align:center}.launch-card span{font-size:36px;font-weight:900;letter-spacing:.13em}.launch-card p{max-width:560px;margin:24px 0 22px;color:var(--muted);font-size:21px;line-height:1.45}.launch-card b{display:grid;place-items:center;width:176px;height:54px;margin-top:auto;border-radius:4px;background:#e5e7e3;color:#1b2520;font-size:22px;letter-spacing:.12em}.line-art{width:min(470px,88%);height:210px;margin-top:12px;border:4px solid #d8ded8;position:relative}.pitch-art::before{content:"";position:absolute;top:0;bottom:0;left:50%;border-left:4px solid #d8ded8}.pitch-art::after{content:"";position:absolute;width:86px;height:86px;border:4px solid #d8ded8;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.media-art{display:grid;place-items:center}.media-art::before{content:"أ¢â€“آ¶";display:grid;place-items:center;width:96px;height:96px;border:4px solid #d8ded8;border-radius:50%;font-size:46px}
.color-control{display:grid;gap:8px;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:6px;background:rgba(255,255,255,.04)}.color-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.color-head span{color:var(--muted);font-size:12px;font-weight:900}.color-head input[type=color]{width:34px;height:30px;padding:0;border:0;background:transparent}.hex-row{display:flex;gap:6px}.hex-row input{width:100%;height:32px;border:1px solid rgba(255,255,255,.16);border-radius:4px;padding:0 8px;background:#0c1411;color:var(--text);direction:ltr;text-transform:uppercase}.hex-row button{height:32px;border-radius:4px;background:#e5e7e3;color:#1b2520;font-weight:800}.preset-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:5px}.preset-dot{height:18px;border:1px solid rgba(255,255,255,.35);border-radius:50%}
.compact-header{height:66px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.14);background:#222}.brand-link{display:flex;align-items:center;gap:10px}.brand-link b{display:grid;place-items:center;width:42px;height:42px;border-radius:4px;background:#e6e8e3;color:#151d18}.brand-link span{color:#c7cec8;font-weight:800}.top-actions{display:flex;align-items:center;gap:8px}.board-shell,.media-shell{width:min(1900px,calc(100vw - 12px));height:calc(100vh - 12px);margin:6px auto;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#d9d9d9;box-shadow:var(--shadow)}.board-workspace{direction:ltr;display:grid;grid-template-columns:68px minmax(0,1fr) 330px;height:calc(100% - 66px)}.simple-tools{direction:rtl;display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 8px;border-right:1px solid rgba(0,0,0,.08);background:#f7f7f4}.simple-tools hr{width:42px;border:0;border-top:1px solid #d7d7d2;margin:4px 0}.tool-button,.swatch{display:grid;place-items:center;width:44px;height:40px;border:1px solid #d4d4ce;border-radius:4px;background:white;color:#141a16;font-size:18px}.tool-button.active{background:#333;color:white}.swatch{height:28px}.swatch.home{background:var(--home-color)}.swatch.away{background:var(--away-color)}.swatch.neutral{background:var(--neutral-color)}.swatch.active{outline:3px solid rgba(0,0,0,.18)}.board-main{direction:rtl;min-width:0;padding:14px}.board-controls{display:flex;align-items:center;gap:8px;margin-bottom:12px;overflow:auto}.pitch-wrap{display:grid;place-items:center;height:calc(100% - 52px)}.pitch{position:relative;width:min(100%,1120px);aspect-ratio:1000/750;overflow:hidden;border:18px solid var(--pitch-color);background:var(--pitch-color);box-shadow:0 18px 45px rgba(0,0,0,.23);user-select:none}.drawing-layer,.pitch-lines,.tokens{position:absolute;inset:0}.drawing-layer{z-index:4;pointer-events:none}.drawing-layer.active{pointer-events:auto}.pitch-lines{z-index:1;pointer-events:none;color:var(--line-color)}.pitch-lines span{position:absolute;border-color:currentColor}.half-line{top:0;bottom:0;left:50%;width:1px;background:currentColor}.center-circle{top:50%;left:50%;width:18%;aspect-ratio:1;border:2px solid;border-radius:50%;transform:translate(-50%,-50%)}.box{top:25%;width:16%;height:50%;border:2px solid}.left-box{left:-1px}.right-box{right:-1px}.six{top:36%;width:6.5%;height:28%;border:2px solid}.left-six{left:-1px}.right-six{right:-1px}.spot{top:50%;width:7px;height:7px;border-radius:50%;background:currentColor;transform:translateY(-50%)}.left-spot{left:10.5%}.right-spot{right:10.5%}.tokens{z-index:5}.token{position:absolute;left:var(--x);top:var(--y);display:grid;place-items:center;width:var(--size);height:var(--size);border:2px solid rgba(255,255,255,.84);border-radius:50%;background:var(--token-color);color:#fff;font-size:calc(var(--size)*.41);font-weight:900;transform:translate(-50%,-50%);box-shadow:0 8px 18px rgba(0,0,0,.28);touch-action:none}.token.ball{background:#f8f8f2;color:#111}.token.note{width:auto;min-width:92px;max-width:190px;height:auto;min-height:42px;padding:8px 10px;border-radius:4px;background:rgba(0,0,0,.68);color:#f7f3dd;font-size:13px}.token.selected{outline:4px solid rgba(223,255,102,.45)}.right-tabs{direction:rtl;display:flex;flex-direction:column;border-left:1px solid rgba(0,0,0,.08);background:var(--side-color);color:var(--text)}.tab-switch{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:8px}.tab-switch button{height:38px;border-radius:4px;background:rgba(255,255,255,.06);font-weight:900}.tab-switch button.active{background:#e5e7e3;color:#1b2520}.side-pane{display:none;gap:12px;padding:12px;overflow:auto}.side-pane.active{display:grid}.side-pane label{display:grid;gap:6px;color:var(--muted);font-size:12px;font-weight:900}.side-pane select{height:40px;border:1px solid rgba(255,255,255,.16);border-radius:4px;background:#0c1411;color:var(--text);padding:0 10px}.side-pane p{margin:0;color:var(--muted);line-height:1.6}.strip-head{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-weight:900}.strip-head button{width:34px;height:34px;border-radius:4px;background:#e5e7e3;color:#1b2520;font-weight:900}.scene-list{display:grid;gap:8px;overflow:auto}.scene-card{display:grid;gap:4px;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:4px;background:rgba(255,255,255,.05);text-align:right}.scene-card span{color:var(--muted);font-size:11px}
.media-page-only{display:grid;grid-template-columns:260px minmax(0,1fr) 340px;gap:14px;height:calc(100% - 66px);padding:14px;background:#0d1a15}.collection-panel,.preview-panel{border:1px solid rgba(255,255,255,.1);border-radius:8px;background:var(--side-color);padding:12px}.collection-panel{display:grid;align-content:start;gap:8px}.search-input{width:100%;height:38px;border:1px solid rgba(255,255,255,.15);border-radius:4px;padding:0 10px;background:#0c1411;color:var(--text)}.collection{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 12px;border-radius:4px;background:transparent;color:var(--muted);font-weight:900}.collection.active{background:#e5e7e3;color:#1b2520}.collection span{color:var(--green)}.side-color-block{display:grid;gap:8px;margin-top:10px}.media-grid{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:14px;align-content:start;overflow:auto}.media-card{border:1px solid rgba(255,255,255,.1);border-bottom:3px solid rgba(255,255,255,.55);border-radius:8px;background:var(--panel-color);overflow:hidden;padding:10px}.media-card.active{border-color:rgba(229,231,227,.8)}.card-art,.preview-art{border-radius:5px;background:linear-gradient(135deg,rgba(255,255,255,.18),transparent 35%),var(--art-bg)}.card-art{aspect-ratio:16/10;margin-bottom:10px}.media-card h3,.preview-panel h3{margin:0;font-size:15px}.media-card p{margin:6px 0 0;color:var(--muted);font-size:12px}.media-tag{display:inline-flex;align-items:center;min-height:22px;margin-top:8px;padding:0 8px;border-radius:99px;background:rgba(114,238,143,.13);color:var(--green);font-size:11px;font-weight:900}.preview-panel{display:grid;align-content:start;gap:12px}.preview-art{aspect-ratio:16/11}.preview-panel dl{display:grid;gap:10px;margin:0}.preview-panel dl div{display:flex;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}.preview-panel dt{color:var(--muted)}.preview-panel dd{margin:0;font-weight:900}@media(max-width:1120px){.launch-grid,.settings-grid,.board-workspace,.media-page-only{grid-template-columns:1fr}.home-nav{margin-bottom:40px}.simple-tools{flex-direction:row;overflow:auto}.right-tabs{min-height:360px}.media-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.home-nav,.top-actions,.board-controls{flex-wrap:wrap}.launch-card span{font-size:26px}.settings-grid,.media-grid{grid-template-columns:1fr}}

/* Board right-side workflow panels */
.five-tabs{grid-template-columns:repeat(5,1fr)}
.five-tabs button{font-size:11px;padding:0 4px}
.roster-panel,.tool-options,.position-panel{display:grid;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.11);border-radius:5px;background:rgba(255,255,255,.04)}
.roster-head{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-weight:900;font-size:12px}
.roster-head button,.position-panel button{height:32px;border-radius:4px;background:#e5e7e3;color:#1b2520;font-weight:900}
.roster-list{display:grid;gap:7px;max-height:390px;overflow:auto;padding-left:2px}
.roster-row{display:grid;grid-template-columns:44px 1fr 34px;gap:6px;align-items:center}
.roster-row input{min-width:0;height:32px;border:1px solid rgba(255,255,255,.16);border-radius:4px;background:#0c1411;color:var(--text);padding:0 7px}
.roster-row input[type=color]{padding:0;width:34px}
.tool-options h3{margin:0;color:#e9eee8;font-size:13px;letter-spacing:.04em;text-transform:uppercase}
.position-panel p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}
.position-panel label{display:grid;gap:6px;color:var(--muted);font-size:12px;font-weight:900}
.position-panel input[type=number],.position-panel input[type=range]{width:100%}
.position-panel input[type=number]{height:34px;border:1px solid rgba(255,255,255,.16);border-radius:4px;background:#0c1411;color:var(--text);padding:0 8px}
.position-panel #deleteSelected{background:rgba(255,95,95,.18);color:#ffb7b7;border:1px solid rgba(255,95,95,.32)}
.token .token-number{display:grid;place-items:center;line-height:1}
.token .token-name{position:absolute;top:calc(100% + 4px);left:50%;transform:translateX(-50%);max-width:96px;padding:2px 5px;border-radius:3px;background:rgba(0,0,0,.62);color:#fff;font-size:10px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.drawing-layer text{font-family:"Segoe UI","Noto Kufi Arabic",Tahoma,Arial,sans-serif;font-weight:600;letter-spacing:0;paint-order:normal!important;stroke:none!important;stroke-width:0!important;text-shadow:none!important;filter:none}
.drawing-layer [data-drawing]{pointer-events:all}
.drawing-layer [data-layer-selected="1"]{filter:drop-shadow(0 0 6px rgba(255,248,74,.92))}
.drawing-layer [data-drawing="text"][data-layer-selected="1"]{filter:none}
.drawing-layer .arrow-curve-handle{fill:#d9dee7;stroke:#1b59d1;stroke-width:4px;cursor:grab;pointer-events:all;filter:drop-shadow(0 4px 8px rgba(0,0,0,.35))}
.drawing-layer .arrow-curve-handle:active{cursor:grabbing}
.drawing-layer rect[data-drawing="rectangle"]{pointer-events:all}
.drawing-layer rect[data-layer-selected="1"]{filter:drop-shadow(0 0 6px rgba(255,248,74,.92))}
.layer-controls{display:grid;gap:8px;margin-top:12px;padding:10px;border:1px solid #dfdfda;border-radius:7px;background:#fbfbfa;color:#222}
.layer-controls h3{margin:0;font-size:13px}
.layer-controls p{margin:0;color:#777;font-size:11px;font-weight:800}
.layer-controls div{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.layer-controls button{height:34px;border:1px solid #d8d8d2;border-radius:6px;background:#fff;color:#222;font-weight:900}
.layer-controls button:disabled{opacity:.42;cursor:not-allowed}
@media(max-width:1120px){.five-tabs{grid-template-columns:repeat(5,minmax(72px,1fr));overflow:auto}.roster-list{max-height:260px}}

/* Tacticalista-like compact side dock */
.compact-workspace{grid-template-columns:68px minmax(0,1fr) auto}
.side-dock{direction:rtl;display:grid;grid-template-columns:52px 300px;border-left:1px solid rgba(0,0,0,.08);background:#f7f7f4;color:#151a16;transition:grid-template-columns .18s ease}
.side-dock.collapsed{grid-template-columns:52px 0}
.icon-rail{display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 6px;border-left:1px solid #d7d7d2;background:#fff}
.icon-rail button{display:grid;place-items:center;width:38px;height:38px;border:1px solid #d6d6d0;border-radius:4px;background:#fff;color:#111;font-size:18px;font-weight:900}
.icon-rail button.active{background:#333;color:#fff}
.icon-rail [data-side-close]{margin-top:auto;background:#f1f1ed;color:#333}
.side-drawer{min-width:0;overflow:hidden;background:#fff;border-left:1px solid #deded8;transition:width .18s ease,opacity .18s ease}
.side-dock.collapsed .side-drawer{opacity:0;pointer-events:none}
.side-drawer .side-pane{display:none;height:100%;gap:12px;padding:10px 12px;overflow:auto;color:#1a1f1b}
.side-drawer .side-pane.active{display:grid;align-content:start}
.drawer-title{display:grid;gap:3px;padding-bottom:8px;border-bottom:1px solid #e4e4df}
.drawer-title span{color:#777;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.drawer-title b{font-size:17px}
.side-drawer .side-pane label{color:#555}
.side-drawer .side-pane select,.side-drawer .roster-row input,.side-drawer .position-panel input[type=number],.side-drawer .hex-row input{background:#fff;color:#1a1f1b;border-color:#d8d8d2}
.side-drawer .color-control,.side-drawer .roster-panel,.side-drawer .tool-options,.side-drawer .position-panel{background:#fafafa;border-color:#e2e2dd;color:#1a1f1b}
.side-drawer .color-head span,.side-drawer .roster-head,.side-drawer .position-panel p,.side-drawer .position-panel label{color:#555}
.side-drawer .hex-row button,.side-drawer .roster-head button,.side-drawer .position-panel button,.side-drawer .strip-head button{background:#333;color:#fff}
.side-drawer .preset-grid{grid-template-columns:repeat(6,1fr)}
.side-drawer .preset-dot{height:20px}
.side-drawer .scene-card{background:#fafafa;border-color:#e0e0da;color:#1a1f1b}
.side-drawer .scene-card span{color:#777}
@media(max-width:1120px){.compact-workspace{grid-template-columns:1fr}.side-dock{grid-template-columns:52px minmax(0,1fr);min-height:430px}.side-dock.collapsed{grid-template-columns:52px 0}.icon-rail{flex-direction:row;overflow:auto}.icon-rail [data-side-close]{margin-top:0;margin-right:auto}}
/* Premium reset override - OmniBoard Board */
:root{--premium-bg:#0a0f12;--premium-shell:#0f151a;--premium-panel:#151d22;--premium-panel-2:#1d272d;--premium-ink:#eef3ef;--premium-muted:#8e9b94;--premium-line:rgba(238,243,239,.12);--pitch-color:#10233b;--line-color:#d9e0dc;--home-color:#3c82ff;--away-color:#fff35a;--neutral-color:#c9c44b;--side-color:#12191e;--panel-color:#151d22}
body.board-body{background:var(--premium-bg);color:var(--premium-ink);font-family:"Segoe UI","Noto Kufi Arabic",Tahoma,Arial,sans-serif;overflow:hidden}body.board-body::before{display:none}.board-shell{width:100vw;height:100vh;margin:0;border:0;border-radius:0;background:var(--premium-bg);box-shadow:none}.compact-header{height:58px;padding:0 18px;background:#0b0f12;border-bottom:1px solid var(--premium-line)}.brand-link b{width:38px;height:38px;border-radius:8px;background:#ecf2ed;color:#0b1114}.brand-link span{color:var(--premium-muted)}.top-actions .ghost-link,.top-actions .ghost-button,.top-actions .primary-button{height:36px;border-radius:7px;border:1px solid var(--premium-line);background:#131a1f;color:var(--premium-ink);font-size:14px}.top-actions .primary-button{background:#e8eee9;color:#0b1114}.compact-workspace{height:calc(100vh - 58px);grid-template-columns:64px minmax(0,1fr) auto;background:#0b1013}.simple-tools{background:#0e1418;border-right:1px solid var(--premium-line);gap:10px;padding:12px 8px}.simple-tools hr{border-top-color:var(--premium-line);width:36px}.tool-button,.swatch{width:42px;height:42px;border-radius:9px;border:1px solid var(--premium-line);background:#151d22;color:#dfe7e2;box-shadow:none}.tool-button.active{background:#e8eee9;color:#11181c}.swatch{height:30px}.swatch.active{outline:2px solid rgba(232,238,233,.42)}.board-main{padding:0;background:radial-gradient(circle at 50% 38%,rgba(64,130,255,.08),transparent 32%),#0b1013}.board-controls{height:54px;margin:0;padding:8px 18px;justify-content:center;background:rgba(15,21,26,.74);border-bottom:1px solid var(--premium-line);backdrop-filter:blur(10px)}.board-controls button{height:36px;border-radius:7px;border:1px solid var(--premium-line);background:#141c21;color:#dce5df;font-size:13px}.board-controls button:hover{background:#1d272d}.pitch-wrap{height:calc(100% - 54px);padding:28px;align-items:center}.pitch{width:min(86vw,1180px);max-height:calc(100vh - 150px);aspect-ratio:1000/650;border:12px solid #0d1829;border-radius:4px;background:linear-gradient(135deg,color-mix(in srgb,var(--pitch-color) 82%,#000),var(--pitch-color));box-shadow:0 28px 90px rgba(0,0,0,.42),inset 0 0 0 1px rgba(255,255,255,.04)}.pitch-lines{color:var(--line-color);opacity:.9}.token{box-shadow:0 10px 24px rgba(0,0,0,.32);border-color:rgba(255,255,255,.9)}.token .token-name{background:rgba(8,12,15,.76);font-weight:700}.side-dock{grid-template-columns:54px 320px;background:#0e1418;border-left:1px solid var(--premium-line);color:var(--premium-ink)}.side-dock.collapsed{grid-template-columns:54px 0}.icon-rail{background:#0e1418;border-left:1px solid var(--premium-line);gap:9px;padding:12px 7px}.icon-rail button{width:40px;height:40px;border-radius:9px;border:1px solid var(--premium-line);background:#151d22;color:#dfe7e2}.icon-rail button.active{background:#e8eee9;color:#11181c}.icon-rail [data-side-close]{background:#151d22;color:#dfe7e2}.side-drawer{background:var(--side-color);border-left:1px solid var(--premium-line);box-shadow:-20px 0 70px rgba(0,0,0,.24)}.side-drawer .side-pane{padding:16px;color:var(--premium-ink)}.drawer-title{border-bottom:1px solid var(--premium-line);padding-bottom:12px}.drawer-title span{color:var(--premium-muted)}.drawer-title b{font-size:20px;color:var(--premium-ink)}.side-drawer .side-pane label{color:var(--premium-muted)}.side-drawer .side-pane select,.side-drawer .roster-row input,.side-drawer .position-panel input[type=number],.side-drawer .hex-row input{height:36px;border:1px solid var(--premium-line);border-radius:7px;background:#0d1317;color:var(--premium-ink)}.side-drawer .color-control,.side-drawer .roster-panel,.side-drawer .tool-options,.side-drawer .position-panel{border:1px solid var(--premium-line);border-radius:9px;background:#141c21;color:var(--premium-ink);box-shadow:none}.side-drawer .color-head span,.side-drawer .roster-head,.side-drawer .position-panel p,.side-drawer .position-panel label{color:var(--premium-muted)}.side-drawer .hex-row button,.side-drawer .roster-head button,.side-drawer .position-panel button,.side-drawer .strip-head button{border-radius:7px;background:#e8eee9;color:#11181c}.preset-grid{gap:7px}.side-drawer .preset-grid{grid-template-columns:repeat(8,1fr)}.preset-dot{height:22px;border-radius:999px;border:1px solid rgba(255,255,255,.18)}.roster-row{grid-template-columns:42px 1fr 32px}.roster-list{max-height:330px}.scene-card{border-radius:8px}.side-drawer .scene-card{background:#141c21;border-color:var(--premium-line);color:var(--premium-ink)}.toast{background:#141c21;border-color:var(--premium-line);color:var(--premium-ink)}

/* Project font + host shirt icon */
@font-face{font-family:"OmniBoard Alyamama";src:url("alfont_com_Alyamama-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"OmniBoard Wafeq";src:url("alfont_com_Wafeq-Medium.otf") format("opentype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"OmniBoard Thmanyah";src:url("الخطوط/Thmanyah-Font-Family/thmanyah typeface/thmanyahsans/woff2/thmanyahsans-Light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"OmniBoard Thmanyah";src:url("الخطوط/Thmanyah-Font-Family/thmanyah typeface/thmanyahsans/woff2/thmanyahsans-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"OmniBoard Thmanyah";src:url("الخطوط/Thmanyah-Font-Family/thmanyah typeface/thmanyahsans/woff2/thmanyahsans-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"OmniBoard Thmanyah";src:url("الخطوط/Thmanyah-Font-Family/thmanyah typeface/thmanyahsans/woff2/thmanyahsans-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"OmniBoard Thmanyah";src:url("الخطوط/Thmanyah-Font-Family/thmanyah typeface/thmanyahsans/woff2/thmanyahsans-Black.woff2") format("woff2");font-weight:900;font-style:normal;font-display:swap}
html,body,button,input,select,textarea{font-family:"OmniBoard Thmanyah","OmniBoard Wafeq","Segoe UI","Noto Kufi Arabic",Tahoma,Arial,sans-serif}
.shirt-icon{position:relative;display:grid;place-items:center;width:28px;height:26px;margin-top:3px;background:var(--home-color);color:#fff;font-size:13px;font-weight:900;line-height:1;border:2px solid rgba(255,255,255,.85);border-radius:5px 5px 7px 7px;text-transform:uppercase}
.shirt-icon::before,.shirt-icon::after{content:"";position:absolute;top:4px;width:9px;height:13px;background:var(--home-color);border:2px solid rgba(255,255,255,.85)}
.shirt-icon::before{right:-8px;border-left:0;border-radius:0 5px 5px 0;transform:rotate(-20deg)}
.shirt-icon::after{left:-8px;border-right:0;border-radius:5px 0 0 5px;transform:rotate(20deg)}
.icon-rail button.active .shirt-icon{color:#fff}

/* Clean host shirt SVG icon */
.shirt-svg{width:34px;height:34px;display:block;overflow:visible}
.shirt-svg .shirt-body{fill:var(--home-color);stroke:rgba(255,255,255,.92);stroke-width:3;stroke-linejoin:round}
.shirt-svg .shirt-trim{fill:rgba(255,255,255,.9)}
.shirt-svg text{fill:#fff;font-family:"Segoe UI",Arial,sans-serif;font-size:20px;font-weight:900;dominant-baseline:middle;paint-order:stroke;stroke:rgba(0,0,0,.28);stroke-width:2px}
.icon-rail button.active .shirt-svg .shirt-body{stroke:#11181c}

/* Tacticalista-inspired rail, shadcn-like behavior */
body.board-body .side-dock{grid-template-columns:64px 332px;background:#f8f8f5;border-left:1px solid #d8d8d4;color:#151515;box-shadow:-10px 0 28px rgba(0,0,0,.08)}
body.board-body .side-dock.collapsed{grid-template-columns:64px 0}
body.board-body .icon-rail{background:#fff;border-left:1px solid #d8d8d4;border-right:1px solid #efefeb;padding:10px 7px;gap:7px;box-shadow:-2px 0 8px rgba(0,0,0,.04)}
body.board-body .icon-rail button{position:relative;width:48px;height:48px;border:1px solid #deded9;border-radius:4px;background:#fff;color:#050505;font-size:22px;font-weight:900;box-shadow:0 1px 0 rgba(0,0,0,.04);transition:background .12s ease,color .12s ease,border-color .12s ease,transform .12s ease}
body.board-body .icon-rail button:hover{background:#f0f0ed;transform:translateX(-1px)}
body.board-body .icon-rail button.active{background:#333;color:#fff;border-color:#333}
body.board-body .icon-rail button.active::before{content:"";position:absolute;right:-8px;top:8px;bottom:8px;width:3px;border-radius:2px;background:#333}
body.board-body .icon-rail [data-side-close]{margin-top:auto;background:#fff;color:#111}
body.board-body .shirt-svg{width:38px;height:38px}
body.board-body .shirt-svg .shirt-body{fill:var(--home-color);stroke:#111;stroke-width:2.7;stroke-linejoin:round}
body.board-body .shirt-svg .shirt-trim{fill:#fff}
body.board-body .shirt-svg text{fill:#fff;font-size:20px;font-weight:900;stroke:rgba(0,0,0,.32);stroke-width:2px}
body.board-body .icon-rail button.active .shirt-svg .shirt-body{stroke:#fff}
.icon-glyph{display:grid;place-items:center;width:32px;height:32px;margin:auto}
.icon-glyph svg{width:32px;height:32px;display:block;stroke:currentColor;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.icon-glyph.solid svg{fill:currentColor;stroke:none}
body.board-body .side-drawer{background:#fff;border-left:1px solid #deded9;box-shadow:-14px 0 34px rgba(0,0,0,.10)}
body.board-body .side-drawer .side-pane{padding:12px 14px;color:#181818}
body.board-body .drawer-title{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px;padding:0 0 10px;margin-bottom:2px;border-bottom:1px solid #e3e3df}
body.board-body .drawer-title span{grid-column:1 / -1;color:#b6b6b0;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
body.board-body .drawer-title b{font-size:20px;color:#222;line-height:1.1}
body.board-body .side-drawer .side-pane label{font-size:12px;color:#666;font-weight:900}
body.board-body .side-drawer .side-pane select,body.board-body .side-drawer .roster-row input,body.board-body .side-drawer .position-panel input[type=number],body.board-body .side-drawer .hex-row input{background:#fff;color:#151515;border:1px solid #d6d6d1;border-radius:5px;height:34px}
body.board-body .side-drawer .color-control,body.board-body .side-drawer .roster-panel,body.board-body .side-drawer .tool-options,body.board-body .side-drawer .position-panel{background:#fbfbfa;border:1px solid #dfdfda;border-radius:6px;color:#151515}
body.board-body .side-drawer .color-head span,body.board-body .side-drawer .roster-head,body.board-body .side-drawer .position-panel p,body.board-body .side-drawer .position-panel label{color:#595955}
body.board-body .side-drawer .hex-row button,body.board-body .side-drawer .roster-head button,body.board-body .side-drawer .position-panel button,body.board-body .side-drawer .strip-head button{background:#333;color:#fff;border-radius:5px}
body.board-body .side-drawer .preset-grid{grid-template-columns:repeat(6,1fr);gap:8px}
body.board-body .side-drawer .preset-dot{height:24px;border-radius:999px;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
body.board-body .side-drawer .tool-options h3{color:#333;font-size:12px;text-align:left;direction:ltr;letter-spacing:.06em}
body.board-body .side-drawer .scene-card{background:#fbfbfa;border-color:#dfdfda;color:#151515}

/* Keep pitch visible when switching side tools */
body.board-body .board-main{min-width:0;display:grid;grid-template-rows:54px minmax(0,1fr)}
body.board-body .pitch-wrap{min-height:0;overflow:hidden}
body.board-body .side-dock{flex:0 0 auto}

/* Tacticalista-like color picker blocks */
body.board-body .side-drawer .color-control{padding:12px;border-radius:7px;background:#fff;border:1px solid #e4e4df;box-shadow:0 1px 2px rgba(0,0,0,.04)}
body.board-body .side-drawer .color-head{justify-content:space-between;margin-bottom:8px}
body.board-body .side-drawer .color-head span{order:2;color:#333;font-size:13px;font-weight:900}
body.board-body .side-drawer .color-head input[type=color]{order:1;width:36px;height:30px;border:1px solid #9f9f98;background:#fff;padding:0}
body.board-body .side-drawer .preset-grid{display:grid;grid-template-columns:repeat(6,28px);gap:8px;justify-content:center;margin:6px 0 10px}
body.board-body .side-drawer .preset-dot{width:28px;height:28px;border-radius:999px;border:2px solid transparent;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
body.board-body .side-drawer .preset-dot:hover{border-color:#2f6fec;transform:scale(1.05)}
body.board-body .side-drawer .hex-row{display:grid;grid-template-columns:84px 1fr;gap:8px;direction:ltr}
body.board-body .side-drawer .hex-row button{grid-column:1;grid-row:1;height:36px;border-radius:4px;background:#4c78f0;color:white;font-size:13px;font-weight:900}
body.board-body .side-drawer .hex-row input{grid-column:2;grid-row:1;height:36px;border-radius:4px;background:#fff;color:#60656b;border:1px solid #d7d7d2;font-size:14px;font-weight:800;text-transform:uppercase}
.formation-apply{height:36px;border:1px solid #333;border-radius:5px;background:#333;color:#fff;font-weight:900}
body.board-body .board-controls{gap:10px}

/* Clean board viewing controls */
body.board-body .compact-workspace{grid-template-columns:minmax(0,1fr) auto!important}
body.board-body .simple-tools{display:none!important}
body.board-body .board-controls{justify-content:center;gap:8px;overflow:visible}
body.board-body .board-controls .view-button{min-width:66px;background:#e8eee9;color:#11181c;border-color:#d7ded8}
body.board-body .board-controls .view-button.compact{min-width:38px;width:38px;padding:0;font-size:18px;line-height:1}
body.board-body .zoom-readout{display:inline-grid;place-items:center;min-width:58px;height:36px;border:1px solid var(--premium-line);border-radius:7px;background:#0f151a;color:#e8eee9;font-weight:900;direction:ltr}
body.board-body .control-separator{width:1px;height:28px;background:var(--premium-line);margin:0 2px}
body.board-body .pitch-wrap{overflow:hidden}
body.board-body .pitch{transform:scale(var(--board-zoom,1));transform-origin:center center;transition:transform .16s ease}
@media(max-width:720px){body.board-body .board-controls{justify-content:flex-start;overflow:auto}body.board-body .control-separator{display:none}}

/* Restore clean left tool rail */
body.board-body .compact-workspace{grid-template-columns:64px minmax(0,1fr) auto!important}
body.board-body .simple-tools.clean-tools{display:flex!important;background:#0e1418;border-right:1px solid var(--premium-line);gap:10px;padding:12px 8px}
body.board-body .simple-tools.clean-tools .tool-button{width:42px;height:42px;border-radius:9px;border:1px solid var(--premium-line);background:#151d22;color:#dfe7e2;font-size:18px}
body.board-body .simple-tools.clean-tools .tool-button.active{background:#e8eee9;color:#11181c}
body.board-body .simple-tools.clean-tools hr{width:34px;border:0;border-top:1px solid var(--premium-line);margin:2px 0}
@media(max-width:1120px){body.board-body .compact-workspace{grid-template-columns:1fr!important}body.board-body .simple-tools.clean-tools{flex-direction:row;overflow:auto;min-height:64px}}

/* Move compact tool rail to the right of the pitch */
body.board-body .compact-workspace{grid-template-columns:minmax(0,1fr) 64px auto!important}
body.board-body .simple-tools.clean-tools{border-right:0;border-left:1px solid var(--premium-line)}
@media(max-width:1120px){body.board-body .compact-workspace{grid-template-columns:1fr!important}}

/* Fit the whole tactical board with side tabs visible */
body.board-body .board-shell{overflow:hidden}
body.board-body .compact-workspace{grid-template-columns:minmax(0,1fr) 64px minmax(360px,396px)!important;overflow:hidden}
body.board-body .board-main{min-width:0;overflow:hidden;background:#dedede;grid-template-rows:54px minmax(0,1fr)}
body.board-body .board-controls{position:relative;z-index:2;flex:0 0 auto}
body.board-body .pitch-wrap{height:100%;min-height:0;padding:18px 24px 22px;display:grid;place-items:center;overflow:hidden;background:#dedede}
body.board-body .pitch{width:min(100%,calc((100vh - 156px) * 1.538));max-width:1180px;max-height:calc(100vh - 156px);aspect-ratio:1000/650;border-width:12px;transform:scale(var(--board-zoom,1));transform-origin:center center}
body.board-body .side-dock{min-width:0;max-width:396px;overflow:hidden}
body.board-body .side-drawer{min-width:0;overflow:hidden}
body.board-body .side-drawer .side-pane{height:calc(100vh - 58px);overflow:auto}
body.board-body .simple-tools.clean-tools{min-width:64px;overflow:hidden}
@media(max-width:1280px){body.board-body .compact-workspace{grid-template-columns:minmax(0,1fr) 56px minmax(320px,360px)!important}body.board-body .side-dock{grid-template-columns:56px minmax(0,304px)}body.board-body .simple-tools.clean-tools{min-width:56px;padding-inline:6px}body.board-body .pitch-wrap{padding:14px}}
@media(max-width:1120px){body.board-body .compact-workspace{grid-template-columns:1fr!important;grid-auto-rows:auto}body.board-body .pitch{width:min(100%,calc((100vh - 232px) * 1.538));max-height:calc(100vh - 232px)}}

/* Position adjustment controls */
.shape-panel{display:grid;gap:14px;padding:12px;border:1px solid #dfdfda;border-radius:7px;background:#fbfbfa;color:#151515}
.shape-panel label{display:grid;gap:6px;color:#555;font-size:12px;font-weight:900}
.shape-panel select{height:36px;border:1px solid #d6d6d1;border-radius:5px;background:#fff;color:#151515;padding:0 10px}
.shape-control{display:grid;grid-template-columns:1fr 1fr;gap:6px;align-items:center}
.shape-control div{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#555;font-size:12px;font-weight:900}
.shape-control b{color:#222;font-size:13px}
.shape-control input{grid-column:1 / -1;width:100%;accent-color:#333}
.shape-control small{color:#777;font-size:11px;font-weight:900}.shape-control small:last-child{text-align:left}

/* Complete pitch markings and simplified roster */
body.board-body .pitch{outline:2px solid var(--line-color);outline-offset:-14px}
body.board-body .pitch-lines{opacity:.95}
body.board-body .pitch-lines span{border-color:currentColor}
.arc{top:39%;width:10%;height:22%;border:2px solid;border-radius:50%;background:transparent}
.left-arc{left:10.8%;clip-path:inset(0 0 0 50%)}
.right-arc{right:10.8%;clip-path:inset(0 50% 0 0)}
.corner{width:22px;height:22px;border:2px solid;border-radius:50%;background:transparent}
.corner-tl{top:-11px;left:-11px;clip-path:inset(50% 0 0 50%)}
.corner-tr{top:-11px;right:-11px;clip-path:inset(50% 50% 0 0)}
.corner-bl{bottom:-11px;left:-11px;clip-path:inset(0 0 50% 50%)}
.corner-br{bottom:-11px;right:-11px;clip-path:inset(0 50% 50% 0)}
body.board-body .roster-row{grid-template-columns:52px 1fr!important}
body.board-body .roster-row input[type=color]{display:none!important}

/* Team number/name color controls */
.token .token-number{color:var(--number-color,#fff)}
.token .token-name{color:var(--name-color,#fff)}
.single-color-option{display:flex!important;align-items:center;gap:8px;padding:10px 12px;border:1px solid #dfdfda;border-radius:7px;background:#fbfbfa;color:#333;font-size:12px;font-weight:900}
.single-color-option input{width:16px;height:16px;accent-color:#333}

/* Team color tabs */
.team-color-tabs{display:grid;gap:10px;padding:10px;border:1px solid #dfdfda;border-radius:7px;background:#fbfbfa}
.team-color-tab-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.team-color-tab-buttons button{height:34px;border:1px solid #d6d6d1;border-radius:5px;background:#fff;color:#333;font-size:12px;font-weight:900}
.team-color-tab-buttons button.active{background:#333;color:#fff;border-color:#333}
.team-color-pane{display:none}.team-color-pane.active{display:block}
.team-color-pane .color-control{border:0;padding:0;background:transparent;box-shadow:none}

/* Cleaner position sliders */
body.board-body .team-shape{gap:12px;padding:14px 12px}
body.board-body .shape-control{display:grid;grid-template-columns:1fr 1fr;gap:7px;align-items:center;direction:rtl}
body.board-body .shape-control div{grid-column:1 / -1;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;min-height:22px;color:#555;font-size:12px;font-weight:900}
body.board-body .shape-control div span{text-align:right}
body.board-body .shape-control div b{justify-self:start;min-width:58px;text-align:center;color:#222;font-size:12px;line-height:1.4}
body.board-body .shape-control input[type=range]{grid-column:1 / -1;display:block;width:100%;height:22px;margin:0;direction:ltr;accent-color:#333}
body.board-body .shape-control small{display:block;color:#777;font-size:11px;font-weight:900;line-height:1.2}
body.board-body .shape-control small:first-of-type{text-align:right}
body.board-body .shape-control small:last-of-type{text-align:left}

/* Shape controls without lower captions */
body.board-body .shape-control{grid-template-columns:1fr!important}
body.board-body .shape-control small{display:none!important}
body.board-body .shape-control div b{min-width:72px}

/* Tool configuration tabs */
.tool-config-tabs{display:grid;gap:10px;padding:10px;border:1px solid #dfdfda;border-radius:7px;background:#fbfbfa}
.tool-tab-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.tool-tab-buttons button{display:grid;place-items:center;gap:3px;min-height:48px;border:1px solid #d6d6d1;border-radius:5px;background:#fff;color:#333;font-weight:900}
.tool-tab-buttons button span{display:grid;place-items:center;width:22px;height:22px;font-size:18px;line-height:1}
.tool-tab-buttons button b{font-size:10px;line-height:1.1}
.tool-tab-buttons button.active{background:#333;color:#fff;border-color:#333}
.tool-config-pane{display:none}.tool-config-pane.active{display:block}
.tool-config-pane .tool-options{border:0;padding:0;background:transparent;box-shadow:none}
body.board-body .board-tool-size-control{display:grid;gap:7px;padding:8px;border:1px solid rgba(17,17,17,.12);border-radius:7px;background:#f8f9f7}
body.board-body .board-tool-size-control label{display:flex;align-items:center;justify-content:space-between;color:#303532;font-size:12px;font-weight:900}
body.board-body .board-tool-size-control b{color:#111;direction:ltr}
body.board-body .board-tool-size-control input[type=range]{width:100%;accent-color:#f7d84b}
.tool-note{margin:0;color:#666;font-size:12px;line-height:1.6;font-weight:800}
.mini-tool-icon{display:grid;place-items:center;width:24px;height:24px;font-size:18px;line-height:1}

body.board-body .tool-tab-buttons{grid-template-columns:repeat(3,1fr)}


/* Color alpha row */
.alpha-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:6px;border-radius:5px;background:linear-gradient(45deg,#ddd 25%,transparent 25%),linear-gradient(-45deg,#ddd 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ddd 75%),linear-gradient(-45deg,transparent 75%,#ddd 75%);background-size:12px 12px;background-position:0 0,0 6px,6px -6px,-6px 0;background-color:#fff}
.alpha-grid button{height:26px;border-radius:4px;background:rgba(51,51,51,.82);color:#fff;font-size:11px;font-weight:900}
.alpha-grid button:nth-child(2){background:rgba(51,51,51,.68)}.alpha-grid button:nth-child(3){background:rgba(51,51,51,.52)}.alpha-grid button:nth-child(4){background:rgba(51,51,51,.38)}

/* Alpha controls only inside drawing tools */
body.board-body .side-pane:not([data-side-pane="tools"]) .alpha-grid{display:none!important}
body.board-body .side-pane:not([data-side-pane="tools"]) .hex-input[value$="FF"]{}

/* Home color pickers match the in-board palette style */

body.home-body .settings-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
body.home-body .color-head{justify-content:space-between;margin-bottom:8px}
body.home-body .color-head span{order:2;color:#333;font-size:13px;font-weight:900}
body.home-body .color-head input[type=color]{order:1;width:36px;height:30px;border:1px solid #9f9f98;background:#fff;padding:0}
body.home-body .preset-grid{display:grid;grid-template-columns:repeat(6,28px);gap:8px;justify-content:center;margin:6px 0 10px}
body.home-body .preset-dot{width:28px;height:28px;border-radius:999px;border:2px solid transparent;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
body.home-body .preset-dot:hover{border-color:#2f6fec;transform:scale(1.05)}
body.home-body .hex-row{display:grid;grid-template-columns:84px 1fr;gap:8px;direction:ltr}
body.home-body .hex-row button{grid-column:1;grid-row:1;height:36px;border-radius:4px;background:#4c78f0;color:#fff;font-size:13px;font-weight:900}
body.home-body .hex-row input{grid-column:2;grid-row:1;height:36px;border-radius:4px;background:#fff;color:#60656b;border:1px solid #d7d7d2;font-size:14px;font-weight:800;text-transform:uppercase}
body.home-body .alpha-grid,body.media-body .alpha-grid{display:none!important}
@media(max-width:1120px){body.home-body .settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){body.home-body .settings-grid{grid-template-columns:1fr}}

/* Project hub */
.projects-body{background:#0b1114;color:#eef3ef}
.projects-body::before{display:none}
.projects-shell{width:min(1320px,calc(100vw - 40px));margin:28px auto 56px}
.projects-header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:48px}
.projects-hero{display:grid;gap:6px;margin-bottom:20px}
.projects-hero p{margin:0;color:#7fa7ff;font-size:12px;font-weight:900;letter-spacing:.12em}
.projects-hero h1{margin:0;font-size:34px}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:14px}
.project-card{display:grid;gap:10px;min-height:150px;padding:16px;border:1px solid rgba(238,243,239,.12);border-radius:8px;background:#151d22;color:#eef3ef;text-align:right;box-shadow:0 18px 48px rgba(0,0,0,.24)}
.project-card strong{font-size:20px}
.project-card span{color:#8e9b94;font-size:12px;font-weight:800}
.project-card b{align-self:end;justify-self:start;padding:7px 11px;border-radius:5px;background:#e8eee9;color:#11181c;font-size:12px}
.project-empty{padding:18px;border:1px dashed rgba(238,243,239,.22);border-radius:8px;color:#9aa59f}
@media(max-width:900px){.project-grid{grid-template-columns:1fr}}

/* Board display settings inspired by compact tactical editors */
body.board-body .pitch{aspect-ratio:var(--pitch-ratio,1000/650)!important}
.pitch-grid{position:absolute;inset:0;z-index:0;display:none;pointer-events:none;background-image:linear-gradient(to right,rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.16) 1px,transparent 1px);background-size:10% 10%}
.selection-marquee{position:absolute;z-index:20;border:1px solid rgba(36,133,255,.85);background:rgba(36,133,255,.24);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);pointer-events:none}
.pitch.show-grid .pitch-grid{display:block}
.token .token-name{font-size:var(--name-size,13px)}
.board-settings{gap:12px}
.position-swap-panel{display:grid;gap:6px;margin:10px 0 12px;padding:10px;border:1px solid rgba(20,28,24,.12);border-radius:8px;background:#f7f8f5}
.position-swap-panel button{height:40px;border:1px solid rgba(20,28,24,.18);border-radius:6px;background:#202020;color:#fff;font-weight:900;cursor:pointer}
.position-swap-panel button.active,.position-swap-panel.active button{background:#4b8dff;border-color:#2f6ee6;color:#fff}
.position-swap-panel p{margin:0;color:#69706a;font-size:12px;font-weight:800;line-height:1.5}
.pitch.position-swap-mode .token[data-kind="player"]{cursor:copy}
.token.swap-first{outline:4px solid rgba(75,141,255,.65);outline-offset:4px;box-shadow:0 0 0 8px rgba(75,141,255,.18),0 9px 18px rgba(0,0,0,.24)}
.board-text-editor{position:absolute;z-index:35;min-width:210px;transform:translate(-50%,12px);direction:rtl}
.board-text-editor textarea{width:100%;min-height:54px;resize:none;border:2px solid rgba(247,216,75,.9);border-radius:8px;padding:10px 12px;background:rgba(12,15,14,.92);color:#fff;font:900 16px/1.4 var(--font);box-shadow:0 12px 30px rgba(0,0,0,.28);outline:none}
.board-text-editor textarea::placeholder{color:rgba(255,255,255,.62)}
.setting-block{display:grid;gap:8px;padding:10px;border:1px solid #dfdfda;border-radius:7px;background:#fff;color:#151515}
.setting-block>b{color:#555;font-size:12px;font-weight:900;text-align:left;direction:ltr}
.segmented,.segmented-v2,.field-layouts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.segmented button,.segmented-v2 button,.field-layouts button,.wide-control,.setting-grid button{height:34px;border:1px solid #d6d6d1;border-radius:5px;background:#fff;color:#333;font-size:12px;font-weight:900}
.segmented button.active,.segmented-v2 button.active,.field-layouts button.active,.wide-control.active,.setting-grid button.active{background:#333;color:#fff;border-color:#333}
.field-layouts{grid-template-columns:repeat(3,1fr)}
.wide-control{width:100%;margin-top:2px}
.setting-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.board-setting-tabs{display:grid;gap:10px;padding:10px;border:1px solid #dfdfda;border-radius:7px;background:#fbfbfa}
.board-setting-tab-buttons{grid-template-columns:repeat(3,1fr)}
.board-setting-tab-buttons button{font-size:11px}
.board-setting-pane{display:none;gap:10px}
.board-setting-pane.active{display:grid}
.board-setting-pane .setting-block{margin:0}
.board-color-tabs{padding:10px;border:1px solid #dfdfda;border-radius:7px;background:#fff}
.board-color-tabs .team-color-tab-buttons{grid-template-columns:repeat(2,1fr)}
.board-color-tabs .team-color-pane .color-control{border:0;padding:0;background:transparent;box-shadow:none}
.ball-panel{display:grid;gap:12px}
.ball-add-button{display:grid;grid-template-columns:86px 1fr;align-items:center;gap:12px;width:100%;padding:10px;border:1px solid #dfdfda;border-radius:7px;background:#fbfbfa;color:#181818;text-align:right;font-weight:900}
.ball-add-button:hover{border-color:#333;background:#f1f1ed}
.ball-add-button .ball-preview{height:72px;border:0;background:transparent}
.ball-preview{display:grid;place-items:center;height:92px;border:1px solid #dfdfda;border-radius:7px;background:#fbfbfa;color:var(--ball-color,#f8f8f2);line-height:1}
.soccer-preview svg{width:62px;height:62px;fill:var(--ball-color,#f8f8f2);stroke:var(--ball-line-color,#111);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.soccer-glyph svg{fill:#fff!important;stroke:#111!important;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.token.ball{background:transparent!important;border:0!important;box-shadow:none;color:#111}
.soccer-ball-svg{display:block;width:100%;height:100%;fill:var(--token-color,#f8f8f2);stroke:var(--ball-line-color,#111);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 6px 8px rgba(0,0,0,.28))}
body.board-body .token.ball,body.board-body .token.ball *{pointer-events:auto}
body.board-body .soccer-ball-svg{pointer-events:none}
body.board-body .token.ball{z-index:30!important}
.ball-color-tabs{padding:10px;border:1px solid #dfdfda;border-radius:7px;background:#fff}
.ball-color-tabs .team-color-tab-buttons{grid-template-columns:repeat(2,1fr)}
.ball-color-tabs .team-color-pane .color-control{border:0;padding:0;background:transparent;box-shadow:none}
.setting-block input[type=range]{width:100%;accent-color:#333}
.range-readout{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;color:#777;font-size:11px;font-weight:900}
.range-readout b{color:#222;font-size:12px}
.range-readout span:last-child{text-align:left}

.project-actions{align-self:end;display:flex;gap:8px;justify-content:flex-start;align-items:center}
.project-actions a,.project-actions button{border:0;border-radius:5px;padding:8px 12px;font:inherit;font-size:12px;font-weight:900;text-decoration:none;cursor:pointer}
.project-actions a{background:#e8eee9;color:#11181c}
.project-actions button{background:#311719;color:#ffd9d9;border:1px solid rgba(255,120,120,.28)}
.project-actions button:hover{background:#4a2024}
/* Tactical launch illustration */
.tactical-art{overflow:hidden;border-color:#ff6535;color:#ff6535;background:linear-gradient(rgba(255,101,53,.04),rgba(255,101,53,.02));box-shadow:inset 0 0 0 1px rgba(255,101,53,.12)}
.tactical-art::before{border-left-color:#ff6535!important;opacity:.95}
.tactical-art::after{border-color:#ff6535!important;width:72px!important;height:72px!important;opacity:.95}
.tactical-art i{position:absolute;display:block;box-sizing:border-box;color:#ff6535}
.t-dot{width:22px;height:22px;border:3px solid currentColor;border-radius:50%;background:#13241d}
.t-dot.d1{left:17%;top:48%}.t-dot.d2{left:30%;top:20%}.t-dot.d3{left:70%;top:36%}.t-dot.d4{left:79%;top:52%}.t-dot.d5{left:29%;top:74%}.t-dot.d6{left:70%;top:72%}
.t-x{width:26px;height:26px}.t-x::before,.t-x::after{content:"";position:absolute;left:12px;top:0;width:3px;height:28px;background:currentColor;border-radius:999px}.t-x::before{transform:rotate(45deg)}.t-x::after{transform:rotate(-45deg)}
.t-x.x1{left:27%;top:49%}.t-x.x2{left:11%;top:76%}.t-x.x3{left:84%;top:73%}
.t-arrow{height:3px;background:currentColor;border-radius:999px;transform-origin:left center}.t-arrow::after{content:"";position:absolute;right:-1px;top:50%;width:13px;height:13px;border-top:3px solid currentColor;border-right:3px solid currentColor;transform:translateY(-50%) rotate(45deg)}
.t-arrow.a1{left:38%;top:22%;width:32%;transform:rotate(0deg)}.t-arrow.a2{left:38%;top:74%;width:34%;transform:rotate(0deg)}.t-arrow.a3{left:27%;top:59%;width:23%;transform:rotate(90deg)}
.t-curve{left:8%;top:17%;width:70px;height:46px;border:3px solid currentColor;border-top:0;border-right:0;border-radius:0 0 0 34px}.t-curve::after{content:"";position:absolute;right:-12px;bottom:-7px;width:13px;height:13px;border-top:3px solid currentColor;border-right:3px solid currentColor;transform:rotate(45deg)}
.launch-card:hover .tactical-art{box-shadow:inset 0 0 0 1px rgba(255,101,53,.22),0 0 34px rgba(255,101,53,.08)}
/* Refined tactical launch illustration */
.tactical-art{border-color:#dbe4dc!important;color:#dbe4dc!important;background:linear-gradient(180deg,rgba(219,228,220,.035),rgba(219,228,220,.015))!important;box-shadow:inset 0 0 0 1px rgba(219,228,220,.12)!important}
.tactical-art::before{border-left-color:#dbe4dc!important;opacity:.85!important}
.tactical-art::after{border-color:#dbe4dc!important;width:70px!important;height:70px!important;opacity:.85!important}
.tactical-art .t-dot{width:21px;height:21px;border-width:3px;background:#13251e;box-shadow:0 0 0 3px rgba(19,37,30,.9)}
.tactical-art .t-dot.d1,.tactical-art .t-dot.d2,.tactical-art .t-dot.d5{border-color:#66a6ff;color:#66a6ff}
.tactical-art .t-dot.d3,.tactical-art .t-dot.d4,.tactical-art .t-dot.d6{border-color:#f4d35e;color:#f4d35e}
.tactical-art .t-dot.d1{left:18%;top:49%}.tactical-art .t-dot.d2{left:31%;top:30%}.tactical-art .t-dot.d5{left:31%;top:68%}
.tactical-art .t-dot.d3{left:68%;top:30%}.tactical-art .t-dot.d4{left:81%;top:49%}.tactical-art .t-dot.d6{left:68%;top:68%}
.tactical-art .t-x{color:#ff6848;width:24px;height:24px;opacity:.95}
.tactical-art .t-x::before,.tactical-art .t-x::after{width:3px;height:26px;background:#ff6848}
.tactical-art .t-x.x1{left:42%;top:48%}.tactical-art .t-x.x2{left:15%;top:73%}.tactical-art .t-x.x3{left:84%;top:24%}
.tactical-art .t-arrow{height:3px;background:#ff9f43;color:#ff9f43;opacity:.95}
.tactical-art .t-arrow::after{border-color:#ff9f43;width:12px;height:12px}
.tactical-art .t-arrow.a1{left:39%;top:31%;width:21%;transform:rotate(0deg)}
.tactical-art .t-arrow.a2{left:39%;top:69%;width:21%;transform:rotate(0deg)}
.tactical-art .t-arrow.a3{left:28%;top:48%;width:18%;transform:rotate(90deg)}
.tactical-art .t-curve{left:11%;top:22%;width:58px;height:38px;border-color:#ff9f43;color:#ff9f43;opacity:.95}
.tactical-art .t-curve::after{border-color:#ff9f43}
.launch-card:hover .tactical-art{box-shadow:inset 0 0 0 1px rgba(219,228,220,.2),0 0 34px rgba(102,166,255,.06)!important}
/* Project cards, structured metadata */
.project-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:2px}
.project-meta span{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;background:rgba(127,167,255,.14);color:#aecaef;font-size:11px;font-weight:900}
.project-meta small{color:#82908a;font-size:11px;font-weight:900}
.project-details{display:grid;gap:8px;margin:2px 0 8px}
.project-details div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:8px;border-top:1px solid rgba(238,243,239,.08)}
.project-details dt{color:#7c8983;font-size:11px;font-weight:900}
.project-details dd{margin:0;color:#cfd8d2;font-size:12px;font-weight:800;text-align:left;direction:rtl}
.project-card:hover{border-color:rgba(238,243,239,.22);background:#172128}
/* Media analysis workspace */
.analysis-body{overflow:hidden;background:#090d10;color:#e8eee9}
.analysis-shell{width:100vw;height:100vh;margin:0;border:0;border-radius:0;background:#0b1013;box-shadow:none}
.analysis-header{height:58px;background:#0b0f12;border-bottom:1px solid rgba(238,243,239,.12)}
.analysis-workspace{direction:ltr;display:grid;grid-template-columns:280px minmax(0,1fr) 310px;height:calc(100vh - 58px);background:#0b1013;color:#e8eee9}
.analysis-assets,.analysis-tools{direction:rtl;display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:12px;padding:14px;background:#10171b;border-color:rgba(238,243,239,.12)}
.analysis-assets{border-right:1px solid rgba(238,243,239,.12)}.analysis-tools{border-left:1px solid rgba(238,243,239,.12);overflow:auto}
.panel-head{display:flex;align-items:end;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid rgba(238,243,239,.1)}
.panel-head span{color:#7fa7ff;font-size:11px;font-weight:900;letter-spacing:.12em}.panel-head b{font-size:20px}
.asset-list{display:grid;align-content:start;gap:8px;overflow:auto}.asset-row{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;padding:11px;border:1px solid rgba(238,243,239,.1);border-radius:7px;background:#151e23;color:#e8eee9;text-align:right}.asset-row.active{border-color:#e8eee9;background:#202a30}.asset-row span{grid-row:1/3;align-self:center;padding:5px 7px;border-radius:5px;background:#e8eee9;color:#11181c;font-size:10px;font-weight:900}.asset-row b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.asset-row small{color:#87958e;font-weight:800}.empty-list{padding:12px;border:1px dashed rgba(238,243,239,.18);border-radius:7px;color:#87958e;text-align:center;font-size:13px}
.analysis-center{direction:rtl;display:grid;grid-template-rows:minmax(0,1fr) 54px 116px;gap:12px;padding:14px;min-width:0;background:radial-gradient(circle at 50% 18%,rgba(79,140,255,.08),transparent 32%),#0b1013}
.analysis-stage{--media-scale:1;--media-x:0px;--media-y:0px;position:relative;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(238,243,239,.14);border-radius:8px;background:#06090b;box-shadow:0 24px 70px rgba(0,0,0,.32)}
.analysis-media{display:none;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;background:#06090b;transform:translate(var(--media-x),var(--media-y)) scale(var(--media-scale));transform-origin:center;transition:transform .12s ease}.analysis-media.active{display:block}.analysis-overlay{position:absolute;inset:0;z-index:3;width:100%;height:100%;pointer-events:auto;transform:translate(var(--media-x),var(--media-y)) scale(var(--media-scale));transform-origin:center;transition:transform .12s ease}.analysis-stage.is-panning,.analysis-stage.is-panning .analysis-overlay{cursor:grab}.analysis-stage.is-panning:active,.analysis-stage.is-panning:active .analysis-overlay{cursor:grabbing}.empty-viewer{display:grid;place-items:center;align-content:center;gap:8px;color:#9aa59f;text-align:center}.empty-viewer.hidden{display:none}.empty-viewer b{color:#e8eee9;font-size:24px}.empty-viewer span{font-size:14px}
.analysis-transport{display:grid;grid-template-columns:auto auto auto auto minmax(160px,1fr) auto;align-items:center;gap:8px;padding:8px;border:1px solid rgba(238,243,239,.1);border-radius:8px;background:#10171b}.analysis-transport button,.analysis-tools button{height:34px;border-radius:6px;border:1px solid rgba(238,243,239,.13);background:#172127;color:#e8eee9;font-weight:900}.analysis-transport button:hover,.analysis-tools button:hover{background:#223039}.analysis-transport input[type=range]{width:100%}.analysis-transport span{color:#aab6af;font-weight:900;direction:ltr}.media-view-controls{display:flex;align-items:center;gap:6px;direction:ltr}.media-view-controls button{min-width:42px;padding:0 10px}.media-view-controls button.active{background:#e8eee9;color:#10171b;border-color:#e8eee9}
.page-strip{display:flex;gap:10px;overflow:auto;padding:8px;border:1px solid rgba(238,243,239,.1);border-radius:8px;background:#10171b}.page-thumb{flex:0 0 180px;display:grid;grid-template-columns:32px 1fr;gap:4px 8px;align-content:center;padding:9px;border:1px solid rgba(238,243,239,.1);border-radius:7px;background:#151e23;color:#e8eee9;text-align:right}.page-thumb.active{border-color:#7fa7ff;background:#1b2630}.page-thumb span{grid-row:1/3;display:grid;place-items:center;border-radius:5px;background:#e8eee9;color:#10171b;font-weight:900}.page-thumb b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.page-thumb small{color:#87958e}
.tool-cluster{display:grid;gap:9px;padding:11px;border:1px solid rgba(238,243,239,.1);border-radius:8px;background:#151e23}.tool-cluster label{color:#aab6af;font-size:12px;font-weight:900}.tool-grid,.tag-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.tool-grid button.active{background:#e8eee9;color:#10171b}.analysis-colors{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.analysis-colors button{width:100%;aspect-ratio:1;border-radius:999px;border:2px solid rgba(255,255,255,.22);padding:0;min-height:28px}.analysis-colors button.active{outline:2px solid #7fa7ff;outline-offset:2px}.analysis-selected{filter:drop-shadow(0 0 7px #7fa7ff) drop-shadow(0 0 2px #fff)}.tag-grid button{font-size:12px}.analysis-tools textarea{width:100%;resize:vertical;min-height:92px;border:1px solid rgba(238,243,239,.12);border-radius:7px;background:#0d1317;color:#e8eee9;padding:10px;font:inherit}.tag-list{display:grid;gap:7px;max-height:210px;overflow:auto}.tag-item{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:right}.tag-item span{color:#9aa59f;direction:ltr}
@media(max-width:1180px){.analysis-workspace{grid-template-columns:230px minmax(0,1fr)}.analysis-tools{grid-column:1/-1;grid-row:2;height:260px}.analysis-center{grid-column:2;grid-row:1}.analysis-assets{grid-row:1}}
@media(max-width:820px){.analysis-workspace{grid-template-columns:1fr;height:auto;min-height:calc(100vh - 58px);overflow:auto}.analysis-assets,.analysis-center,.analysis-tools{grid-column:1;grid-row:auto}.analysis-center{min-height:620px}.analysis-transport{grid-template-columns:repeat(3,auto);overflow:auto}.analysis-header{height:auto;min-height:58px;flex-wrap:wrap}.media-shell.analysis-shell{overflow:auto}}
/* Media delete + custom color controls */
.asset-row,.page-thumb,.tag-item{position:relative}
.asset-open,.page-open,.tag-open{display:grid;width:100%;height:100%;border:0;background:transparent;color:inherit;text-align:right;padding:0;font:inherit}
.asset-open{grid-template-columns:auto 1fr;gap:4px 10px}.asset-open span{grid-row:1/3}.asset-open b,.asset-open small{grid-column:2}
.page-open{grid-template-columns:32px 1fr;gap:4px 8px}.page-open span{grid-row:1/3}.page-open b,.page-open small{grid-column:2}
.tag-open{display:flex;align-items:center;justify-content:space-between;gap:10px}
.delete-mini{position:absolute;top:6px;left:6px;display:grid;place-items:center;width:24px;height:24px;border:1px solid rgba(255,120,120,.28)!important;border-radius:6px!important;background:#32171a!important;color:#ffd8d8!important;font-size:17px!important;line-height:1;font-weight:900!important;padding:0!important}
.delete-mini:hover{background:#5a2228!important;color:#fff!important}
.analysis-color-custom{display:grid;grid-template-columns:42px 1fr;gap:8px;direction:ltr}.analysis-color-custom input[type=color]{width:42px;height:34px;padding:0;border:1px solid rgba(238,243,239,.18);border-radius:7px;background:#0d1317}.analysis-color-custom input:not([type=color]){height:34px;border:1px solid rgba(238,243,239,.12);border-radius:7px;background:#0d1317;color:#e8eee9;padding:0 9px;font-weight:900;text-transform:uppercase}
.danger-tool-action{height:36px!important;border:1px solid rgba(220,50,50,.35)!important;border-radius:6px!important;background:#3a1518!important;color:#ffd6d6!important;font-weight:900!important}.danger-tool-action:hover{background:#5b2025!important;color:#fff!important}
.media-tool-controls{display:grid!important;gap:10px!important;order:2!important;border:1px solid var(--border)!important;background:var(--surface)!important}
.media-tool-controls label{color:var(--ink)!important;font-size:13px!important;font-weight:900!important}
.media-tool-controls .force-colors{display:grid!important;grid-template-columns:repeat(6,minmax(24px,1fr))!important;gap:8px!important;min-height:64px!important;visibility:visible!important;opacity:1!important}
.media-tool-controls .force-colors button{display:block!important;width:100%!important;min-width:26px!important;min-height:26px!important;aspect-ratio:1!important;border-radius:999px!important;border:2px solid rgba(255,255,255,.32)!important;padding:0!important;visibility:visible!important;opacity:1!important}
.media-delete-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.media-delete-actions button:first-child,#mediaDeleteSelected{background:#3a1518!important;border-color:rgba(255,120,120,.35)!important;color:#ffdada!important}/* force media tools column */
body.media-body .analysis-tools{display:flex!important;flex-direction:column!important;gap:12px!important;align-items:stretch!important;overflow:auto!important;grid-template-rows:none!important}
body.media-body .analysis-tools > *{flex:0 0 auto!important;min-height:auto!important}
body.media-body #mediaToolControls{display:grid!important;visibility:visible!important;opacity:1!important;flex:0 0 auto!important}.media-size-control{display:grid!important;gap:7px!important;padding:8px;border:1px solid var(--border);border-radius:7px;background:var(--surface2)}
.media-size-control label{display:flex!important;align-items:center!important;justify-content:space-between!important;color:var(--ink-muted)!important;font-size:12px!important;font-weight:900!important}
.media-size-control b{color:var(--ink)!important;direction:ltr!important}
.media-size-control input[type=range]{width:100%!important;accent-color:#f7d84b!important}
.ground-circle{mix-blend-mode:normal;vector-effect:non-scaling-stroke;paint-order:fill stroke;stroke-linejoin:round}
.edit-handles{pointer-events:auto}
.edit-handles rect[data-edit-handle="move"]{fill:rgba(47,91,255,.08);stroke:#2f5bff;stroke-width:2;stroke-dasharray:7 6;vector-effect:non-scaling-stroke;cursor:move}
.edit-handles line[data-edit-handle="move"]{stroke:#2f5bff;stroke-width:12;stroke-opacity:.18;stroke-linecap:round;cursor:move;vector-effect:non-scaling-stroke}
.edit-handles circle{fill:rgba(16,25,36,.88);stroke:#2f5bff;stroke-width:4;vector-effect:non-scaling-stroke;cursor:pointer}
.edit-handles circle[data-edit-handle="move"]{fill:#f7d84b;stroke:#10171b}
/* OmniBoard media tool redesign */
body.media-body .analysis-tools{background:var(--surface)!important;border-left:1px solid var(--border)!important;padding:12px!important;gap:10px!important}
body.media-body .analysis-tools .panel-head{padding:4px 2px 12px;border-bottom:1px solid var(--border)}
body.media-body .tool-cluster{border-color:var(--border);background:var(--surface);box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.tactical-toolbox{padding:10px!important}.tool-palette{grid-template-columns:repeat(5,1fr)!important;gap:7px!important;direction:ltr}.tool-palette button{height:58px!important;display:grid!important;place-items:center!important;gap:3px!important;padding:5px 2px!important;border-radius:8px!important;background:var(--surface2)!important;border-color:var(--border)!important;color:var(--ink-muted)!important}.tool-palette button span{display:grid;place-items:center;width:26px;height:24px;font-size:20px;font-weight:900;line-height:1}.tool-palette button b{font-size:10px;font-weight:900;line-height:1;color:var(--ink-muted)}.tool-palette button.active{background:var(--accent)!important;color:var(--bg)!important;border-color:var(--accent)!important}.tool-palette button.active b{color:var(--bg)}.tool-palette button:hover{border-color:var(--accent)!important;background:var(--accent-muted)!important}
body.media-body #mediaToolControls{order:1!important;border-color:var(--border)!important;background:var(--surface)!important}.media-tool-controls label{display:flex;align-items:center;justify-content:space-between}.analysis-colors.force-colors{grid-template-columns:repeat(6,1fr)!important}.analysis-colors.force-colors button{box-shadow:inset 0 0 0 2px rgba(0,0,0,.18),0 6px 16px rgba(0,0,0,.18)}.analysis-colors button.active{outline:2px solid var(--accent,#f7d84b)!important;outline-offset:3px!important}.media-delete-actions button{height:38px!important}.media-delete-actions #mediaDeleteAll{grid-column:1/-1;background:color-mix(in srgb,var(--accent) 16%,var(--surface2))!important;color:var(--ink)!important;border-color:color-mix(in srgb,var(--accent) 38%,transparent)!important}.media-delete-actions #mediaDeleteSelected,.media-delete-actions #mediaDeleteLast{background:color-mix(in srgb,#f87171 18%,var(--surface2))!important;color:#ffd9d9!important}.media-size-control{background:var(--surface2)!important;border-color:var(--border)!important}
.ground-circle{vector-effect:non-scaling-stroke;paint-order:fill stroke;stroke-linejoin:round;filter:url(#groundGlow);stroke-linecap:round;opacity:.96}
.analysis-selected{filter:drop-shadow(0 0 0 #fff) drop-shadow(0 0 7px rgba(247,216,75,.9))!important}
.edit-handles{pointer-events:auto}.edit-handles .handle-hit{fill:transparent!important;stroke:transparent!important;pointer-events:all!important;cursor:nwse-resize}.edit-handles .handle-hit[data-edit-handle="move"]{cursor:move}.edit-handles .handle-dot{fill:#0d1418!important;stroke:#f7d84b!important;stroke-width:3!important;vector-effect:non-scaling-stroke;pointer-events:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.55))}.edit-handles .handle-hit-area{fill:rgba(247,216,75,.06)!important;stroke:#f7d84b!important;stroke-width:2!important;stroke-dasharray:8 7!important;vector-effect:non-scaling-stroke;pointer-events:all!important;cursor:move}.edit-handles line.handle-hit-area{stroke-width:24!important;stroke-opacity:.16!important;stroke-linecap:round!important}.edit-handles .handle-hit:hover + .handle-dot{fill:#fff7b8!important}.edit-handles .handle-hit[data-edit-handle="move"] + .handle-dot{fill:#f7d84b!important;stroke:#10171b!important}
.analysis-overlay text{paint-order:stroke;stroke:rgba(0,0,0,.55);stroke-width:4px;stroke-linejoin:round}
.color-section-label{margin-top:4px;padding-top:10px;border-top:1px solid var(--border);color:var(--ink-muted)!important}

.analysis-stage[data-tool="circle"],.analysis-overlay[data-tool="circle"]{cursor:crosshair}
.analysis-stage[data-tool="arrow"],.analysis-overlay[data-tool="arrow"]{cursor:crosshair}
.analysis-stage[data-tool="rect"],.analysis-overlay[data-tool="rect"]{cursor:crosshair}
.analysis-stage[data-tool="text"],.analysis-overlay[data-tool="text"]{cursor:text}
.analysis-stage[data-tool="select"],.analysis-overlay[data-tool="select"]{cursor:default}
.tool-palette button.active{box-shadow:0 0 0 2px rgba(247,216,75,.35),0 8px 22px rgba(0,0,0,.22)!important}
/* Strict media panel order */
body.media-body .analysis-tools .tactical-toolbox{order:0!important}
body.media-body .analysis-tools #mediaToolControls{order:1!important}
body.media-body .analysis-tools .mapping-panel{order:2!important}
body.media-body .analysis-tools > .tool-cluster:not(.tactical-toolbox):not(.media-tool-controls):not(.mapping-panel){order:4!important}
body.media-body #mediaToolControls .color-section-label{display:block!important;margin-top:8px!important;padding-top:10px!important;border-top:1px solid rgba(238,243,239,.1)!important}
body.media-body #mediaToolControls .force-colors{display:grid!important}
body.media-body #mediaToolControls .analysis-color-custom{display:grid!important}
body.media-body #mediaToolSize{accent-color:#f7d84b!important}

/* Tactical media arrows and areas */
.tactical-arrow{vector-effect:non-scaling-stroke;paint-order:stroke;filter:drop-shadow(0 2px 4px rgba(0,0,0,.45));opacity:.96}
.tactical-area{vector-effect:non-scaling-stroke;paint-order:fill stroke;stroke-linejoin:round;filter:drop-shadow(0 3px 8px rgba(0,0,0,.28));opacity:.92}
.area-width-control{display:grid!important}
.area-width-control[hidden]{display:none!important}
/* Tactical ring handles */
.tactical-ring{mix-blend-mode:normal;vector-effect:non-scaling-stroke;paint-order:fill stroke;stroke-linejoin:round;stroke-linecap:round;filter:url(#groundGlow);opacity:.98}
.edit-handles .handle-dot{fill:#191a33!important;stroke:#191a33!important;stroke-width:3!important}
.edit-handles .handle-hit[data-edit-handle="move"] + .handle-dot{fill:#fff!important;stroke:#fff!important}
.edit-handles .handle-hit[data-edit-handle="n"] + .handle-dot,
.edit-handles .handle-hit[data-edit-handle="e"] + .handle-dot,
.edit-handles .handle-hit[data-edit-handle="s"] + .handle-dot,
.edit-handles .handle-hit[data-edit-handle="w"] + .handle-dot{fill:#1b1b37!important;stroke:#1b1b37!important}
/* Inline text editor inside media stage */
body.media-body .inline-text-editor{position:absolute;z-index:20;min-width:180px;max-width:440px;min-height:44px;transform:translate(-50%,-50%);padding:9px 13px;border:2px solid #f7d84b;border-radius:7px;background:rgba(10,14,17,.96);color:#fff;font:800 20px "Segoe UI","Noto Kufi Arabic",Tahoma,Arial,sans-serif;line-height:1.35;resize:none;outline:none;box-shadow:0 16px 42px rgba(0,0,0,.46);pointer-events:auto}
body.media-body .inline-text-editor::placeholder{color:rgba(255,255,255,.55)}
body.media-body .media-text-control{display:none;gap:8px;padding:9px;border:1px solid var(--border);border-radius:7px;background:var(--surface2)}
body.media-body .media-text-control textarea{min-height:74px!important;border-color:var(--border)!important;background:var(--surface)!important;color:var(--ink)!important;font-weight:800;line-height:1.55}
body.media-body .text-color-control{display:grid;gap:7px;padding-top:8px;border-top:1px solid var(--border)}
body.media-body .text-color-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px}
body.media-body .text-color-tabs button{height:34px;border:1px solid var(--border);border-radius:7px;background:var(--surface2);color:var(--ink-muted);font-weight:900}
body.media-body .text-color-tabs button.active{background:var(--accent);color:var(--bg);border-color:var(--accent)}
body.media-body .mapping-panel{border-color:var(--border)!important;background:var(--surface)!important}
body.media-body .mapping-panel label{color:var(--ink)}
.mapping-actions,.mapping-point-grid,.mapping-kind-grid{display:grid;gap:7px}
.mapping-actions{grid-template-columns:repeat(3,1fr)}
.mapping-point-grid{grid-template-columns:repeat(2,1fr)}
.mapping-point-grid button:only-child{grid-column:1/-1}
.mapping-kind-grid{grid-template-columns:repeat(3,1fr)}
.mapping-panel button{min-height:34px}
.mapping-panel button.active{background:#e8eee9!important;color:#10171b!important;border-color:#e8eee9!important}
.mapping-preview{min-height:132px;border:1px solid rgba(238,243,239,.12);border-radius:8px;background:#0d1317;padding:2px;box-sizing:border-box;flex-shrink:0}
.mapping-preview .corner.calibrated{background:#4CAF50;border:2px solid #fff;box-shadow:0 0 10px #4CAF50;z-index:5;clip-path:none!important;width:6px!important;height:6px!important;border-radius:50%!important;margin-top:-3px;margin-left:-3px;left:auto;right:auto;top:auto;bottom:auto;}
.mapping-preview .corner.tl.calibrated{left:0!important;top:0!important}
.mapping-preview .corner.tr.calibrated{right:0!important;top:0!important}
.mapping-preview .corner.bl.calibrated{left:0!important;bottom:0!important}
.mapping-preview .corner.br.calibrated{right:0!important;bottom:0!important}
.mapping-preview .corner.center.calibrated{left:50%!important;top:50%!important;margin-top:0!important;margin-left:0!important}
.mapping-mini-pitch-wrap{width:100%;aspect-ratio:1050/730;background:#12271d;padding:4%;box-sizing:border-box;margin-bottom:2px;border-radius:4px;display:flex;align-items:center;justify-content:center}
.mapping-mini-pitch{position:relative;width:100%;height:100%;border:2px solid rgba(232,238,233,.68)}
.mapping-mini-pitch .half{position:absolute;top:0;bottom:0;left:50%;border-left:1px solid rgba(232,238,233,.65)}
.mapping-mini-pitch .circle{position:absolute;left:50%;top:50%;width:17.4%;aspect-ratio:1;border:1px solid rgba(232,238,233,.65);border-radius:50%;transform:translate(-50%,-50%)}
.mapping-mini-pitch .box{position:absolute;top:20.35%;width:15.7%;height:59.3%;border:1px solid rgba(232,238,233,.65)}
.mapping-mini-pitch .box.left{left:-1px}
.mapping-mini-pitch .box.right{right:-1px}
.mapping-mini-pitch .goal{position:absolute;top:44.6%;width:3.6%;height:10.8%;border:1px solid rgba(232,238,233,.75)}
.mapping-mini-pitch .goal.left{left:0;border-left:0}
.mapping-mini-pitch .goal.right{right:0;border-right:0}
.mapping-mini-pitch .corner{position:absolute;width:8%;aspect-ratio:1;border:1px solid rgba(232,238,233,.65);border-radius:50%}
.mapping-mini-pitch .corner.tl{left:-4%;top:-6%;clip-path:polygon(50% 50%,100% 50%,100% 100%,50% 100%)}
.mapping-mini-pitch .corner.tr{right:-4%;top:-6%;clip-path:polygon(0 50%,50% 50%,50% 100%,0 100%)}
.mapping-mini-pitch .corner.bl{left:-4%;bottom:-6%;clip-path:polygon(50% 0,100% 0,100% 50%,50% 50%)}
.mapping-mini-pitch .corner.br{right:-4%;bottom:-6%;clip-path:polygon(0 0,50% 0,50% 50%,0 50%)}
.mapping-mini-pitch .corner.center{left:50%;top:50%;width:6px;height:6px;border:1px solid rgba(232,238,233,.65);border-radius:50%;transform:translate(-50%,-50%);background:transparent}
.mapping-mini-pitch i{position:absolute;z-index:3;display:grid;place-items:center;width:12px;height:12px;border:1.4px solid rgba(255,255,255,.85);border-radius:50%;transform:translate(-50%,-50%);color:#fff;font-size:7px;font-weight:900;font-style:normal}
.mapping-mini-pitch i.ball{width:9px;height:9px;color:#111}
.mapping-center-dot{position:absolute;z-index:4;width:10px;height:10px;border:2px solid #fff;border-radius:50%;background:#f7d84b;box-shadow:0 0 0 3px rgba(247,216,75,.3),0 3px 8px rgba(0,0,0,.4);transform:translate(-50%,-50%);pointer-events:none}
.mapping-view-rect{position:absolute;z-index:2;border:2px solid rgba(247,216,75,.95);background:rgba(12,37,24,.66);box-shadow:0 0 0 999px rgba(226,232,226,.13);cursor:move}
.mapping-view-rect b{position:absolute;width:8px;height:8px;border:1px solid #fff;border-radius:50%;background:#e32632;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.mapping-view-rect b[data-mapping-rect-handle="nw"]{left:-5px;top:-5px;cursor:nwse-resize}
.mapping-view-rect b[data-mapping-rect-handle="n"]{left:50%;top:-5px;transform:translateX(-50%);cursor:ns-resize}
.mapping-view-rect b[data-mapping-rect-handle="ne"]{right:-5px;top:-5px;cursor:nesw-resize}
.mapping-view-rect b[data-mapping-rect-handle="e"]{right:-5px;top:50%;transform:translateY(-50%);cursor:ew-resize}
.mapping-view-rect b[data-mapping-rect-handle="se"]{right:-5px;bottom:-5px;cursor:nwse-resize}
.mapping-view-rect b[data-mapping-rect-handle="s"]{left:50%;bottom:-5px;transform:translateX(-50%);cursor:ns-resize}
.mapping-view-rect b[data-mapping-rect-handle="sw"]{left:-5px;bottom:-5px;cursor:nesw-resize}
.mapping-view-rect b[data-mapping-rect-handle="w"]{left:-5px;top:50%;transform:translateY(-50%);cursor:ew-resize}
.mapping-layer{pointer-events:all}
.mapping-measure-line{stroke:#f7d84b;stroke-width:4px;stroke-linecap:round;stroke-dasharray:18 10;filter:drop-shadow(0 3px 7px rgba(0,0,0,.45));cursor:crosshair}
.mapping-measure-line.active{stroke:#7fa7ff}
.mapping-point{fill:#7fa7ff;stroke:#fff;stroke-width:3px;cursor:grab;filter:drop-shadow(0 4px 9px rgba(0,0,0,.36))}
.mapping-point.active{fill:#f7d84b}
.mapping-label{fill:#f5f8f4;stroke:rgba(0,0,0,.75);stroke-width:2.6px;paint-order:stroke;font-size:12px;font-weight:900;pointer-events:none}
.mapping-layer [data-mapping-object]{cursor:grab}
.analysis-stage[data-tool="mapping"],.analysis-overlay[data-tool="mapping"]{cursor:crosshair}
.export-split{position:relative;display:flex;align-items:center}.export-split #exportMediaPng{border-radius:4px 0 0 4px}.export-split .export-arrow{width:34px;padding:0;justify-content:center;border-radius:0 4px 4px 0;border-inline-start:0}.export-menu{position:absolute;top:44px;inset-inline-end:0;z-index:40;display:none;min-width:118px;padding:6px;border:1px solid rgba(255,255,255,.16);border-radius:7px;background:#11191d;box-shadow:0 18px 44px rgba(0,0,0,.35)}.export-menu.open{display:grid;gap:4px}.export-menu button{height:34px;border-radius:5px;background:transparent;color:#e8eee9;font-weight:900;text-align:center}.export-menu button:hover{background:rgba(255,255,255,.08)}
body.board-body .training-panel{display:grid;gap:12px}.training-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.training-grid button{display:grid;place-items:center;gap:7px;min-height:86px;border:1px solid #dfdfda;border-radius:7px;background:#fbfbfa;color:#202020;font-weight:900}.training-grid button:hover{border-color:#333}.training-grid button.active{background:#333;color:#fff;border-color:#333}.training-preview{display:block;position:relative;width:44px;height:34px}.cone-preview,.cone-shape{clip-path:polygon(50% 0,78% 72%,94% 72%,94% 100%,6% 100%,6% 72%,22% 72%);background:#ff7a1a}.hurdle-preview,.hurdle-shape{border:4px solid currentColor;border-bottom:0;border-radius:5px 5px 0 0;color:#f2f5ef}.marker-preview,.marker-shape{border-radius:999px;background:#2f80ed}.dummy-preview,.dummy-shape{border-radius:999px 999px 8px 8px;background:#9aa59f}.training-token{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}.training-shape{display:block;width:100%;height:100%;filter:drop-shadow(0 8px 9px rgba(0,0,0,.32))}.training-cone .training-shape{background:var(--token-color,#ff7a1a)}.training-hurdle .training-shape{color:var(--token-color,#f2f5ef)}.training-marker .training-shape{background:var(--token-color,#2f80ed);height:46%;transform:translateY(34%)}.training-dummy .training-shape{background:var(--token-color,#9aa59f)}.training-controls label{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-weight:900;color:#333}.training-controls input[type=range]{width:100%;accent-color:#333}.training-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.training-actions button{height:36px;border:1px solid #d8d8d2;border-radius:7px;background:#f5f5f1;color:#222;font-weight:900}.training-actions button:first-child{background:#2c1515;color:#ffd6d6;border-color:#6a2a2a}
.training-token{color:var(--token-color,#ff7a1a)!important}.training-token .training-shape{background:transparent!important;color:var(--token-color,#ff7a1a);height:100%;transform:none}.training-shape svg{display:block;width:100%;height:100%;overflow:visible}.training-grid{grid-template-columns:repeat(3,1fr)}.training-preview{color:#1e2428;background:transparent!important;clip-path:none!important}.training-preview::before{content:"";position:absolute;inset:2px;border:2px solid currentColor;border-radius:3px}.training-preview-grid::before{background:repeating-linear-gradient(90deg,transparent 0 8px,currentColor 8px 10px,transparent 10px 16px),repeating-linear-gradient(0deg,transparent 0 8px,currentColor 8px 10px,transparent 10px 16px)}.training-preview-gridbox::before{box-shadow:inset 11px 0 0 -9px currentColor,inset -11px 0 0 -9px currentColor,inset 0 9px 0 -7px currentColor,inset 0 -9px 0 -7px currentColor}.training-preview-gridwall::before{transform:skewX(-12deg);background:repeating-linear-gradient(90deg,transparent 0 9px,currentColor 9px 11px),repeating-linear-gradient(0deg,transparent 0 8px,currentColor 8px 10px)}.training-preview-minigoal::before{border-bottom:0}.training-preview-rebounder::before{transform:skewX(10deg);background:repeating-linear-gradient(90deg,transparent 0 8px,currentColor 8px 10px),repeating-linear-gradient(0deg,transparent 0 8px,currentColor 8px 10px)}.training-preview-mannequin::before{left:17px;right:17px;border-radius:999px 999px 5px 5px;background:currentColor}.training-preview-ladder::before{left:14px;right:14px;background:repeating-linear-gradient(0deg,transparent 0 7px,currentColor 7px 9px)}.training-preview-cornergate::before{border-bottom:0}.training-preview-tallcone::before{clip-path:polygon(50% 0,72% 86%,90% 86%,90% 100%,10% 100%,10% 86%,28% 86%);border:0;background:currentColor}.training-preview-flag::before{left:20px;right:auto;width:3px;border:0;background:currentColor}.training-preview-flag::after{content:"";position:absolute;left:23px;top:7px;border-left:18px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent}.training-preview-dome::before{top:14px;border:0;border-radius:999px 999px 4px 4px;background:currentColor}.training-preview-pole::before{left:20px;right:20px;border:0;background:currentColor}.training-preview-pole::after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:3px;background:currentColor}

/* Keep the media right panel locked inside its column */
body.media-body .analysis-workspace{grid-template-columns:280px minmax(0,1fr) 320px!important;overflow:hidden!important}
body.media-body .analysis-tools{width:320px!important;max-width:320px!important;min-width:0!important;overflow-x:hidden!important}
body.media-body .analysis-tools *,
body.media-body .analysis-tools *::before,
body.media-body .analysis-tools *::after{box-sizing:border-box;min-width:0}
body.media-body .analysis-tools .tool-cluster,
body.media-body #mediaToolControls,
body.media-body .mapping-panel{width:100%!important;max-width:100%!important;overflow:hidden!important}
body.media-body .analysis-tools button{max-width:100%;white-space:normal!important;line-height:1.25!important;padding-inline:6px!important;overflow:hidden}
body.media-body .tool-palette,
body.media-body .mapping-actions,
body.media-body .mapping-point-grid,
body.media-body .mapping-kind-grid,
body.media-body .media-delete-actions{grid-template-columns:repeat(var(--cols,2),minmax(0,1fr))!important}
body.media-body .tool-palette{--cols:5}
body.media-body .mapping-actions,
body.media-body .mapping-kind-grid{--cols:3}
body.media-body .mapping-point-grid{--cols:2}
body.media-body .mapping-preview.expanded{margin-inline:0!important}
body.media-body .mapping-mini-pitch{max-width:100%!important}
body.media-body .analysis-colors.force-colors{grid-template-columns:repeat(6,minmax(0,1fr))!important}
body.media-body .analysis-color-custom{grid-template-columns:42px minmax(0,1fr)!important}
body.board-body .token .token-name:empty{display:none}
body.board-body .token .token-name{background:var(--name-bg,rgba(8,12,15,.76))}
body.board-body .name-color-compact{display:grid;gap:8px}
body.board-body .name-color-switch{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:2px}
body.board-body .name-color-switch button{height:32px;border:1px solid #d6d6d1;border-radius:5px;background:#fff;color:#333;font-size:12px;font-weight:900}
body.board-body .name-color-switch button.active{background:#333;color:#fff;border-color:#333}
body.board-body .name-color-pane{display:none}
body.board-body .name-color-pane.active{display:grid;gap:8px}
body.board-body .name-shadow-mode{display:grid;grid-template-columns:1fr 1fr;gap:6px}
body.board-body .name-shadow-mode button{height:30px;border:1px solid #d6d6d1;border-radius:5px;background:#fff;color:#333;font-size:12px;font-weight:900}
body.board-body .name-shadow-mode button.active{background:#333;color:#fff;border-color:#333}
body.board-body .name-shadow-disabled [data-color-key$="NameBgColor"]{opacity:.45;filter:grayscale(.4)}
body.board-body .pitch.training-placement{cursor:crosshair}
body.media-body .media-text-box{filter:drop-shadow(0 4px 8px rgba(0,0,0,.32))}
body.media-body .media-text-bg{stroke:rgba(0,0,0,.18);stroke-width:1.5;vector-effect:non-scaling-stroke}

/* Priority 1: global premium setup */
.global-settings-panel{display:grid;gap:16px;margin:-88px 0 34px;padding:18px;border:1px solid rgba(238,243,239,.1);border-radius:10px;background:linear-gradient(180deg,rgba(21,31,36,.96),rgba(14,22,25,.96));box-shadow:0 20px 60px rgba(0,0,0,.26)}
.global-settings-head{display:flex;align-items:end;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid rgba(238,243,239,.1)}
.global-settings-head span{color:#f7d84b;font-size:11px;font-weight:900;letter-spacing:.14em}.global-settings-head b{font-size:22px}
.global-settings-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.global-settings-panel label{display:grid;gap:7px;color:#aab6af;font-size:12px;font-weight:900}
.global-settings-panel input:not([type=file]):not([type=checkbox]),.global-settings-panel select{height:38px;border:1px solid rgba(238,243,239,.13);border-radius:7px;padding:0 10px;background:#0d1418;color:#eef3ef}
.board-global-settings{display:grid;gap:10px;padding:12px;border:1px solid #deded8;border-radius:8px;background:#f7f8f5;color:#171a18}
.board-global-settings h3{margin:0;font-size:13px;text-transform:uppercase;color:#7a817b;letter-spacing:.08em}
.board-global-settings label{display:grid;gap:6px;font-size:12px;font-weight:900;color:#555}
.board-global-settings input:not([type=file]):not([type=checkbox]),.board-global-settings select{height:34px;border:1px solid #d3d5cf;border-radius:5px;background:#fff;color:#151515;padding:0 9px}
.board-font-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.board-global-settings .signature-upload,.board-global-settings .signature-options,.board-global-settings .signature-preview{min-height:auto;background:#fff;border-color:#d9dbd5}
.board-signature-upload{grid-template-columns:1fr auto;align-items:center}.board-signature-upload small{grid-column:1/-1;color:#777}
.board-signature-options{grid-template-columns:1fr 1fr}.board-signature-options label:last-child{grid-column:1/-1}
.board-global-settings .signature-preview{min-height:72px;color:#777}.board-global-settings .signature-preview img{max-width:140px;max-height:44px}
.text-font-panel{display:grid;gap:8px;padding:10px;border:1px solid #deded8;border-radius:8px;background:#f7f8f5;color:#171a18}
.text-font-panel h3{margin:0;font-size:12px;text-transform:uppercase;color:#777;letter-spacing:.08em}
.text-font-panel label{display:grid;gap:6px;color:#555;font-size:12px;font-weight:900}
.text-font-panel select{height:34px;border:1px solid #d3d5cf;border-radius:5px;background:#fff;color:#151515;padding:0 9px}
.signature-custom-position{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px;border:1px solid #d9dbd5;border-radius:8px;background:#fff}
.signature-custom-position[hidden]{display:none!important}.signature-custom-position input{width:100%;accent-color:#333}
.signature-settings{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:12px;align-items:stretch}
.signature-upload,.signature-options,.signature-preview{display:grid;gap:9px;align-content:center;min-height:112px;padding:12px;border:1px solid rgba(238,243,239,.1);border-radius:9px;background:#10181c}
.signature-upload{grid-template-columns:auto auto 1fr}.signature-upload small{align-self:center;color:#8b9791;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.signature-options{grid-template-columns:1fr 1fr}.signature-options label:last-child{grid-column:1/-1}.signature-options input[type=range]{width:100%;accent-color:#f7d84b}.check-row{display:flex!important;align-items:center;gap:8px}
.danger-lite{border-color:rgba(255,120,120,.22)!important;background:#2b1518!important;color:#ffd8d8!important}
.signature-preview{place-items:center;text-align:center;color:#8d9992;font-weight:900}.signature-preview img{max-width:190px;max-height:64px;object-fit:contain}.signature-preview span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.signature-preview.empty{border-style:dashed}
.omniboard-signature-mark{position:absolute;z-index:8;display:flex;align-items:center;gap:8px;max-width:34%;padding:6px 8px;border-radius:5px;background:rgba(8,12,15,.34);color:rgba(255,255,255,.92);font-weight:900;font-size:13px;line-height:1.2;pointer-events:none;text-shadow:0 2px 10px rgba(0,0,0,.75);backdrop-filter:blur(2px)}
.omniboard-signature-mark img{max-width:78px;max-height:32px;object-fit:contain}.omniboard-signature-mark span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.omniboard-signature-mark[data-position="bottom-right"]{right:18px;bottom:18px}.omniboard-signature-mark[data-position="bottom-left"]{left:18px;bottom:18px}.omniboard-signature-mark[data-position="top-right"]{right:18px;top:18px}.omniboard-signature-mark[data-position="top-left"]{left:18px;top:18px}
html[data-font-group="broadcast"] .drawing-layer text{font-weight:800}html[data-font-group="compact"] .drawing-layer text{font-weight:600}
@media(max-width:1100px){.global-settings-panel{margin:0 0 28px}.global-settings-grid,.signature-settings{grid-template-columns:1fr 1fr}.signature-preview{grid-column:1/-1}}
@media(max-width:720px){.global-settings-grid,.signature-settings,.signature-upload,.signature-options{grid-template-columns:1fr}.global-settings-panel{padding:14px}}


/* Fix color picker text color */
.hex-input, .premium-hex-input input { color: #000 !important; font-weight: bold !important; }

/* Floating Training Panel */
.floating-training-panel {
    position: fixed;
    left: 86px;
    top: 50%;
    transform: translateY(-50%) translateX(-10px);
    background: rgba(13, 17, 23, 0.95);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    z-index: 100;
    width: 300px;
    max-height: 85vh;
    overflow-y: auto;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    color: white;
}
body.light-theme .floating-training-panel {
    background: rgba(255, 255, 255, 0.95);
    border-color: rgba(0, 0, 0, 0.1);
    color: #151515;
}
.floating-training-panel.active {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(-50%) translateX(0);
}
.training-grid-v2 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}
.floating-training-panel .divider-v2.horizontal {
    height: 1px;
    width: 100%;
    background: rgba(255, 255, 255, 0.1);
    margin: 4px 0;
}
body.light-theme .floating-training-panel .divider-v2.horizontal {
    background: rgba(0, 0, 0, 0.1);
}
/* Re-style the color grid for training panel specifically so it doesn't overflow much */
.floating-training-panel .preset-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 6px;
    max-height: 110px;
    overflow-y: auto;
    padding-right: 4px;
}
.floating-training-panel .preset-dot {
    width: 24px;
    height: 24px;
}
.floating-board-tools-panel .preset-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 6px;
    max-height: 110px;
    overflow-y: auto;
    padding-right: 4px;
}
.floating-board-tools-panel .preset-dot {
    width: 24px;
    height: 24px;
}
.selected-tool-editor {
    margin: 10px 0 12px;
    padding: 10px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 10px;
    background: rgba(246, 247, 242, 0.72);
    display: grid;
    gap: 8px;
}
.selected-tool-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #151515;
    font-size: 12px;
}
.selected-tool-head span {
    color: #5d655f;
    font-weight: 900;
}
.tool-edit-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #151515;
    font-size: 11px;
    font-weight: 900;
}
.rect-dimension-controls {
    display: grid;
    gap: 7px;
}
.rect-dimension-controls[hidden] {
    display: none !important;
}
.board-edit-toggle.active {
    background: #202020 !important;
    color: #fff !important;
}
.board-selection-editor {
    position: fixed;
    left: 128px;
    bottom: 62px;
    width: 292px;
    z-index: 130;
    margin: 0;
    background: rgba(246, 247, 242, 0.96);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.28);
    opacity: 0;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity .16s ease, transform .16s ease;
}
.board-selection-editor.active {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

html,
body,
body.board-body,
body.media-body,
button,
input,
select,
textarea,
.drawing-layer text {
  font-family: var(--font-sans, "OmniBoard Thmanyah", "OmniBoard Wafeq", "Segoe UI", Tahoma, Arial, sans-serif) !important;
  font-variant-numeric: lining-nums tabular-nums;
}

input[type="number"],
[data-setting-label],
[data-tool-readout],
.token-number,
.zoom-readout,
.zoom-readout-v2,
#timeReadout,
#animationStartHold,
#animationEndHold {
  direction: ltr;
  unicode-bidi: isolate;
}

body.media-body .tool-palette {
  --cols: 6;
}

body.media-body .tool-palette .delete-all-tool {
  border-color: rgba(255,110,120,.35) !important;
  background: #23101a !important;
  color: #ffd6da !important;
}

body.media-body .tool-palette .delete-all-tool:hover {
  border-color: rgba(255,110,120,.64) !important;
  background: #351622 !important;
  color: #fff0f2 !important;
}