/* Leon's HQ · voxel-inspired shared visual system · no external assets */
:root{
 --ink:#f3ead8;--muted:#c9b8a0;--subtle:#a8947b;
 --bg:#211c17;--bg2:#2d251d;--panel:#322820;--panel2:#45362a;
 --edge:#82715c;--edge2:#a89169;--grass:#ad8756;--grassdark:#705735;
 --gold:#e8be7c;--stone:#d3c5ad;--danger:#d99d64;
 --shadow:#130e0b;
 color-scheme:dark;
 font-family:"Trebuchet MS",Verdana,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-size:15px;line-height:1.6;
 background-image:
  radial-gradient(ellipse 50% 35% at 75% -5%,#6a5241 0%,transparent 100%),
  linear-gradient(90deg,transparent 95%,#ffffff05 95%),
  linear-gradient(0deg,transparent 95%,#ffffff04 95%);
 background-size:auto,40px 40px,40px 40px;
 min-width:300px
}
a{color:inherit}img{max-width:100%}button,input,select{font:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.pixel-title{font-family:Impact,"Arial Black","Trebuchet MS",sans-serif;font-weight:900;letter-spacing:.055em;line-height:1.08;text-transform:uppercase;text-shadow:4px 4px 0 #06110b,0 1px 0 #b6d49c}
.heading{font-family:Impact,"Arial Black","Trebuchet MS",sans-serif;font-size:clamp(2rem,4.8vw,4.2rem);line-height:1.08;text-transform:uppercase;letter-spacing:.045em;margin:0}
.micro{color:var(--gold);text-transform:uppercase;letter-spacing:.25em;font-size:.73rem;font-weight:900}
.muted{color:var(--muted)}
.wrap{width:min(1250px,calc(100% - 48px));margin-inline:auto}
.site-header{height:84px;position:sticky;top:0;z-index:50;background:#2c241ceF;border-bottom:4px solid #695744;box-shadow:0 7px 0 #17120d;backdrop-filter:blur(12px)}
.head-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand{display:inline-flex;align-items:center;gap:13px;text-decoration:none;flex-shrink:0}
.brand-mark{position:relative;width:42px;height:42px;background:linear-gradient(#6fa849 0 27%,#4b7740 27% 37%,#836148 37% 100%);border:3px solid #b6c99b;box-shadow:5px 5px 0 #07140c;transform:rotate(-3deg)}
.brand-mark:after{content:"";position:absolute;inset:14px 6px 7px 7px;background:#725038;box-shadow:10px 7px 0 #553c30}
.brand-text{font-family:Impact,"Arial Black",sans-serif;font-size:25px;letter-spacing:.06em;line-height:1;color:#f7e5c5;text-shadow:3px 3px #16210e}
.brand-text small{display:block;font:700 10px/2 "Trebuchet MS",sans-serif;letter-spacing:.22em;color:#d4b78f}
.nav{display:flex;align-items:center;gap:9px}
.nav-link{min-height:39px;display:inline-flex;align-items:center;justify-content:center;padding:7px 18px;text-decoration:none;text-transform:uppercase;font:800 12px/1.15 "Trebuchet MS",sans-serif;letter-spacing:.14em;border:2px solid transparent;transition:background .15s,color .15s}
.nav-link:hover{background:#2e4434}
.nav-link[aria-current="page"]{color:#2b241e;background:#d6b17a;border-color:#f7ddb1;box-shadow:3px 3px #86603d}
.nav-soon{padding:7px 12px;text-transform:uppercase;color:#869b86;font-weight:800;font-size:11px;letter-spacing:.12em;border:1px dashed #4d6551}
.site-footer{background:#0b1712;border-top:5px solid #3e6041;margin-top:75px;padding:29px 0;color:#a9bdab}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer-small{font-size:12px}
.footer-links{display:flex;gap:19px;font-size:13px}.footer-links a{text-decoration:none}.footer-links a:hover{color:var(--gold)}
/* common elements */
.badge{display:inline-flex;align-items:center;gap:8px;text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:900;padding:6px 10px;border:1px solid #648565;color:#cbe8b0;background:#233e2a}
.badge.warn{background:#423624;border-color:#947b4c;color:#edc890}
.dot{display:inline-block;width:8px;height:8px;background:var(--grass);box-shadow:2px 2px #2b5631}
.dot.warn{background:var(--danger);box-shadow:2px 2px #9a5736}
.block-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:52px;padding:13px 24px;text-decoration:none;text-transform:uppercase;letter-spacing:.12em;font-weight:900;font-size:13px;background:#d1ac74;color:#10230f;border:2px solid #f4d5a5;box-shadow:5px 5px 0 #63462f;transition:transform .15s,box-shadow .15s}
.block-btn:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 #63462f;background:#e8bf83}
.block-btn.secondary{background:#45362c;color:#e8f2df;border-color:#9a8063;box-shadow:5px 5px 0 #0a1910}
.block-btn.secondary:hover{background:#3e614a}
.block-btn.small{font-size:11px;min-height:39px;padding:8px 13px;box-shadow:3px 3px 0 #203c21}
.block-btn[disabled]{opacity:.5;cursor:not-allowed;filter:grayscale(.4)}
.block-card{background:linear-gradient(155deg,#48392b,#322820 75%);border:2px solid #806a55;box-shadow:7px 7px 0 #160f0b;position:relative}
.block-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:#c7a274;opacity:.5}
.card-pad{padding:24px}
.section{padding:70px 0 8px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:25px}
.section-head p{margin:6px 0 0}
.link-more{color:#c5df9a;text-decoration:none;text-transform:uppercase;font-weight:900;font-size:12px;letter-spacing:.13em}
.link-more:hover{text-decoration:underline}
.decor-sep{height:17px;background:repeating-linear-gradient(90deg,#5b883d 0 42px,#74a047 42px 80px,#4b7840 80px 88px);border-bottom:7px solid #594a35;box-shadow:0 6px 0 #2c2119}
main{min-height:calc(100vh - 84px)}
/* home */
.hero{position:relative;overflow:hidden;padding:92px 0 75px;background:radial-gradient(ellipse at 80% 40%,#594534 0,#2b231c 55%,#201a15 100%);border-bottom:2px solid #3f5c48}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:32px;background:repeating-linear-gradient(90deg,#a68d5e 0 54px,#8d7048 54px 88px,#c8a574 88px 120px);box-shadow:0 14px 0 #60472d;pointer-events:none}
.hero-layout{display:grid;grid-template-columns:49% minmax(0,51%);align-items:center;min-height:490px;position:relative;z-index:1}
.hero-copy{padding:22px 0 50px;position:relative;z-index:2}
.hero-copy h1{font-size:clamp(3.6rem,7vw,7.8rem);margin:20px 0;color:#f6efcd}
.hero-copy h1 em{font-style:normal;color:#aad96f;display:block}
.hero-copy p{color:#c6d8c8;font-size:clamp(1.05rem,1.7vw,1.25rem);max-width:520px;margin:0 0 26px}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.hero-art{position:relative;align-self:stretch;display:flex;align-items:center;justify-content:center;min-width:0;filter:drop-shadow(0 24px 20px #050e0a8c)}
.hero-art img{width:min(760px,125%);max-width:none;height:auto;image-rendering:pixelated;transform:translate(2%,2%)}
.hero-sticker{position:absolute;right:-4px;bottom:35px;transform:rotate(4deg);padding:13px 17px;background:#efd893;border:3px solid #59462b;color:#263324;font:900 13px/1.3 "Trebuchet MS",sans-serif;box-shadow:5px 5px #17281d}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}
.feature-card{padding:27px;display:flex;flex-direction:column;min-height:260px;text-decoration:none;transition:transform .15s}
.feature-card:hover{transform:translateY(-5px)}
.feature-card p{color:#cbbba5;margin:9px 0 23px;flex:1}
.feature-icon{font-size:38px;line-height:1;margin-bottom:22px;filter:drop-shadow(3px 3px #091711)}
.feature-card h3{margin:0;font-family:Impact,"Arial Black",sans-serif;font-size:25px;letter-spacing:.08em;text-transform:uppercase}
.feature-arrow{color:#c8e9ab;font-weight:900;letter-spacing:.12em;font-size:12px;text-transform:uppercase}
.stat-strip{display:grid;grid-template-columns:repeat(3,1fr);background:#13231d;border:1px solid #425b45;margin:43px 0;padding:24px}
.stat-item{text-align:center;border-right:1px solid #3b5342}
.stat-item:last-child{border:0}
.stat-n{display:block;color:var(--gold);font-family:Impact,"Arial Black",sans-serif;font-size:33px;line-height:1.1;letter-spacing:.04em}
.stat-label{font-size:12px;color:#a7bbac;letter-spacing:.08em;text-transform:uppercase;font-weight:800}
.command-banner{margin-top:50px;padding:34px 38px;background:linear-gradient(105deg,#374f32,#28412d);border:2px solid #86aa6f;box-shadow:7px 7px #101f14;display:flex;justify-content:space-between;align-items:center;gap:24px}
.command-banner h3{font:900 28px Impact,"Arial Black",sans-serif;text-transform:uppercase;letter-spacing:.07em;margin:0}
.command-banner p{margin:7px 0 0;color:#c3d8b9}
/* inner pages */
.page-head{padding:56px 0 35px;background:linear-gradient(145deg,#483729,#271f19 68%);border-bottom:5px solid #8c6b47}
.page-head p{max-width:740px;color:#bcd0bc;font-size:16px;margin:13px 0 0}
.page-head .heading{margin-top:9px}
.page-shell{padding:32px 0 15px}
/* library */
.library-layout{display:grid;grid-template-columns:335px minmax(0,1fr);gap:20px;align-items:start;min-height:620px}
.library-side{background:#192a23;border:2px solid #73604b;min-width:0}
.side-head{padding:21px 19px 14px;border-bottom:2px solid #354e3b}
.side-head h2{font-family:Impact,"Arial Black",sans-serif;font-size:24px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 11px}
.filter-label{display:block;font-size:11px;color:#b6caaf;text-transform:uppercase;letter-spacing:.11em;font-weight:900;margin:14px 0 6px}
.field{width:100%;padding:12px;color:#eff8e8;background:#0e1c16;border:2px solid #52714f;border-radius:0;font-size:14px}
.field::placeholder{color:#839a89}
.results-summary{padding:12px 18px;color:#bed4b4;background:#3f3227;font-size:12px;letter-spacing:.04em}
.result-list{max-height:730px;min-height:280px;overflow:auto;padding:8px}
.result-item{border:2px solid transparent;background:transparent;color:#eef3e9;display:block;width:100%;padding:13px 14px;text-align:left;margin-bottom:4px;cursor:pointer}
.result-item:hover{background:#304a36}
.result-item.active{background:#344c36;border-color:#8cae6d;box-shadow:inset 5px 0 #aad579}
.result-title{font-weight:900;display:block;line-height:1.3}
.result-meta{display:block;font-size:12px;color:#abbfab;margin-top:4px}
.result-status{display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#d9e9b5;margin-top:5px;font-weight:900}
.result-status.review{color:#e6bb7a}
.library-preview{min-width:0}
.preview-top{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:center;padding:22px 24px;background:#263d30;border-bottom:2px solid #506e4e}
.preview-top h2{font-family:Impact,"Arial Black",sans-serif;font-size:clamp(22px,3vw,32px);letter-spacing:.06em;text-transform:uppercase;margin:0}
.preview-caption{font-size:12px;color:#adbdaf}
#voxel-stage{height:clamp(320px,46vw,535px);position:relative;background:radial-gradient(ellipse at 50% 43%,#3f614d 0%,#20352d 46%,#111e1a 100%);overflow:hidden;touch-action:none}
#voxel-stage canvas{width:100%;height:100%;display:block;touch-action:none}
.stage-overlay{position:absolute;top:18px;left:18px;background:#211c17de;padding:9px 13px;border:1px solid #67825d;font-weight:800;letter-spacing:.05em;font-size:12px;max-width:calc(100% - 36px);pointer-events:none}
.stage-help{position:absolute;bottom:14px;left:14px;padding:7px 11px;color:#e3f1df;background:#211c17d9;font-size:12px;pointer-events:none}
.stage-no-preview{display:grid;place-items:center;text-align:center;height:100%;padding:45px;max-width:500px;margin:auto;color:#cee0c5}
.stage-no-preview strong{display:block;color:#f7d79f;font:900 24px Impact,sans-serif;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}
.preview-tools{display:flex;justify-content:space-between;flex-wrap:wrap;align-items:center;gap:15px;background:#192d23;padding:15px 20px;border-top:2px solid #52714e}
.preview-tools label{display:inline-flex;align-items:center;gap:8px;color:#c5d4c0;font-size:12px;font-weight:800}
.preview-tools input{accent-color:#a4d576}
.preview-info{padding:20px 23px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;border-top:2px solid #35513a}
.info-pair span{display:block;color:#99b49c;text-transform:uppercase;font-size:10px;font-weight:900;letter-spacing:.11em}
.info-pair strong{display:block;font-size:14px;margin-top:4px;word-break:break-word}
.info-note{border-top:1px solid #4b654d;padding:15px 23px;background:#1a2c24;color:#d6d0a3;font-size:13px}
.tag-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
.tag{padding:4px 9px;color:#c9e0b8;background:#2e4634;border:1px solid #66865e;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.05em}
.library-warning{color:#d5bc88;font-size:13px;margin-top:20px}
/* server overview */
.server-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:25px}
.server-card{padding:25px;min-height:240px}
.server-card .server-top{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:21px}
.server-icon{font-size:35px;line-height:1}
.server-card h3{font:900 27px Impact,"Arial Black",sans-serif;letter-spacing:.07em;text-transform:uppercase;margin:0 0 8px}
.server-card p{color:#c1cfc0;margin:0 0 22px;max-width:510px}
.server-facts{display:flex;gap:12px;flex-wrap:wrap}
.server-fact{font-size:12px;padding:6px 10px;background:#172a22;border:1px solid #4d6851;color:#cddcc8}
.status-note{border-left:5px solid #c39c65;background:#1e3527;color:#c4d7bc;padding:20px 25px;margin-top:29px}
@media(max-width:950px){
 .hero-layout{grid-template-columns:1fr 1fr}
 .hero-copy h1{font-size:clamp(3rem,7vw,5.7rem)}
 .hero-art img{width:125%}
 .library-layout{grid-template-columns:295px minmax(0,1fr)}
}
@media(max-width:700px){
 .wrap{width:min(100% - 30px,1250px)}
 .site-header{height:auto;min-height:77px}
 .head-inner{padding:13px 0;flex-wrap:wrap}
 .brand-text{font-size:22px}
 .nav{width:100%;overflow:auto;padding:3px 0 5px;gap:5px}
 .nav-link{padding:8px 14px;white-space:nowrap}
 .nav-soon{display:none}
 .hero{padding:42px 0 55px}
 .hero-layout{display:flex;flex-direction:column;min-height:0}
 .hero-copy{padding:10px 0 0;width:100%}
 .hero-copy h1{font-size:clamp(3.3rem,15vw,5.8rem)}
 .hero-art{width:100%;height:325px;align-self:center}
 .hero-art img{width:min(120%,540px)}
 .hero-sticker{bottom:0;right:10px}
 .feature-grid,.server-grid{grid-template-columns:1fr}
 .feature-card{min-height:220px}
 .stat-strip{grid-template-columns:1fr;gap:14px}
 .stat-item{border:0;border-bottom:1px solid #48614c;padding-bottom:14px}
 .stat-item:last-child{padding:0}
 .command-banner{padding:23px;display:block}
 .command-banner .block-btn{margin-top:18px}
 .section-head{display:block}.section-head .link-more{display:inline-block;margin-top:14px}
 .page-head{padding:40px 0 30px}
 .library-layout{grid-template-columns:1fr}
 .result-list{max-height:320px;min-height:140px}
 .preview-info{grid-template-columns:repeat(2,minmax(0,1fr))}
 #voxel-stage{height:420px}
 .site-footer{margin-top:50px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* Compact mobile hero avoids sideways scrolling and clipped action buttons. */
@media(max-width:700px){
 html,body{overflow-x:clip}
 .hero-copy,.hero-copy p{max-width:100%;min-width:0}
 .hero-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;width:100%}
 .hero-actions .block-btn{width:100%;justify-content:space-between;max-width:100%}
 .hero-art{height:auto;min-height:270px;padding:10px 0 20px;overflow:hidden}
 .hero-art img{width:100%;height:auto;max-width:100%;transform:none}
 .hero-sticker{right:7px;bottom:15px;font-size:10px;padding:8px 10px}
}

/* Longer identity title: keep Minecraft name fully visible at every width. */
.hero-copy h1{font-size:clamp(2.8rem,5.2vw,5.7rem);letter-spacing:.015em;overflow-wrap:normal}
@media(max-width:700px){.hero-copy h1{font-size:clamp(2.2rem,10vw,4.2rem)}.brand-text{font-size:19px}}

/* Earthy Minecraft materials: timber panels, clay, stone and sandstone.
   Natural grass survives only in the castle illustration and favicon. */
body{color:#eee3ce}
.brand-mark{background:linear-gradient(#917955 0 27%,#86704d 27% 37%,#745039 37% 100%);border-color:#ddc395}
.site-header{background:#29221beF;border-color:#6d5541}
.nav-link:hover{background:#54402c}
.nav-link[aria-current="page"]{color:#34241a;background:#d5b17a;border-color:#f3dfb7;box-shadow:3px 3px #6f5237}
.nav-soon{color:#baa287;border-color:#7f674e}
.hero{background:radial-gradient(ellipse at 77% 42%,#5b4839 0%,#332820 58%,#231b16 100%)}
.hero-copy h1 em{color:#e2ba7b;text-shadow:4px 4px #2a1810}
.hero-copy p{color:#e0d2be}
.badge{background:#51402f;border-color:#988063;color:#f3deb3}
.dot{background:#d5ad74;box-shadow:2px 2px #775b39}
.page-head{background:linear-gradient(145deg,#49372a,#2b221b 78%);border-color:#927655}
.page-head p,.muted{color:#cbbba6}
.section .block-card,.block-card{background:linear-gradient(150deg,#45362b,#312820 76%);border-color:#8b7055}
.block-card:before{background:#c8a37a}
.site-footer{background:#1c1712;border-color:#7b6043}
.library-side{background:#32271f;border-color:#82684f}
.side-head{border-color:#6b513e}
.side-head h2,.preview-top h2{color:#f0e0c5}
.filter-label{color:#d9c4a7}
.field{background:#211b16;border-color:#806346;color:#f3e5d0}
.field::placeholder{color:#b19a81}
.results-summary{background:#483526;color:#f2d7b2}
.result-item:hover{background:#5b4533}
.result-item.active{background:#5a4330;border-color:#d1a776;box-shadow:inset 5px 0 #e5bd83}
.result-status{color:#efc88f}
.result-meta{color:#cab9a5}
.library-preview{background:#332920}
.preview-top{background:#4d392b;border-color:#8f704e}
#voxel-stage{background:radial-gradient(ellipse at 50% 40%,#675344 0%,#3b3027 45%,#251e19 100%)}
.preview-tools{background:#453529;border-color:#947352}
.preview-info{background:#342920;border-color:#80634d}
.preview-tools label,.preview-caption{color:#e0cfbb}
.preview-tools input{accent-color:#cda46d}
.info-pair span{color:#bfaa8e}
.info-note{background:#392d23;border-color:#72583f;color:#e8d4ba}
.tag{background:#514032;border-color:#8c7150;color:#e8d2aa}
.library-warning{color:#d9b68b}
.server-card{background:#382c23}
.server-fact{background:#251d16;border-color:#826b51;color:#efdbbb}
.status-note{background:#3b3023;border-color:#c5a06f;color:#e9d7b9}
#preview-badge,.stage-overlay,.stage-help{background:#33291f;color:#efd8b3;border-color:#ac8d67}
.decor-sep{background:repeating-linear-gradient(90deg,#a2875c 0 42px,#96784d 42px 80px,#b39263 80px 88px);border-color:#604a34;box-shadow:0 6px #372a20}
