﻿/* 偲スタジオ内部ポータル：トップのヒーロー選定と端末内アップロードを整える。 */
.hero-control-lead{max-width:650px;margin:-22px 0 32px;color:#576159;font-size:13px}
.hero-selector{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.hero-selector button{position:relative;overflow:hidden;padding:0;text-align:left;border:1px solid var(--line);background:var(--paper);transition:border .18s,transform .18s}
.hero-selector button:hover,.hero-selector button.active{border-color:var(--warm);transform:translateY(-2px)}
.hero-selector img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;filter:saturate(.8)}
.hero-selector span{display:block;padding:14px 16px 2px;font:600 21px var(--display)}
.hero-selector small{display:block;padding:0 16px 15px;color:var(--warm);font:9px var(--mono);letter-spacing:.13em}
.hero-upload{display:grid;grid-template-columns:1fr auto;gap:18px;margin-top:28px;padding:28px;background:#e9e0d2;border-left:3px solid var(--warm)}
.hero-upload .eyebrow{margin-bottom:7px}
.hero-upload h3{margin:0;font:600 25px var(--display)}
.hero-upload p:not(.eyebrow){margin:8px 0 0;color:#576159;font-size:12px}
.hero-upload-control{align-self:center;display:inline-flex;align-items:center;padding:12px 15px;background:var(--ink);color:var(--paper);font:10px var(--mono);letter-spacing:.1em;cursor:pointer}
.hero-upload-control input{position:absolute;width:1px;height:1px;opacity:0}
.hero-upload-status{grid-column:1/-1;margin:0!important;font-size:11px!important;color:var(--warm)!important}
@media(max-width:560px){.hero-selector{grid-template-columns:1fr;gap:7px}.hero-upload{grid-template-columns:1fr}.hero-upload-control{justify-content:center}}
