/* OsakaPNG: local review direction, Osaka street culture and gaming. */
:root {
  --ink:#19171e;
  --muted:#625d69;
  --purple:#592592;
  --purple-dark:#1c1723;
  --orange:#ef7338;
  --paper:#faf8f2;
  --soft:#eeeae1;
  --line:#d8d3c8;
  --radius:4px;
  --yellow:#ffda45;
}
.site-header {
  background:#17151b;
  color:#fff;
  border-bottom:1px solid #36303e;
  backdrop-filter:none;
}
.header-inner { height:84px; }
.brand img { filter:none; width:188px; }
.site-nav { font-family:Arial,system-ui,sans-serif; font-weight:800; }
.site-nav a { min-height:44px; display:flex; align-items:center; }
.site-nav a:last-child { color:#17151b; background:var(--yellow); border-radius:2px; }
.menu-toggle { border-color:#686170; }
.menu-toggle span { background:#fff; }
.button { border-radius:2px; font-weight:800; min-height:54px; }
.primary { background:var(--purple); }
.outline { border-width:2px; }
.button:hover { box-shadow:4px 4px 0 #17151b; transform:translate(-2px,-2px); }
.eyebrow { font-family:Arial,system-ui,sans-serif; letter-spacing:.12em; }
.section-head .eyebrow:before {
  content:""; display:inline-block; width:10px; height:10px;
  background:currentColor; margin-right:10px; box-shadow:5px -5px 0 var(--yellow);
}
.section-head h2 { font-weight:900; letter-spacing:-.045em; }
.section-head { padding-bottom:22px; border-bottom:2px solid var(--ink); }
.arena-hero { background:var(--paper); overflow:hidden; }
.arena-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.12fr); max-width:1800px; margin:auto; }
.arena-copy {
  padding:54px 36px 38px max(32px,calc((100vw - 1180px)/2));
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
  min-width:0; position:relative;
}
.arena-kicker { display:flex; flex-direction:column; gap:3px; font:800 11px/1.4 Arial,sans-serif; letter-spacing:.13em; margin:0 0 32px; }
.arena-kicker span:first-child { color:var(--purple); }
.arena-copy h1 {
  font-size:clamp(2rem,3.6vw,4.1rem); font-weight:850; line-height:1.45;
  letter-spacing:-.05em; margin:0 0 23px; position:relative;
}
.arena-copy h1 span { color:var(--purple); white-space:nowrap; }
.arena-lead { font-size:1rem; line-height:1.95; color:#48404f; margin-bottom:30px; }
.arena-copy .actions { gap:12px; }
.arena-copy .button { font-size:.82rem; padding:12px 18px; border-radius:12px; }
.arena-copy .button:hover { box-shadow:0 5px 14px #59259224; transform:translateY(-2px); }
.arena-signature { margin:42px 0 0; font-size:.76rem; font-weight:800; }
.arena-signature span { display:inline-block; margin-left:15px; font:900 1.05rem Arial,sans-serif; }
.arena-visual { position:relative; min-width:0; background:var(--paper); min-height:560px; overflow:hidden; }
.arena-visual picture { display:contents; }
.arena-city { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; object-position:54% center; }
.play-strip {
  display:flex; justify-content:space-around; align-items:center; flex-wrap:wrap; gap:14px 22px;
  padding:17px 30px; background:var(--purple); color:white;
  font:800 .8rem/1.5 Arial,sans-serif; letter-spacing:.1em;
}
.play-strip span + span:before { content:"+"; color:var(--yellow); margin-right:26px; font-weight:900; }
.play-strip a { color:var(--yellow); padding:3px 0; }
.news-card { border:1px solid var(--line); border-radius:3px; background:#fff; }
.news-cover { background:#efe9dd; }
.news-copy { padding:24px; }
.news-copy .meta span { color:var(--ink); background:var(--yellow); border-radius:1px; }
.home-page #news .news-copy h3 { font-weight:850; }
.home-page #talents { background:#1b181f; color:white; position:relative; }
.home-page #talents .section-head { border-bottom-color:#4e435a; }
.home-page #talents .eyebrow,.home-page #talents .text-link { color:var(--yellow); }
.home-page #talents .section-lead { color:#ddd2e7; }
.talent-card { border-radius:3px; border:1px solid var(--line); box-shadow:none; }
.portrait { background:#eee7d7; border-bottom:4px solid var(--yellow); }
.home-page #talents .talent-card { background:#28222f; border-color:#493d53; }
.home-page #talents .talent-info>p:not(.tagline) { color:#e0d7e6; }
.home-page #talents .tagline { color:#ddbfef; }
.home-page #talents .social-links a { border-bottom-color:#776880; }
.talent-info h3 { font-weight:900; }
.home-page #about { position:relative; }
.home-page #about:before { content:"OSAKA"; position:absolute; top:35px; left:0; z-index:-1; font:900 7rem Arial,sans-serif; color:#eeeae1; letter-spacing:-.07em; }
.about-mark { border-radius:2px; background:var(--purple); }
.dark { background:var(--purple); }
.dark .section-head { border-bottom-color:#bd9ed6; }
.dark .eyebrow { color:var(--yellow); }
.enjoy-grid article { border-radius:3px; }
.enjoy-grid .large-number { color:var(--yellow); }
.sponsor-row a { border:1px solid var(--line); border-radius:2px; }
.history-logo { background:var(--yellow); border-radius:3px; padding:48px; }
.page-intro { border-bottom:2px solid var(--ink); margin-bottom:35px; position:relative; }
.page-intro .eyebrow { display:inline-block; background:var(--purple); color:white; padding:5px 11px; }
.operator { padding:44px; margin-bottom:80px; background:#eeeae1; gap:55px; border-top:4px solid var(--purple); }
.operator-brand { background:#21172e; padding:35px; width:360px; flex-shrink:0; }
.operator .operator-brand img { display:block; width:100%; height:auto; filter:none; }
.operator h2 { margin-bottom:12px; font-size:1.8rem; }
.operator>div:last-child { min-width:0; }
.operator a { color:var(--purple); font-weight:750; }
.archive-controls,.profile-update,.contact-layout form { border-radius:3px; }
.profile-update { border-left-width:5px; }
.member-status { border-radius:2px; background:var(--yellow); color:var(--ink); }
.site-footer { background:#17151b; }
.footer-top p { color:#dcc9e9; }
.footer-bottom { color:#c4b7cc; }
@media(min-width:1800px) { .arena-copy { padding-left:80px; } }
@media(max-width:1100px) {
  .arena-copy { padding:40px 25px 35px 32px; }
  .arena-copy h1 { font-size:3.6vw; }
  .arena-visual { min-height:530px; }
  .arena-copy .actions { flex-direction:column; align-items:stretch; }
  .arena-copy .button { min-width:230px; }
  .arena-signature { margin-top:28px; }
}
@media(max-width:800px) {
  .arena-grid { grid-template-columns:1fr; }
  .arena-copy { padding:40px 30px 32px; }
  .arena-kicker { margin-bottom:20px; flex-direction:row; flex-wrap:wrap; gap:8px 18px; font-size:10px; }
  .arena-copy h1 { font-size:clamp(2rem,7vw,3.6rem); margin-bottom:18px; }
  .arena-lead { margin-bottom:24px; }
  .arena-copy .actions { flex-direction:row; }
  .arena-copy .button { min-width:0; }
  .arena-signature { margin-top:25px; }
  .arena-visual { min-height:0; aspect-ratio:1.5; }
  .arena-city { object-position:center; }
  .play-strip { padding:13px 20px; font-size:.65rem; gap:8px 15px; }
  .play-strip span + span:before { margin-right:15px; }
  .play-strip span:first-child { display:none; }
  .play-strip span:nth-child(2):before { display:none; }
}
@media(max-width:720px) {
  .header-inner { height:70px; }
  .brand img { width:168px; }
  .site-nav { background:#211a29; color:white; border-bottom:1px solid #53465e; }
  .site-nav a:last-child { justify-content:center; }
  .section-head { padding-bottom:18px; }
  .section-head h2 { font-size:1.65rem; }
  .home-page #news .news-card { display:block; }
  .home-page #news .news-cover { height:auto; aspect-ratio:1.8; }
  .home-page #news .news-copy { padding:20px; }
  .home-page #news .news-grid { gap:23px; }
  .home-page #about:before { font-size:5rem; }
  .operator { padding:28px 24px; gap:28px; margin-bottom:50px; }
  .operator-brand { width:100%; max-width:360px; padding:27px; }
  .history-logo { padding:32px; }
  .page-intro { margin-bottom:24px; }
}
@media(max-width:399px) {
  .arena-copy { padding:32px 20px 26px; }
  .arena-copy h1 { font-size:7vw; letter-spacing:-.06em; }
  .arena-kicker { font-size:9px; }
  .arena-lead { font-size:.9rem; }
  .arena-copy .button { padding:11px 12px; font-size:.75rem; }
  .arena-visual { aspect-ratio:1.5; }
  .play-strip { padding-inline:12px; letter-spacing:.06em; }
  .play-strip span + span:before { margin-right:10px; }
  .play-strip a { flex-basis:100%; text-align:center; }
}