/* SmileDice 25.9 — Scoped exclusively to Saved Picks / Unlocked Picks. */ #sport-screen #sp-view-saved{--su-ink:#f0faff;--su-muted:#a1bbd2;--su-blue:#31b7ef;--su-accent:#34d3f0;--su-line:#22557a;--su-base:#041524;color:var(--su-ink)} #sport-screen #sp-view-saved .sp-su,#sport-screen #sp-view-saved .sp-su *{box-sizing:border-box} #sport-screen #sp-view-saved .sp-su{display:grid;gap:17px;width:100%;min-width:0;padding:0 0 25px} #sport-screen #sp-view-saved .sp-su-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:center;overflow:hidden;min-height:206px;padding:27px 35px;border-radius:21px;border:1px solid #216a9c;background:radial-gradient(ellipse at 77% 20%,#145482a1 0,transparent 46%),linear-gradient(115deg,#06182d 0%,#082846 55%,#071c3d 100%);box-shadow:inset 0 1px #62d8ff0e,0 12px 28px #0004} #sport-screen #sp-view-saved .sp-su-hero:before{position:absolute;content:"";inset:0;pointer-events:none;opacity:.34;background-image:linear-gradient(#4abcf80d 1px,transparent 1px),linear-gradient(90deg,#4abcf80d 1px,transparent 1px);background-size:47px 47px} #sport-screen #sp-view-saved .sp-su-hero-copy{position:relative;z-index:1} #sport-screen #sp-view-saved .sp-su-eyebrow{display:block;margin:0 0 13px;color:#76dafa;font-size:11px;letter-spacing:.14em;font-weight:900} #sport-screen #sp-view-saved .sp-su-hero h2{margin:0 0 12px;font-size:clamp(31px,3.3vw,50px);line-height:1.04;letter-spacing:-.045em;font-weight:950;color:#f5faff} #sport-screen #sp-view-saved .sp-su-hero h2 em{font-style:normal;color:#32d1ee} #sport-screen #sp-view-saved .sp-su-hero p{max-width:670px;margin:0;color:#bbd4e8;font-size:13px;line-height:1.7;font-weight:550} #sport-screen #sp-view-saved .sp-su-ticket-scene{position:relative;height:168px;display:flex;align-items:center;justify-content:center} #sport-screen #sp-view-saved .sp-su-orbit{position:absolute;width:90%;height:65%;border:1px solid #31dbf566;border-radius:50%;transform:rotate(-18deg)} #sport-screen #sp-view-saved .sp-su-ticket{position:relative;width:164px;height:97px;display:grid;place-items:center;border:1px solid #90ebff61;border-radius:17px;transform:rotate(-9deg);background:linear-gradient(140deg,#1155a3,#21b4e8 58%,#2672bf);box-shadow:0 17px 33px #0008,0 0 45px #17bbef33;font-size:50px;color:#defaff} #sport-screen #sp-view-saved .sp-su-ticket:after{content:"";position:absolute;width:17px;height:17px;right:17px;top:13px;background:#e7bb58;border-radius:5px;box-shadow:0 0 0 5px #083855a0} #sport-screen #sp-view-saved .sp-su-access-chip{position:absolute;right:0;bottom:4px;min-width:142px;padding:12px 13px;border-radius:13px;border:1px solid #2773ab;background:#06192fe9;box-shadow:0 9px 26px #0006;display:flex;flex-direction:column;gap:5px} #sport-screen #sp-view-saved .sp-su-access-chip small{font-size:9px;letter-spacing:.12em;color:#87e4ff;font-weight:900} #sport-screen #sp-view-saved .sp-su-access-chip strong{font-size:25px;line-height:1;color:#fff} #sport-screen #sp-view-saved .sp-su-access-chip span{font-size:10px;color:#abc6dd} #sport-screen #sp-view-saved .sp-su-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px} #sport-screen #sp-view-saved .sp-su-kpi{min-width:0;display:flex;flex-direction:column;gap:6px;padding:15px 18px 14px;border-radius:15px;border:1px solid #25577d;background:linear-gradient(145deg,#09223b,#061829)} #sport-screen #sp-view-saved .sp-su-kpi small{font-size:10px;letter-spacing:.09em;color:#b4d1e5;font-weight:900} #sport-screen #sp-view-saved .sp-su-kpi strong{font-size:25px;line-height:1;color:#e9f8ff;font-weight:900} #sport-screen #sp-view-saved .sp-su-kpi[data-type=won]{border-color:#1d765e;background:linear-gradient(140deg,#07352d,#071d2a)} #sport-screen #sp-view-saved .sp-su-kpi[data-type=lost]{border-color:#853957;background:linear-gradient(140deg,#32182b,#121929)} #sport-screen #sp-view-saved .sp-su-kpi[data-type=pending]{border-color:#896326;background:linear-gradient(140deg,#342914,#101d2d)} #sport-screen #sp-view-saved .sp-su-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border:1px solid #235278;border-radius:15px;background:#071e33} #sport-screen #sp-view-saved .sp-su-mode-tabs,#sport-screen #sp-view-saved .sp-su-filters{display:flex;flex-wrap:wrap;align-items:center;gap:8px} #sport-screen #sp-view-saved button[data-su-mode],#sport-screen #sp-view-saved button[data-su-filter],#sport-screen #sp-view-saved button[data-su-refresh]{border:1px solid #2b5376;background:#0b263e;color:#cbe9f7;min-height:38px;padding:9px 14px;border-radius:10px;cursor:pointer;font:inherit;font-size:12px;font-weight:850;white-space:nowrap;transition:border-color .15s,background .15s,color .15s} #sport-screen #sp-view-saved button[data-su-mode].is-active,#sport-screen #sp-view-saved button[data-su-filter].is-active{border-color:#44bfe6;background:linear-gradient(110deg,#3bb8f3,#2671d4);color:#06192a} #sport-screen #sp-view-saved button[data-su-mode]:hover,#sport-screen #sp-view-saved button[data-su-filter]:hover,#sport-screen #sp-view-saved button[data-su-refresh]:hover{border-color:#55b9e5} #sport-screen #sp-view-saved button[data-su-filter] b{display:inline-grid;place-items:center;min-width:23px;margin-left:3px;padding:2px 5px;border-radius:10px;background:#ffffff14;font-size:11px} #sport-screen #sp-view-saved .sp-su-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 0 0} #sport-screen #sp-view-saved .sp-su-section-head h3{margin:0;font-size:16px;letter-spacing:.03em;color:#ecf9ff;font-weight:900} #sport-screen #sp-view-saved #sp-su-purchased{display:grid;gap:12px} #sport-screen #sp-view-saved #sp-su-results{display:grid;gap:12px} #sport-screen #sp-view-saved .sp-su-card{border:1px solid #276a96;border-radius:16px;background:linear-gradient(120deg,#091e36,#071a2e 62%,#092a3f);overflow:hidden;box-shadow:inset 0 1px #9be6ff11,0 7px 20px #0004} #sport-screen #sp-view-saved .sp-su-card-top{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:11px 17px;background:linear-gradient(90deg,#0d2a46,#08203a);border-bottom:1px solid #255a7b} #sport-screen #sp-view-saved .sp-su-unlock-badge{color:#8ce9ff;font-size:10px;font-weight:900;letter-spacing:.12em} #sport-screen #sp-view-saved .sp-su-status{display:inline-flex;align-items:center;justify-content:center;padding:5px 11px;border:1px solid #836c35;color:#ffdd93;background:#4b382a44;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.03em} #sport-screen #sp-view-saved .sp-su-status.is-won{border-color:#26ae82;color:#83f0c6;background:#064635} #sport-screen #sp-view-saved .sp-su-status.is-lost{border-color:#a44d68;color:#ff98b2;background:#4b2035} #sport-screen #sp-view-saved .sp-su-status.is-void,#sport-screen #sp-view-saved .sp-su-status.is-unavailable{border-color:#527187;color:#bdd1df;background:#193044} #sport-screen #sp-view-saved .sp-su-card-body{display:grid;grid-template-columns:minmax(0,1fr) 235px;gap:18px;padding:18px} #sport-screen #sp-view-saved .sp-su-match{min-width:0} #sport-screen #sp-view-saved .sp-su-match>small{display:block;font-size:10px;color:#8edcf9;font-weight:900;letter-spacing:.08em} #sport-screen #sp-view-saved .sp-su-match h3{margin:7px 0 6px;font-size:clamp(16px,1.5vw,21px);font-weight:950;line-height:1.3;color:#f3fbff} #sport-screen #sp-view-saved .sp-su-match h3 span{color:#659cbd;font-size:.7em} #sport-screen #sp-view-saved .sp-su-author{font-size:11px;color:#a7c5d9} #sport-screen #sp-view-saved .sp-su-author b{color:#eaf8ff} #sport-screen #sp-view-saved .sp-su-pick-fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:16px} #sport-screen #sp-view-saved .sp-su-pick-fields span{display:flex;flex-direction:column;gap:4px;padding:10px;border:1px solid #1d4869;border-radius:10px;background:#061b30} #sport-screen #sp-view-saved .sp-su-pick-fields small{font-size:10px;color:#87b4d0} #sport-screen #sp-view-saved .sp-su-pick-fields b{font-size:12px;color:#54dcff;overflow-wrap:anywhere} #sport-screen #sp-view-saved .sp-su-card-side{display:flex;flex-direction:column;gap:8px;align-items:stretch;padding:14px;border:1px solid #275b82;border-radius:12px;background:linear-gradient(180deg,#0c2a47,#071b2d)} #sport-screen #sp-view-saved .sp-su-card-side small{font-size:10px;color:#90c0df;letter-spacing:.1em;font-weight:900} #sport-screen #sp-view-saved .sp-su-card-side strong{font-size:21px;color:#f6fcff} #sport-screen #sp-view-saved .sp-su-card-side>span{font-size:10px;color:#9ebed6} #sport-screen #sp-view-saved .sp-su-detail-button,#sport-screen #sp-view-saved .sp-su-empty button{border:1px solid #56d0f1;background:linear-gradient(115deg,#38c6f7,#2878db);color:#031a29;font:inherit;font-size:12px;font-weight:900;border-radius:10px;padding:11px 13px;cursor:pointer;margin-top:auto} #sport-screen #sp-view-saved button:disabled{opacity:.65;cursor:not-allowed} #sport-screen #sp-view-saved .sp-su-unavailable{padding:12px 0;color:#b7c6d8;font-size:12px} #sport-screen #sp-view-saved .sp-su-empty{display:flex;align-items:center;flex-direction:column;justify-content:center;text-align:center;gap:10px;padding:39px 25px;border:1px dashed #2c6589;border-radius:18px;background:linear-gradient(125deg,#081c30,#092f40);min-height:205px} #sport-screen #sp-view-saved .sp-su-empty-icon{width:55px;height:55px;display:grid;place-items:center;border-radius:16px;border:1px solid #2478a5;color:#80e7ff;background:#0e3954;font-size:29px} #sport-screen #sp-view-saved .sp-su-empty h3{color:#f4fbff;margin:0;font-size:18px} #sport-screen #sp-view-saved .sp-su-empty p{max-width:600px;color:#a8c5d8;margin:0;font-size:12px;line-height:1.65} #sport-screen #sp-view-saved .sp-su-empty button{margin-top:5px;min-width:145px} #sport-screen #sp-view-saved #sp-su-show-more{justify-self:center;border-radius:10px;background:#0c2c4b;border:1px solid #2e719c;color:#cdf3ff;padding:10px 24px;font-weight:800;cursor:pointer} #sport-screen #sp-view-saved #sp-su-bookmarks{display:grid;gap:10px} #sport-screen #sp-view-saved #sp-su-bookmarks[hidden],#sport-screen #sp-view-saved #sp-su-purchased[hidden]{display:none!important} #sport-screen #sp-view-saved #sp-su-bookmarks .sp-picks{display:grid;gap:12px} #sport-screen #sp-view-saved .sp-su-bookmark-note{font-size:12px;color:#afc8da;margin:0 0 8px} #sport-screen #sp-view-saved .sp-su-dialog{position:fixed;inset:0;z-index:2147483200;display:flex;align-items:center;justify-content:center;overflow-y:auto;background:#000b;padding:22px} #sport-screen #sp-view-saved .sp-su-dialog[hidden]{display:none!important} #sport-screen #sp-view-saved .sp-su-dialog-panel{position:relative;width:min(700px,100%);max-height:92vh;overflow-y:auto;background:linear-gradient(135deg,#0d2b49,#05192b);color:#ecfaff;border:1px solid #3c9dcc;border-radius:20px;box-shadow:0 25px 100px #000b;padding:28px} #sport-screen #sp-view-saved .sp-su-dialog-panel>button{position:absolute;right:15px;top:12px;border:1px solid #2b6a93;border-radius:9px;background:#0a304e;color:white;padding:6px 12px;cursor:pointer;font-size:19px} #sport-screen #sp-view-saved .sp-su-dialog-panel h2{font-size:clamp(20px,3vw,30px);line-height:1.2;margin:16px 0 8px} #sport-screen #sp-view-saved .sp-su-dialog-subtitle{color:#aacbde;font-size:12px} #sport-screen #sp-view-saved .sp-su-dialog-info{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:18px 0} #sport-screen #sp-view-saved .sp-su-dialog-info>div{display:grid;gap:7px;border:1px solid #265274;background:#071c33;border-radius:10px;padding:11px} #sport-screen #sp-view-saved .sp-su-dialog-info small{color:#99bbd3;font-size:10px} #sport-screen #sp-view-saved .sp-su-dialog-info b{color:#8fe7ff;overflow-wrap:anywhere} #sport-screen #sp-view-saved .sp-su-detail-legs{border-top:1px solid #264d70;padding-top:10px} #sport-screen #sp-view-saved .sp-su-detail-legs p{font-size:12px;color:#cce8fa} #sport-screen #sp-view-saved .sp-su-analysis h4{font-size:15px;margin-bottom:9px} #sport-screen #sp-view-saved .sp-su-analysis>p{white-space:pre-wrap;font-size:13px;line-height:1.7;color:#d4ebfa} #sport-screen #sp-view-saved .sp-su-legal{border-top:1px solid #25547d;padding-top:12px;font-size:11px;color:#8caac0} #sport-screen #sp-view-saved [hidden]{display:none!important} @media(max-width:960px){#sport-screen #sp-view-saved .sp-su-hero{grid-template-columns:minmax(0,1fr) 230px;padding:24px}#sport-screen #sp-view-saved .sp-su-pick-fields{grid-template-columns:repeat(2,minmax(0,1fr))}#sport-screen #sp-view-saved .sp-su-card-body{grid-template-columns:minmax(0,1fr) 205px}} @media(max-width:680px){#sport-screen #sp-view-saved .sp-su-hero{grid-template-columns:1fr;gap:8px;padding:21px;min-height:unset}#sport-screen #sp-view-saved .sp-su-ticket-scene{height:120px}#sport-screen #sp-view-saved .sp-su-access-chip{right:5%;bottom:0}#sport-screen #sp-view-saved .sp-su-ticket{width:132px;height:76px;font-size:37px}#sport-screen #sp-view-saved .sp-su-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}#sport-screen #sp-view-saved .sp-su-card-body{grid-template-columns:1fr}#sport-screen #sp-view-saved .sp-su-card-side{gap:6px}#sport-screen #sp-view-saved .sp-su-toolbar{align-items:stretch}#sport-screen #sp-view-saved .sp-su-mode-tabs{width:100%}#sport-screen #sp-view-saved .sp-su-dialog-info{grid-template-columns:repeat(2,minmax(0,1fr))}#sport-screen #sp-view-saved .sp-su-dialog-panel{padding:22px 17px}} /* v25.9.1 — SmileDice premium palette parity. Scoped ONLY to Saved Picks. Mirrors the navy/royal-blue/cyan depth, rounded pills and selective gold used in Top Tipsters. This is cosmetic: no purchase or filter logic changes. */ #sport-screen #sp-view-saved{ --su-ink:#f6f9ff;--su-muted:#b5cce5;--su-blue:#348de6; --su-accent:#35e4f5;--su-line:#2e6fa8;--su-base:#071426; font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif; } #sport-screen #sp-view-saved .sp-su{gap:16px} #sport-screen #sp-view-saved .sp-su-hero{ border-color:#327cae; background:radial-gradient(ellipse 56% 115% at 73% 28%,#125a9aa8,transparent 76%), radial-gradient(ellipse 50% 90% at 0% 105%,#033a666a,transparent 75%), linear-gradient(108deg,#112d55 0%,#05203d 62%,#112f59 100%); box-shadow:0 16px 37px #030e2966,inset 0 1px #57bff342,0 0 23px #038bd214; } #sport-screen #sp-view-saved .sp-su-hero:before{ opacity:.58; background-image:linear-gradient(#63c8ff0b 1px,transparent 1px),linear-gradient(90deg,#63c8ff0b 1px,transparent 1px); } #sport-screen #sp-view-saved .sp-su-eyebrow{color:#5be6ff} #sport-screen #sp-view-saved .sp-su-hero h2 em{color:#25d9f4;text-shadow:0 0 22px #15c9fc24} #sport-screen #sp-view-saved .sp-su-hero p{color:#c3d7ee} #sport-screen #sp-view-saved .sp-su-orbit{border-color:#47d9ff82;box-shadow:0 0 17px #22bfff18} #sport-screen #sp-view-saved .sp-su-ticket{ border-color:#89d6ff9c; background:linear-gradient(140deg,#1366bd,#29c6f3 55%,#2c6bd5); box-shadow:0 18px 40px #0008,0 0 29px #23bfff58; } #sport-screen #sp-view-saved .sp-su-access-chip{ border-color:#399dd4;background:linear-gradient(145deg,#0d2950f5,#061936f7); box-shadow:0 9px 26px #0007,inset 0 1px #80e3ff30,0 0 17px #178fe23b; } #sport-screen #sp-view-saved .sp-su-access-chip strong{color:#4de0ff} #sport-screen #sp-view-saved .sp-su-kpi{ position:relative;overflow:hidden;min-height:80px; border-color:#376ea8; background:radial-gradient(ellipse at 100% 0%,#17609f43,transparent 75%),linear-gradient(135deg,#102a50,#0a1a33); box-shadow:inset 0 1px #7fd3ff23,0 5px 18px #0004; } #sport-screen #sp-view-saved .sp-su-kpi:before{ content:"";position:absolute;inset:0 auto auto 0;width:100%;height:2px; background:linear-gradient(90deg,#1ed2fb,#348de6 62%,transparent); } #sport-screen #sp-view-saved .sp-su-kpi[data-type=won], #sport-screen #sp-view-saved .sp-su-kpi[data-type=lost], #sport-screen #sp-view-saved .sp-su-kpi[data-type=pending]{ background:radial-gradient(ellipse at 100% 0%,#17609f43,transparent 75%),linear-gradient(135deg,#102a50,#0a1a33); border-color:#376ea8; } #sport-screen #sp-view-saved .sp-su-kpi[data-type=won]:before{background:linear-gradient(90deg,#26e4b2,#23b2cf 64%,transparent)} #sport-screen #sp-view-saved .sp-su-kpi[data-type=lost]:before{background:linear-gradient(90deg,#fc658b,#748ce5 64%,transparent)} #sport-screen #sp-view-saved .sp-su-kpi[data-type=pending]:before{background:linear-gradient(90deg,#f7c65f,#328dd9 64%,transparent)} #sport-screen #sp-view-saved .sp-su-kpi strong{color:#fff;font-size:27px} #sport-screen #sp-view-saved .sp-su-kpi[data-type=all] strong{color:#45d8ff} #sport-screen #sp-view-saved .sp-su-kpi[data-type=won] strong{color:#5df3c3} #sport-screen #sp-view-saved .sp-su-kpi[data-type=lost] strong{color:#ff8eac} #sport-screen #sp-view-saved .sp-su-kpi[data-type=pending] strong{color:#ffd17a} #sport-screen #sp-view-saved .sp-su-toolbar{ border-color:#327caf;background:linear-gradient(105deg,#0c2748,#071932 82%); box-shadow:inset 0 1px #66bdff21,0 7px 20px #0003; } #sport-screen #sp-view-saved button[data-su-mode], #sport-screen #sp-view-saved button[data-su-filter], #sport-screen #sp-view-saved button[data-su-refresh]{ border-color:#37679a;background:linear-gradient(180deg,#122f53,#0a2340); color:#dbeeff;border-radius:21px; } #sport-screen #sp-view-saved button[data-su-mode].is-active, #sport-screen #sp-view-saved button[data-su-filter].is-active{ border-color:#80d4ff;background:linear-gradient(115deg,#32d0f6,#348fe8 73%,#345fd0); color:#061c32;box-shadow:0 4px 18px #1688d853,inset 0 1px #fff5; } #sport-screen #sp-view-saved button[data-su-mode]:focus-visible, #sport-screen #sp-view-saved button[data-su-filter]:focus-visible, #sport-screen #sp-view-saved button[data-su-refresh]:focus-visible, #sport-screen #sp-view-saved .sp-su-detail-button:focus-visible{ outline:2px solid #72eaff;outline-offset:2px; } #sport-screen #sp-view-saved .sp-su-section-head h3{color:#f5faff;letter-spacing:.06em} #sport-screen #sp-view-saved .sp-su-empty{ border-color:#327fb4; background:radial-gradient(ellipse at 50% 100%,#0b506e48,transparent 70%), radial-gradient(ellipse at 100% 0%,#123d775c,transparent 72%), linear-gradient(130deg,#091f3b,#071931); box-shadow:inset 0 1px #4ecbff20,0 0 21px #078bcf17; } #sport-screen #sp-view-saved .sp-su-empty-icon{ border-color:#3aa3d8;color:#8decff;background:linear-gradient(145deg,#15558e,#0c2854); box-shadow:0 0 18px #1eaffd36; } #sport-screen #sp-view-saved .sp-su-empty button, #sport-screen #sp-view-saved .sp-su-detail-button{ border-color:#85d8ff;background:linear-gradient(108deg,#32d0f6,#3395e9 70%,#3471dc); box-shadow:0 5px 20px #178be64b,inset 0 1px #fff5;border-radius:11px; } #sport-screen #sp-view-saved .sp-su-card{ border-color:#3289bd;background:radial-gradient(ellipse at 38% 0%,#0d4e8063,transparent 62%), linear-gradient(110deg,#0b2745,#081a33 74%,#0e2b4f); box-shadow:0 8px 28px #0007,inset 0 1px #89d6ff23; } #sport-screen #sp-view-saved .sp-su-card-top{background:linear-gradient(95deg,#153964,#0a2242);border-bottom-color:#3276a2} #sport-screen #sp-view-saved .sp-su-pick-fields span{background:#0b2444;border-color:#2b6391} #sport-screen #sp-view-saved .sp-su-card-side{background:linear-gradient(155deg,#133a68,#091d39);border-color:#3b84b5} #sport-screen #sp-view-saved .sp-su-dialog-panel{ border-color:#4db9e9;background:linear-gradient(145deg,#163960,#0a1e3d 65%,#07172d); box-shadow:0 25px 100px #000b,0 0 27px #189bdf36; } #sport-screen #sp-view-saved #sp-su-show-more{border-color:#468ac4;background:#0e3158} @media(max-width:680px){ #sport-screen #sp-view-saved .sp-su-hero{padding:21px} #sport-screen #sp-view-saved .sp-su-toolbar{gap:10px} #sport-screen #sp-view-saved button[data-su-mode], #sport-screen #sp-view-saved button[data-su-filter]{padding:9px 12px;min-height:37px} #sport-screen #sp-view-saved .sp-su-kpi{min-height:75px} }