/* Accueil uniquement : l'identité des menus du jeu, adaptée à une page web. */
#app.home { --sth-hero:url('../img/skytirmy-web-night.webp'); }
#app.home.sthome-ready #searchsection,#app.home.sthome-ready .sthome-profile { display:none!important; }
#app.home.sthome-ready .sthome-hero { margin:0!important; padding:0!important; }
#app.home.sthome-ready .sthome-hero > .col-12 { padding:0; }
#app.home.sthome-ready #homebanner { background-image:linear-gradient(90deg,#08101bec 0%,#08101bd1 24%,#08101b80 47%,#08101b00 76%),var(--sth-hero)!important; background-size:cover!important; background-position:center center!important; min-height:560px; display:flex; align-items:center; overflow:hidden; position:relative; border-radius:14px!important; border:1px solid #fe7d2a59; box-shadow:0 26px 70px #0004,inset 0 1px #ead5a43d; isolation:isolate; }
#app.home.sthome-ready #homebanner::after { content:''; position:absolute; inset:12px; border:1px solid #fe7d2a14; border-radius:7px; pointer-events:none; z-index:-1; }
#app.home.sthome-ready #homebanner .hommebanner-content { padding:64px!important; max-width:650px!important; width:58%!important; }
#app.home.sthome-ready #homebanner .hommebanner-content > .d-flex:first-child { color:var(--sth-accent); margin-bottom:22px!important; letter-spacing:.17em; text-transform:uppercase; font-weight:650; font-size:11px; }
#app.home.sthome-ready #homebanner .hommebanner-content > .d-flex:first-child img { display:none; }
#app.home.sthome-ready #homebanner .title-mini { color:var(--sth-accent); font-size:11px; font-weight:700; letter-spacing:inherit; }
#app.home.sthome-ready #homebanner h1.title { margin:0 0 23px; max-width:600px; font-family:inherit; font-size:clamp(43px,4.4vw,70px); font-weight:650; line-height:1.04; letter-spacing:-.045em; white-space:pre-line; color:var(--sth-text); text-shadow:0 3px 30px #0005; }
#app.home.sthome-ready #homebanner p.description { margin:0 0 25px; max-width:480px; font-size:16px; line-height:1.75; color:#c0c8d9; }
#app.home.sthome-ready #homebanner .playerlist { margin:0 0 26px; color:#c2cbd8; font-size:12px; font-weight:500; }
#app.home.sthome-ready #homebanner .playerlist .circle { box-shadow:none; }
#app.home.sthome-ready #homebanner .btn { border:1px solid #ffb27e; background:#fe7d2a!important; color:#111622!important; border-radius:7px; padding:14px 24px; min-height:50px; font-size:14px; font-weight:750; box-shadow:0 4px 0 #ad3b40,0 12px 25px #0004; }
#app.home.sthome-ready #homebanner .sthome-secondary { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:50px; padding:12px 19px; border:1px solid #a5b2ce54; border-radius:7px; color:#e4e8f0; font-size:13px; font-weight:600; text-decoration:none; background:#101a2980; }
#app.home.sthome-ready #homebanner .sthome-secondary:hover { border-color:var(--sth-accent); color:var(--sth-accent); }
.sthome-intro { padding:48px 0 34px; }
.sthome-heading { display:flex; align-items:end; justify-content:space-between; gap:22px; margin-bottom:25px; }
.sthome-eyebrow { color:var(--sth-accent); display:block; text-transform:uppercase; font-size:10px; letter-spacing:.2em; font-weight:700; margin-bottom:10px; }
.sthome-heading h2 { margin:0; color:var(--sth-text); font-size:clamp(25px,2.4vw,34px); line-height:1.2; letter-spacing:-.025em; font-weight:600; }
.sthome-heading > p { max-width:430px; margin:0; color:var(--sth-muted); line-height:1.65; font-size:13px; }
.sthome-features { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.sthome-feature { padding:26px 28px; border:1px solid var(--sth-line); border-top-color:#aa8d584f; border-radius:10px; background:linear-gradient(150deg,#381b58,#23103d); position:relative; }
.sthome-feature > i { display:inline-flex; width:39px; height:39px; align-items:center; justify-content:center; color:var(--sth-accent); background:#fe7d2a0b; border:1px solid #fe7d2a36; border-radius:8px; font-size:19px; margin-bottom:20px; }
.sthome-feature h3 { font-size:17px; margin:0 0 11px; letter-spacing:-.015em; color:var(--sth-text); font-weight:600; }
.sthome-feature p { color:var(--sth-muted); font-size:13px; line-height:1.7; margin:0; max-width:350px; }
.sthome-life { margin:12px 0 24px; }
.sthome-feed { display:grid; grid-template-columns:minmax(0,1fr) minmax(310px,380px); gap:28px; align-items:start; margin:0; }
#app.home.sthome-ready .sthome-main { width:auto; min-width:0; padding:0; }
#app.home.sthome-ready .sthome-aside { display:flex; flex-direction:column; gap:24px; width:auto; min-width:0; padding:0; }
#app.home.sthome-ready .sthome-aside > div:has(> .sthome-profile) { display:none; }
#app.home.sthome-ready .sthome-aside #profilesection { display:none; }
#app.home.sthome-ready .sthome-news { padding:0!important; margin:0; }
#app.home.sthome-ready .sthome-news > .col-md-4 { width:100%; }
#app.home.sthome-ready .sthome-news > .col-md-4 { padding:0; }
#app.home.sthome-ready .sthome-news .post { background-size:190px!important; background-repeat:no-repeat; background-position:right 28px center!important; background-color:var(--sth-surface); border:1px solid var(--sth-line); border-radius:12px; min-height:240px; height:240px; box-shadow:none; }
#app.home.sthome-ready .sthome-news .date-wrapper { display:block; }
#app.home.sthome-ready .sthome-news .post .card { background:transparent; }
#app.home.sthome-ready .sthome-news .post .content { background:transparent!important; }
#app.home.sthome-ready .sthome-news .post { padding-bottom:0; }
#app.home.sthome-ready .sthome-news .post .content { inset:0 auto 0 0; width:calc(100% - 240px); margin:0; padding:30px; text-align:left; display:flex; flex-direction:column; align-items:start; justify-content:center; backdrop-filter:none; }
#app.home.sthome-ready .sthome-news .post .action { opacity:1; max-height:none; height:auto; }
#app.home.sthome-ready .sthome-news h5 { color:var(--sth-text); font-size:23px; letter-spacing:-.02em; }
#app.home.sthome-ready .sthome-news .btn { background:transparent!important; color:var(--sth-accent); border:1px solid #fe7d2a55; border-radius:6px; padding:9px 15px; }
#app.home.sthome-ready .sthome-news h6 { color:var(--sth-muted); font-size:11px; text-align:left; margin-top:15px; }
#app.home.sthome-ready .sthome-aside section { padding:0!important; margin:0!important; }
#app.home.sthome-ready .sthome-aside .section-title { font-size:17px; text-align:left; margin:0 0 20px; color:var(--sth-text); font-weight:600; letter-spacing:-.01em; }
#app.home.sthome-ready .sthome-vote-banner > a { display:flex; justify-content:space-between; align-items:center; padding:15px 18px; background:#2b251b!important; border:1px solid #b3904c61; border-radius:8px; color:#e2c793; font-size:13px; }
#app.home.sthome-ready .sthome-aside .sthome-ranking { background:var(--sth-surface); border:1px solid var(--sth-line); border-radius:12px; padding:24px!important; }
#app.home.sthome-ready #ranks { display:flex; flex-direction:column; gap:0; width:100%; padding:0; margin:0; height:auto!important; min-height:0!important; justify-content:normal; }
#app.home.sthome-ready #ranks .rank { display:grid; grid-template-columns:32px minmax(0,1fr) auto; align-items:center; gap:12px; width:100%!important; height:61px!important; min-height:0; padding:10px 0; margin:0!important; position:relative!important; inset:auto!important; transform:none!important; border-top:1px solid #6340748c; }
#app.home.sthome-ready #ranks canvas,#app.home.sthome-ready #ranks .cube { display:none!important; }
#app.home.sthome-ready #ranks .rank .name { display:flex; align-items:center; gap:8px; position:static!important; transform:none!important; grid-column:2; width:auto; font-size:13px; font-weight:550; color:#d8dfec; text-align:left; white-space:nowrap; overflow:hidden; }
#app.home.sthome-ready #ranks .sthome-avatar { display:block!important; flex:none; width:28px; height:28px; border-radius:5px; image-rendering:pixelated; }
#app.home.sthome-ready #ranks .name > span { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.sthome-place { grid-column:1; grid-row:1; font-size:15px; font-weight:700; color:var(--sth-accent); }
.sthome-votes { grid-column:3; grid-row:1; color:var(--sth-muted); font-size:12px; white-space:nowrap; }
#app.home.sthome-ready .sthome-community #discord { background:#2d164f!important; border:1px solid #6f62884f; border-radius:12px; overflow:hidden; box-shadow:none; }
#app.home.sthome-ready #discord #wave { opacity:.06; }
#app.home.sthome-ready #discord .section-2 { background:#391c5e; }
#app.home.sthome-ready #discord .btn { background:#532867; color:#e6deff; border:1px solid #8a7aa050; border-radius:6px; font-size:12px; padding:8px 16px; }
#app.home.sthome-ready #discord h6 { font-size:12px; color:var(--sth-muted); }
#app.home.sthome-ready #discord h5 { color:var(--sth-text); font-size:16px; }
#app.home.sthome-ready .sthome-trailer { margin-top:4px; }
#app.home.sthome-ready .sthome-trailer > div { border:0; border-radius:0; overflow:visible; background:none; box-shadow:none; }
@media(max-width:1199px) {
 #app.home.sthome-ready #homebanner .hommebanner-content { padding:44px!important; width:64%!important; }
 #app.home.sthome-ready #homebanner { min-height:530px; }
 .sthome-feature { padding:24px; }
}
@media(max-width:799px) {
 #app.home.sthome-ready #homebanner { min-height:590px; background-position:64% center!important; background-image:linear-gradient(90deg,#08101bee,#08101ba8 65%,#08101b40),var(--sth-hero)!important; }
 #app.home.sthome-ready #homebanner .hommebanner-content { padding:36px 26px!important; width:100%!important; max-width:520px!important; }
 #app.home.sthome-ready #homebanner h1.title { font-size:52px; }
 #app.home.sthome-ready #homebanner p.description { font-size:14px; max-width:400px; }
 #app.home.sthome-ready #homebanner .btn { padding:14px 18px; }
 .sthome-heading { align-items:start; flex-direction:column; gap:14px; }
 .sthome-intro { padding:35px 0 25px; }
 .sthome-features { grid-template-columns:1fr; gap:12px; }
 .sthome-feature { padding:21px; display:grid; grid-template-columns:40px minmax(0,1fr); gap:0 17px; }
 .sthome-feature > i { grid-row:1/3; margin:0; }
 .sthome-feature h3 { font-size:16px; margin-bottom:7px; }
 .sthome-feature p { max-width:none; grid-column:2; font-size:12px; }
 #app.home.sthome-ready .sthome-news .post { background-size:160px!important; background-position:right 15px center!important; }
 #app.home.sthome-ready .sthome-news .post { height:330px; padding-top:125px; background-size:125px!important; background-position:top 16px left 22px!important; }
 #app.home.sthome-ready .sthome-news .post .content { inset:125px 0 0; width:100%; padding:22px; }
 #app.home.sthome-ready .sthome-news .post .title { font-size:21px; -webkit-line-clamp:unset; }
}
@media(max-width:1000px) {
 .sthome-feed { grid-template-columns:minmax(0,1fr); gap:24px; }
}
@media(max-width:400px) {
 #app.home.sthome-ready #homebanner .hommebanner-content { padding:31px 22px!important; }
 #app.home.sthome-ready #homebanner h1.title { font-size:clamp(38px,11.5vw,45px); }
 #app.home.sthome-ready #homebanner .sthome-secondary { width:100%; }
}
@media(prefers-reduced-motion:reduce) { #app.home.sthome-ready * { transition:none!important; scroll-behavior:auto!important; } }

#app.home.sthome-ready #homebanner .btn { background:linear-gradient(120deg,#fe7d2a,#fe2d4f)!important; color:#190b2e!important; border-color:#ff9b6866; }
#app.home.sthome-ready .sthome-news .btn { color:#190b2e!important; background:linear-gradient(120deg,#fe7d2a,#fe2d4f)!important; }


#app.home.sthome-ready #trailer { border:0; border-radius:12px; overflow:hidden; box-shadow:0 12px 30px #10042044; }
#app.home.sthome-ready .sthome-trailer > div { border:0; padding:0; }

.sthome-devlogs { margin:32px 0 0; min-width:0; }
.sthome-devlogs .sthome-heading h2 { font-size:clamp(24px,2.1vw,30px); }
.sthome-devlog-list { display:flex; flex-direction:column; gap:14px; }
.sthome-devlog { border:1px solid var(--sth-line); border-radius:14px; background:linear-gradient(145deg,#35184ff2,#24103ff2); overflow:hidden; }
.sthome-devlog > summary { position:relative; padding:24px 60px 24px 26px; list-style:none; cursor:pointer; }
.sthome-devlog > summary::marker,.sthome-devlogs-more > summary::marker { content:''; }
.sthome-devlog > summary::-webkit-details-marker,.sthome-devlogs-more > summary::-webkit-details-marker { display:none; }
.sthome-devlog > summary:focus-visible,.sthome-devlogs-more > summary:focus-visible { outline:2px solid var(--sth-accent); outline-offset:-4px; border-radius:12px; }
.sthome-devlog-meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin-bottom:12px; font-size:11px; color:var(--sth-muted); }
.sthome-devlog-meta > span { padding:3px 8px; color:#ffb584; background:#fe7d2a0c; border:1px solid #fe7d2a30; border-radius:5px; }
.sthome-devlog h3 { margin:0; color:var(--sth-text); font-size:19px; line-height:1.5; letter-spacing:-.015em; overflow-wrap:anywhere; }
.sthome-devlog-preview { margin:12px 0 0; font-size:14px; color:var(--sth-muted); line-height:1.75; overflow-wrap:anywhere; }
.sthome-devlog-chevron { position:absolute; right:25px; top:30px; color:#ffb584; transition:transform .18s; }
.sthome-devlog[open] { border-color:#fe7d2a88; }
.sthome-devlog[open] > summary .sthome-devlog-chevron { transform:rotate(180deg); }
.sthome-devlog[open] > summary .sthome-devlog-preview { display:none; }
.sthome-devlog-body { padding:0 26px 28px; color:#e6dceb; line-height:1.85; font-size:15px; overflow-wrap:anywhere; }
.sthome-devlog-body :is(p,ul,ol) { max-width:110ch; }
.sthome-devlog-body :is(h4,h5,h6) { margin:1.5em 0 .75em; color:var(--sth-text); font-size:18px; line-height:1.5; }
.sthome-devlog-body h5 { font-size:16px; }
.sthome-devlog-body h6 { font-size:15px; }
.sthome-devlog-body > :last-child { margin-bottom:0; }
.sthome-devlog-body :is(img,video) { max-width:100%; height:auto; border-radius:8px; }
.sthome-devlog-body :is(pre,table) { display:block; max-width:100%; overflow:auto; }
.sthome-devlogs-more { margin-top:18px; }
.sthome-devlogs-more > summary { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px; padding:14px 20px; cursor:pointer; list-style:none; font-size:14px; font-weight:650; color:#ffb584; border:1px solid #fe7d2a55; border-radius:8px; background:#291345; }
.sthome-devlogs-more > summary > span { color:var(--sth-muted); font-size:12px; font-weight:400; }
.sthome-devlogs-more[open] > summary { margin-bottom:18px; }
.sthome-devlogs-more[open] > summary > i { transform:rotate(180deg); }
@media(max-width:599px) {
 .sthome-devlog > summary { padding:21px 45px 21px 20px; }
 .sthome-devlog-chevron { right:17px; top:26px; }
 .sthome-devlog h3 { font-size:17px; }
 .sthome-devlog-preview { font-size:13px; }
 .sthome-devlog-body { padding:0 20px 24px; font-size:14px; }
}
