/* Scoped xFame Studios site, superadmin CMS, and home integrations. */
.xf-nav-studios{color:#c3f314!important;font-weight:700}.xf-nav-studios:hover{color:#fff!important}
@media(min-width:1081px){.xf-nav{gap:clamp(16px,2vw,37px)!important}.xf-nav a{white-space:nowrap}}
.xf-game-connect{margin:46px 0 0;border:1px solid rgba(184,239,0,.28);background:linear-gradient(110deg,rgba(184,239,0,.065),rgba(8,18,20,.94) 45%,rgba(8,18,20,.98));display:grid;grid-template-columns:1.08fr 1fr;position:relative;overflow:hidden}
.xf-game-connect:before{content:"";height:2px;background:linear-gradient(90deg,#b8ef00,transparent 55%,#b8ef00);position:absolute;top:0;left:0;right:0}
.xf-game-connect__intro{padding:32px 40px 36px}.xf-game-connect__intro>span{font-size:11px;letter-spacing:.22em;color:#b8ef00;font-weight:700}
.xf-game-connect__intro h3{margin:18px 0;color:#f3f7f7;font-size:clamp(26px,3vw,45px);line-height:1.05;font-weight:900}.xf-game-connect__intro h3 em{font-style:normal;color:#b8ef00}
.xf-game-connect__intro p{margin:0;max-width:550px;color:#b4c1c1;font-size:15px;line-height:1.7}
.xf-game-connect__status{display:grid;grid-template-columns:1fr 1fr;border-left:1px solid rgba(184,239,0,.19)}
.xf-game-connect__status article{padding:40px 25px;border-left:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;justify-content:center;gap:10px}
.xf-game-connect__status article:first-child{border-left:0}.xf-game-connect__status b{font-size:10px;letter-spacing:.18em;color:#b8ef00}
.xf-game-connect__status strong{color:#eef4f3;font-size:18px;line-height:1.2}.xf-game-connect__status small{color:#a8b7b6;font-size:13px;line-height:1.55}
@media(max-width:980px){.xf-game-connect{grid-template-columns:1fr}.xf-game-connect__status{border-left:0;border-top:1px solid rgba(184,239,0,.19)}}
@media(max-width:600px){.xf-game-connect__intro{padding:25px 21px}.xf-game-connect__status{grid-template-columns:1fr}.xf-game-connect__status article{padding:20px 21px;border-top:1px solid rgba(255,255,255,.07)}.xf-game-connect__status article:first-child{border-top:0}}

.xs-body{--xs-lime:#b8ef00;--xs-line:rgba(184,239,0,.24);margin:0;background:#080e10;color:#f4f7f6;font-family:Inter,Arial,sans-serif;min-height:100vh;overflow-x:hidden}
.xs-body *{box-sizing:border-box}.xs-body a{color:inherit;text-decoration:none}.xs-body button,.xs-body input,.xs-body textarea{font:inherit}
.xs-container{width:min(1480px,calc(100% - 88px));margin:0 auto}
.xs-header{position:sticky;top:0;z-index:60;min-height:82px;padding:12px max(44px,calc((100vw - 1480px)/2));display:grid;grid-template-columns:260px 1fr auto;gap:24px;align-items:center;background:rgba(6,13,15,.95);border-bottom:1px solid var(--xs-line);backdrop-filter:blur(14px)}
.xs-header__brand{display:flex;gap:10px;align-items:center;font-size:21px;font-weight:900;letter-spacing:-.06em;line-height:1}.xs-header__brand em{display:block;margin-top:7px;font-size:10px;letter-spacing:.35em;font-style:normal;color:var(--xs-lime)}
.xs-mark{font-size:42px;line-height:1;color:var(--xs-lime);font-style:italic}.xs-header nav{display:flex;align-items:center;justify-content:center;gap:clamp(12px,2.3vw,35px)}.xs-header nav a{color:#bdcbca;white-space:nowrap;font-size:14px;transition:color .2s}.xs-header nav a:hover{color:var(--xs-lime)}
.xs-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;min-height:58px;padding:0 24px;background:var(--xs-lime);color:#061014!important;font-size:15px;font-weight:800;border:1px solid var(--xs-lime);cursor:pointer;transition:transform .2s,box-shadow .2s}
.xs-btn:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(184,239,0,.2)}.xs-btn span{font-size:23px;line-height:1}.xs-btn--small{min-height:44px;padding:0 17px;font-size:13px;gap:12px}.xs-btn--small span{font-size:19px}
.xs-text-link{display:inline-flex;align-items:center;gap:12px;color:#e5eeee!important;border-bottom:1px solid var(--xs-lime);padding:12px 0;font-weight:700}.xs-text-link span{color:var(--xs-lime)}
.xs-eyebrow{display:flex;align-items:center;gap:13px;color:var(--xs-lime);font-size:11px;font-weight:800;letter-spacing:.22em;text-transform:uppercase}.xs-eyebrow i{width:25px;height:1px;background:var(--xs-lime)}
.xs-hero{min-height:660px;display:grid;grid-template-columns:1.13fr .87fr;gap:40px;align-items:center;position:relative;padding-top:85px;padding-bottom:95px}
.xs-hero:before{content:"";position:absolute;top:0;left:58%;width:1px;height:100%;background:linear-gradient(transparent,rgba(184,239,0,.12),transparent);pointer-events:none}
.xs-hero__content{position:relative;z-index:2}.xs-hero__logo{display:block;width:min(450px,80%);height:auto;max-height:180px;object-fit:contain;object-position:left;margin:14px 0 25px}
.xs-hero h1{font-size:clamp(47px,5.35vw,86px);max-width:880px;line-height:.97;letter-spacing:-.045em;margin:0;font-weight:900}
.xs-lead{max-width:640px;margin:26px 0 0;color:#bbc9c9;line-height:1.65;font-size:clamp(17px,1.4vw,21px)}
.xs-hero__actions{display:flex;align-items:center;flex-wrap:wrap;gap:25px;margin-top:34px}
.xs-hero__graphic{min-height:460px;display:grid;place-items:center;position:relative;background:radial-gradient(ellipse at 50% 50%,rgba(184,239,0,.11),transparent 66%)}
.xs-hero__custom-image{display:block;width:min(100%,480px);height:auto;max-height:510px;object-fit:contain;border:1px solid rgba(184,239,0,.25)}
.xs-graphic__frame{width:min(440px,90%);aspect-ratio:1;border:1px solid var(--xs-line);clip-path:polygon(14% 0,100% 0,100% 86%,86% 100%,0 100%,0 14%);display:flex;flex-direction:column;justify-content:space-between;padding:34px;position:relative;background:linear-gradient(150deg,#111d1b,#050b0c 50%,#152015)}
.xs-graphic__frame:before{content:"";position:absolute;inset:10px;border:1px solid rgba(184,239,0,.15);clip-path:polygon(14% 0,100% 0,100% 86%,86% 100%,0 100%,0 14%);pointer-events:none}
.xs-graphic__frame span,.xs-graphic__frame small{color:var(--xs-lime);font-size:11px;letter-spacing:.25em}.xs-graphic__frame b{font-size:clamp(50px,5vw,85px);letter-spacing:-.06em;line-height:.86;color:#fff}.xs-graphic__frame b::first-line{color:var(--xs-lime)}
.xs-hero__bottom{position:absolute;bottom:31px;left:0;right:0;display:flex;justify-content:space-between;border-top:1px solid var(--xs-line);padding-top:16px;color:#8d9c9b;letter-spacing:.22em;font-size:10px}
.xs-section{padding-top:104px;padding-bottom:40px}.xs-section__head{display:grid;grid-template-columns:1.3fr .7fr;align-items:end;gap:22px}.xs-section__head .xs-eyebrow{grid-column:1/-1;margin:0 0 5px}
.xs-section h2,.xs-contact h2,.xs-detail__next h2{margin:0;font-size:clamp(38px,5vw,70px);line-height:1.04;letter-spacing:-.04em;font-weight:900}.xs-section h2 em,.xs-about h2 em{font-style:normal;color:var(--xs-lime)}
.xs-section__head>p:last-child{color:#a6b8b7;font-size:16px;line-height:1.6}
.xs-services{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:38px}
.xs-service{position:relative;min-height:305px;background:linear-gradient(145deg,#14201f,#091112 70%);border:1px solid rgba(184,239,0,.16);padding:28px 28px 55px;transition:transform .2s,border-color .2s}.xs-service:hover{transform:translateY(-4px);border-color:var(--xs-lime)}
.xs-service__number{color:var(--xs-lime);font-size:10px;letter-spacing:.22em;font-weight:700}.xs-service h3{font-size:clamp(23px,2.3vw,34px);letter-spacing:-.025em;line-height:1.1;margin:45px 0 13px}.xs-service p{color:#a9b8b7;line-height:1.62;font-size:14px}.xs-service__arrow{position:absolute;bottom:24px;right:25px;color:var(--xs-lime);font-size:24px}
.xs-filters{display:flex;gap:9px;flex-wrap:wrap;margin:30px 0 25px}.xs-filters button{border:1px solid rgba(255,255,255,.16);background:transparent;color:#c7d4d2;padding:10px 17px;cursor:pointer;font-size:13px}.xs-filters button.is-active,.xs-filters button:hover{border-color:var(--xs-lime);color:var(--xs-lime)}
.xs-project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.xs-project{display:block;border:1px solid rgba(184,239,0,.17);background:#0e1718;transition:border-color .2s,transform .2s}.xs-project:hover{transform:translateY(-4px);border-color:var(--xs-lime)}
.xs-project[hidden]{display:none}.xs-project__image{aspect-ratio:16/9;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;padding:25px;background:radial-gradient(circle at 80% 10%,rgba(184,239,0,.16),transparent 50%),#111d1a;color:var(--xs-lime)}
.xs-project__image:not(.xs-project__image--preview)>img{width:calc(100% + 50px);height:calc(100% + 50px);object-fit:cover;margin:-25px}.xs-project__image span{font-size:10px;letter-spacing:.2em}.xs-project__image b{font-size:clamp(33px,4vw,65px);max-width:500px;line-height:1}
.xs-project__meta{padding:24px 27px 28px}.xs-project__meta small{color:var(--xs-lime);letter-spacing:.15em;text-transform:uppercase}.xs-project__meta h3{font-size:28px;margin:12px 0 7px}.xs-project__meta p{color:#a2b4b3;min-height:42px}.xs-project__meta>a{display:inline-block;font-size:13px;font-weight:700;color:var(--xs-lime);padding:7px 0}.xs-project__meta>a:hover{text-decoration:underline}
.xs-project__image--preview{display:flex;flex-direction:column;padding:0;aspect-ratio:16/9;background:#071012}.xs-project__browserbar{flex:0 0 39px;display:flex;align-items:center;gap:12px;padding:0 13px;background:linear-gradient(100deg,#1b2825,#0c1717);border-bottom:1px solid rgba(184,239,0,.25);color:#c5d2cc;min-width:0}.xs-project__browserdots{display:flex;gap:5px;flex:none}.xs-project__browserdots i{width:6px;height:6px;border-radius:50%;background:#65816c}.xs-project__browserdots i:first-child{background:#b8ef00}.xs-project__browserdots i:last-child{background:#e9867d}.xs-project__address{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 11px/1.3 monospace!important;letter-spacing:.01em!important;color:#c9d4ce;flex:1}.xs-project__browserbar>a{flex:none;color:var(--xs-lime);font-size:11px;font-weight:700;white-space:nowrap}.xs-project__browserbar>a:hover{text-decoration:underline}
.xs-project__devices{display:flex;gap:2px;flex:none}.xs-project__devices button{color:#a7b5ac;background:transparent;border:1px solid transparent;padding:4px 5px;font-size:10px;line-height:1;cursor:pointer}.xs-project__devices button.is-active,.xs-project__devices button:hover{color:var(--xs-lime);border-color:rgba(184,239,0,.42)}
.xs-project__viewport{position:relative;flex:1;min-height:0;overflow:hidden;background:#080e10}.xs-project__viewport.is-mobile{background:radial-gradient(ellipse at 50% 40%,#1b2721,#080e10 72%)}.xs-project__poster{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;gap:18px;padding:24px;background:radial-gradient(circle at 75% 10%,rgba(184,239,0,.17),transparent 55%),linear-gradient(140deg,#142016,#0b1818 60%,#151e13);overflow:hidden}.xs-project__poster:after{content:"";position:absolute;inset:0;border:1px solid rgba(184,239,0,.15);pointer-events:none}.xs-project__poster>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.75}.xs-project__poster>span,.xs-project__poster>strong{position:relative;z-index:1;text-shadow:0 2px 20px #071012}.xs-project__poster>span{font-size:10px;letter-spacing:.22em;color:var(--xs-lime)}.xs-project__poster>strong{display:block;max-width:88%;font-size:clamp(25px,3vw,44px);line-height:1.02;color:var(--xs-lime);overflow-wrap:anywhere;padding-bottom:38px}.xs-project__viewport iframe{position:absolute;top:0;left:0;border:0;background:#fff;transform-origin:top left;display:block;max-width:none}.xs-project__viewport iframe[hidden]{display:none}.xs-project__viewport.is-live .xs-project__poster,.xs-project__viewport.is-live .xs-project__play{display:none}
.xs-project__play{position:absolute;z-index:2;bottom:17px;left:18px;border:1px solid var(--xs-lime);background:var(--xs-lime);color:#081012;padding:10px 15px;font-weight:800;font-size:12px;cursor:pointer;display:flex;gap:16px;align-items:center;box-shadow:0 0 28px rgba(184,239,0,.14)}.xs-project__play span{font-size:17px}.xs-project__play:hover{background:#ddff56}
@media(max-width:620px){.xs-project__browserbar{gap:7px;padding:0 9px}.xs-project__browserdots{gap:3px}.xs-project__browserdots i{width:5px;height:5px}.xs-project__browserbar>a{font-size:10px}.xs-project__poster{padding:16px}.xs-project__poster>strong{font-size:clamp(21px,6vw,31px)}.xs-project__play{left:12px;bottom:11px}}
.xs-work-empty{padding:60px;border:1px solid var(--xs-line);background:linear-gradient(90deg,rgba(184,239,0,.07),#091112);margin-top:30px}.xs-work-empty strong{font-size:clamp(27px,4vw,50px)}.xs-work-empty p,.xs-empty{color:#b5c3c1;line-height:1.6}
.xs-about{padding-top:130px;padding-bottom:130px}.xs-about__columns{display:grid;grid-template-columns:1.2fr .8fr;gap:60px}.xs-about__columns>div>p{color:#bbc9c7;font-size:18px;line-height:1.8;margin:0 0 27px}.xs-about ul{padding:0;margin:0;list-style:none}.xs-about li{padding:15px 0;border-top:1px solid var(--xs-line);color:#e0e9e7}.xs-about li span{color:var(--xs-lime);font-size:11px;letter-spacing:.2em;margin-right:20px}
.xs-contact{background:linear-gradient(125deg,rgba(184,239,0,.075),#0d1617 48%);border:1px solid var(--xs-line);display:grid;grid-template-columns:1fr 1fr;gap:55px;padding:65px}.xs-contact h2{max-width:680px}.xs-contact>div:first-child>p:not(.xs-eyebrow){color:#bccac8;max-width:510px;line-height:1.65;font-size:17px}.xs-contact__links{display:flex;flex-wrap:wrap;gap:19px;margin-top:35px}.xs-contact__links a{border-bottom:1px solid var(--xs-lime);padding-bottom:5px}
.xs-contact__form{display:grid;grid-template-columns:1fr 1fr;gap:15px}.xs-contact__form label{display:flex;flex-direction:column;gap:8px;color:#bac9c7;font-size:12px;letter-spacing:.05em}.xs-contact__form label:nth-of-type(3),.xs-contact__form label:nth-of-type(4){grid-column:1/-1}
.xs-contact__form input,.xs-contact__form textarea{width:100%;border:1px solid rgba(255,255,255,.16);background:#071012;color:#fff;padding:14px;outline:none;border-radius:0}.xs-contact__form input:focus,.xs-contact__form textarea:focus{border-color:var(--xs-lime)}.xs-contact__form button{grid-column:1/-1;justify-content:center}.xs-contact__form small{grid-column:1/-1;color:#849997}
.xs-honeypot{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}.xs-alert{border:1px solid var(--xs-line);padding:12px;color:#d1f96b}.xs-alert--error{border-color:#d16868;color:#efaaaa}
.xs-footer{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center;color:#9faca9;border-top:1px solid var(--xs-line);padding-top:35px;padding-bottom:40px;margin-top:70px;font-size:13px}.xs-footer a:hover{color:var(--xs-lime)}
.xs-detail{padding-top:52px}.xs-back{font-size:13px;color:var(--xs-lime)!important}.xs-detail__head{padding:60px 0 38px}.xs-detail__head h1{font-size:clamp(47px,6vw,95px);line-height:1.02;margin:15px 0;letter-spacing:-.04em}.xs-detail__head>p:last-child{max-width:780px;color:#b3c2c0;font-size:20px;line-height:1.6}
.xs-detail__cover{max-height:800px;overflow:hidden;border:1px solid var(--xs-line)}.xs-detail__cover img{display:block;width:100%;height:auto}.xs-detail__body{display:grid;grid-template-columns:300px 1fr;gap:45px;padding:48px 0}.xs-detail__facts{display:grid;align-content:start;gap:20px}.xs-detail__facts>div{display:grid;gap:7px;border-top:1px solid var(--xs-line);padding-top:12px}.xs-detail__facts small{color:var(--xs-lime);font-size:10px;letter-spacing:.2em}.xs-detail__story{white-space:normal;font-size:18px;line-height:1.85;color:#c6d1d0}.xs-detail__gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.xs-detail__gallery figure{margin:0}.xs-detail__gallery img{display:block;max-width:100%;width:100%;height:auto;border:1px solid var(--xs-line)}.xs-detail__gallery figcaption{padding:10px 0;color:#a2b8b5;font-size:13px}.xs-detail__next{display:flex;align-items:center;flex-wrap:wrap;gap:24px;border-top:1px solid var(--xs-line);margin-top:60px;padding:50px 0}.xs-detail__next h2{font-size:34px;margin-right:auto}
@media(max-width:1100px){.xs-header{grid-template-columns:220px 1fr auto;padding:12px 30px}.xs-header nav{gap:12px}.xs-container{width:calc(100% - 60px)}.xs-hero{grid-template-columns:1fr .65fr}.xs-hero__graphic{min-height:300px}.xs-graphic__frame{padding:20px}}
@media(max-width:880px){.xs-header{grid-template-columns:1fr auto}.xs-header nav{grid-column:1/-1;grid-row:2;justify-content:flex-start;overflow:auto;padding:6px 0 4px}.xs-hero{grid-template-columns:1fr;min-height:0}.xs-hero__graphic{display:none}.xs-hero:before{display:none}.xs-section__head{grid-template-columns:1fr}.xs-section__head .xs-eyebrow{grid-column:auto}.xs-services{grid-template-columns:1fr 1fr}.xs-contact{grid-template-columns:1fr}.xs-about__columns{grid-template-columns:1fr;gap:25px}}
@media(max-width:620px){.xs-container{width:calc(100% - 36px)}.xs-header{padding:10px 18px;gap:8px}.xs-header__brand{font-size:17px}.xs-header__brand em{font-size:8px}.xs-mark{font-size:31px}.xs-btn--small{font-size:11px;min-height:40px;padding:0 11px}.xs-hero{padding:55px 0 80px}.xs-hero h1{font-size:clamp(42px,10vw,61px)}.xs-hero__logo{max-height:115px;margin:0 0 16px}.xs-hero__bottom{font-size:8px}.xs-section{padding-top:70px}.xs-services,.xs-project-grid{grid-template-columns:1fr}.xs-service{min-height:245px}.xs-about{padding:90px 0}.xs-contact{padding:28px 19px;gap:26px}.xs-contact__form{grid-template-columns:1fr}.xs-contact__form label{grid-column:1/-1}.xs-work-empty{padding:28px}.xs-detail__body{grid-template-columns:1fr;gap:25px}.xs-detail__gallery{grid-template-columns:1fr}.xs-detail__head{padding:35px 0}.xs-detail__next{padding:35px 0}.xs-footer{margin-top:45px}}

/* CMS additions to the existing xFame superadmin visual system. */
.xp-sidebar .xs-admin-entry{display:flex;align-items:center;justify-content:space-between;padding:16px;color:#c8f145;border-left:2px solid #b8ef00;gap:13px;font-size:14px;font-weight:700}
.xp-sidebar .xs-admin-entry:hover{background:rgba(184,239,0,.1)}
.xs-admin-body{background:#050c10;color:#f4f7f6;font-family:Inter,Arial,sans-serif;margin:0}.xs-admin-body *{box-sizing:border-box}.xs-admin-body a{color:inherit;text-decoration:none}
.xs-admin-top{height:75px;display:flex;justify-content:space-between;align-items:center;padding:0 max(25px,calc((100vw - 1480px)/2));background:#071115;border-bottom:1px solid rgba(184,239,0,.2);position:sticky;top:0;z-index:10}.xs-admin-top a:hover{color:#b8ef00}.xs-admin-top strong{color:#b8ef00;letter-spacing:.1em}.xs-admin-top nav{display:flex;gap:18px;font-size:13px}
.xs-admin{width:min(1480px,calc(100% - 50px));margin:0 auto;padding:35px 0 90px}.xs-admin h1{font-size:44px;line-height:1;margin:12px 0 12px}.xs-admin h2{font-size:27px;margin:0 0 18px}.xs-admin p{color:#a8b9b6;line-height:1.6}.xs-admin__sub{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:center}.xs-admin__sub b{color:#b8ef00}
.xs-admin-nav{display:flex;overflow:auto;gap:9px;margin:27px 0 40px}.xs-admin-nav a{padding:11px 17px;border:1px solid rgba(184,239,0,.2);white-space:nowrap;font-size:13px}.xs-admin-nav a:hover{border-color:#b8ef00;color:#b8ef00}
.xs-admin-section{scroll-margin-top:100px;border-top:1px solid rgba(184,239,0,.25);padding:38px 0 55px}.xs-admin-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.xs-admin-grid--3{grid-template-columns:repeat(3,1fr)}
.xs-admin-card{background:#0c1719;border:1px solid rgba(184,239,0,.17);padding:22px;margin:0}.xs-admin-card h3{margin:0 0 15px}.xs-admin-card__head{display:flex;justify-content:space-between;align-items:center}.xs-admin-card__head span{color:#b8ef00;font-size:11px}.xs-admin-card__head b{font-size:20px}.xs-admin-card img{display:block;max-width:100%;max-height:210px;object-fit:contain;margin:14px 0}
.xs-admin-form{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.xs-admin-form label{display:flex;flex-direction:column;gap:7px;color:#a5b8b5;font-size:12px}.xs-admin-form label.full{grid-column:1/-1}.xs-admin-form input,.xs-admin-form textarea,.xs-admin-form select{border:1px solid rgba(255,255,255,.15);background:#061012;color:#fff;padding:11px;min-width:0;width:100%;outline:none}.xs-admin-form input:focus,.xs-admin-form textarea:focus,.xs-admin-form select:focus{border-color:#b8ef00}
.xs-admin-form input[type=checkbox]{width:auto;margin-right:6px}.xs-admin-check{display:flex!important;flex-direction:row!important;align-items:center;min-height:37px}.xs-admin-form button,.xs-admin-compact button{background:#b8ef00;color:#071012;border:0;padding:11px 18px;font-weight:800;cursor:pointer}.xs-admin-form button{grid-column:1/-1}.xs-admin-form button:hover,.xs-admin-compact button:hover{background:#d8ff56}
.xs-admin-compact{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}.xs-admin-compact input,.xs-admin-compact select{background:#061012;color:#fff;border:1px solid rgba(255,255,255,.15);padding:9px;min-width:0}.xs-admin-compact button{padding:9px 13px}.xs-admin-delete{background:transparent!important;color:#e6a6a6!important;border:1px solid rgba(230,166,166,.36)!important}
.xs-admin-card details summary{cursor:pointer;color:#b8ef00;margin:12px 0;font-weight:700}.xs-admin-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:15px 0}.xs-admin-gallery article{border:1px solid rgba(255,255,255,.13);padding:9px}.xs-admin-gallery article img{width:100%;height:110px;object-fit:cover}
.xs-admin-alert{border:1px solid #b8ef00;padding:12px 17px;margin:12px 0;color:#b8ef00}.xs-admin-alert--error{border-color:#d06868;color:#f2adad}.xs-admin-muted{color:#8ba3a0;font-size:13px}.xs-admin-lead{display:grid;grid-template-columns:1fr auto;gap:15px}.xs-admin-lead strong{color:#fff}.xs-admin-lead p{white-space:pre-wrap}.xs-admin-lead small{color:#b8ef00}.xs-admin-lead__actions{min-width:170px}
@media(max-width:880px){.xs-admin-grid,.xs-admin-grid--3{grid-template-columns:1fr}.xs-admin-card{padding:18px}.xs-admin-top{padding:0 18px}.xs-admin-top nav{gap:10px}.xs-admin h1{font-size:34px}.xs-admin-gallery{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.xs-admin{width:calc(100% - 30px)}.xs-admin-form{grid-template-columns:1fr}.xs-admin-form label{grid-column:1/-1}.xs-admin-lead{grid-template-columns:1fr}.xs-admin-top nav a:last-child{display:none}}

/* XFAME_STUDIOS_REVIEWS_V6_CSS_START */


/* =========================================================
   SECTION
   ========================================================= */

.xsr6,
.xsr6 *,
.xsr6 *::before,
.xsr6 *::after {
    box-sizing: border-box;
}


.xsr6 {
    position: relative;

    width: calc(100% - 96px);
    max-width: 1600px;

    margin: 0 auto;

    padding:
        clamp(88px, 8vw, 135px)
        0
        clamp(90px, 8vw, 135px);
}


.xsr6::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;
    right: 0;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(184,255,0,.5),
            rgba(184,255,0,.08) 65%,
            transparent
        );
}


/* =========================================================
   HEADER
   ========================================================= */

.xsr6-head {
    display: grid;

    grid-template-columns:
        minmax(0,1.2fr)
        minmax(300px,.8fr);

    gap:
        clamp(40px, 7vw, 110px);

    align-items: end;

    margin-bottom: 38px;
}


.xsr6-kicker {
    display: flex;

    align-items: center;

    gap: 15px;

    margin-bottom: 22px;

    color: #b7ff00;

    font-size: 13px;

    font-weight: 900;

    letter-spacing: .2em;
}


.xsr6-kicker i {
    width: 30px;
    height: 2px;

    background: #b7ff00;
}


.xsr6-head h2 {
    margin: 0;

    color: #f4f6f5;

    font-size:
        clamp(58px, 6.2vw, 104px);

    line-height: .87;

    letter-spacing: -.06em;
}


.xsr6-head h2 em {
    color: #b7ff00;

    font-style: normal;
}


.xsr6-head__side {
    display: flex;

    flex-direction: column;

    align-items: flex-start;

    gap: 25px;

    padding-bottom: 4px;
}


.xsr6-head__side > p {
    max-width: 500px;

    margin: 0;

    color: #98aaa2;

    font-size:
        clamp(15px, 1.2vw, 19px);

    line-height: 1.6;
}


/* =========================================================
   ONLY ONE SET OF ARROWS
   ========================================================= */

.xsr6-arrows {
    display: flex;

    gap: 10px;
}


.xsr6-arrow {
    display: grid;

    width: 56px;
    height: 48px;

    place-items: center;

    padding: 0;

    border:
        1px solid rgba(183,255,0,.35);

    border-radius: 0;

    outline: none;

    color: #b7ff00;

    background:
        rgba(7,15,12,.95);

    font-family: inherit;

    font-size: 21px;

    cursor: pointer;

    transition:
        background .2s ease,
        color .2s ease,
        border-color .2s ease,
        transform .2s ease;
}


.xsr6-arrow:hover {
    border-color: #b7ff00;

    color: #07100b;

    background: #b7ff00;

    transform: translateY(-2px);
}


/* =========================================================
   COMPACT CAROUSEL
   ========================================================= */

.xsr6-carousel {
    width: min(820px, 100%);

    margin: 0 auto;
}


.xsr6-viewport {
    width: 100%;

    overflow-x: auto;
    overflow-y: hidden;

    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;

    scrollbar-width: none;

    overscroll-behavior-x: contain;

    touch-action: pan-x pan-y;

    -webkit-overflow-scrolling: touch;
}


.xsr6-viewport::-webkit-scrollbar {
    display: none;
}


.xsr6-track {
    display: flex;

    align-items: stretch;

    gap: 18px;
}


/* =========================================================
   CARD
   ========================================================= */

.xsr6-card {
    position: relative;

    display: flex;

    width: 100%;
    height: 340px;

    flex: 0 0 100%;
    flex-direction: column;

    overflow: hidden;

    scroll-snap-align: start;
    scroll-snap-stop: always;

    padding: 24px 26px;

    border:
        1px solid rgba(183,255,0,.22);

    background:
        radial-gradient(
            circle at 100% 0,
            rgba(183,255,0,.065),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            rgba(12,24,19,.98),
            rgba(6,14,11,.99)
        );
}


.xsr6-card::after {
    content: "";

    position: absolute;

    right: -70px;
    top: -70px;

    width: 175px;
    height: 175px;

    border:
        1px solid rgba(183,255,0,.065);

    transform: rotate(45deg);

    pointer-events: none;
}


.xsr6-card__head {
    position: relative;
    z-index: 2;

    display: flex;

    align-items: center;

    gap: 13px;

    flex: 0 0 auto;

    margin-bottom: 18px;
}


.xsr6-avatar {
    display: grid;

    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    place-items: center;

    border:
        1px solid rgba(183,255,0,.7);

    color: #b7ff00;

    font-size: 17px;

    font-weight: 900;
}


.xsr6-person {
    display: flex;

    min-width: 0;

    flex-direction: column;

    gap: 4px;
}


.xsr6-person strong {
    overflow: hidden;

    color: #fff;

    font-size: 17px;

    font-weight: 800;

    text-overflow: ellipsis;
    white-space: nowrap;
}


.xsr6-person span {
    overflow: hidden;

    color: #81938a;

    font-size: 13px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


.xsr6-quote {
    margin-left: auto;

    align-self: flex-start;

    color: #b7ff00;

    font-family:
        Georgia,
        serif;

    font-size: 56px;
    line-height: .65;
}


/* =========================================================
   TEXT — ДЛИННЫЙ ОТЗЫВ НЕ РАСТЯГИВАЕТ КАРТОЧКУ
   ========================================================= */

.xsr6-card__text {
    position: relative;
    z-index: 2;

    flex: 1 1 auto;

    min-height: 0;

    max-height: 205px;

    overflow-y: auto;

    padding-right: 10px;

    color: #cbd5d0;

    font-size: 15px;

    line-height: 1.62;

    white-space: pre-line;

    scrollbar-width: thin;

    scrollbar-color:
        rgba(183,255,0,.5)
        transparent;
}


.xsr6-card.has-screen .xsr6-card__text {
    max-height: 125px;
}


.xsr6-card__text::-webkit-scrollbar {
    width: 5px;
}


.xsr6-card__text::-webkit-scrollbar-thumb {
    border-radius: 20px;

    background:
        rgba(183,255,0,.45);
}


/* =========================================================
   SCREENSHOT — МАЛЕНЬКИЙ ПРЕВЬЮ
   ========================================================= */

.xsr6-proof {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        108px
        minmax(0,1fr);

    height: 74px;

    flex: 0 0 74px;

    margin-top: 16px;

    overflow: hidden;

    border:
        1px solid rgba(183,255,0,.16);

    background: #030604;

    text-decoration: none;
}


.xsr6-proof__image {
    width: 108px;
    height: 72px;

    overflow: hidden;

    border-right:
        1px solid rgba(183,255,0,.12);
}


.xsr6-proof__image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position: center;

    margin: 0;
}


.xsr6-proof__label {
    display: flex;

    min-width: 0;

    align-items: center;
    justify-content: space-between;

    gap: 12px;

    padding: 0 15px;

    color: #b7ff00;

    font-size: 10px;

    font-weight: 900;

    letter-spacing: .11em;
}


.xsr6-proof__label b {
    font-size: 16px;
}


.xsr6-card__signature {
    position: relative;
    z-index: 2;

    flex: 0 0 auto;

    margin-top: 15px;

    padding-top: 13px;

    border-top:
        1px solid rgba(183,255,0,.1);

    color: #687a71;

    font-size: 9px;

    font-weight: 900;

    letter-spacing: .16em;
}


/* =========================================================
   TIMER + DOTS
   ========================================================= */

.xsr6-navigation {
    margin-top: 22px;
}


.xsr6-progress {
    position: relative;

    width: 100%;
    height: 4px;

    overflow: hidden;

    background:
        rgba(183,255,0,.14);
}


.xsr6-progress span {
    display: block;

    width: 0;
    height: 100%;

    background: #b7ff00;

    box-shadow:
        0 0 14px
        rgba(183,255,0,.42);
}


.xsr6-dots {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    margin-top: 15px;
}


.xsr6-dot {
    width: 8px;
    height: 8px;

    padding: 0;

    border: 0;
    border-radius: 999px;

    background:
        rgba(255,255,255,.24);

    cursor: pointer;

    transition:
        width .2s ease,
        background .2s ease,
        opacity .2s ease;
}


.xsr6-dot:hover {
    background:
        rgba(183,255,0,.55);
}


.xsr6-dot.is-active {
    width: 27px;

    background: #b7ff00;
}


/* =========================================================
   EMPTY
   ========================================================= */

.xsr6-empty {
    width: min(820px,100%);

    margin: 0 auto;

    padding: 34px;

    border:
        1px solid rgba(183,255,0,.18);

    background:
        rgba(7,16,12,.8);
}


.xsr6-empty small {
    display: block;

    margin-bottom: 8px;

    color: #b7ff00;

    font-size: 10px;

    font-weight: 900;

    letter-spacing: .15em;
}


.xsr6-empty strong {
    color: #fff;

    font-size: 18px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

    .xsr6 {
        width: calc(100% - 32px);

        padding:
            70px
            0
            75px;
    }


    .xsr6-head {
        display: block;

        margin-bottom: 27px;
    }


    .xsr6-head h2 {
        font-size:
            clamp(50px,16vw,75px);
    }


    .xsr6-head__side {
        display: block;

        margin-top: 20px;

        padding: 0;
    }


    .xsr6-head__side > p {
        font-size: 15px;
    }


    /* На телефоне только свайп */
    .xsr6-arrows {
        display: none !important;
    }


    .xsr6-carousel {
        width: 100%;
    }


    .xsr6-card {
        height: 330px;

        flex-basis: 92%;

        padding: 20px;
    }


    .xsr6-card__head {
        margin-bottom: 16px;
    }


    .xsr6-card__text {
        font-size: 14px;

        line-height: 1.58;
    }


    .xsr6-card.has-screen .xsr6-card__text {
        max-height: 120px;
    }


    .xsr6-proof {
        grid-template-columns:
            90px
            minmax(0,1fr);

        height: 68px;

        flex-basis: 68px;
    }


    .xsr6-proof__image {
        width: 90px;
        height: 66px;
    }


    .xsr6-progress {
        height: 3px;
    }

}


/* XFAME_STUDIOS_REVIEWS_V6_CSS_END */




/* XFAME_STUDIOS_MOBILE_REBUILD_V3 */

/* Mobile is a separate composition, not a squeezed desktop layout */
@media (max-width: 620px) {

  html, body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .xs-header {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
    padding: 18px;
  }

  .xs-header__brand {
    justify-content: center;
    width: 100%;
  }

  /* Remove preview-like injected header blocks */
  .xs-header-studios-logo,
  .xs-header-studios-logo img,
  .xs-studios-logo-moved-source {
    display: none !important;
  }

  .xs-header nav {
    order: 2;
    display: flex;
    width: 100%;
    gap: 22px;
    overflow-x: auto;
    justify-content: flex-start;
    padding-bottom: 8px;
  }

  .xs-header nav a {
    flex: 0 0 auto;
    font-size: 15px;
  }

  .xs-btn--small {
    order: 3;
    width: 100%;
    justify-content: center;
  }

  /* Hero */
  .xs-hero {
    padding: 42px 0 55px;
  }

  .xs-hero__logo {
    width: 100%;
    max-width: 300px;
    margin: 0 auto 24px;
  }

  .xs-hero h1 {
    font-size: clamp(38px, 12vw, 54px);
    line-height: .95;
    text-transform: uppercase;
  }

  .xs-hero__actions {
    flex-direction: column;
    align-items: stretch;
  }

  /* Portfolio */
  .xs-project-grid {
    display: block;
  }

  .xs-project {
    width: 100%;
    margin-bottom: 22px;
  }

  .xs-project__image--preview {
    aspect-ratio: 9 / 11;
  }

  .xs-project__browserbar {
    height: auto;
    min-height: 42px;
    flex-wrap: wrap;
    padding: 10px;
  }

  .xs-project__address {
    max-width: 100%;
    order: 3;
    flex-basis: 100%;
  }

  .xs-project__viewport {
    min-height: 300px;
  }

  .xs-project__meta {
    padding: 20px;
  }

  .xs-project__meta h3 {
    font-size: 25px;
  }

  /* Reviews */
  .xsr6-card,
  .xsr7-card {
    width: 100%;
    max-width: 100%;
  }

  .xsr6-proof img,
  .xsr7__proof-media img {
    width: 100%;
    height: auto;
    object-fit: contain;
  }
}

/* Admin review form */
.xs-review-admin-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

@media (max-width: 800px) {
  .xs-review-admin-grid {
    grid-template-columns: 1fr;
  }

  .xs-review-admin-grid > * {
    width: 100%;
    grid-column: auto;
  }

  .xs-review-admin-bottom {
    flex-direction: column;
    align-items: stretch;
  }
}