:root{--navy:#0b2a6b;--navy2:#071a46;--ink:#111;--mut:#444;--line:#d9dee7;--bg:#f3f5f9;--ok:#127a3a;--warn:#a15c00;--bad:#b3261e;--gold:#b8860b;--silver:#6b7280;--bronze:#8a5a2b}
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--navy)}
header.top{background:var(--navy2);color:#fff;padding:12px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
header.top .brand{font-weight:800;font-size:20px;letter-spacing:.3px;color:#fff;text-decoration:none}
header.top .sp{flex:1}
header.top a.btn,header.top button{margin-left:6px}
.wrap{max-width:1180px;margin:0 auto;padding:16px}
h1{font-size:30px;line-height:1.15;margin:8px 0}
h2{font-size:22px;margin:18px 0 8px}
h3{font-size:18px;margin:14px 0 6px}
.lead{font-size:18px;color:var(--mut);margin:0 0 14px}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;margin:0 0 14px}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.row>*{flex:1 1 180px}
label{display:block;font-weight:600;font-size:14px;margin:0 0 4px}
input,select,textarea{width:100%;font-family:inherit;font-size:16px;line-height:1.4;padding:10px;border:1px solid #b9c1cf;border-radius:8px;background:#fff;color:var(--ink);min-height:44px}
textarea{min-height:90px}
button,.btn{display:inline-block;font-family:inherit;font-weight:600;font-size:16px;line-height:1.2;padding:12px 16px;border-radius:8px;border:0;background:var(--navy);color:#fff;cursor:pointer;text-decoration:none;min-height:44px}
button.alt,.btn.alt{background:#fff;color:var(--navy);border:1px solid var(--navy)}
button.bad{background:var(--bad)}
button.ok{background:var(--ok)}
button.sm{padding:8px 12px;min-height:40px;font-size:14px}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.tabs button{background:#fff;color:var(--navy);border:1px solid var(--line)}
.tabs button.on{background:var(--navy);color:#fff}
.badge{display:inline-block;font-size:13px;font-weight:700;padding:3px 9px;border-radius:999px;margin:2px 4px 2px 0;border:1px solid transparent;background:#eef2f8;color:var(--navy)}
.b-master{background:#fff6dc;color:#7a5600;border-color:var(--gold)}
.b-journeyman{background:#f1f2f4;color:#374151;border-color:var(--silver)}
.b-apprentice{background:#f7ece2;color:#6b3f17;border-color:var(--bronze)}
.b-verified,.b-insured{background:#e5f4e9;color:var(--ok)}
.b-pending{background:#fff3e0;color:var(--warn)}
.b-expired,.b-rejected{background:#fdeceb;color:var(--bad)}
.b-years{background:#e7eefc;color:var(--navy)}
.b-emergency{background:#fdeceb;color:var(--bad)}
.b-top{background:#fff6dc;color:#7a5600}
.mut{color:var(--mut)}
.err{color:var(--bad);font-weight:600}
.okmsg{color:var(--ok);font-weight:600}
table{width:100%;border-collapse:collapse;background:#fff}
th,td{text-align:left;padding:8px;border-bottom:1px solid var(--line);vertical-align:top}
.tablewrap{overflow-x:auto}
.area{display:block;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px;text-decoration:none;color:var(--ink);font-weight:600;min-height:44px}
.area small{display:block;color:var(--mut);font-weight:400}
.ad{border:1px dashed var(--navy);background:#f7f9ff;border-radius:10px;padding:10px 12px;margin:0 0 10px}
.ad small{color:var(--mut)}
#map{height:420px;border-radius:12px;border:1px solid var(--line)}
.ptt{width:100%;padding:22px;font-size:20px;border-radius:14px;background:var(--bad);user-select:none;-webkit-user-select:none;touch-action:none}
.ptt.live{background:var(--ok)}
.clip{display:flex;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line)}
.foot{color:var(--mut);font-size:14px;padding:20px 16px;text-align:center}
.hide{display:none!important}
.pill{display:inline-block;padding:2px 8px;border-radius:6px;background:#eef2f8;font-size:13px}
@media (max-width:600px){h1{font-size:24px}.wrap{padding:12px}#map{height:320px}}
/* header picture (Ray 2026-11-13) */
.hero{background:#f3e6d3}.hero img{display:block;width:100%;height:auto}

/* contractor benefits (Ray 2026-11-13) */
.why{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin:14px 0}.why .card{margin:0;border-top:4px solid #e07b1a}.why h3{margin:0 0 6px;font-size:18px}.why p{margin:0}
.offer{background:#fff4e6;border:2px solid #e07b1a;border-radius:12px;padding:14px 16px;margin:12px 0;font-size:20px;line-height:1.35;color:#5a2d00}.offer b{color:#b45309}
.emg{display:inline-block;background:#fdecea;border:2px solid #b42318;color:#b42318;font-weight:700;border-radius:10px;padding:10px 14px;min-height:44px}.emgtag{color:#fff;background:#b42318;padding:2px 8px;border-radius:6px}.lf label{min-height:44px;display:flex;align-items:center;gap:8px}
.hwt{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:4px 12px}.hwt label{min-height:40px;display:flex;align-items:center;gap:8px}table.hwr td{vertical-align:top}tr.won td{background:#ecfdf3}

/* account colour bars + We are hiring (Ray 2026-11-13) */
.rolebar{padding:12px 16px;border-radius:12px;margin:0 0 12px;font-weight:700;font-size:18px}.rolebar small{display:block;font-weight:400;font-size:15px;margin-top:2px}.rb-homeowner{background:#e8f7ee;border:2px solid #17a34a;color:#12502a}.rb-biz{background:#e8eefb;border:2px solid #2f5bd3;color:#1b2f6b}.rb-contractor{background:#fff4e6;border:2px solid #e07b1a;color:#5a2d00}body.k-homeowner header.top{background:#1f6f43}.okmsg.big{font-size:20px;padding:18px 20px;border-radius:12px;background:#e8f7ee;border:2px solid #17a34a;color:#12502a;font-weight:700}

/* warmer, friendlier look + trade icons (Ray 2026-11-13) */
:root{--bg:#fbf6ee;--line:#eadfce;--warm:#c2410c;--warm2:#9a3412}
body{background:var(--bg)}
header.top{background:linear-gradient(90deg,#071a46,#163a8a);border-bottom:4px solid #e07b1a}
body.k-homeowner header.top{background:linear-gradient(90deg,#14532d,#1f6f43)}
header.top a.btn:not(.alt){background:var(--warm)}
h1{color:#2a1a0b}
.lead{color:#5b4636}
.card{border-radius:16px;border-color:var(--line);box-shadow:0 2px 12px rgba(90,55,20,.07)}
button,.btn{border-radius:999px;transition:transform .08s ease,box-shadow .15s ease}
button:hover,.btn:hover{box-shadow:0 3px 10px rgba(0,0,0,.15)}
button:active,.btn:active{transform:translateY(1px)}
button,.btn{background:var(--warm)}
.btn.alt,button.alt{background:#fff}
.tabs button{border-radius:999px}
.tabs button.on{background:var(--navy);color:#fff}
input,select,textarea{border-radius:10px;border-color:#d6c7b3}
input:focus,select:focus,textarea:focus{outline:3px solid #fbbf77;outline-offset:1px;border-color:#e07b1a}
.area{border-radius:14px;border-color:var(--line);display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;transition:transform .1s ease,box-shadow .15s ease}
.area small{flex-basis:100%;padding-left:46px}
.area:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(90,55,20,.12);border-color:#e07b1a}
.area .ti{font-size:26px;width:36px;height:36px;line-height:36px;text-align:center;background:#fff4e6;border-radius:10px}
.licarea{background:#fff8ee;border:2px solid #e07b1a;border-radius:18px;padding:14px 16px 16px;margin:6px 0 18px}
.licarea h2{margin:0 0 4px;color:#7c2d12}
.licarea p{margin:0 0 12px}
.pill{border-radius:999px;background:#fff1df;color:#5a2d00}
.rolebar .hi{font-weight:400}
.foot .thx{font-size:16px;color:#7c2d12;margin-bottom:6px}
.badge{border-radius:999px}
/* sales-leads offer banner, redesigned (Ray 2026-11-13) */
.offer{display:none}
.offer2{display:flex;gap:18px;align-items:center;background:linear-gradient(135deg,#fff7ed,#ffedd5);border:1px solid #fdba74;border-radius:18px;padding:18px 20px;margin:14px 0;box-shadow:0 4px 16px rgba(194,65,12,.10)}
.o-badge{flex:0 0 auto;width:96px;height:96px;border-radius:50%;background:#c2410c;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;line-height:1.05;box-shadow:0 3px 10px rgba(194,65,12,.35)}
.o-badge b{font-size:38px}.o-badge span{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.4px}
.o-body{flex:1 1 auto;min-width:0}.o-h{font-size:22px;font-weight:800;color:#7c2d12;line-height:1.25}.o-s{font-size:17px;color:#9a3412;margin:2px 0 8px}
.o-l{list-style:none;margin:0 0 10px;padding:0}.o-l li{position:relative;padding:3px 0 3px 26px;color:#43281a}.o-l li:before{content:"\2714";position:absolute;left:2px;top:3px;color:#15803d;font-weight:800}
.o-btn{margin-top:4px}
@media (max-width:560px){.offer2{flex-direction:column;text-align:center;padding:18px 16px}.o-l{text-align:left;display:inline-block}}
/* Micro-Ray colours replace the orange (Ray 2026-11-13): navy #0742A8 / bright #2E86FF / pale #DCEAFF, green #017B4D / #2FD68F / #D8F7E8 */
:root{--navy:#0742A8;--navy2:#062c73;--bg:#f3f7fd;--line:#d6e2f5;--warm:#0742A8;--warm2:#05337f;--mrg:#017B4D;--mrg2:#2FD68F;--mrgp:#D8F7E8;--mrbp:#DCEAFF}
header.top{background:linear-gradient(90deg,#041f57,#0742A8);border-bottom:4px solid #2FD68F}
header.top a.btn:not(.alt){background:var(--mrg)}
h1{color:#0b1f44}.lead{color:#3d4b63}
.card{border-color:var(--line);box-shadow:0 2px 12px rgba(7,66,168,.07)}
button,.btn{background:var(--navy)}
.btn.alt,button.alt{background:#fff;color:var(--navy);border-color:var(--navy)}
.tabs button{background:#fff;color:var(--navy)}
.tabs button.on{background:var(--navy);color:#fff}
input,select,textarea{border-color:#b8c8e3}
input:focus,select:focus,textarea:focus{outline:3px solid #9cc4ff;border-color:#2E86FF}
.area{border-color:var(--line)}.area:hover{border-color:#2E86FF;box-shadow:0 6px 16px rgba(7,66,168,.14)}
.area .ti{background:var(--mrbp)}
.licarea{background:#f5f9ff;border:2px solid #2E86FF}.licarea h2{color:#0742A8}
.pill{background:var(--mrbp);color:#0b2a6b}
.why .card{border-top:4px solid #2E86FF}
.foot .thx{color:#0742A8}
.rb-contractor{background:var(--mrgp);border-color:var(--mrg);color:#0b4a30}
.offer2{background:linear-gradient(135deg,#f5f9ff,#DCEAFF);border:1px solid #9cc4ff;box-shadow:0 4px 16px rgba(7,66,168,.12)}
.o-badge{background:var(--mrg);box-shadow:0 3px 10px rgba(1,123,77,.35)}
.o-h{color:#0742A8}.o-s{color:#24467f}.o-l li{color:#1d2b45}.o-l li:before{color:var(--mrg)}
.o-btn{background:var(--mrg)!important}
.okmsg.big{background:var(--mrgp);border-color:var(--mrg);color:#0b4a30}
/* smaller header picture (Ray 2026-11-13: it is huge) */
.hero{background:linear-gradient(90deg,#041f57,#0742A8);padding:10px 12px}
.hero img{max-width:560px;margin:0 auto;border-radius:12px;box-shadow:0 4px 16px rgba(0,0,0,.25)}
@media (max-width:600px){.hero{padding:8px}.hero img{border-radius:10px}}

/* header picture wider again (Ray 2026-11-13) */
.hero img{max-width:760px}

/* panoramic header strip, edge to edge (Ray 2026-11-13) */
.hero{padding:0;background:#041f57}
.hero img{max-width:none;width:100%;height:clamp(170px,41vw,440px);object-fit:cover;object-position:50% 22%;border-radius:0;box-shadow:none}

/* Microsoft panoramic header picture, whole image edge to edge (Ray 2026-11-13) */
.hero{padding:0;background:#041f57}
.hero img{max-width:none;width:100%;height:auto;max-height:none;object-fit:fill;border-radius:0;box-shadow:none}

/* invoices, listings, properties, fliers (Ray 2026-11-13) */
.bign{font-size:26px;font-weight:800;color:#0742A8}
.phgrid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.ph{display:flex;flex-direction:column;gap:6px;align-items:flex-start}.ph img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;border:1px solid #d6e2f5}
.lfx{display:flex;align-items:center;gap:8px;min-height:44px}
.rblogo{float:right;max-height:52px;max-width:140px;margin:-4px 0 0 10px;background:#fff;border-radius:8px;padding:3px}
.clogo{max-height:44px;max-width:110px;vertical-align:middle;margin-right:10px}
table.ptab tr[data-go]{cursor:pointer}table.ptab tr[data-go]:hover td{background:#f5f9ff}
.pthumb{width:120px;height:84px;object-fit:cover;border-radius:8px;display:block}
.pnone{display:flex;align-items:center;justify-content:center;background:#eef3fb;color:#3d4b63;font-size:14px}
.pprice{color:#0742A8;font-size:19px}
.pbig{width:100%;max-height:520px;object-fit:cover;display:block;background:#eef3fb}div.pbig{height:260px}
.pthumbs{display:flex;gap:6px;overflow-x:auto;padding:8px;background:#0b1f44}.pthumbs img{height:70px;width:100px;object-fit:cover;border-radius:6px;cursor:pointer;opacity:.75;border:2px solid transparent}.pthumbs img.on{opacity:1;border-color:#2FD68F}
.pgrid{display:grid;gap:14px;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);margin-top:14px}
.clv{min-height:44px;border:1px solid #b8c8e3;border-radius:10px;padding:10px;background:#fff}
@media (max-width:820px){.pgrid{grid-template-columns:1fr}.pthumb{width:90px;height:64px}}

/* shared calendar (Ray 2026-11-13) */
.cgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin-top:8px}
.cw{font-weight:700;text-align:center;font-size:13px;color:#3d4b63}
.cd{min-height:84px;border:1px solid #d6e2f5;border-radius:8px;padding:4px;background:#fff;cursor:pointer;overflow:hidden;min-width:0}
.cd.x{background:transparent;border:0;cursor:default}.cd.today{border:2px solid #2E86FF}.cd:hover{background:#f5f9ff}
.cdn{font-weight:700;font-size:13px}
.ce{font-size:12px;background:#DCEAFF;color:#0b2a6b;border-radius:4px;padding:1px 4px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ce.shared{background:#D8F7E8;color:#0b4a30}.cmore{font-size:11px;color:#3d4b63}
@media (max-width:600px){.cd{min-height:58px;padding:2px}.ce{font-size:10px;padding:0 2px}.cw{font-size:11px}}

/* building products and discounts (Ray 2026-11-13) */
.dbadge{display:inline-block;background:#017B4D;color:#fff;border-radius:999px;padding:3px 12px;font-weight:700;white-space:nowrap}
img.clogo{max-width:90px;max-height:44px;object-fit:contain;display:inline-block}

/* contractor Today desk (Ray 2026-11-13) */
.tdtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-bottom:14px}
.tdtile{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;cursor:pointer;margin:0;font:inherit;color:inherit;border:1px solid #d6e2f5;background:#fff;min-height:96px}
.tdtile:hover{background:#f5f9ff}.tdtile.hot{border:2px solid #017B4D;background:#D8F7E8}
.tdev{padding:8px 0;border-bottom:1px solid #e6edf8}.tdev:last-of-type{border-bottom:0}

.vtx{padding:8px 12px;border-radius:10px;margin:6px 0;max-width:640px}.vtx.vo{background:#DCEAFF}.vtx.vv{background:#D8F7E8;margin-left:auto}

/* ===== Friendlier look (Ray 2026-11-13: "please make the buttons stand out, everything looks so plain, the page needs to be more inviting and nicer") ===== */
body{background:linear-gradient(180deg,#eef5ff 0,#f6faff 420px,#f4f8fd 100%)}
/* buttons: bright Micro-Ray blue gradient, bold, raised */
button,.btn{background:linear-gradient(180deg,#2E86FF 0,#0742A8 100%);color:#fff;font-weight:700;letter-spacing:.2px;box-shadow:0 3px 0 #052f78,0 6px 14px rgba(7,66,168,.25);border:0}
button:hover,.btn:hover{background:linear-gradient(180deg,#4b98ff 0,#0b4fc4 100%);transform:translateY(-1px);box-shadow:0 4px 0 #052f78,0 10px 20px rgba(7,66,168,.3)}
button:active,.btn:active{transform:translateY(2px);box-shadow:0 1px 0 #052f78,0 3px 8px rgba(7,66,168,.25)}
button.alt,.btn.alt{background:#fff;color:#0742A8;border:2px solid #2E86FF;box-shadow:0 3px 0 #b9d4ff}
button.alt:hover,.btn.alt:hover{background:#DCEAFF;color:#0742A8}
button.ok{background:linear-gradient(180deg,#2FD68F 0,#017B4D 100%);box-shadow:0 3px 0 #015a38,0 6px 14px rgba(1,123,77,.25)}
button.bad{background:linear-gradient(180deg,#ff6b6b 0,#b42318 100%);box-shadow:0 3px 0 #7a1810}
header.top a.btn,header.top button{box-shadow:none}
header.top a.btn:not(.alt){background:linear-gradient(180deg,#2FD68F 0,#017B4D 100%)}
header.top a.btn.alt{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.45)}
/* dashboard tabs: big colorful pills with an icon each */
.tabs{gap:8px;padding:10px;background:#fff;border-radius:18px;box-shadow:0 4px 18px rgba(7,66,168,.08);border:1px solid #d6e2f5}
.tabs button{background:#f2f7ff;color:#0742A8;border:1px solid #cfe0fb;box-shadow:none;font-weight:700}
.tabs button:hover{background:#DCEAFF;transform:none;box-shadow:none}
.tabs button.on{background:linear-gradient(180deg,#2E86FF 0,#0742A8 100%);color:#fff;border-color:#0742A8;box-shadow:0 3px 10px rgba(7,66,168,.3)}
.tabs button::before{margin-right:6px}
.tabs button[data-t="today"]::before{content:"\1F4CB"}.tabs button[data-t="prof"]::before{content:"\1F3E2"}.tabs button[data-t="ppl"]::before{content:"\1F477"}
.tabs button[data-t="ins"]::before{content:"\1F6E1\FE0F"}.tabs button[data-t="req"]::before{content:"\1F4E5"}.tabs button[data-t="cal"]::before{content:"\1F4C5"}
.tabs button[data-t="hw"]::before{content:"\1F4E2"}.tabs button[data-t="shop"]::before{content:"\1F6D2"}.tabs button[data-t="emp"]::before{content:"\1F91D"}
.tabs button[data-t="pay"]::before{content:"\1F4B3"}.tabs button[data-t="fl"]::before{content:"\2709\FE0F"}.tabs button[data-t="lst"]::before{content:"\2B50"}
.tabs button[data-t="vans"]::before{content:"\1F690"}.tabs button[data-t="ads"]::before{content:"\1F4E3"}.tabs button[data-t="web"]::before{content:"\1F310"}
.tabs button[data-t="find"]::before{content:"\1F50E"}.tabs button[data-t="jobs"]::before{content:"\1F9F0"}.tabs button[data-t="rfq"]::before{content:"\1F4DD"}
.tabs button[data-t="bld"]::before{content:"\1F3D8\FE0F"}.tabs button[data-t="wv"]::before{content:"\1F4CD"}.tabs button[data-t="bills"]::before{content:"\1F9FE"}
.tabs button[data-t="props"]::before{content:"\1F3E1"}.tabs button[data-t="re"]::before{content:"\1FAAA"}.tabs button[data-t="inv"]::before{content:"\1F4E6"}
.tabs button[data-t="mp"]::before{content:"\1F3F7\FE0F"}.tabs button[data-t="dl"]::before{content:"\1F4B0"}.tabs button[data-t="iq"]::before{content:"\1F4E5"}
.tabs button[data-t="io"]::before{content:"\1F6E1\FE0F"}.tabs button[data-t="adm"]::before{content:"\2705"}.tabs button[data-t="rules"]::before{content:"\1F4DC"}.tabs button[data-t="fees"]::before{content:"\1F4B5"}
/* cards: softer, with a blue accent on headings */
.card{border-radius:18px;border:1px solid #d6e2f5;box-shadow:0 6px 22px rgba(7,66,168,.08)}
.card h2{color:#0b2a6b;padding-left:12px;border-left:5px solid #2E86FF;line-height:1.25}
.card h2[style*="margin-top:0"]{margin-top:0}
h1{color:#0b2a6b}
/* Today tiles: colored and lively */
.tdtile{border:0!important;color:#fff!important;box-shadow:0 6px 18px rgba(7,66,168,.2)!important;min-height:110px}
.tdtile .mut{color:rgba(255,255,255,.92)!important;font-weight:600}.tdtile .bign{color:#fff!important;font-size:34px}
.tdtiles .tdtile:nth-child(1){background:linear-gradient(135deg,#2FD68F,#017B4D)!important}
.tdtiles .tdtile:nth-child(2){background:linear-gradient(135deg,#4b98ff,#0742A8)!important}
.tdtiles .tdtile:nth-child(3){background:linear-gradient(135deg,#ffb547,#d9480f)!important}
.tdtiles .tdtile:nth-child(4){background:linear-gradient(135deg,#a78bfa,#6d28d9)!important}
.tdtiles .tdtile:nth-child(5){background:linear-gradient(135deg,#38bdf8,#0369a1)!important}
.tdtile:hover{transform:translateY(-2px)}
/* inputs: friendlier focus */
input:focus,select:focus,textarea:focus{outline:3px solid #9cc4ff;outline-offset:1px;border-color:#2E86FF}
table th{background:#f2f7ff;color:#0b2a6b}

.reqbox{background:#D8F7E8;border-radius:12px;padding:10px 14px;margin:8px 0}.reqbox ul{list-style:none;margin:6px 0 0;padding:0;columns:2;column-gap:20px}.reqbox li{break-inside:avoid;padding:2px 0}@media (max-width:600px){.reqbox ul{columns:1}}

/* Locations (Ray 2026-11-13) */
.loccard{border-top:5px solid #2E86FF}.lochead{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:flex-start;margin-bottom:10px}
.locstats{display:flex;gap:8px;flex-wrap:wrap}.locstats span{background:#DCEAFF;color:#0b2a6b;border-radius:999px;padding:6px 12px}
.locform{background:#f5f9ff;border:1px solid #d6e2f5;border-radius:14px;padding:14px;margin-top:8px}tr.won td{background:#D8F7E8}

/* side ad rails (Ray 2026-11-13) */
.srail{position:absolute;width:180px;display:none;z-index:5}.srail-l{left:14px}.srail-r{right:14px}
body.has-srail .srail{display:block}body.has-srail .sadrow{display:none}
.srail-in{position:sticky;top:16px;display:flex;flex-direction:column;gap:14px}
.sad{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid #d6e2f5;border-radius:16px;padding:14px;box-shadow:0 6px 18px rgba(7,66,168,.1);color:#0b2a6b;text-decoration:none;font-size:14px;line-height:1.35}
.sad small{font-size:11px;color:#5b6b85;text-transform:uppercase;letter-spacing:.6px}.sad b{font-size:16px}.sad i{font-style:normal;color:#5b6b85;font-size:12px}
.sad a{display:inline-block;align-self:flex-start;background:linear-gradient(180deg,#2E86FF,#0742A8);color:#fff;border-radius:999px;padding:8px 14px;font-weight:700;text-decoration:none;min-height:36px;line-height:20px}
.sad-empty{background:linear-gradient(160deg,#DCEAFF,#D8F7E8);border:2px dashed #2E86FF;text-align:left}
.sad-empty em{font-style:normal;font-weight:700;color:#0742A8}.sad-empty:hover{background:linear-gradient(160deg,#cfe2ff,#c6f2dd)}
.sadrow{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;max-width:1080px;margin:18px auto;padding:0 16px;box-sizing:border-box}

/* darker sides (Ray 2026-11-13: "make the sides of the page slightly darker for the work area") */
body{background:#dbe5f3}
@media (min-width:900px){.wrap{background:#f7faff;border-radius:22px;box-shadow:0 0 0 1px #cbdaf0,0 12px 34px rgba(7,66,168,.10);padding-top:22px;padding-bottom:26px;margin-top:18px;margin-bottom:18px}}
@media (max-width:899px){body{background:#e6eef9}}

/* compact pickers (Ray 2026-11-13) */
.spk{position:relative;margin:4px 0 8px}.spk-bar{display:flex;gap:8px;flex-wrap:wrap}.spk-q{flex:1 1 220px;min-width:0}
.spk-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.spk-chip{display:inline-flex;align-items:center;gap:4px;background:#DCEAFF;color:#0b2a6b;border-radius:999px;padding:4px 4px 4px 12px;font-weight:600}
.spk-x{background:#fff!important;color:#0742A8!important;box-shadow:none!important;border:1px solid #b9d4ff!important;border-radius:999px;min-height:30px;width:30px;padding:0;font-size:18px;line-height:1}
.spk .grid.hwt.spk-list{display:none;max-height:300px;overflow:auto;border:1px solid #cfe0fb;border-radius:14px;padding:10px;background:#fff;margin-top:8px;box-shadow:0 10px 24px rgba(7,66,168,.12)}
.spk.open .grid.hwt.spk-list{display:grid}.spk-list.spk-none::after{content:"Nothing matches. Try another word.";color:#5b6b85}

.tabs button[data-t="sup"]::before{content:"\1F3EA"}

.tabs button[data-t="cl"]::before{content:"\1F465"}.tabs button[data-t="ct"]::before{content:"\270D"}

.stile{display:block;padding:16px;border-radius:16px;background:linear-gradient(135deg,#eaf3ff,#fff);border:1px solid #cfe0fb;text-decoration:none;color:#0b2a6b;font-weight:600}.stile:hover{border-color:#2E86FF}.tabs button[data-t="home"]::before{content:"\1F4CA"}.tabs button[data-t="up"]::before{content:"\1F4E4"}

.tabs button[data-t="vs"]::before{content:"\1F5FA"}

.tabs button[data-t="com"]::before{content:"\1F4AC"}.tabs button[data-t="team"]::before{content:"\1F91D"}

.tabs button[data-t="pb"]::before{content:"\1F4B2"}

/* small radio buttons */#radio .ptt,#radio [data-r="on"]{width:auto;height:auto;min-height:34px;font-size:13px;line-height:1.2;padding:6px 10px;border-radius:999px;box-shadow:none}

.tabs button[data-t="myvan"]::before{content:"\1F690"}

.tabs button[data-t="fav"]::before{content:"\2B50"}.favb[aria-pressed=true]{color:#8a5a00;border-color:#e8a10c}

.tabs button[data-t="qt"]::before{content:"\1F4DD"}.tabs button[data-t="sug"]::before{content:"\1F4AC"}
