.proc-home{padding:clamp(3rem,7vw,7rem) 0;background:linear-gradient(135deg,rgba(30,45,72,.18),transparent 55%)}
.proc-home-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(260px,.7fr);gap:2rem;align-items:end;margin-bottom:2rem}
.proc-home-head>div>p,.proc-kicker{margin:0 0 .65rem;color:var(--proc-accent,#4ba8ff);font-size:.74rem;font-weight:900;letter-spacing:.18em}
.proc-home-head h2{margin:0;max-width:760px;font-size:clamp(2rem,5vw,4.5rem);line-height:.96;letter-spacing:-.045em}
.proc-home-head>p{margin:0;color:var(--muted,#8c98aa);font-size:1.05rem}
.proc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.8rem,2vw,1.5rem)}
.proc-card{overflow:hidden;border:1px solid rgba(130,160,200,.2);border-radius:20px;background:rgba(8,13,24,.78);box-shadow:0 24px 60px rgba(0,0,0,.18)}
.proc-card-art{display:block;aspect-ratio:1;overflow:hidden;background:#07101d}
.proc-card-art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s ease,filter .45s ease}
.proc-card:hover .proc-card-art img{transform:scale(1.045);filter:saturate(1.12)}
.proc-card>div{padding:1rem 1.1rem 1.25rem}.proc-card span{color:var(--proc-accent,#4ba8ff);font-size:.66rem;font-weight:900;letter-spacing:.15em}
.proc-card h3{margin:.45rem 0;font-size:1.08rem;line-height:1.2}.proc-card h3 a{color:inherit;text-decoration:none}.proc-card p{margin:0;color:var(--muted,#8995a8);font-size:.86rem;line-height:1.55}
.proc-detail{--proc-accent:#4ba8ff;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr);gap:clamp(1.5rem,4vw,4rem);max-width:1440px;margin:0 auto;padding:clamp(2rem,5vw,5rem) clamp(1rem,4vw,4rem)}
.proc-preview-wrap{min-width:0}.proc-preview{position:sticky;top:100px;aspect-ratio:1;border:1px solid rgba(130,180,230,.3);border-radius:28px;background-image:var(--proc-image);background-repeat:repeat;background-size:33.333% 33.333%;box-shadow:0 35px 90px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.06);overflow:hidden}
.proc-preview img{width:1px;height:1px;opacity:.001;position:absolute}.proc-repeat-proof{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.85rem}.proc-repeat-proof span{padding:.4rem .7rem;border:1px solid rgba(120,165,210,.25);border-radius:999px;color:var(--muted,#8b99ad);font-size:.66rem;font-weight:800;letter-spacing:.12em}
.proc-panel{align-self:start;padding:clamp(1.2rem,3vw,2rem);border:1px solid rgba(130,170,210,.22);border-radius:24px;background:rgba(5,10,19,.86);backdrop-filter:blur(18px)}
.proc-panel h1{margin:.25rem 0 1rem;font-size:clamp(2rem,4vw,3.8rem);line-height:.96;letter-spacing:-.045em}.proc-panel>p{color:var(--muted,#98a5b7);line-height:1.7}
.proc-colors{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin:1.5rem 0;padding:0;border:0}.proc-colors legend{grid-column:1/-1;margin-bottom:.55rem;font-weight:800}.proc-colors label{display:grid;gap:.35rem;color:var(--muted,#98a5b7);font-size:.7rem}.proc-colors input{width:100%;height:44px;padding:3px;border:1px solid rgba(150,180,215,.28);border-radius:10px;background:transparent;cursor:pointer}
.proc-sliders{display:grid;gap:1rem}.proc-sliders label{display:grid;gap:.55rem}.proc-sliders span{font-size:.78rem;font-weight:800}.proc-sliders input{width:100%;accent-color:var(--proc-accent)}
.proc-actions{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;margin-top:1.5rem}.proc-actions button,.proc-actions a{min-height:46px;padding:.75rem;border:1px solid rgba(120,175,225,.32);border-radius:12px;background:rgba(60,125,220,.12);color:inherit;font:inherit;font-size:.8rem;font-weight:850;text-align:center;text-decoration:none;cursor:pointer}.proc-actions a,.proc-actions [data-proc-png]{background:var(--proc-accent);color:#03101e;border-color:transparent}.proc-note{margin:.9rem 0 0!important;font-size:.76rem!important}
.proc-profile-papst{--proc-accent:#d5ad53}.proc-profile-papst .proc-card,.proc-profile-papst.proc-detail .proc-panel{border-radius:5px;border-color:rgba(213,173,83,.34)}.proc-profile-papst .proc-card h3,.proc-profile-papst.proc-detail h1{font-family:Georgia,serif}
.proc-profile-lol{--proc-accent:#ff4fa3}.proc-profile-lol .proc-card{border-radius:30px}.proc-profile-lol .proc-card:nth-child(3n+2){transform:translateY(14px) rotate(.35deg)}.proc-profile-lol.proc-detail .proc-preview{border-radius:42% 58% 46% 54%/54% 42% 58% 46%}
.proc-profile-atelier{--proc-accent:#4ab3a7}.proc-profile-atelier .proc-card{border-radius:2px;background:rgba(245,248,250,.04)}.proc-profile-atelier .proc-card>div{border-top:3px solid var(--proc-accent)}
.proc-profile-club{--proc-accent:#44a3ff}.proc-profile-club .proc-card{box-shadow:0 0 0 1px rgba(68,163,255,.1),0 28px 80px rgba(20,96,210,.12)}.proc-profile-club.proc-detail .proc-panel{background:linear-gradient(145deg,rgba(8,20,38,.96),rgba(17,15,42,.92))}
.proc-profile-alloy{--proc-accent:#63d8ff}.proc-profile-alloy .proc-card,.proc-profile-alloy.proc-detail .proc-panel{background:linear-gradient(145deg,rgba(3,9,18,.98),rgba(13,32,52,.88));border-color:rgba(99,216,255,.25)}.proc-profile-alloy .proc-card>div{box-shadow:inset 0 1px rgba(255,255,255,.08)}
@media(max-width:960px){.proc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.proc-detail{grid-template-columns:1fr}.proc-preview{position:relative;top:auto}.proc-home-head{grid-template-columns:1fr}}
@media(max-width:600px){.proc-grid{grid-template-columns:1fr}.proc-colors{grid-template-columns:repeat(2,1fr)}.proc-actions{grid-template-columns:1fr}.proc-home{padding:2.5rem 0}.proc-preview{border-radius:18px}}