:root{--bg:#050a13;--surface:#0c1626;--surface2:#101e32;--surface3:#14243a;--border:rgba(135,177,239,.15);--border-bright:rgba(72,153,255,.32);--blue:#1686ff;--blue2:#2467f3;--cyan:#4db9ff;--text:#f1f6ff;--muted:#8ea1b9;--muted2:#62758e;--green:#30d09c;--purple:#8c5aff;--red:#ee667d;--shadow:0 18px 50px rgba(0,0,0,.27)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased}a{text-decoration:none;color:inherit}img{max-width:100%}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.65}a,button,input,textarea,select{outline-offset:3px}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--cyan)}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.17}h1{letter-spacing:-.055em}h2{letter-spacing:-.035em}p{color:var(--muted)}[hidden]{display:none!important}::selection{background:#1763b6;color:#fff}
.container{max-width:1320px;margin:0 auto;padding:0 36px}.page-lines{position:absolute;inset:0 0 auto;height:850px;pointer-events:none;background:radial-gradient(ellipse at 65% 12%,rgba(19,82,179,.12),transparent 55%),linear-gradient(90deg,transparent 24.9%,rgba(108,168,236,.025) 25%,transparent 25.1%,transparent 49.9%,rgba(108,168,236,.025) 50%,transparent 50.1%,transparent 74.9%,rgba(108,168,236,.025) 75%,transparent 75.1%);z-index:-1}.site-header{position:relative;z-index:9;height:78px;border-bottom:1px solid rgba(108,160,226,.11);background:rgba(5,10,19,.94);backdrop-filter:blur(15px)}.header-inner{height:100%;display:flex;align-items:center;gap:42px}.brand{display:inline-flex;align-items:center;gap:10px;flex-shrink:0;line-height:1.08}.brand img{width:43px;height:43px;object-fit:contain;mix-blend-mode:screen}.brand span{font-size:19px;letter-spacing:.1em;font-weight:850;display:flex;flex-direction:column}.brand b{font-size:8px;letter-spacing:.32em;color:#a6b5c7;font-weight:700;margin-top:5px}.main-nav{display:flex;align-items:stretch;height:100%;gap:7px;margin-left:auto}.main-nav a{position:relative;padding:0 13px;display:flex;align-items:center;color:#a8b8d0;font-size:12px;font-weight:660;transition:color .2s}.main-nav a:hover,.main-nav a.active{color:#fff}.main-nav a.active:after{content:"";position:absolute;bottom:0;height:2px;left:13px;right:13px;background:var(--blue);box-shadow:0 0 10px var(--blue)}.header-action{font-size:12px;white-space:nowrap;background:var(--blue2);border:1px solid rgba(106,181,255,.3);padding:10px 17px;border-radius:8px;font-weight:730;box-shadow:0 0 25px rgba(30,98,241,.2)}.header-action span{margin-left:6px}.header-action:hover,.btn.primary:hover,.card-cta:hover{background:#378dff}.menu-toggle{display:none;background:transparent;border:0;padding:10px;flex-direction:column;gap:5px}.menu-toggle span{display:block;width:23px;height:2px;background:#dfeaff}
.overline{display:block;font-weight:770;font-size:10px;letter-spacing:.16em;color:#45a2ff;margin-bottom:10px}.hero{border-bottom:1px solid rgba(89,149,223,.15);position:relative;overflow:hidden;background:radial-gradient(ellipse at 76% 36%,rgba(17,59,144,.25),transparent 45%),linear-gradient(130deg,#081427 0%,#060d18 44%,#06142c 100%)}.hero:before{content:"";position:absolute;right:-120px;top:-250px;width:720px;height:730px;border:1px solid rgba(51,128,255,.085);transform:rotate(32deg);border-radius:80px;pointer-events:none}.hero-layout{min-height:555px;display:grid;grid-template-columns:47% 53%;gap:0;align-items:center;position:relative}.hero-copy{position:relative;z-index:2;padding:56px 0 50px}.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:10px;font-weight:760;letter-spacing:.065em;color:#8fc5ff;padding:7px 12px;border-radius:40px;border:1px solid rgba(44,137,249,.3);background:rgba(20,80,160,.17);margin-bottom:22px}.eyebrow i{font-style:normal;color:#3675bb}.pulse-dot,.green-dot{width:7px;height:7px;background:#29abff;border-radius:50%;box-shadow:0 0 10px rgba(36,162,255,.75)}.green-dot{background:var(--green)}.hero h1{font-size:clamp(46px,5.5vw,79px);font-weight:850;max-width:645px;margin-bottom:10px;line-height:1.03}.hero h1 span{display:block;background:linear-gradient(130deg,#fff 0%,#a6c7fa 40%,#227cff 100%);background-clip:text;-webkit-background-clip:text;color:transparent}.hero-tagline{font-size:21px;color:#f4f8ff;font-weight:680;letter-spacing:-.025em;margin-bottom:12px}.hero-description{max-width:475px;font-size:14px;line-height:1.75}.hero-buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}.btn{min-height:43px;display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:11px 20px;border-radius:7px;border:1px solid transparent;color:white;font-size:12px;font-weight:780;transition:background .2s,border-color .2s,transform .2s}.btn:hover{transform:translateY(-1px)}.btn.primary{background:linear-gradient(110deg,#128afa,#2459f2);border-color:#2e92fc;box-shadow:0 9px 28px rgba(24,95,235,.23)}.btn.outline{background:rgba(1,13,29,.55);border-color:#2174c9}.btn.outline:hover{border-color:#65baff;background:rgba(14,52,95,.48)}.btn.small{min-height:38px;padding:8px 15px}.btn.muted{background:#1c2a3e;color:#9cacc1}.hero-meta{display:flex;gap:0;margin-top:55px}.hero-meta div{min-width:118px;padding-right:18px;margin-right:19px;border-right:1px solid rgba(146,179,224,.22)}.hero-meta div:last-child{border:0}.hero-meta strong{display:block;color:#218fff;font-size:21px;line-height:1.2}.hero-meta span{font-size:10px;color:#9dafc3;display:block;margin-top:7px}
.hero-visual{height:500px;position:relative;min-width:0;perspective:1100px}.hero-grid{position:absolute;inset:40px -200px -80px -30px;background:linear-gradient(rgba(30,99,211,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(30,99,211,.07) 1px,transparent 1px);background-size:60px 60px;transform:perspective(500px) rotateX(60deg) skewX(-15deg);mask-image:linear-gradient(transparent,black 20%,transparent 88%)}.hero-glow{position:absolute;width:360px;height:360px;border-radius:100%;background:#136efa;filter:blur(110px);opacity:.19;right:5%;top:20%}.monitor-frame{position:absolute;left:12%;top:20%;width:84%;height:58%;background:#061020;border:2px solid #3777d1;border-radius:13px;box-shadow:2px 9px 0 #0d1a2d,0 24px 65px #000b1a,0 0 40px rgba(30,101,247,.21);transform:rotateY(-11deg) rotateX(3deg) rotateZ(1deg);overflow:hidden}.monitor-top{height:31px;border-bottom:1px solid #223450;background:#0b1728;display:flex;justify-content:space-between;align-items:center;padding:0 14px;color:#81a5d9;font-size:11px}.three-dots{color:#4776aa;letter-spacing:.3em;font-size:8px}.fake-url{padding:3px 42px;background:#10223a;border-radius:4px;color:#6590c6}.monitor-content{display:flex;height:calc(100% - 31px)}.mock-sidebar{width:56px;border-right:1px solid #163157;background:#0a172a;padding:16px 16px;display:flex;flex-direction:column;gap:14px;align-items:center}.mock-logo{font-size:22px;font-weight:1000;color:#2a8cff}.mock-sidebar span{width:19px;height:6px;border-radius:3px;background:#1c3654}.mock-main{flex:1;overflow:hidden;padding:30px 24px;background:radial-gradient(ellipse at 67% 0%,#17375d,#071428 78%)}.mock-pill{font-size:9px;letter-spacing:.17em;font-weight:800;color:#4e9cfa;margin-bottom:12px}.mock-main strong{display:block;font-size:clamp(19px,2.6vw,37px);line-height:1.12;letter-spacing:-.05em}.mock-main em{font-style:normal;color:#3d91fb}.mock-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:19px}.mock-summary>div{height:72px;background:#132841;border:1px solid #1b395e;border-radius:7px;padding:10px;display:flex;flex-direction:column;gap:7px}.mock-summary i{display:block;width:18px;height:18px;background:linear-gradient(135deg,#267cf8,#67b7ff);border-radius:4px}.mock-summary span{height:5px;width:72%;background:#335075;border-radius:5px}.mock-summary span:last-child{width:50%}.float-label{position:absolute;z-index:2;font-size:9px;letter-spacing:.12em;color:#b3dafd}.label-top{top:14%;right:5%;display:flex;gap:8px;align-items:center}.floating-app{position:absolute;z-index:2;display:flex;align-items:center;gap:10px;border:1px solid rgba(66,133,228,.42);background:rgba(9,22,42,.93);box-shadow:0 10px 30px rgba(0,0,0,.4);border-radius:10px;padding:10px 12px}.floating-app>span{display:grid;place-items:center;width:37px;height:37px;background:linear-gradient(145deg,#123f83,#102448);color:#60b1fc;font-weight:850;border:1px solid #2b72bd;border-radius:8px}.floating-app b{display:block;font-size:11px}.floating-app small{display:block;color:#88a1bf;font-size:9px}.floating-app em{font-style:normal;color:#51a5fa;margin-left:10px}.app-one{right:0;bottom:14%}.app-two{left:5%;bottom:7%}.section{padding:80px 0}.section-projects{padding-top:69px}.section-intro{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:29px}.section h2,.section-intro h2,.bottom-banner h2,.content-block h2{font-size:35px;margin-bottom:7px}.section h2 span,.section-intro h2 span,.page-heading h1 span,.bottom-banner h2 span,.content-block h2 span,.admin-page-head h1 span{color:#4d9fff}.section-intro p,.section-sub{margin:0;color:#8498b1;font-size:13px}.text-link{color:#78b8ff;font-size:12px;font-weight:760}.text-link:hover{color:white}.text-link span{margin-left:5px}
.card-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:17px}.project-card{background:#0d1a2b;border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:border-color .22s,transform .22s,box-shadow .22s;min-width:0}.project-card:hover{transform:translateY(-4px);border-color:rgba(38,132,253,.55);box-shadow:var(--shadow)}.card-image-link{display:block}.project-art{height:153px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 75% 20%,rgba(32,136,255,.41),transparent 65%),linear-gradient(130deg,#091d3a,#050e1c)}.project-art.android{background:radial-gradient(ellipse at 75% 20%,rgba(32,223,154,.3),transparent 65%),linear-gradient(130deg,#102b31,#051319)}.project-art.fivem{background:radial-gradient(ellipse at 75% 20%,rgba(255,114,53,.34),transparent 65%),linear-gradient(130deg,#2d1723,#10131a)}.project-art:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 58%,rgba(6,10,20,.42));pointer-events:none}.art-grid{position:absolute;inset:0;background:linear-gradient(90deg,rgba(169,207,255,.07) 1px,transparent 1px),linear-gradient(rgba(169,207,255,.07) 1px,transparent 1px);background-size:23px 23px;transform:perspective(260px) rotateX(35deg) scale(1.3)}.art-ring{position:absolute;width:158px;height:158px;border-radius:20px;border:2px solid rgba(67,151,255,.4);transform:rotate(-24deg);top:27px;right:2px;box-shadow:0 0 38px rgba(0,112,255,.21),inset 0 0 35px rgba(25,112,255,.15)}.android .art-ring{border-color:rgba(48,235,156,.3)}.fivem .art-ring{border-color:rgba(255,147,85,.38)}.art-monogram{position:absolute;z-index:1;top:50%;left:50%;transform:translate(-50%,-48%);font-size:59px;font-weight:900;line-height:1;letter-spacing:-.09em;color:#67afff;text-shadow:0 9px 28px rgba(30,134,255,.75)}.android .art-monogram{color:#5ae1b0;text-shadow:0 9px 27px rgba(38,170,111,.5)}.fivem .art-monogram{color:#ffac78;text-shadow:0 9px 27px rgba(209,88,30,.5)}.art-category{position:absolute;z-index:2;top:11px;right:11px;font-size:9px;letter-spacing:.06em;color:#def;background:rgba(5,12,22,.77);padding:3px 7px;border:1px solid rgba(122,169,225,.18);border-radius:4px}.project-image{width:100%;height:100%;object-fit:cover;display:block}.card-body{padding:15px 13px 13px}.card-heading{display:flex;flex-direction:column;gap:3px}.card-heading h3{font-size:14px;line-height:1.25;letter-spacing:-.01em;margin:0}.mini-badge{font-size:10px;color:#65a8ef;font-weight:630}.card-body p{font-size:11px;line-height:1.45;height:47px;overflow:hidden;margin:11px 0 12px;color:#b0c1d5}.card-meta{display:flex;justify-content:space-between;gap:6px;font-size:10px;color:#849cb9;border-top:1px solid rgba(115,162,219,.14);padding:11px 0}.card-cta{display:flex;align-items:center;justify-content:center;gap:10px;color:white;background:#146aef;border-radius:6px;padding:9px;font-size:11px;font-weight:780;transition:background .2s}.platform-section{padding-top:26px}.platform-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:27px}.platform-tile{min-height:173px;position:relative;display:flex;align-items:flex-start;flex-direction:column;justify-content:space-between;overflow:hidden;border:1px solid var(--border-bright);border-radius:11px;padding:23px;background:radial-gradient(ellipse at 94% 14%,rgba(36,126,255,.22),transparent 58%),linear-gradient(110deg,#0b1d36,#0a1424)}.platform-tile:after{content:"";position:absolute;width:220px;height:220px;border:1px solid rgba(117,175,255,.12);border-radius:32px;transform:rotate(31deg);right:-100px;top:-120px}.platform-tile.android{background:radial-gradient(ellipse at 94% 14%,rgba(31,194,130,.17),transparent 58%),linear-gradient(110deg,#0d272c,#0a1422)}.platform-tile.fivem{background:radial-gradient(ellipse at 94% 14%,rgba(236,94,52,.2),transparent 58%),linear-gradient(110deg,#251820,#0a1422)}.platform-tile:hover{border-color:#5fa4ff}.platform-icon{font-size:32px;color:#4da5ff;line-height:1}.android .platform-icon{color:#46e8aa}.fivem .platform-icon{color:#ff9464}.platform-tile h3{font-size:17px;margin:0 0 4px}.platform-tile p{font-size:11px;margin:0}.platform-tile small{font-weight:750;font-size:10px;color:#d5e8ff}.round-arrow{position:absolute;right:18px;bottom:18px;display:grid;place-items:center;width:31px;height:31px;border-radius:50%;border:1px solid rgba(190,220,255,.6);font-size:17px}.updates-section{padding-top:18px}.updates-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.release-card{background:#101e32;border:1px solid var(--border);border-radius:10px;padding:18px}.release-card:hover{border-color:#448eed}.release-head{display:flex;align-items:center;gap:11px}.release-icon,.update-symbol{display:grid;place-items:center;flex-shrink:0;width:46px;height:46px;border-radius:9px;background:linear-gradient(140deg,#1d67cc,#102747);border:1px solid #275c9e;color:#92cfff;font-weight:900}.release-head strong{display:block;font-size:12px}.release-head small{display:block;font-size:10px;color:#6ca5e9}.release-head time{margin-left:auto;align-self:flex-start;font-size:10px;color:#738ba9;white-space:nowrap}.release-card>p{white-space:pre-line;font-size:11px;line-height:1.6;margin:15px 0 9px;max-height:75px;overflow:hidden}.release-link{font-size:11px;color:#70b0ff;font-weight:750}.subtle-panel,.empty-card{padding:30px;background:#0c1828;border:1px solid var(--border);border-radius:10px;grid-column:1/-1}.subtle-panel p{margin:8px 0 0}.bottom-banner{border:1px solid var(--border-bright);border-radius:13px;padding:31px 39px;margin-bottom:80px;background:radial-gradient(ellipse at 94% 20%,rgba(23,108,244,.24),transparent 60%),#0e1c32;display:flex;align-items:center;justify-content:space-between;gap:20px}.bottom-banner h2{margin:0 0 7px}.bottom-banner p{margin:0}.footer{border-top:1px solid var(--border);background:#070f1d}.footer-inner{display:flex;justify-content:space-between;gap:20px;padding-top:36px;padding-bottom:27px}.footer-inner p{font-size:11px;margin:11px 0 0}.footer-links{display:flex;align-items:center;gap:24px;flex-wrap:wrap;font-size:12px;color:#9aadc5}.footer-links a:hover{color:#fff}.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid var(--border);padding-top:17px;padding-bottom:22px;color:#6f8198;font-size:11px}
.page-heading{padding:77px 0 65px;background:radial-gradient(ellipse at 80% 0%,rgba(20,80,172,.18),transparent 60%);border-bottom:1px solid var(--border)}.page-heading h1{font-size:clamp(43px,5vw,66px);margin:0 0 14px}.page-heading p{font-size:14px;max-width:650px;margin:0}.catalog-section{padding-top:35px;min-height:520px}.catalog-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:24px}.filter-pills{display:flex;gap:8px;flex-wrap:wrap}.filter-pill{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 13px;border:1px solid var(--border);border-radius:7px;background:#0e1829;font-size:12px;color:#9db1cc}.filter-pill.selected,.filter-pill:hover{background:#132b4d;color:#fff;border-color:#2e75cc}.catalog-search{display:flex;gap:6px;min-width:270px}.catalog-search input{flex:1;min-width:80px;background:#0d1727;border:1px solid var(--border);color:white;padding:10px 12px;border-radius:7px}.catalog-search button{background:#136be8;border:0;color:white;border-radius:7px;padding:10px 15px;font-weight:750}.results-count{color:#8ca2bb;font-size:12px;margin:0 0 14px}.catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.catalog-grid .project-art{height:180px}
.project-page{padding-top:30px;padding-bottom:100px}.breadcrumbs{display:flex;align-items:center;gap:10px;color:#8297b2;font-size:12px;margin-bottom:33px}.breadcrumbs a:hover{color:#fff}.breadcrumbs b{color:#d7e8ff}.project-top{display:flex;align-items:center;gap:20px;padding-bottom:33px}.detail-icon{flex-shrink:0;display:grid;place-items:center;width:108px;height:108px;border:1px solid #4184d7;background:radial-gradient(ellipse at 25% 10%,#2361ac,#091832 77%);border-radius:18px;box-shadow:0 0 30px rgba(12,101,231,.13);font-size:41px;font-weight:850;letter-spacing:-.08em;color:#80c0ff}.detail-main{min-width:0}.detail-main .overline{margin-bottom:6px}.detail-main h1{font-size:39px;margin:0 0 7px}.detail-main p{font-size:13px;margin:0 0 14px}.detail-meta{display:flex;flex-wrap:wrap;gap:8px}.detail-meta span{padding:4px 9px;background:#13263f;border:1px solid rgba(103,159,220,.17);border-radius:5px;color:#95bee9;font-size:10px}.detail-actions{margin-left:auto;display:flex;align-items:flex-end;flex-direction:column;gap:8px;min-width:213px}.detail-actions small{color:#8496af;font-size:10px}.detail-shell{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(235px,.9fr);gap:24px}.detail-content{min-width:0}.gallery-box,.info-panel,.side-card{border:1px solid var(--border);border-radius:11px;background:#0a1423;overflow:hidden}.gallery-top{display:flex;justify-content:space-between;align-items:center;padding:15px 19px}.gallery-top h2{font-size:15px;margin:0}.gallery-top span{color:#7e93af;font-size:11px}.gallery-main{display:block;width:100%;padding:0;position:relative;border:0;background:#0a1727;height:400px;cursor:zoom-in}.gallery-main img{width:100%;height:100%;object-fit:contain}.expand-icon{position:absolute;bottom:14px;right:14px;background:rgba(5,12,24,.86);border:1px solid #26476c;border-radius:6px;padding:7px 11px;color:#fff;font-size:11px}.gallery-thumbs{padding:12px 15px;display:flex;gap:9px;overflow-x:auto}.gallery-thumb{padding:0;flex:0 0 105px;height:67px;border:2px solid transparent;border-radius:6px;overflow:hidden;background:#101e30}.gallery-thumb.selected{border-color:#238cf5}.gallery-thumb img{width:100%;height:100%;object-fit:cover}.gallery-placeholder{height:345px;display:flex;align-items:center;flex-direction:column;justify-content:center;background:radial-gradient(circle,#0e2d51,#081320 65%);text-align:center}.gallery-placeholder span{font-size:75px;color:#3685e0;opacity:.55}.gallery-placeholder strong{font-size:19px}.gallery-placeholder p{font-size:12px}.info-panel{margin-top:20px}.tabs{display:flex;gap:7px;overflow-x:auto;border-bottom:1px solid var(--border);padding:0 14px}.tab{padding:16px 13px;color:#8da4c0;border:0;border-bottom:2px solid transparent;background:transparent;font-size:12px;font-weight:730}.tab.active{color:#fff;border-color:#258cfa}.tab-body{padding:24px;min-height:180px}.tab-body h2{font-size:20px}.tab-body h3{font-size:15px;margin-top:25px}.tab-body p{font-size:13px}.multiline{white-space:pre-line;overflow-wrap:anywhere}.changelog-item{padding:20px 0;border-bottom:1px solid var(--border)}.changelog-item>div{display:flex;justify-content:space-between;gap:15px}.changelog-item time{font-size:11px;color:#8da0bb}.changelog-item p{margin:10px 0 0}.side-card{padding:22px;margin-bottom:19px}.side-card h3{font-size:15px;margin-bottom:18px}.side-card>div{display:flex;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid var(--border);font-size:11px}.side-card>div:last-child{border-bottom:none;padding-bottom:0}.side-card>div span{color:#8497b0}.side-card>div b{font-weight:760;text-align:right}.side-card p{font-size:12px}.support-box a{font-size:12px;color:#5eaaff;font-weight:750}.update-list{max-width:1000px}.update-item{display:flex;gap:20px;padding:29px 0;border-bottom:1px solid var(--border)}.update-item .update-symbol{width:57px;height:57px}.update-item h2{font-size:21px}.update-item h2 span{color:#59a5ff}.update-item p{font-size:13px}.content-block{display:grid;grid-template-columns:37% 1fr;gap:45px;align-items:center;max-width:1040px}.content-block>img{width:100%;border:1px solid var(--border);border-radius:16px}.content-block p{font-size:14px;line-height:1.8}.content-block .btn{margin-top:10px}.contact-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:960px}.contact-card{border:1px solid var(--border-bright);border-radius:12px;background:#0d1c30;padding:30px}.contact-card:hover{border-color:#66aaff}.contact-card h2{font-size:21px;margin:15px 0 8px}.contact-card strong{color:#73b7ff;font-size:12px}.contact-icon{font-size:29px;color:#61acff}
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(1,4,12,.96);display:flex;align-items:center;justify-content:center;gap:10px;padding:60px 15px}.lightbox img{max-width:min(1150px,85vw);max-height:83vh;object-fit:contain}.lightbox button{border:1px solid #37608b;background:#101f31;color:white;border-radius:50%;width:40px;height:40px;font-size:25px}.lightbox-close{position:absolute;right:20px;top:20px}.notice{padding:11px 16px;color:#bfffe8;background:#0f352e;border:1px solid #216955;border-radius:7px;margin-bottom:20px}.notice.error{color:#ffb7c5;background:#391824;border-color:#842f48}
.admin-body{background:#07101d}.admin-layout{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100vh}.admin-sidebar{background:#0a1628;border-right:1px solid var(--border);padding:25px 18px;display:flex;flex-direction:column;min-height:100vh}.admin-sidebar .brand{margin:0 8px 42px}.admin-sidebar .brand img{width:37px;height:37px}.admin-sidebar .brand span{font-size:16px}.admin-menu-label{color:#5e7799;font-size:9px;letter-spacing:.15em;font-weight:800;margin:0 13px 11px}.admin-menu{display:grid;gap:6px}.admin-menu a{display:block;padding:11px 13px;border-radius:7px;color:#9db2cb;font-size:12px;font-weight:670}.admin-menu a:hover,.admin-menu a.selected{background:#102c54;color:#72b7ff}.admin-sidebar-foot{margin-top:auto;border-top:1px solid var(--border);padding:22px 8px 0;display:flex;flex-direction:column;gap:10px;font-size:11px;color:#829ab7}.admin-sidebar-foot button{color:#e2ecff;border:0;background:transparent;padding:4px 0}.admin-main{min-width:0}.admin-top{padding:22px 35px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;gap:15px}.admin-top a{font-size:12px;color:#82bfff}.admin-content{padding:38px 35px 80px;max-width:1500px;margin:auto}.admin-page-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:30px}.admin-page-head h1{font-size:34px;margin:0 0 6px}.admin-page-head p{font-size:12px;margin:0}.admin-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:22px}.admin-stats>div{background:#0f1f35;border:1px solid var(--border);border-radius:10px;padding:23px}.admin-stats span{display:block;font-size:12px;color:#8ba5c4}.admin-stats strong{display:block;font-size:35px;letter-spacing:-.05em;margin:3px 0}.admin-stats small{color:#3ba4e8;font-size:10px}.admin-panel{background:#0d192a;border:1px solid var(--border);border-radius:11px;padding:20px;margin-bottom:24px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:17px}.panel-head h2,.admin-panel>h2{font-size:17px;margin:0 0 18px}.panel-head h2{margin:0}.panel-head a{font-size:12px;color:#7cbbff}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:580px;font-size:12px}th{text-transform:uppercase;letter-spacing:.08em;color:#7891af;text-align:left;font-size:10px;font-weight:800;background:#0b192b}td,th{padding:15px 12px;border-bottom:1px solid rgba(112,157,214,.13)}td{color:#9fb3cc}td strong{color:#e6f2ff;font-size:12px}td small{display:block;color:#657f9f;margin-top:3px}td a,.inline-actions button{color:#79baff;font-size:12px;font-weight:720}td a:hover{color:white}.inline-actions{display:flex;align-items:center;gap:12px}.inline-actions button{background:transparent;border:0;padding:0}.inline-actions .danger-text,.danger-text{color:#ff829b}.form-panel{padding:25px}.form-grid{display:grid;gap:17px}.form-grid.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid label{display:flex;flex-direction:column;gap:7px;color:#c2d3e9;font-size:12px;font-weight:650;min-width:0}.form-grid input:not([type=checkbox]),.form-grid textarea,.form-grid select{width:100%;min-width:0;background:#071320;border:1px solid #243a53;color:#f1f7ff;padding:11px 12px;border-radius:7px;outline-color:#48a3ff;font-size:13px}.form-grid textarea{resize:vertical;min-height:98px}.form-grid input[type=file]{padding:10px;color:#a8bedb}.form-grid label small{font-weight:400;color:#8496af}.form-grid .span-2{grid-column:1/-1}.check-group{display:flex;flex-wrap:wrap;gap:20px}.check-group label{display:inline-flex;flex-direction:row;align-items:center;gap:8px}.check-group input{accent-color:#2589f5}.form-actions{display:flex;gap:10px;flex-wrap:wrap}.small-note{font-size:11px;color:#8296b1}.form-grid .small-note{margin:0}.admin-screens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:25px}.admin-screen{background:#071422;border:1px solid var(--border);border-radius:8px;overflow:hidden}.admin-screen img{width:100%;aspect-ratio:16/10;object-fit:cover}.admin-screen p{font-size:11px;margin:6px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.screen-actions{display:flex;flex-wrap:wrap;gap:8px;padding:10px}.screen-actions button{font-size:10px;border:0;background:transparent;color:#7bb8f2;padding:2px}.screen-actions .danger-text{color:#ff8ca3}.delete-box{margin-top:30px}.danger-btn{background:transparent;color:#ff8a9e;border:1px solid #813e4e;border-radius:7px;padding:10px 13px}.danger-btn:hover{background:#3d1825}.install-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:44px 16px;background:radial-gradient(ellipse at 50% 15%,#0b2a54,#050a13 70%)}.install-card{width:min(100%,570px);background:#0b192b;border:1px solid var(--border-bright);border-radius:17px;padding:38px;box-shadow:var(--shadow)}.install-card .brand{margin-bottom:27px}.install-card h1{font-size:32px;margin-bottom:10px}.install-card p{font-size:13px}.install-card .form-grid{margin:25px 0}.login-card{max-width:480px}.login-card .overline{margin-top:8px}.login-card .small-note{display:block;margin-top:25px}.install-card code{color:#add6ff}
@media(max-width:1200px){.header-inner{gap:18px}.main-nav a{padding:0 9px}.card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-layout{grid-template-columns:49% 51%}.hero h1{font-size:57px}.hero-visual{height:455px}.admin-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:850px){.container{padding:0 22px}.header-inner{gap:12px}.site-header{height:70px}.menu-toggle{display:flex;margin-left:auto}.main-nav{display:none;position:absolute;top:70px;left:0;right:0;height:auto;background:#0b1829;border-bottom:1px solid #214366;padding:13px 20px;flex-direction:column;gap:0;margin:0}.main-nav.open{display:flex}.main-nav a{padding:12px 14px}.main-nav a.active:after{left:0;right:auto;top:5px;bottom:5px;width:2px;height:auto}.header-action{display:none}.hero-layout{grid-template-columns:1fr}.hero-copy{padding:60px 0 0}.hero h1{font-size:clamp(47px,8vw,72px)}.hero-visual{height:340px;margin:-20px 0 0}.monitor-frame{left:15%;top:14%;width:69%;height:75%}.hero-meta{margin-top:30px}.floating-app.app-one{bottom:14%}.floating-app.app-two{bottom:4%}.label-top{top:7%}.platform-grid,.updates-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-shell{grid-template-columns:1fr}.project-top{flex-wrap:wrap}.detail-actions{align-items:flex-start;margin-left:128px}.admin-layout{grid-template-columns:1fr}.admin-sidebar{min-height:auto;padding:15px 22px}.admin-sidebar .brand{margin:0 0 13px}.admin-menu{display:flex;flex-wrap:wrap;gap:4px}.admin-menu-label,.admin-sidebar-foot{display:none}.admin-top{padding:17px 23px}.admin-content{padding:25px 23px 65px}.form-grid.two-col{grid-template-columns:1fr}}
@media(max-width:620px){.container{padding:0 16px}.brand span{font-size:16px}.brand img{width:36px;height:36px}.hero-copy{padding:45px 0 0}.hero h1{font-size:clamp(41px,11vw,57px)}.hero-tagline{font-size:18px}.hero-description{font-size:13px}.hero-buttons .btn{flex:1;min-width:145px}.eyebrow{gap:5px;font-size:8px;letter-spacing:0}.hero-meta div{min-width:0;flex:1;padding-right:7px;margin-right:8px}.hero-meta strong{font-size:16px}.hero-meta span{font-size:9px}.hero-visual{height:280px}.monitor-frame{left:13%;top:14%;width:83%;height:67%}.mock-main{padding:17px 13px}.mock-main strong{font-size:23px}.mock-summary{gap:5px;margin-top:11px}.mock-summary>div{height:53px;padding:7px}.fake-url{padding:3px 10px}.app-one{right:0;bottom:9%;transform:scale(.85);transform-origin:right bottom}.app-two{left:-6%!important;bottom:2%!important;transform:scale(.82);transform-origin:left bottom}.float-label{font-size:8px}.section{padding:49px 0}.section-projects{padding-top:45px}.section-intro{align-items:start;flex-direction:column}.section h2,.section-intro h2,.bottom-banner h2{font-size:29px}.card-grid,.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.project-art,.catalog-grid .project-art{height:125px}.art-monogram{font-size:42px}.card-body{padding:11px}.card-heading h3{font-size:12px}.card-body p{font-size:10px}.card-meta{font-size:9px}.card-cta{padding:8px;font-size:10px}.platform-grid,.updates-grid{grid-template-columns:1fr}.platform-section{padding-top:25px}.platform-tile{min-height:163px}.bottom-banner{flex-direction:column;align-items:start;padding:23px 22px;margin-bottom:45px}.footer-inner{flex-direction:column}.footer-links{gap:12px 20px}.page-heading{padding:51px 0}.page-heading h1{font-size:43px}.catalog-toolbar{align-items:stretch}.catalog-search{width:100%;min-width:0}.project-top{gap:13px}.detail-icon{width:73px;height:73px;font-size:27px;border-radius:12px}.detail-main h1{font-size:29px}.detail-actions{margin-left:0;width:100%}.detail-actions .btn{width:100%}.gallery-main{height:270px}.gallery-placeholder{height:235px}.tab-body{padding:19px}.lightbox{gap:2px;padding:45px 5px}.lightbox img{max-width:calc(100vw - 92px)}.lightbox button{width:36px;height:36px}.contact-cards,.content-block{grid-template-columns:1fr}.content-block>img{max-width:260px}.admin-page-head{align-items:flex-start;flex-direction:column}.admin-page-head h1{font-size:29px}.admin-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.admin-stats>div{padding:16px}.admin-stats strong{font-size:27px}.admin-screens{grid-template-columns:1fr 1fr}.install-card{padding:27px 22px}}
@media(max-width:365px){.card-grid,.catalog-grid{grid-template-columns:1fr}.project-art,.catalog-grid .project-art{height:170px}.card-body p{height:auto}.hero-visual{height:245px}.monitor-frame{top:12%}.admin-screens{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ================================================================
   NODE Development 1.1 — Cyberpunk Neon (visual-only redesign)
   x10Hosting-safe: static CSS and local WebP artwork, no dependencies.
   ================================================================ */
:root{
  --bg:#060716;
  --surface:#0b1429;
  --surface2:#10192f;
  --surface3:#172340;
  --border:rgba(95,148,232,.23);
  --border-bright:rgba(13,211,255,.48);
  --blue:#009bff;
  --blue2:#1073ed;
  --cyan:#20e0ff;
  --purple:#a44cff;
  --magenta:#ff27d4;
  --orange:#ff815b;
  --muted:#a3aeca;
  --text:#f6f8ff;
  --shadow:0 23px 65px rgba(0,0,0,.42)
}
body{background:radial-gradient(ellipse 48% 26% at 100% 40%,rgba(64,7,106,.11),transparent 80%),radial-gradient(ellipse 40% 23% at 0 75%,rgba(7,70,118,.10),transparent 80%),#060716}
.sr-only{position:absolute;clip:rect(0,0,0,0);clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.container{max-width:1410px}
.page-lines{position:fixed;height:100%;inset:0;z-index:-1;opacity:.5;background:linear-gradient(90deg,rgba(0,217,255,.06) 1px,transparent 1px),radial-gradient(circle at 18% 29%,rgba(218,25,232,.15),transparent 18%),radial-gradient(circle at 89% 62%,rgba(1,171,255,.10),transparent 25%);background-size:240px 100%,auto,auto}
.site-header{background:rgba(4,6,21,.91);border-bottom:1px solid rgba(49,186,255,.27);box-shadow:0 5px 25px rgba(0,0,0,.34);height:77px}
.site-header:after{content:"";position:absolute;bottom:-1px;left:0;width:100%;height:1px;pointer-events:none;background:linear-gradient(90deg,rgba(18,203,255,.55),transparent 30%,rgba(228,25,226,.48) 87%,transparent)}
.header-inner{gap:17px}
.brand span{color:#f6f8ff;letter-spacing:.065em}
.brand b{color:#b8c1dd}
.main-nav{gap:0;margin-left:auto}
.main-nav a{font-size:12px;padding:0 10px}
.main-nav a.active:after{background:var(--cyan);box-shadow:0 0 12px var(--cyan),0 0 30px rgba(14,214,255,.55)}
.top-search{width:220px;min-width:0;height:39px;display:flex;align-items:center;gap:8px;border-radius:9px;border:1px solid rgba(113,138,225,.28);background:rgba(24,29,66,.75);color:#7ba0c9;padding:0 10px;transition:border-color .2s;margin-left:9px}
.top-search:focus-within{border-color:var(--cyan)}
.top-search span{font-size:23px;line-height:1}
.top-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#fff;font-size:11px}
.top-search input::placeholder{color:#8192ba}
.top-search input::-webkit-search-cancel-button{filter:grayscale(1)}
.header-action{background:linear-gradient(112deg,#0bcbef,#1979f3 45%,#ae28e6 100%);border-color:rgba(99,245,255,.45);box-shadow:0 0 23px rgba(4,175,255,.24),0 0 26px rgba(234,41,254,.18);border-radius:8px;font-size:11px;padding:11px 14px}
.header-action:hover{background:linear-gradient(112deg,#36dcff,#368fff 45%,#cd4afd 100%)}
.overline{color:#37dcff;text-shadow:0 0 12px rgba(18,179,255,.22)}
.section-intro h2 span,.section h2 span,.page-heading h1 span,.bottom-banner h2 span,.content-block h2 span,.admin-page-head h1 span{color:#ae66f4;background:linear-gradient(100deg,#4ed7ff,#af68ff 55%,#fa44db);color:transparent;-webkit-background-clip:text;background-clip:text}
.section h2,.section-intro h2,.bottom-banner h2,.content-block h2{font-size:38px}
.text-link{color:#6cceff}
.text-link:hover{color:#f7cbff}
/* Hero: local neon city art, plus the approved mockup's illustrative device artwork. */
.cyber-hero{min-height:570px;isolation:isolate;border-bottom:1px solid rgba(205,32,247,.35);background:linear-gradient(90deg,rgba(2,6,23,.97) 0%,rgba(4,8,30,.88) 27%,rgba(3,7,22,.54) 60%,rgba(4,6,17,.32) 100%),linear-gradient(0deg,#060817 0%,transparent 31%),url('/assets/img/cyber-city.webp') center 47%/cover no-repeat,#060817}
.cyber-hero:before{inset:0;width:auto;height:auto;right:0;top:0;transform:none;border:0;border-radius:0;opacity:.5;background:linear-gradient(105deg,transparent 19%,rgba(13,185,251,.08) 19.08%,transparent 19.2%,transparent 77%,rgba(246,23,225,.08) 77.1%,transparent 77.2%)}
.cyber-hero:after{content:"";pointer-events:none;position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 71% 38%,rgba(98,33,219,.23),transparent 42%),radial-gradient(ellipse at 92% 58%,rgba(235,22,185,.15),transparent 35%)}
.cyber-hero .hero-layout{min-height:565px;grid-template-columns:48% 52%}
.cyber-hero .hero-copy{padding:65px 0 64px}
.cyber-hero .eyebrow{font-size:10px;border:1px solid rgba(15,202,255,.52);color:#7bdfff;box-shadow:inset 0 0 14px rgba(0,151,236,.12);background:rgba(0,16,43,.79);border-radius:40px;letter-spacing:.07em;padding:7px 13px}
.cyber-hero .eyebrow i{color:#e350e7}
.cyber-hero h1{font-size:clamp(49px,5vw,79px);line-height:.96;letter-spacing:-.065em;max-width:680px;margin-bottom:18px;text-shadow:0 10px 38px #000a22}
.cyber-hero h1 span{display:block}
.cyber-hero h1 .hero-node{color:#f6fbff;background:linear-gradient(130deg,#fff,#d6e3ff 62%,#65d8fd);background-clip:text;-webkit-background-clip:text}
.cyber-hero h1 .hero-development{font-size:.91em;color:transparent;background:linear-gradient(95deg,#18e5ff 0%,#36a2ff 32%,#b64bff 65%,#ff37e5 100%);background-clip:text;-webkit-background-clip:text;filter:drop-shadow(0 2px 10px rgba(30,116,242,.16))}
.cyber-hero .hero-tagline{color:#f7f6ff;font-size:21px;text-shadow:0 2px 11px #010514}
.cyber-hero .hero-description{font-size:13px;color:#c0d2ec;max-width:495px;text-shadow:0 1px 6px #000}
.cyber-hero .hero-buttons{margin-top:28px}
.btn.primary{background:linear-gradient(105deg,#03bfeb,#0b83ff 49%,#b41ae2 100%);border-color:rgba(92,233,252,.57);box-shadow:0 6px 25px rgba(10,160,255,.27),0 0 14px rgba(155,13,240,.16)}
.btn.primary:hover{background:linear-gradient(105deg,#35e5fa,#368cff 49%,#d151f6)}
.btn.outline{border-color:rgba(12,203,253,.72);background:rgba(4,10,32,.81)}
.btn.outline:hover{background:rgba(45,18,83,.82);border-color:rgba(250,58,227,.73)}
.cyber-hero .hero-meta{margin-top:52px}
.cyber-hero .hero-meta div{border-color:rgba(38,205,255,.37);min-width:135px;margin-right:19px;padding-right:20px}
.cyber-hero .hero-meta strong{font-size:23px;color:#21dafa;text-shadow:0 0 14px rgba(13,171,234,.45)}
.cyber-hero .hero-meta span{color:#c2cbe0;font-size:10px}
.cyber-visual{height:430px;position:relative;min-width:0;perspective:none}
.hero-device-image{position:absolute;inset:10% -2% 5% -2%;display:grid;place-items:center;filter:drop-shadow(0 18px 25px rgba(0,0,0,.7))}
.hero-device-image img{width:100%;height:100%;object-fit:contain;object-position:center;opacity:.94;mask-image:radial-gradient(ellipse at 50% 50%,#000 38%,rgba(0,0,0,.97) 57%,transparent 80%)}
.cyber-floating-badge{position:absolute;right:12%;bottom:0;font-size:10px;font-weight:800;letter-spacing:.16em;color:#83eaff;background:rgba(3,10,30,.85);padding:8px 13px;border-left:2px solid var(--magenta);border-right:1px solid rgba(29,198,248,.6);box-shadow:0 0 20px rgba(239,22,225,.1)}
.hero-corner{position:absolute;pointer-events:none;width:90px;height:80px;border-color:rgba(40,208,255,.64);border-style:solid}
.corner-a{border-width:2px 0 0 2px;left:6%;top:10%}
.corner-b{border-width:0 2px 2px 0;right:0;bottom:14%;border-color:rgba(235,40,224,.64)}
.hero-bottom-line{position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent 3%,#07beff 23%,#ed27d9 56%,#8b5eff 80%,transparent 97%);box-shadow:0 0 15px #9c2efa}
/* Quiet circuit/scan accents around the high-contrast content blocks. */
.section-projects{position:relative;padding-top:64px}
.section-projects:before,.platform-section:before,.updates-section:before{content:"";pointer-events:none;position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(52,161,255,.2),rgba(240,37,207,.34),transparent)}
.platform-section,.updates-section{position:relative}
.card-grid{gap:14px}
.project-card{--card-accent:#1abfff;position:relative;background:linear-gradient(170deg,rgba(18,27,59,.96),rgba(5,11,27,.96));border:1px solid rgba(29,155,241,.36);border-radius:11px;box-shadow:inset 0 1px 0 rgba(143,210,255,.07),0 0 13px rgba(11,97,172,.08);transition:transform .24s,border-color .24s,box-shadow .24s}
.project-card:nth-child(2){--card-accent:#ad57fa;border-color:rgba(162,69,244,.4)}
.project-card:nth-child(3){--card-accent:#18d5ef;border-color:rgba(16,201,242,.36)}
.project-card:nth-child(4),.project-card.category-android{--card-accent:#ea43fa;border-color:rgba(187,65,243,.36)}
.project-card.category-fivem{--card-accent:#ff885a;border-color:rgba(255,116,72,.45)}
.project-card:hover{border-color:var(--card-accent);box-shadow:0 12px 33px rgba(0,0,0,.49),0 0 17px color-mix(in srgb,var(--card-accent) 24%,transparent);transform:translateY(-4px)}
.project-art{height:173px;border-bottom:1px solid rgba(113,166,255,.25);background:radial-gradient(ellipse at 80% 20%,rgba(67,31,161,.4),transparent 56%),linear-gradient(130deg,#092044,#070f25)}
.project-art:after{background:linear-gradient(0deg,rgba(4,10,23,.47),transparent 54%)}
.project-art .project-image{transition:transform .35s;object-position:center}
.project-card:hover .project-image{transform:scale(1.05)}
.art-category{top:9px;left:9px;right:auto;border-color:rgba(44,192,255,.44);background:rgba(3,8,22,.83);font-size:9px;color:#ebf9ff}
.concept-label{position:absolute;bottom:7px;left:9px;z-index:2;background:rgba(0,0,0,.7);color:#ccd7e8;padding:2px 5px;border-radius:3px;font-size:8px;letter-spacing:.09em;text-transform:uppercase}
.card-body{padding:15px 13px 13px}
.card-heading h3{font-size:14px}
.card-body p{color:#b9c9e4;font-size:11px;height:45px}
.card-meta{border-color:rgba(105,167,247,.2);font-size:10px}
.card-cta{border:1px solid rgba(53,205,255,.35);background:linear-gradient(110deg,#0678e9,#077dff 61%,#235aef);box-shadow:0 4px 13px rgba(0,125,251,.12)}
.project-card:nth-child(2) .card-cta{background:linear-gradient(110deg,#7245eb,#ab23e4)}
.project-card:nth-child(4) .card-cta{background:linear-gradient(110deg,#a536e1,#dc1de3)}
.project-card.category-fivem .card-cta{background:linear-gradient(110deg,#f0783b,#f14183)}
.card-cta:hover{filter:brightness(1.16)}
.platform-section{padding-top:62px}
.platform-tile{border-radius:12px;min-height:190px;background:linear-gradient(100deg,rgba(2,10,30,.85),rgba(5,14,33,.36)),url('/assets/img/cyber-city.webp') 21% 59%/auto 430px no-repeat,#091a34;border:1px solid rgba(24,205,252,.63);box-shadow:inset 0 0 25px rgba(14,102,192,.16)}
.platform-tile:after{background:linear-gradient(125deg,transparent 20%,rgba(13,175,241,.11) 20.4%,transparent 21%);inset:0;width:auto;height:auto;transform:none;border:0;border-radius:0}
.platform-tile.android{background:linear-gradient(108deg,rgba(2,32,34,.9),rgba(0,43,45,.33)),url('/assets/img/cyber-city.webp') 52% 61%/auto 440px no-repeat,#081f22;border-color:rgba(21,243,190,.63)}
.platform-tile.fivem{background:linear-gradient(108deg,rgba(30,9,24,.88),rgba(55,16,27,.35)),url('/assets/img/cyber-city.webp') 90% 61%/auto 430px no-repeat,#260e23;border-color:rgba(247,117,70,.66)}
.platform-icon{font-size:37px;color:#29ddff;text-shadow:0 0 24px rgba(20,210,251,.55);z-index:1}
.android .platform-icon{color:#4af5a5}
.fivem .platform-icon{color:#ff9d60}
.platform-tile>div,.round-arrow{z-index:1}
.platform-tile h3{font-size:19px;text-shadow:0 2px 10px #000}
.platform-tile p{color:#c2d0e2}
.platform-tile small{font-weight:700;color:#72e8ff}
.platform-tile.android small{color:#6af7c6}
.platform-tile.fivem small{color:#ffad81}
.platform-tile:hover{box-shadow:0 0 23px rgba(35,190,250,.16);filter:brightness(1.09)}
.round-arrow{border-color:rgba(201,233,255,.7);background:rgba(0,0,0,.24)}
.updates-section{padding-top:48px}
.release-card,.subtle-panel,.empty-card{background:linear-gradient(135deg,rgba(17,29,54,.96),rgba(5,13,31,.98));border-color:rgba(48,130,216,.33)}
.release-card:nth-child(2){border-color:rgba(174,70,255,.39)}
.release-card:nth-child(3){border-color:rgba(241,87,106,.36)}
.release-card:hover{border-color:var(--magenta)}
.release-icon,.update-symbol{box-shadow:inset 0 0 10px rgba(62,121,255,.2),0 0 15px rgba(18,119,244,.15)}
.subtle-panel{border-left:3px solid #9d4ce9}
.bottom-banner{position:relative;isolation:isolate;overflow:hidden;margin-top:10px;padding:33px 39px;border-color:rgba(51,182,245,.49);background:linear-gradient(93deg,rgba(5,10,30,.9),rgba(5,17,40,.52)),url('/assets/img/cyber-city.webp') center 68%/cover no-repeat,#091227;box-shadow:0 0 28px rgba(106,45,224,.12)}
.bottom-banner:after{content:"";position:absolute;z-index:-1;inset:auto 0 0 0;height:2px;background:linear-gradient(90deg,#14cfff,#bc2cf4,#ff43d8)}
.banner-actions{display:flex;flex-wrap:wrap;gap:12px}
.bottom-banner .overline{color:#ae9afa}
.footer{background:linear-gradient(0deg,#050718,#090e20);border-top:1px solid rgba(61,159,255,.24)}
.footer-bottom{border-color:rgba(78,129,212,.2)}
/* Consistent interior pages / CMS keep all existing workflows and form controls. */
.page-heading{position:relative;border-color:rgba(53,192,248,.3);background:linear-gradient(90deg,rgba(5,10,26,.93),rgba(7,10,27,.74)),url('/assets/img/cyber-city.webp') center 35%/cover no-repeat}
.page-heading:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#03bbfc,#a44aff,#fa36ba)}
.project-page .detail-icon{border-color:rgba(156,72,254,.6);background:linear-gradient(135deg,#112f62,#29113a);color:#c0e3ff;box-shadow:0 0 25px rgba(102,53,234,.19)}
.detail-meta span,.filter-pill{background:rgba(17,27,52,.85);border-color:rgba(57,131,224,.33)}
.filter-pill.selected,.filter-pill:hover{background:linear-gradient(120deg,rgba(14,120,210,.4),rgba(108,29,185,.34));border-color:rgba(27,221,255,.7)}
.gallery-box,.info-panel,.side-card,.contact-card{border-color:rgba(79,123,230,.3);background:linear-gradient(125deg,rgba(13,21,42,.97),rgba(7,12,30,.97))}
.gallery-placeholder{background:radial-gradient(circle at 50% 45%,rgba(98,24,152,.3),transparent 55%),url('/assets/img/cyber-city.webp') center 55%/cover no-repeat}
.tab.active{border-color:var(--magenta)}
.contact-card:hover{border-color:var(--magenta)}
.contact-icon{color:#7ecaff}
.admin-body{background:#070918}
.admin-sidebar{background:#091027;border-color:rgba(34,152,225,.29)}
.admin-top{background:rgba(7,11,29,.9);border-color:rgba(117,58,213,.26)}
.admin-menu a:hover,.admin-menu a.selected{background:linear-gradient(100deg,rgba(15,122,209,.35),rgba(115,32,172,.22));border-left:2px solid #2ddcfe;color:#a0deff}
.admin-stats>div,.admin-panel{background:linear-gradient(140deg,rgba(17,28,58,.97),rgba(8,14,32,.98));border-color:rgba(81,122,215,.28)}
.admin-stats>div:nth-child(even){border-color:rgba(147,78,237,.27)}
.admin-stats small,.admin-top a,.panel-head a{color:#6dd5ff}
.form-grid input:not([type=checkbox]),.form-grid textarea,.form-grid select{background:#070e25;border-color:rgba(93,110,205,.43)}
.form-grid input:focus,.form-grid textarea:focus,.form-grid select:focus{outline-color:#5fe8ff}
/* Adaptive header and low-motion layout. */
@media(max-width:1350px){.top-search{width:175px}.header-inner{gap:12px}.main-nav a{padding:0 8px}.cyber-hero h1{font-size:clamp(46px,5.2vw,71px)}}
@media(max-width:1100px){.top-search{display:none}.main-nav{margin-left:auto}.cyber-hero h1{font-size:clamp(43px,5.4vw,65px)}.card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.project-art{height:170px}}
@media(max-width:850px){.site-header{height:70px}.main-nav{background:rgba(7,10,30,.98);border-color:rgba(171,55,239,.39)}.main-nav.open{display:flex}.main-nav a{padding:13px 14px}.header-inner .menu-toggle{margin-left:auto}.cyber-hero .hero-layout{grid-template-columns:1fr}.cyber-hero .hero-copy{padding:58px 0 0}.cyber-hero h1{font-size:clamp(54px,8.4vw,75px)}.cyber-hero .hero-description{max-width:560px}.cyber-visual{height:365px;margin:0}.hero-device-image{inset:0 8% -2% 8%}.cyber-floating-badge{bottom:10px;right:11%}.hero-corner{display:none}.platform-grid,.updates-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.cyber-hero .hero-copy{padding:42px 0 0}.cyber-hero h1{font-size:clamp(40px,10vw,61px)}.cyber-hero .hero-development{font-size:.89em}.cyber-hero .hero-tagline{font-size:18px}.cyber-hero .hero-description{font-size:13px}.cyber-hero .hero-meta{margin-top:35px}.cyber-hero .hero-meta div{min-width:0;flex:1;margin-right:9px;padding-right:7px}.cyber-hero .hero-meta strong{font-size:18px}.cyber-hero .hero-meta span{font-size:9px}.cyber-visual{height:265px}.hero-device-image{inset:0 -4% 0 -4%}.cyber-floating-badge{bottom:0;right:3%;font-size:8px}.section-projects{padding-top:48px}.section h2,.section-intro h2,.bottom-banner h2{font-size:29px}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.project-art{height:124px}.card-body{padding:12px 10px}.card-heading h3{font-size:12px}.card-body p{font-size:10px}.card-meta{font-size:9px}.card-cta{font-size:10px}.platform-grid,.updates-grid{grid-template-columns:1fr}.platform-section{padding-top:44px}.platform-tile{min-height:172px}.bottom-banner{padding:25px 22px}.banner-actions{width:100%}.banner-actions .btn{flex:1}.footer{margin-top:0}}
@media(max-width:365px){.card-grid{grid-template-columns:1fr}.project-art{height:190px}.hero-buttons .btn{min-width:0;width:100%}.cyber-hero h1{font-size:41px}.hero-device-image{inset:0 -16% 0 -16%}}
@media(prefers-reduced-motion:reduce){.project-card,.project-image,.btn{transition:none!important}.cyber-hero h1{filter:none}}


/* v1.1.1 — uploaded project media should always display in full, including square app logos.
   Concept covers still use full-bleed art. No editing or loss of uploaded files. */
.project-art:not(.concept-art):has(> .project-image){
    background:radial-gradient(ellipse at 50% 36%,rgba(36,92,166,.20),transparent 68%),#060d1b;
}
.project-art:not(.concept-art) > .project-image{
    object-fit:contain;
    object-position:center;
    padding:5px;
    transform:none;
}
.project-card:hover .project-art:not(.concept-art) > .project-image{transform:none}
.gallery-thumb img,.admin-screen img{object-fit:contain;background:#060d1b}
/* The public Discord invitation is shown on the home CTA, Contact page, and footer. */
.discord-join{border-color:#a969f5!important;color:#f3ebff!important;background:rgba(51,25,103,.52)!important}
.discord-join:hover{background:rgba(86,34,146,.7)!important;box-shadow:0 0 22px rgba(162,74,241,.2)}
.discord-contact{border-color:rgba(178,107,251,.55);background:linear-gradient(125deg,rgba(39,20,76,.92),rgba(7,12,30,.96))}
.discord-contact:hover{border-color:#ca8fff;box-shadow:0 0 23px rgba(136,64,235,.14)}
.discord-contact .contact-icon{color:#c991ff}
.footer-links .footer-discord{color:#d7aeff;font-weight:750}
.footer-links .footer-discord:hover{color:#fff;text-shadow:0 0 13px rgba(188,94,255,.6)}


/* v1.2 — image-link gallery + FREE/PAID pricing in the approved cyberpunk design */
.card-price-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px;font-size:10px;color:#88a0b8;flex-wrap:wrap}
.price-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;max-width:100%;border-radius:5px;font-size:11px;line-height:1.2;letter-spacing:.045em;font-weight:850;white-space:normal}
.price-pill.free{color:#7dffd7;background:rgba(19,139,101,.17);border:1px solid rgba(33,211,149,.43)}
.price-pill.paid{color:#ffc1f5;background:rgba(170,47,156,.16);border:1px solid rgba(229,80,205,.47)}
.card-body p{margin-bottom:9px}
.card-meta{padding:9px 0;margin-top:8px}
.detail-price{display:flex;align-items:center;gap:10px;margin-top:13px}
.detail-price>span{font-size:10px;letter-spacing:.11em;font-weight:800;color:#7ea6c5}
.detail-price .price-pill{padding:9px 15px;font-size:16px;box-shadow:0 0 16px rgba(228,58,207,.07)}
.detail-actions small{max-width:270px;text-align:right;line-height:1.5}
.side-price{color:#c3f9ff!important}
.table-price{font-weight:850;display:inline-block;border-radius:5px;padding:5px 8px;white-space:nowrap}
.table-price.is-free{color:#5aefbb;background:rgba(12,132,95,.14)}
.table-price.is-paid{color:#edb3ff;background:rgba(156,68,211,.16)}
.pricing-editor{padding:20px;border-radius:11px;background:linear-gradient(115deg,rgba(36,23,77,.48),rgba(10,28,51,.52));border:1px solid rgba(155,96,236,.34)}
.pricing-editor .editor-section-heading h3{margin:6px 0 8px;color:#f3f0ff;font-size:18px}
.pricing-editor .editor-section-heading p{font-size:12px;margin:0 0 20px}
.pricing-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}
.pricing-is-free .pricing-controls input:disabled,.pricing-is-free .pricing-controls select:disabled{opacity:.48;cursor:not-allowed}
.image-source-form{margin:16px 0 24px;border:1px solid rgba(70,169,237,.26);background:rgba(3,12,30,.4);border-radius:10px;padding:17px}
.image-source-grid{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px}
.image-source-grid>label{min-width:0}
.image-source-grid input[type=file]{max-width:100%}
.image-or{font-size:10px;letter-spacing:.15em;font-weight:900;color:#c394e7;padding:8px;border:1px solid rgba(151,82,241,.4);border-radius:50%}
.image-source-grid small{font-size:10px;line-height:1.6;color:#8597ba;margin-top:5px}
.image-source-badge{font-size:10px;color:#b58efe;margin-left:8px;display:block;margin-bottom:12px}
@media(max-width:850px){.image-source-grid{grid-template-columns:1fr}.image-or{justify-self:center}.pricing-controls{grid-template-columns:1fr}.detail-actions small{text-align:left}}
@media(max-width:620px){.card-price-row{font-size:9px}.price-pill{font-size:10px;padding:4px 6px}.detail-price .price-pill{font-size:14px}}


/* NODE Development · v1.3.0 / private visitor analytics */
.analytics-preview{margin:24px 0}.analytics-mini{color:#8eacc9;font-size:12px;font-weight:500;margin-left:8px}
.analytics-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:12px 0 18px}
.analytics-hero-metrics{margin:4px 0 24px}
.analytics-metric{min-width:0;border:1px solid #244260;background:linear-gradient(135deg,rgba(8,34,57,.96),rgba(22,12,49,.89));padding:24px;border-radius:13px;position:relative;overflow:hidden}
.analytics-metric:before{content:'';position:absolute;top:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,#00d8fd,#7e60ff,#e927db)}
.analytics-metric small{display:block;color:#81c8ee;font-size:13px;font-weight:700}
.analytics-metric strong{display:block;color:#eff9ff;font-size:clamp(27px,3vw,42px);line-height:1.3;margin-top:7px}
.analytics-metric span{font-size:12px;color:#91a5be;line-height:1.5}
.analytics-panel{margin-bottom:24px}
.analytics-chart{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:clamp(4px,1vw,17px);height:228px;min-width:0;padding:20px 7px 0}
.analytics-chart-column{display:flex;flex-direction:column;align-items:center;min-width:0;gap:4px}
.analytics-chart-value{font-size:11px;color:#93b2d0;font-weight:650;flex:0 0 18px;text-align:center}
.analytics-chart-track{width:100%;height:147px;display:flex;align-items:flex-end;justify-content:center;border-bottom:1px solid #2c4164}
.analytics-chart-fill{width:min(100%,30px);min-height:2px;background:linear-gradient(0deg,#097ea8,#08d6f8 55%,#c043e7);border-radius:5px 5px 0 0;box-shadow:0 0 12px #00afff33}
.analytics-chart-day{font-size:clamp(8px,1vw,11px);white-space:nowrap;color:#829abb}
.analytics-country-header{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.analytics-country-header p{margin:7px 0 0}
.analytics-period-tabs{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.analytics-period-tabs a{padding:9px 14px;color:#a5b8d0;border:1px solid #2b3c68;border-radius:8px;text-decoration:none;white-space:nowrap;font-size:12px}
.analytics-period-tabs a.active{color:#fff;background:linear-gradient(110deg,#107de1,#7836d5);border-color:#3b9eeb}
.analytics-country-table{width:100%}.analytics-country-table td{vertical-align:middle}.analytics-rank{color:#8d96bb;width:54px}
.analytics-country-name{display:flex;align-items:center;gap:13px}.analytics-country-name img{display:block;border-radius:3px;object-fit:contain;flex-shrink:0;max-width:32px}
.analytics-country-name strong{display:block;color:#e8f8ff}.analytics-country-name small{display:block;color:#849bb7;margin-top:2px}
.analytics-unknown-flag{width:32px;height:24px;display:grid;place-items:center;font-size:22px}
.analytics-percent{display:flex;align-items:center;gap:10px;min-width:140px}
.analytics-country-meter{height:7px;width:min(150px,65%);background:#19314d;border-radius:15px;overflow:hidden;min-width:50px}
.analytics-country-meter span{display:block;height:100%;border-radius:15px;background:linear-gradient(90deg,#00c7ed,#bd48e6)}
.analytics-percent small{color:#91c5e1;min-width:38px}
.analytics-privacy-note{color:#92a7bf;font-size:12px;line-height:1.7;padding:14px 17px;border:1px solid #29364f;border-radius:12px;background:#0e1727;margin:4px 0 22px}
.analytics-privacy-note strong{color:#d2e4fa}.analytics-privacy-note a{color:#53caff}
.analytics-hint{color:#9bbbd0;line-height:1.7;padding:14px 20px}
@media(max-width:760px){.analytics-metrics{grid-template-columns:1fr;gap:10px}.analytics-metric{padding:17px 20px}.analytics-chart{gap:3px;padding:20px 0 0}.analytics-chart-day{font-size:8px;transform:rotate(-55deg);transform-origin:center;margin-top:14px}.analytics-chart-track{height:142px}.analytics-chart-value{font-size:9px}.analytics-country-header{align-items:flex-start}.analytics-country-table th,.analytics-country-table td{padding:12px 8px}.analytics-percent{min-width:90px}}


/* NODE Development v1.3.3 — always-on admin-managed announcement strip */
.node-announcement{position:sticky;top:0;z-index:65;width:100%;background:var(--announce-bg,#132044);color:var(--announce-fg,#fff);border-bottom:1px solid rgba(255,255,255,.18);box-shadow:0 3px 17px rgba(0,0,0,.45);isolation:isolate;min-height:48px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.node-announcement:before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 70px,rgba(255,255,255,.03) 71px,transparent 72px)}
.node-announcement-viewport{width:100%;max-width:100%;overflow:hidden;padding:11px 22px;text-align:center}
.node-announcement-content{display:inline-flex;align-items:center;justify-content:center;gap:12px;max-width:100%;font-family:var(--announce-font,"Segoe UI",Arial,sans-serif);font-size:var(--announce-size,16px);font-weight:700;line-height:1.45;overflow-wrap:anywhere;white-space:normal}
.node-announcement-text{min-width:0}.announce-mark{font:900 21px/1 Arial,sans-serif;flex-shrink:0;opacity:.9}
.node-announcement-content.animation-left{animation:node-announce-left .85s ease-out both}
.node-announcement-content.animation-right{animation:node-announce-right .85s ease-out both}
.node-announcement-content.animation-down{animation:node-announce-down .85s ease-out both}
.node-announcement-content.animation-fade{animation:node-announce-fade .9s ease-out both}
.node-announcement-content.animation-ticker_left,.node-announcement-content.animation-ticker_right{white-space:nowrap;max-width:none;width:100%;overflow-wrap:normal;animation:node-announce-ticker-left 20s linear infinite}
.node-announcement-content.animation-ticker_right{animation-name:node-announce-ticker-right}
@keyframes node-announce-left{from{opacity:0;transform:translateX(-75px)}to{opacity:1;transform:translateX(0)}}
@keyframes node-announce-right{from{opacity:0;transform:translateX(75px)}to{opacity:1;transform:translateX(0)}}
@keyframes node-announce-down{from{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}
@keyframes node-announce-fade{from{opacity:0}to{opacity:1}}
@keyframes node-announce-ticker-left{from{transform:translateX(110%)}to{transform:translateX(-110%)}}
@keyframes node-announce-ticker-right{from{transform:translateX(-110%)}to{transform:translateX(110%)}}
.announcement-state{font-size:11px;font-weight:750;padding:7px 11px;border-radius:30px;border:1px solid rgba(255,255,255,.15)}
.announcement-state.on{color:#74f4c3;background:rgba(13,120,88,.14);border-color:rgba(46,210,140,.28)}
.announcement-state.off{color:#ffbecc;background:rgba(142,40,80,.14)}
.announcement-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.announcement-form>label{display:flex;flex-direction:column;gap:7px;min-width:0;color:#b8ceea;font-weight:650;font-size:12px}
.announcement-form input[type=color]{width:100%;height:48px;padding:5px;cursor:pointer;border:1px solid #345077;border-radius:8px;background:#0a1425}
.announcement-form textarea{resize:vertical}
.announcement-form small{font-weight:400;color:#90a6c8;font-size:11px}
.announcement-preview-wrapper{background:rgba(0,0,0,.16);border-radius:12px;padding:18px;border:1px solid rgba(116,145,210,.2);min-width:0}
.announcement-preview-frame{border-radius:9px;border:1px solid rgba(111,144,210,.3);overflow:hidden}
.announcement-preview-bar{background:#132044;color:#fff;font-size:16px;font-weight:750;line-height:1.35;min-height:58px;display:flex;justify-content:center;align-items:center;text-align:center;gap:11px;padding:13px;overflow-wrap:anywhere;overflow:hidden}
.announcement-preview-nav{background:#080e22;color:#abc9ff;font-weight:850;font-size:12px;letter-spacing:.08em;padding:15px 20px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}
.announcement-preview-nav span{font-size:11px;font-weight:500;letter-spacing:0}
.announcement-remove-panel{margin-top:22px;padding:18px 0 0;border-top:1px solid rgba(118,151,203,.2);display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.announcement-remove-panel p{font-size:12px;margin:4px 0 0}.btn.danger-announcement{background:#2a142b;border:1px solid #aa466c;color:#ffbbca}
.announcement-preview-bar.preview-enter-left{animation:node-announce-left .85s ease both}.announcement-preview-bar.preview-enter-right{animation:node-announce-right .85s ease both}.announcement-preview-bar.preview-enter-down{animation:node-announce-down .85s ease both}.announcement-preview-bar.preview-enter-fade{animation:node-announce-fade .85s ease both}
@media(max-width:700px){.announcement-form{grid-template-columns:1fr}.announcement-form .span-2{grid-column:1}.node-announcement-viewport{padding:9px 15px}.node-announcement{min-height:44px}.announcement-preview-nav span{display:none}}
@media(prefers-reduced-motion:reduce){.node-announcement-content,.announcement-preview-bar{animation:none!important;transform:none!important;opacity:1!important}}

/* NODE Development v1.3.4 — ticker path fix + real-time admin animation preview.
   The track is intrinsically sized. Move it from just outside the RIGHT edge
   to just outside the LEFT edge, regardless of bar width or message length. */
.node-announcement-viewport.marquee{
  position:relative; width:100%; max-width:100%; padding:0;
  height:max(49px,calc(var(--announce-size,16px) * 1.55 + 14px));
  overflow:hidden;
}
.node-announcement-viewport.marquee .node-announcement-content,
.announcement-preview-runway.marquee .node-announcement-content{
  position:absolute;top:0;left:100%;height:100%;width:max-content;max-width:none;
  display:inline-flex;align-items:center;justify-content:flex-start;
  white-space:nowrap;overflow-wrap:normal;padding:0 12px;
  will-change:transform,left;
}
.node-announcement-viewport.marquee .node-announcement-content.animation-ticker_left,
.announcement-preview-runway.marquee .node-announcement-content.animation-ticker_left{
  animation:node-marquee-traverse-left 13s linear infinite;
}
.node-announcement-viewport.marquee .node-announcement-content.animation-ticker_right,
.announcement-preview-runway.marquee .node-announcement-content.animation-ticker_right{
  animation:node-marquee-traverse-right 13s linear infinite;
}
@keyframes node-marquee-traverse-left{
  from{left:100%;transform:translate3d(0,0,0)}
  to{left:0;transform:translate3d(-100%,0,0)}
}
@keyframes node-marquee-traverse-right{
  from{left:0;transform:translate3d(-100%,0,0)}
  to{left:100%;transform:translate3d(0,0,0)}
}
.announcement-preview-bar{padding:0;display:block;overflow:hidden}
.announcement-preview-runway{
  width:100%;min-height:58px;padding:12px;position:relative;
  display:flex;align-items:center;justify-content:center;text-align:center;
  overflow:hidden;
}
.announcement-preview-runway.marquee{
  display:block;padding:0;
  height:max(58px,calc(var(--announce-size,16px) * 1.55 + 14px));
  min-height:0;
}
.announcement-preview-content{color:inherit;line-height:1.45}
.announcement-preview-content.animation-left{animation:node-announce-left .85s ease-out both}
.announcement-preview-content.animation-right{animation:node-announce-right .85s ease-out both}
.announcement-preview-content.animation-down{animation:node-announce-down .85s ease-out both}
.announcement-preview-content.animation-fade{animation:node-announce-fade .9s ease-out both}
.announcement-preview-helper{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:10px;flex-wrap:wrap}
.announcement-preview-helper .small-note{margin:0;flex:1;min-width:195px}
/* Only move the message, never the entire banner background. */
.announcement-preview-bar.preview-enter-left,.announcement-preview-bar.preview-enter-right,
.announcement-preview-bar.preview-enter-down,.announcement-preview-bar.preview-enter-fade{animation:none}
@media(max-width:700px){
  .node-announcement-viewport.marquee{padding:0}
  .announcement-preview-helper .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .node-announcement-viewport.marquee .node-announcement-content,
  .announcement-preview-runway.marquee .node-announcement-content{
    position:static;max-width:100%;width:auto;height:auto;
    white-space:normal;will-change:auto;
  }
  .node-announcement-viewport.marquee,.announcement-preview-runway.marquee{
    display:flex;align-items:center;justify-content:center;height:auto;min-height:49px;padding:9px 12px;
  }
  .node-announcement-content,.announcement-preview-content{animation:none!important;transform:none!important;opacity:1!important}
}