@font-face{font-family:'Cinzel';src:url(/assets/fonts/Cinzel.woff2) format('woff2');font-weight:400 900;font-display:swap}
@font-face{font-family:'Exo 2';src:url(/assets/fonts/Exo2.woff2) format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Share Tech Mono';src:url(/assets/fonts/ShareTechMono.woff2) format('woff2');font-weight:400;font-display:swap}
:root{color-scheme:dark;--gold:#f0c46a;--gold-hi:#ffe4a3;--gold-deep:#cf933a;--cyan:#29e6ff;--cyan-hi:#a5f7ff;--violet:#8d5bff;--text:#eeeaff;--body:#cfcaea;--muted:#a9a3cf;
  --display:'Cinzel',Georgia,serif;--sans:'Exo 2','Segoe UI',system-ui,sans-serif;--mono:'Share Tech Mono',Consolas,monospace;
  --cut:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
*{box-sizing:border-box}
body{margin:0;color:var(--text);font:15px/1.6 var(--sans);background:radial-gradient(ellipse at 20% -10%,rgba(141,91,255,.28),transparent 55%),radial-gradient(ellipse at 90% 10%,rgba(41,230,255,.12),transparent 45%),#07051a;min-height:100vh}
a{color:inherit}
header{max-width:1440px;margin:auto;padding:30px 5%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(240,196,106,.22);gap:20px}
.brand{text-decoration:none;font:700 19px var(--display);letter-spacing:.18em;background:linear-gradient(180deg,var(--gold-hi),var(--gold) 60%,var(--gold-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
.brand span{font:11px var(--mono);letter-spacing:.2em;color:var(--cyan-hi);-webkit-text-fill-color:var(--cyan-hi);margin-left:10px}
.back{font:600 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:#1a1003;padding:12px 18px;white-space:nowrap;background:linear-gradient(135deg,#fff3cc,var(--gold) 45%,var(--gold-deep));clip-path:var(--cut)}
main{max-width:1440px;margin:auto;padding:58px 5% 32px}
.eyebrow{color:var(--cyan-hi);font:12px var(--mono);letter-spacing:.26em;text-shadow:0 0 10px rgba(41,230,255,.5)}
h1{font:700 clamp(38px,6.2vw,74px)/1.06 var(--display);margin:20px 0 25px;background:linear-gradient(180deg,var(--gold-hi),var(--gold) 58%,var(--gold-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
h1 em{font-style:normal}
.lead{max-width:640px;font-size:16px;color:var(--body);line-height:1.75}
.machines{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:19px;margin-top:40px}
.machine{text-decoration:none;background:linear-gradient(160deg,rgba(24,17,60,.95),rgba(8,6,24,.96));box-shadow:inset 0 0 0 1px rgba(240,196,106,.22);clip-path:var(--cut);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.machine:hover{transform:translateY(-5px);box-shadow:inset 0 0 0 1px var(--accent),0 0 30px color-mix(in srgb,var(--accent) 25%,transparent)}
.machine:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.machine-art{height:192px;background:radial-gradient(ellipse at 50% 70%,color-mix(in srgb,var(--accent) 22%,#140d36),#07051a);position:relative;display:grid;place-items:center;border-bottom:1px solid rgba(141,91,255,.3);overflow:hidden}
.machine-art:after{content:'';position:absolute;width:170px;height:170px;border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);transform:rotate(45deg)}
.machine-art small{position:absolute;left:18px;top:15px;color:var(--muted);font:10px var(--mono);letter-spacing:.16em}
.machine-art b{font:700 62px/1 var(--display);color:var(--accent);text-shadow:0 0 24px color-mix(in srgb,var(--accent) 60%,transparent);z-index:1}
.machine-art>span{font:9px var(--mono);letter-spacing:.2em;position:absolute;bottom:12px;right:16px;color:var(--muted)}
.machine-body{padding:22px;flex:1;display:flex;flex-direction:column}
.tag{font:11px var(--mono);color:var(--accent);letter-spacing:.1em;margin:0 0 8px}
h2{font:700 22px/1.2 var(--display);color:var(--gold-hi);margin:0 0 12px}
.machine-body>p:not(.tag){font-size:13px;line-height:1.75;color:var(--body);flex:1;margin:0 0 22px}
.machine-body strong{border-top:1px solid rgba(141,91,255,.3);padding-top:14px;font:600 12px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);display:flex;justify-content:space-between}
.notice{padding:22px 24px;margin-top:36px;background:linear-gradient(90deg,rgba(41,230,255,.07),rgba(10,8,30,.6) 60%);box-shadow:inset 2px 0 0 var(--cyan),inset 0 0 0 1px rgba(141,91,255,.25);clip-path:var(--cut)}
.notice b{font:12px var(--mono);letter-spacing:.2em;color:var(--cyan-hi)}
.notice p{margin:8px 0 0;color:var(--body);font-size:13px;max-width:1010px}
.notice a{color:var(--cyan-hi)}
footer{max-width:1440px;margin:auto;padding:12px 5% 32px;display:flex;justify-content:space-between;color:var(--muted);font:10px var(--mono);letter-spacing:.14em;gap:14px}
@media(max-width:1050px){.machines{grid-template-columns:repeat(2,minmax(0,1fr))}.machine-art{height:150px}}
@media(max-width:540px){header{padding:20px}.brand{font-size:15px}.brand span{display:none}.back{padding:10px 12px;font-size:10px}main{padding:35px 20px 18px}.machines{grid-template-columns:1fr;gap:16px;margin-top:26px}.machine{display:grid;grid-template-columns:96px minmax(0,1fr)}.machine-art{height:auto;min-height:176px;border-right:1px solid rgba(141,91,255,.3);border-bottom:0}.machine-art small{left:9px;top:12px;font-size:8px}.machine-art b{font-size:38px}.machine-art:after{width:118px;height:118px}.machine-body{padding:16px}.machine-body h2{font-size:20px}.machine-body>p:not(.tag){margin-bottom:14px}.notice{padding:18px}footer{padding:12px 20px 25px;flex-direction:column;gap:4px}}
@media(prefers-reduced-motion:reduce){.machine{transition:none}.machine:hover{transform:none}}
