/* Landing artwork: CSS geometry, chrome reflections and a floating arcade cabinet. */
.hero{padding-top:60px;padding-bottom:55px}
.arcade-stage{position:relative;perspective:1300px;padding:15px 42px 35px 15px;isolation:isolate;max-width:500px;margin:auto}
.arcade-stage::before{content:'';position:absolute;inset:10% -4% 5%;z-index:-1;background:radial-gradient(ellipse,#8f51ff28,transparent 66%)}
.arcade-machine{position:relative;transform-style:preserve-3d;transform:rotateY(-13deg) rotateX(5deg);animation:arcadeFloat 6s ease-in-out infinite}
.arcade-machine::after{content:'';position:absolute;left:100%;top:0;bottom:0;width:52px;transform:rotateY(90deg);transform-origin:left;background:linear-gradient(100deg,#413454,#171020 70%);border:3px solid #92819d;border-left:0;box-sizing:border-box;box-shadow:inset -7px 0 #20152e}
.arcade-marquee{position:relative;text-align:center;padding:18px 8px 13px;background:linear-gradient(120deg,#f8e48b,#e9ad19 48%,#ffdf73);border:5px solid #3a2c48;box-shadow:inset 0 0 0 2px #fff0a6,inset 0 0 22px #e5752570,0 -3px #aa94b9;color:#28122c}
.arcade-marquee>span{display:block;font:clamp(18px,2.6vw,28px)/1.2 var(--f-arcade);text-shadow:2px 2px #fff4bb}
.arcade-marquee small{display:block;margin-top:7px;font:7px/1.5 var(--f-arcade);letter-spacing:2px}
.arcade-machine .world-select{border:5px solid #66516f;border-top:0;border-bottom:0;background:linear-gradient(110deg,#342c43,#151220 80%);padding:12px 17px 8px;box-shadow:inset 4px 0 0 #9a83ab,inset -4px 0 0 #090810;transform:none}
.arcade-machine .world-select::after{display:none}
.arcade-machine .world-select-top{color:#c6b6d5;font-size:6px;padding-bottom:9px}
.arcade-machine .world-select-screen{border:5px solid #0d0b15;border-radius:16px !important;box-shadow:0 0 0 2px #645172,0 0 24px #927dff30}
.arcade-machine .world-select-screen::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:12px !important;background:linear-gradient(130deg,#ffffff18,transparent 40%,transparent 75%,#ffffff09);box-shadow:inset 0 0 20px #0009}
.arcade-machine .world-select-hud{inset:8px 8px auto;font-size:11px;opacity:.8}
.arcade-screen-brand{position:absolute;z-index:1;left:8px;right:8px;top:26%;text-align:center;color:#ffe879;font:bold clamp(28px,4vw,45px)/1 var(--f-pixel);text-shadow:0 0 14px #ffa52d,3px 3px #601846;pointer-events:none}
.arcade-screen-brand small{display:block;color:#ffeda1;font:6px/1.6 var(--f-arcade);letter-spacing:1px;margin-top:10px}
.arcade-machine .world-select-caption{font-size:12px;letter-spacing:1px;bottom:10px}
.arcade-machine .world-select-bottom{color:#d0bfdc;font-size:12px;padding-top:8px}
.arcade-machine .world-select-controls .icon-btn{color:#f5da76;background:#32263d;border-color:#75627c}
.arcade-deck{position:relative;height:69px;margin:0 -9px;background:linear-gradient(#746181,#382f48 13%,#473752 80%,#1a1225 82%);border:3px solid #b3a0c0;border-bottom:6px solid #201528;box-shadow:0 6px 0 #0d0a15;transform:translateZ(16px);z-index:2}
.arcade-deck>span{position:absolute;left:42%;bottom:12px;font:7px var(--f-arcade);color:#d3badd}
.arcade-stick{position:absolute;width:48px;height:18px;border-radius:50% !important;left:21%;top:25px;background:linear-gradient(#18121f,#80718f);box-shadow:0 3px #16101d}
.arcade-stick::before{content:'';position:absolute;width:10px;height:36px;left:19px;bottom:9px;background:linear-gradient(90deg,#696276,#eee7ff,#494050);transform:rotate(-9deg);transform-origin:bottom}
.arcade-stick::after{content:'';position:absolute;width:30px;height:30px;left:5px;bottom:34px;border-radius:50% !important;background:radial-gradient(circle at 32% 23%,#ffbcc4,#f44361 35%,#730d39 82%);box-shadow:3px 5px 8px #0006}
.arcade-buttons{position:absolute;right:12%;top:18px;display:flex;gap:11px;transform:rotate(-10deg)}
.arcade-buttons i{display:block;width:24px;height:18px;border-radius:50% !important;background:radial-gradient(ellipse at 40% 25%,#fff2ae,#f5b624 65%);border:2px solid #312038;box-shadow:0 5px #986112,0 7px #150c1c}
.arcade-buttons i:nth-child(2){background:radial-gradient(ellipse at 40% 25%,#ffaabf,#ee4068 65%);box-shadow:0 5px #811f42,0 7px #150c1c}
.arcade-buttons i:nth-child(3){background:radial-gradient(ellipse at 40% 25%,#c8a9ff,#8954d1 65%);box-shadow:0 5px #472775,0 7px #150c1c}
.arcade-base{height:140px;position:relative;margin:0 9px;background:linear-gradient(105deg,#3c2c50,#20172e 80%);border:4px solid #79618b;border-top:0;border-bottom:10px solid #17101e;box-shadow:inset 5px 0 #b49ac9,inset -5px 0 #0d0815;overflow:hidden}
.arcade-base::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent 40%,#a584c716 40%,#a584c716 44%,transparent 44%,transparent 47%,#f1c65245 47%,#f1c65245 49%,transparent 49%)}
.arcade-emblem{position:absolute;left:17%;top:8px;font:bold 83px/.9 var(--f-pixel);color:#d1b1fa;text-shadow:3px 3px #6e3b95;transform:skewY(-6deg)}
.arcade-emblem span{display:block;font:9px var(--f-arcade);letter-spacing:6px;text-shadow:none;color:#f9d76e;text-align:center;margin-top:10px}
.arcade-coin{position:absolute;right:13%;top:21px;border:3px solid #7b6b8b;border-radius:5px !important;background:linear-gradient(115deg,#312a3d,#100c18);padding:12px 9px;color:#baa6cb;font:5px var(--f-arcade);box-shadow:3px 4px 0 #0d0815}
.arcade-coin i{display:block;height:24px;width:5px;background:#09070d;box-shadow:2px 0 #af9fbb;margin:0 auto 9px}
.arcade-speaker{position:absolute;right:15%;bottom:9px;width:60px;height:17px;background:repeating-linear-gradient(0deg,#09070d 0 2px,transparent 2px 5px)}
.arcade-shadow{height:20px;width:85%;position:absolute;bottom:4px;left:8%;border-radius:50% !important;background:#08041060;filter:blur(9px);animation:arcadeShadow 6s ease-in-out infinite}
@keyframes arcadeFloat{0%,100%{transform:translateY(0) rotateY(-13deg) rotateX(5deg)}50%{transform:translateY(-17px) rotateY(-10deg) rotateX(3deg)}}
@keyframes arcadeShadow{0%,100%{transform:scaleX(1);opacity:.65}50%{transform:scaleX(.84);opacity:.4}}
.feature-showcase{padding:72px 0 62px;border-top:1px solid var(--line);background:linear-gradient(180deg,var(--bg2),transparent)}
.feature-showcase .h2{max-width:720px}
.power-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:26px}
.power-item{text-align:center;min-width:0}
.power-item h3{font:700 29px/1.1 var(--f-text);margin:10px 0 14px;color:var(--ink)}
.power-item p{font:23px/1.4 var(--f-text);color:var(--dim);max-width:320px;margin:auto}
.power-art{height:170px;display:grid;place-items:center;perspective:700px;filter:drop-shadow(0 18px 14px #0003)}
.chrome-orbit{width:117px;height:117px;position:relative;border:13px solid transparent;border-radius:50% !important;background:linear-gradient(var(--bg2),var(--bg2)) padding-box,conic-gradient(#f3f0ff,#7a7797,#fff,#665f82,#d7cef7,#fff1ac,#727081,#fff) border-box;transform:rotateX(23deg) rotateY(-30deg);box-shadow:5px 5px 0 #635872,inset 3px 3px 0 #635872;animation:chromeFloat 7s ease-in-out infinite}
.chrome-orbit i{position:absolute;width:12px;height:60px;bottom:50%;left:calc(50% - 6px);transform-origin:bottom;transform:rotate(45deg);background:linear-gradient(90deg,#73552b,#ffed9c,#c69637);border-radius:8px !important;box-shadow:3px 2px 0 #886322}
.chrome-orbit b{position:absolute;left:calc(50% - 12px);top:calc(50% - 12px);width:24px;height:24px;border-radius:50% !important;background:radial-gradient(circle at 30% 20%,#fff3b1,#db9d25 70%)}
.chrome-globe{position:relative;width:126px;height:126px;border:7px solid #d1cee6;border-radius:50% !important;transform:rotate(-18deg) rotateY(-20deg);box-shadow:3px 4px 0 #685f80,inset 3px 3px 0 #fff9;background:radial-gradient(circle at 30% 20%,#ddc7ff30,#60479230);animation:chromeFloat 7s ease-in-out -2s infinite}
.chrome-globe i,.chrome-globe b,.chrome-globe span{position:absolute;inset:-3px 24px;border:5px solid #d7cfee;border-radius:50% !important;box-shadow:2px 2px #5c5272,inset 1px 1px #fff}
.chrome-globe b{inset:32px -3px;transform:rotate(-10deg)}
.chrome-globe span{inset:54px -3px;border-width:3px;transform:rotate(-10deg)}
.chrome-devices{width:174px;height:126px;position:relative;transform:rotateY(-22deg) rotateX(13deg);animation:chromeFloat 7s ease-in-out -4s infinite}
.chrome-laptop{position:absolute;left:4px;top:4px;width:127px;height:88px;background:linear-gradient(135deg,#ae8cce55,#48315980);border:8px solid #d9d2e8;border-radius:9px !important;box-shadow:5px 3px #62536f,inset 2px 2px #33253c}
.chrome-laptop::after{content:'';position:absolute;left:-20px;bottom:-22px;width:150px;height:16px;transform:skewX(-25deg);background:linear-gradient(#f3efff,#89809c);border-radius:2px 2px 7px 7px !important;box-shadow:3px 4px #645770}
.chrome-phone{position:absolute;right:3px;bottom:0;width:48px;height:89px;border:6px solid #e7e0ec;border-radius:11px !important;background:linear-gradient(135deg,#c59bef,#5c3987);box-shadow:4px 4px #726080,inset 0 0 0 2px #2f1b44}
.chrome-phone::before{content:'';position:absolute;top:2px;left:8px;width:20px;height:4px;border-radius:4px !important;background:#e7e0ec}
@keyframes chromeFloat{0%,100%{translate:0 0}50%{translate:0 -9px}}
.alice-shield{background:#0b0910;color:#f1e9fa;border-block:1px solid #3b2c4a;padding:76px 0;overflow:hidden}
.shield-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:44px;align-items:center}
.shield-copy h2{font:700 clamp(42px,5vw,62px)/1 var(--f-pixel);margin:18px 0 32px}
.shield-detail{display:flex;gap:18px;margin:25px 0}
.shield-detail>span{color:#d6b855;font:10px/2.3 var(--f-arcade)}
.shield-detail h3{font:700 28px/1.1 var(--f-text);margin:0 0 10px}
.shield-detail p{font:23px/1.35 var(--f-text);color:#b8a9c6;margin:0}
.shield-copy .btn{margin-top:15px;color:#f1e9fa;background:#2f243c;box-shadow:0 6px #181020}
.shield-scene{height:440px;position:relative;perspective:900px;display:grid;place-items:center;isolation:isolate}
.shield-scene::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse,#b16fff20,transparent 65%);z-index:-1}
.shield-3d{position:relative;width:235px;height:285px;transform:rotateY(-22deg) rotateZ(8deg);animation:shieldHover 7s ease-in-out infinite;filter:drop-shadow(17px 18px 0 #493951) drop-shadow(0 25px 30px #0009)}
.shield-face{height:100%;clip-path:polygon(50% 0,100% 17%,94% 65%,78% 85%,50% 100%,22% 85%,6% 65%,0 17%);background:linear-gradient(125deg,#fff,#a699b1 25%,#f8f0fa 36%,#746781 60%,#fbecff 85%);padding:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#f2d992;position:relative}
.shield-face::before{content:'';position:absolute;inset:10px;clip-path:inherit;background:linear-gradient(130deg,#a877cc,#4a276d 45%,#241139);box-shadow:inset 0 0 40px #20102e;z-index:-1}
.shield-face>span{font:700 136px/.85 var(--f-pixel);text-shadow:5px 5px #573256;color:#f2dfa7}
.shield-face>b{font:12px var(--f-arcade);margin-top:13px;letter-spacing:1px}
.shield-face>small{font:5px var(--f-arcade);margin-top:14px;color:#d7c2e9}
.shield-orbit{position:absolute;width:340px;height:170px;border:2px solid #987ca644;border-radius:50% !important;transform:rotate(-27deg);box-shadow:0 0 35px #b56af011}
.shield-orbit::after{content:'';position:absolute;top:30px;left:24px;width:17px;height:17px;border-radius:50% !important;background:radial-gradient(circle at 30% 30%,#fff2b3,#ca8b24);box-shadow:0 0 20px #f3c94955}
.shield-plinth{position:absolute;bottom:5px;width:290px;height:75px;border-radius:50% !important;background:linear-gradient(#927b9f 0,#382441 27%,#1b1126 34%,#120d18 85%);box-shadow:0 7px 0 #655172,0 13px 24px #000;transform:rotate(-6deg);text-align:center}
.shield-plinth span{font:6px var(--f-arcade);color:#bba1c9;position:absolute;bottom:15px;left:0;right:0}
@keyframes shieldHover{0%,100%{transform:translateY(-15px) rotateY(-22deg) rotateZ(8deg)}50%{transform:translateY(-32px) rotateY(-12deg) rotateZ(4deg)}}
.device-story{padding:76px 0;text-align:center;background:linear-gradient(var(--bg2),transparent)}
.device-story .h2{margin:20px auto;max-width:730px}
.device-story p{max-width:690px;margin:0 auto 28px;color:var(--dim);font:25px/1.4 var(--f-text)}
.device-platforms{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;margin-top:44px;font:8px/1.6 var(--f-arcade);color:var(--dim)}
.device-platforms span{color:var(--gold)}
@media(max-width:899px){.hero{padding-top:36px}.arcade-stage{width:min(100%,460px);margin-top:16px}.shield-grid{gap:20px}.shield-scene{transform:scale(.85)}.power-grid{gap:20px}.power-item h3{font-size:26px}}
@media(max-width:650px){.hero{padding-bottom:35px}.arcade-stage{padding:22px 33px 35px 12px;max-width:390px}.arcade-machine::after{width:38px}.arcade-marquee>span{font-size:24px}.arcade-screen-brand{font-size:35px}.arcade-machine .world-select{padding-inline:12px}.arcade-base{height:126px}.arcade-marquee small{font-size:6px}.arcade-machine .world-select-top{font-size:5px}.arcade-screen-brand small{font-size:5px}.power-grid{grid-template-columns:1fr;gap:38px}.feature-showcase,.alice-shield,.device-story{padding:48px 0}.power-art{height:154px}.power-item h3{font-size:31px}.power-item p{font-size:24px;max-width:350px}.shield-grid{grid-template-columns:1fr;gap:8px}.shield-copy h2{font-size:44px}.shield-detail h3{font-size:27px}.shield-scene{height:370px;transform:scale(.88)}.device-story p{font-size:24px}.device-platforms{font-size:7px;gap:12px}.shield-copy .btn{max-width:100%;white-space:normal}}
@media(max-width:360px){.arcade-marquee>span{font-size:20px}.arcade-screen-brand{font-size:28px}.arcade-machine .world-select-caption{font-size:10px}.arcade-machine .world-select-hud{font-size:9px}.arcade-machine .world-select-bottom{font-size:10px}.arcade-buttons{gap:7px;right:7%}.arcade-emblem{left:13%}.arcade-coin{right:9%}.shield-scene{width:100%;transform:scale(.8);height:335px}.shield-orbit{width:300px}}
@media(prefers-reduced-motion:reduce){.arcade-machine,.arcade-shadow,.chrome-orbit,.chrome-globe,.chrome-devices,.shield-3d{animation:none}}
/* SHIELD_LIGHT_20260926: блок «Твой щит в сети» в светлой теме тоже светлый */
:root[data-theme="light"] .alice-shield{background:var(--bg2);color:var(--ink);border-color:var(--line)}
:root[data-theme="light"] .shield-detail>span{color:#9a7414}
:root[data-theme="light"] .shield-detail p{color:var(--dim)}
:root[data-theme="light"] .shield-copy .btn{color:var(--ink);background:var(--btn2);box-shadow:0 6px var(--btn2-deep)}
:root[data-theme="light"] .shield-scene::before{background:radial-gradient(ellipse,#7435c62a,transparent 65%)}