:root{font-family:Arial,Helvetica,sans-serif;color:#eff7ff;background:#031026}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 30% 0,#123b78 0,#061c3d 40%,#030b1d 100%);min-height:100vh}button,input,textarea,select{font:inherit}button{cursor:pointer}.shell{max-width:1280px;margin:auto;padding:28px 22px 70px}header{display:flex;justify-content:space-between;gap:24px;align-items:center;margin-bottom:28px}.brand{font-size:2rem;font-weight:900;letter-spacing:-2px;width:220px;max-width:32vw;display:flex;align-items:center;min-height:60px}.brand img{display:block;max-width:100%;max-height:70px;width:auto;height:auto;object-fit:contain;object-position:left center}.brand span{color:#2eb3ff}.heading{text-align:center}h1{font-size:clamp(1.5rem,3vw,2.4rem);margin:0 0 6px}.heading p{margin:0;color:#b9cde8}.admin-btn,.pill{border:1px solid #4b81bd;background:#092f61;color:white;border-radius:10px;padding:10px 16px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.card{background:linear-gradient(145deg,#12376d,#071b39);border:1px solid #3371bc;border-radius:18px;overflow:hidden;min-height:300px;box-shadow:0 15px 35px #0004}.card:nth-child(2){background:linear-gradient(145deg,#075e37,#062d2a);border-color:#1fbb7d}.card:nth-child(3){background:linear-gradient(145deg,#596d8b,#182b4b);border-color:#a9bfdc}.card:nth-child(4){background:linear-gradient(145deg,#6331a0,#1d124d);border-color:#8d59e9}.card:nth-child(5){background:linear-gradient(145deg,#075682,#062142)}.card:nth-child(6){background:linear-gradient(145deg,#375375,#0b1d3e)}.cover{width:100%;height:150px;object-fit:cover;display:block}.cover-placeholder.ios-mark{font-family:Arial,Helvetica,sans-serif;font-size:4.7rem;font-weight:300;letter-spacing:-.08em}.cover-placeholder{height:150px;display:grid;place-items:center;font-size:4rem;background:linear-gradient(120deg,#ffffff20,#ffffff05)}.card-body{padding:18px}.card h2{font-size:1.4rem;margin:0 0 6px}.card p{color:#d5e5f6;margin:0 0 15px;min-height:38px}.apps{display:flex;flex-wrap:wrap;gap:8px}.download-btn{width:100%;background:linear-gradient(180deg,#23baff,#0068ea);border:0;border-radius:9px;color:white;font-weight:700;padding:12px;margin:0 0 12px;box-shadow:0 5px 15px #001a4b88}.card:nth-child(2) .download-btn{background:linear-gradient(180deg,#56f2a2,#0aa865)}.card:nth-child(3) .download-btn{background:linear-gradient(180deg,#dae8fa,#8baacc);color:#152d4e}.app-button{border:1px solid #77c6ff;color:white;background:#0063c7;border-radius:8px;padding:9px 13px}.below{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}.panel{background:#071c38e8;border:1px solid #315987;border-radius:18px;padding:22px}.panel h2{margin:0 0 16px;font-size:1.35rem}.item{padding:14px 0;border-top:1px solid #294a71}.item strong{display:block;margin-bottom:6px}.item.open-item{cursor:pointer;border-radius:9px;padding:14px 10px;transition:background .15s}.item.open-item:hover,.item.open-item:focus-visible{background:#143965;outline:2px solid #60b5ff;outline-offset:1px}.item .arrow{color:#75c7ff;float:right;font-weight:700}.item p{margin:0;line-height:1.5;color:#c3d6eb;white-space:pre-wrap}.item time{display:block;color:#82b9e8;font-size:.88rem;margin-bottom:6px}.empty{color:#9fbad5}.overlay{position:fixed;inset:0;background:#000b;display:none;align-items:center;justify-content:center;padding:18px;z-index:10}.overlay.open{display:flex}.dialog{background:#071d3a;border:1px solid #4c87c9;border-radius:18px;width:min(650px,100%);max-height:90vh;overflow:auto;padding:24px;box-shadow:0 25px 70px #0009}.dialog.wide{width:min(950px,100%)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog h2{margin:0 0 16px}.setup-image{display:block;width:100%;max-height:460px;object-fit:contain;background:#0c2b50;border:1px solid #386994;border-radius:12px;margin:15px 0}.app-editor{padding:15px;border:1px solid #37608d;border-radius:12px;margin:12px 0;background:#0a284c}.app-editor h4{margin:0 0 12px}.close{border:0;background:transparent;color:white;font-size:1.8rem}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 20px}.tabs button{border:1px solid #4775a7;background:#12345e;color:white;padding:10px;border-radius:8px}.tabs button.active{background:#0879df}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}label{display:grid;gap:6px;color:#d2e4f8;margin-bottom:13px}input,textarea,select{width:100%;border:1px solid #4b709b;background:#0b294f;color:white;border-radius:8px;padding:10px}textarea{min-height:80px;resize:vertical}.full{grid-column:1/-1}.save{background:#0585ee;color:white;border:0;padding:11px 18px;border-radius:9px}.danger{background:#6d2441;color:white;border:0;padding:8px 11px;border-radius:7px}.row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px;border:1px solid #294a71;border-radius:9px;margin:7px 0}.hint{color:#a8c3df;font-size:.9rem;line-height:1.5}.feedback{color:#75e7ae;min-height:1.3em}@media(max-width:800px){header{flex-wrap:wrap}.heading{text-align:left;order:3;width:100%}.grid{grid-template-columns:repeat(2,1fr)}.below{grid-template-columns:1fr}}@media(max-width:550px){.grid,.form-grid{grid-template-columns:1fr}.card{min-height:0}.shell{padding:18px 14px 50px}}

.admin-links{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.admin-links a,.admin-links button{color:#e1f3ff;background:#0c396c;border:1px solid #4a83bb;border-radius:8px;padding:9px 12px;text-decoration:none}.admin-links form{margin:0}@media(max-width:800px){.admin-links{order:4}}

/* FiLBOX device and setup centre */
:root{color-scheme:dark;font-family:Inter,"Segoe UI",Arial,sans-serif;color:#eef2f8;background:#0a101b}html{scroll-behavior:smooth;scroll-padding-top:24px}body{background:radial-gradient(ellipse at 80% 0%,#172d494d,transparent 48%),#0a101b;line-height:1.5}button,input,textarea,select{font:inherit}button,a,input,select,textarea{ -webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #58d6c6;outline-offset:4px}[hidden]{display:none!important}.shell{max-width:1240px;padding:0 32px 32px}header{min-height:108px;padding:24px 0;border-bottom:1px solid #ffffff12;margin-bottom:0;gap:24px}.brand{width:150px;min-height:40px;letter-spacing:-1px;font-size:28px;flex-shrink:0}.brand img{max-height:52px}.brand span{color:#f5f7fb}.heading{flex:1;text-align:left}.heading h1{font-size:16px;letter-spacing:-.2px;margin:0 0 3px}.heading p{font-size:12px;color:#93a4ba}.admin-btn,.pill{background:#172336;border:1px solid #ffffff1c;border-radius:9px;font-size:13px;font-weight:600;white-space:nowrap}.admin-links{display:flex;gap:12px;align-items:center;font-size:11px}.admin-links a{color:#a4b7cd;text-decoration:none}.admin-links form{margin:0}.admin-links button{border:0;background:transparent;color:#a4b7cd;padding:7px;white-space:nowrap}.welcome{display:grid;grid-template-columns:1.5fr 1fr;gap:72px;padding:66px 0 54px;align-items:center}.eyebrow{display:block;font-size:10px;font-weight:700;letter-spacing:2px;color:#65d9cb;margin-bottom:14px}.welcome h2{font-size:clamp(36px,4.4vw,60px);line-height:1.08;letter-spacing:-2px;margin:0 0 20px;font-weight:750}.welcome h2 span{color:#69d8ca}.welcome>div>p{font-size:15px;line-height:1.8;color:#9eafc3;max-width:430px;margin:0 0 25px}.hero-link{display:inline-flex;gap:28px;align-items:center;padding:12px 18px;border-radius:9px;background:#66d8c8;color:#081b1b;font-size:13px;font-weight:750;text-decoration:none}.hero-link:hover{background:#8ce5d9}.hero-guide{border:1px solid #ffffff12;background:linear-gradient(135deg,#18283b,#111b2b);padding:28px 32px;border-radius:20px;position:relative;overflow:hidden}.guide-number{font-size:11px;letter-spacing:4px;color:#6b819b}.hero-guide h3{font-size:23px;letter-spacing:-.5px;margin:13px 0 22px}.hero-guide p{display:flex;align-items:center;gap:14px;color:#cbd5e3;font-size:13px;margin:15px 0}.hero-guide b{display:grid;place-items:center;width:29px;height:29px;border:1px solid #4ad2bd33;border-radius:8px;color:#79dbce;background:#63dac50b;font-size:10px}.guide-note{display:block;border-top:1px solid #ffffff10;margin-top:23px;padding-top:17px;color:#71869e;font-size:11px}.device-heading{display:flex;justify-content:space-between;gap:24px;align-items:end;margin:18px 0 24px}.device-heading .eyebrow{color:#8296af;font-size:9px;margin-bottom:8px}.device-heading h2{font-size:23px;letter-spacing:-.7px;margin:0}.search-label{width:280px;margin:0;gap:6px;font-size:11px;color:#8397af}.search-label input{background:#111b29;border-color:#ffffff16;font-size:12px;padding:11px 14px}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.card,.card:nth-child(n){background:#121d2c;border:1px solid #ffffff12;border-radius:15px;box-shadow:none;min-height:0;position:relative;display:flex;flex-direction:column;padding:22px;transition:border-color .18s,transform .18s}.card:hover{border-color:#58d0c65c;transform:translateY(-3px)}.cover-placeholder,.cover-placeholder.ios-mark{height:52px;width:58px;border-radius:12px;font-size:25px;font-weight:700;letter-spacing:-1px;color:#89dcd4;background:#72c8f30c;border:1px solid #ffffff0a;place-items:center;align-self:start}.cover{height:92px;width:100%;object-fit:contain;background:#ffffff06;border-radius:10px;margin-bottom:8px}.card:nth-child(2) .cover-placeholder{background:#77dda00c}.card:nth-child(3) .cover-placeholder{font-size:21px;color:#c3d2e4}.card-body{padding:18px 0 0;display:flex;flex-direction:column;flex:1}.card h2{font-size:20px;letter-spacing:-.5px;margin:0 0 7px}.card p{color:#92a5be;font-size:12px;line-height:1.7;min-height:0;margin:0 0 20px}.card-meta{display:block;color:#7287a2;font-size:10px;padding-bottom:13px;margin-top:auto}.apps{display:grid;gap:7px}.app-button{display:block;width:100%;text-align:left;padding:11px 13px;background:#1b2b40;border:1px solid #ffffff0b;color:#cddbea;border-radius:8px;font-size:12px;font-weight:500}.app-button:hover{background:#223a50;border-color:#66d8c84a;color:#fff}.card .apps .empty{color:#7890a9;font-size:12px;margin:0;padding:10px 0}.below{margin-top:48px;grid-template-columns:1.3fr 1fr;gap:24px}.panel{background:#101b29;border:1px solid #ffffff12;border-radius:15px;padding:26px}.panel h2{font-size:19px;letter-spacing:-.4px;margin-bottom:22px}.item{border-color:#ffffff0d}.item.open-item{padding:16px 5px;border-radius:4px;font-size:12px}.item strong{font-weight:500;line-height:1.6;margin:0;padding-right:25px}.item .arrow{color:#66d8c8}.item.open-item:hover,.item.open-item:focus-visible{background:#1a2d40;outline-color:#66d8c8}.item time{font-size:10px;color:#788ea9;margin-bottom:5px}.site-footer{display:flex;justify-content:space-between;gap:16px;margin-top:42px;border-top:1px solid #ffffff10;padding:22px 0;color:#637a95;font-size:10px}.overlay{background:#040a14d9;backdrop-filter:blur(7px);z-index:50}.dialog{background:#111e2f;border-color:#ffffff20;border-radius:17px;padding:28px;box-shadow:0 30px 100px #0008}.dialog h2{font-size:22px}.dialog-head{margin-bottom:10px}.dialog-head h2{margin:0}.dialog .hint{font-size:12px;color:#8da4bf}.dialog p{line-height:1.8}.tabs{border-bottom:1px solid #ffffff12;padding-bottom:14px;margin-top:20px;gap:8px}.tabs button{background:#192b40;border:1px solid #ffffff12;padding:10px 14px;font-size:12px}.tabs button.active{background:#66d8c8;color:#092321;border-color:#66d8c8;font-weight:700}label{font-size:12px;color:#bdccdf;gap:8px}input,select,textarea{background:#0b1625;border:1px solid #2a3b52;padding:11px;border-radius:8px;font-size:13px}input::placeholder,textarea::placeholder{color:#627a95}textarea{min-height:110px}.save{background:#66d8c8;color:#0b2622;font-size:12px;font-weight:700;border-radius:8px;padding:12px 17px}.save:hover{background:#88e3d8}.danger{background:#402539;color:#ffc5d3;font-size:12px}.app-editor{background:#142437;border-color:#ffffff13}.app-editor h4{font-size:14px;margin:0}.row{border-color:#ffffff12;flex-wrap:wrap;font-size:13px}.create-device{border:1px dashed #66d8c85c;border-radius:12px;padding:16px;margin-bottom:24px;background:#66d8c805}.create-device summary{color:#7de0d3;cursor:pointer;font-size:14px;font-weight:650}.create-device form{padding-top:20px}.feedback{font-size:12px}.setup-image{border-color:#ffffff1c}.form-grid>button{align-self:end}.empty{font-size:12px}.close{font-size:27px}.dialog .pill{display:inline-block;text-decoration:none}.dialog #appContent>p{white-space:pre-wrap;font-size:14px;color:#b0c2d8}
@media(min-width:1100px){.admin-links{flex-direction:column;gap:0;align-items:flex-end}}
@media(max-width:850px){.welcome{gap:28px;grid-template-columns:1.2fr 1fr;padding-top:44px}.hero-guide{padding:24px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}header{flex-wrap:wrap;gap:16px}.heading{order:0;width:auto}.admin-links{width:100%;justify-content:flex-end}.below{grid-template-columns:1fr}}
@media(max-width:560px){.shell{padding:0 18px 24px}header{padding:18px 0;gap:12px;min-height:86px}.brand{width:100px;font-size:25px}.brand img{max-height:43px}.heading{display:none}.admin-btn{margin-left:auto;font-size:12px;padding:9px 12px}.welcome{grid-template-columns:1fr;gap:24px;padding:35px 0}.welcome h2{font-size:44px}.welcome>div>p{font-size:13px}.hero-guide{padding:20px 24px}.hero-guide h3{font-size:20px;margin-bottom:14px}.hero-guide p{margin:10px 0}.guide-note{margin-top:16px;padding-top:13px}.device-heading{align-items:stretch;flex-direction:column;gap:18px;margin-top:10px}.device-heading h2{font-size:21px}.search-label{width:100%}.grid,.form-grid{grid-template-columns:1fr}.card{padding:21px}.card p{margin-bottom:15px}.below{margin-top:32px;gap:18px}.panel{padding:22px}.site-footer{flex-direction:column;gap:5px}.dialog{padding:20px}.tabs button{padding:9px;font-size:11px}.overlay{padding:10px}.row{gap:8px}.hero-link{font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card{transition:none}.card:hover{transform:none}}

/* SPlayer-inspired accent palette */
:root{background:#0d0f15;color:#e4e5ee}body{background:radial-gradient(ellipse at 7% 0%,#6554ff14,transparent 35%),radial-gradient(ellipse at 96% 55%,#08d8e908,transparent 40%),#0d0f15}header{border-color:#ffffff0c}.eyebrow{color:#a69aff}.welcome h2 span{color:#a89aff;background:linear-gradient(100deg,#b497ff,#7570ff 55%,#19dcf2);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-link,.save{background:linear-gradient(110deg,#9674ff,#635bff);color:#fff;border:1px solid #b09aff55;box-shadow:0 5px 22px #735aff25}.hero-link:hover,.save:hover{background:linear-gradient(110deg,#ac90ff,#7971ff);box-shadow:0 5px 25px #735aff55}.hero-guide{background:linear-gradient(135deg,#27203977,#141720 75%);border-color:#8170ff45;box-shadow:0 0 35px #6453ff0a}.hero-guide b{background:#8365ff18;color:#b7a2ff;border-color:#9675ff40}.guide-number,.guide-note{color:#8e8ca5}.card,.card:nth-child(n){--accent:102,92,255;background:radial-gradient(ellipse at 0% 0%,rgba(var(--accent),.10),transparent 65%),#151820;border-color:#ffffff15;box-shadow:none;transition:border-color .2s,box-shadow .2s,transform .2s;isolation:isolate}.card:nth-child(7n+1){--accent:0,210,236}.card:nth-child(7n+2){--accent:65,220,150}.card:nth-child(7n+3){--accent:151,117,255}.card:nth-child(7n+4){--accent:242,51,236}.card:nth-child(7n+5){--accent:102,92,255}.card:nth-child(7n+6){--accent:255,149,61}.card:nth-child(7n+7){--accent:170,103,255}.card:before{content:"";position:absolute;top:0;left:16px;right:16px;height:2px;background:linear-gradient(90deg,transparent,rgba(var(--accent),.95),transparent);pointer-events:none}.card:hover,.card:focus-within{border-color:rgba(var(--accent),.65);box-shadow:0 12px 30px rgba(var(--accent),.15),0 0 22px rgba(var(--accent),.08);transform:translateY(-3px);background:radial-gradient(ellipse at 0% 0%,rgba(var(--accent),.18),transparent 75%),#151820}.card .cover-placeholder,.card:nth-child(n) .cover-placeholder{color:rgb(var(--accent));background:rgba(var(--accent),.11);border:1px solid rgba(var(--accent),.22);transition:transform .2s,box-shadow .2s,border-color .2s}.card:hover .cover-placeholder,.card:focus-within .cover-placeholder{transform:rotate(-7deg);border-color:rgba(var(--accent),.65);box-shadow:0 0 23px rgba(var(--accent),.25)}.card-meta{color:rgb(var(--accent));opacity:.85}.app-button{background:#1d202b;border-color:#ffffff07;color:#d7d9e3}.app-button:hover,.app-button:focus-visible{background:rgba(var(--accent),.14);border-color:rgba(var(--accent),.45);color:#fff}.card p{color:#9b9faf}.panel,.dialog{background:#151820;border-color:#ffffff16}.panel .arrow{color:#a18aff}.item.open-item:hover,.item.open-item:focus-visible{background:#7762ff12;outline-color:#a18aff}.item time{color:#a491d6}.search-label input,input,select,textarea{background:#1d202b;border-color:#ffffff12;color:#ebecf5}input::placeholder,textarea::placeholder{color:#777b90}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:#a18aff}.admin-btn,.pill{background:#7762ff16;border-color:#9076ff44}.tabs button{background:#1d202b;border-color:#ffffff12}.tabs button.active{background:linear-gradient(110deg,#9674ff,#635bff);color:#fff;border-color:#a58aff}.create-device{background:#8c6aff08;border-color:#9675ff55}.create-device summary{color:#b9a0ff}.app-editor{background:#1a1d28;border-color:#ffffff12}.row{border-color:#ffffff12}.dialog{--accent:151,117,255;border-color:rgba(var(--accent),.42);box-shadow:0 25px 100px #0009,0 0 35px rgba(var(--accent),.09);background:radial-gradient(ellipse at 0 0,rgba(var(--accent),.11),transparent 65%),#151820}.dialog-head{border-bottom:1px solid rgba(var(--accent),.18);padding-bottom:16px}.dialog .pill{background:linear-gradient(110deg,rgba(var(--accent),.85),rgba(var(--accent),.58));color:#fff;border-color:rgba(var(--accent),.65);box-shadow:0 5px 22px rgba(var(--accent),.19);padding:12px 22px}.dialog #appContent h3{color:rgb(var(--accent))}.overlay{background:#080a11d9}.site-footer{border-color:#ffffff0d;color:#72778c}.danger{background:#4a253d}.setup-image{background:#10121b}.admin-links a,.admin-links button{color:#aba9bd}
@media(prefers-reduced-motion:reduce){.card,.card .cover-placeholder{transition:none}.card:hover,.card:focus-within{transform:none}.card:hover .cover-placeholder,.card:focus-within .cover-placeholder{transform:none}}