/* Layout: poster colours of the 2026 main visual. Karma orange hero with the visual + logo, bold heavy type throughout. Single committed light look. */
:root{
  --orange:#DD702C;   /* カルマオレンジ（ケンタウロス映像の背景色） */
  --orange-deep:#B5561C;
  --sky:#E0BF2A;      /* からし色の空 */
  --river:#A9C8C5;    /* 川の水色 */
  --paper:#FBF6EA;
  --ink:#141110;
  --ink-soft:#4A423C;
  --line:#14111026;
  --f-head:"Zen Kaku Gothic New","Hiragino Kaku Gothic StdN","Hiragino Sans",sans-serif;
  --f-num:"Rammetto One","Arial Black",sans-serif;
  --f-body:"Zen Kaku Gothic New","Hiragino Sans","Noto Sans JP",sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-weight:500;font-size:16px;line-height:1.9;margin:0}
a{color:inherit}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:960px;margin:0 auto;padding-inline:20px}
h1,h2,h3{text-wrap:balance;margin:0;font-weight:400}
p{margin:0}

/* hero */
.hero{background:var(--orange);color:var(--ink);padding:40px 20px 56px}
.hero-in{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:minmax(0,400px) minmax(0,540px);justify-content:center;column-gap:clamp(48px,7vw,96px);row-gap:28px;align-items:center}
.mv{margin:0;border:3px solid var(--ink);box-shadow:10px 10px 0 var(--ink);background:var(--sky)}
.hero-txt{display:grid;gap:22px;min-width:0;container-type:inline-size}
.logo img{width:100%;max-width:460px}
.dates{font-family:var(--f-num);font-weight:400;font-size:clamp(1.3rem,8.4cqi,3.6rem);line-height:1.1;white-space:nowrap;font-variant-numeric:tabular-nums}
.dates span{font-family:var(--f-num);font-weight:400;font-size:.3em;vertical-align:.95em;margin-left:.12em;letter-spacing:.06em}

.hours{margin:0;display:flex;flex-wrap:wrap;gap:10px 28px}
.hours div{display:grid}
.hours dt{font-weight:900;font-size:.78rem;letter-spacing:.18em}
.hours dd{margin:0;font-family:var(--f-num);font-weight:400;font-size:1.6rem;line-height:1.2;font-variant-numeric:tabular-nums}
.venue{font-family:var(--f-num);font-weight:400;font-size:1.5rem;line-height:1.3;display:grid}
.venue small{font-family:var(--f-body);font-weight:700;font-size:.9rem;letter-spacing:.06em}
.free{justify-self:start;background:var(--ink);color:var(--paper);font-family:var(--f-head);font-weight:900;font-size:1.25rem;padding:6px 22px;border-radius:999px;letter-spacing:.12em}

/* nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--ink);color:var(--paper)}
.nav ul{list-style:none;margin:0 auto;padding:0 12px;max-width:960px;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.nav a{display:block;padding:13px 12px;text-decoration:none;font-weight:900;font-size:.88rem;letter-spacing:.08em;white-space:nowrap}
.nav a:hover,.nav a:focus-visible{color:var(--orange);outline:none}

/* sections */
section{padding-block:80px}
.sec-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:32px}
.sec-head h2{font-family:var(--f-head);font-weight:900;letter-spacing:-.02em;font-size:clamp(2.1rem,6vw,3.2rem);line-height:1.15}
.sec-head .en{font-weight:900;font-size:.8rem;letter-spacing:.26em;color:var(--orange)}
.prose{max-width:36em;display:grid;gap:1.2em;font-size:1.02rem}
.sign{font-family:var(--f-head);font-weight:900;letter-spacing:.04em;margin-top:.4em}
.pull{font-family:var(--f-head);font-weight:900;font-size:clamp(1.4rem,4vw,2rem);line-height:1.55;max-width:21em;color:var(--orange)}
.night{margin-top:36px;background:var(--ink);color:var(--paper);padding:24px 26px;display:grid;gap:6px;max-width:36em;border-left:10px solid var(--orange)}
.night strong{font-family:var(--f-num);font-weight:400;font-size:1.35rem;color:var(--sky)}

#message{background:var(--sky)}
#message .sec-head .en{color:var(--ink)}
#about .pull{color:var(--orange)}

/* artists: orange band */
#artists{background:var(--orange)}
#artists .sec-head .en{color:var(--ink)}
.artists{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));border-top:3px solid var(--ink)}
.artists li{border-bottom:2px solid var(--ink);padding:18px 4px;display:grid;gap:2px;min-width:0}
.artists .name{font-family:var(--f-head);font-weight:900;font-size:clamp(1.5rem,3.6vw,1.9rem);line-height:1.3}
.artists .ig{font-size:.85rem;font-weight:700;overflow-wrap:anywhere}
.artists .ig a{text-decoration:none}
.artists .ig a:hover{text-decoration:underline}
.sub-h{font-family:var(--f-head);font-weight:900;font-size:1.3rem;margin:44px 0 14px}
.djs{display:flex;flex-wrap:wrap;gap:10px}
.djs span{background:var(--ink);color:var(--paper);border-radius:999px;padding:6px 18px;font-weight:900;font-size:1rem}
.note{font-size:.9rem;font-weight:700;margin-top:22px}

.talk-lead{max-width:36em;font-weight:700;margin:0 0 16px}
.talks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px}
.talks li{background:var(--paper);border:2px solid var(--ink);padding:16px 18px;display:grid;gap:4px}
.talks b{font-family:var(--f-head);font-weight:900;font-size:1.15rem}
.talks span{font-weight:700}
.talks small{font-weight:700;font-size:.85rem}

/* shops */
.lead{max-width:36em;margin-bottom:32px;font-weight:700;font-size:1.05rem}
.shop-groups{display:grid;gap:40px}
.shop-group h3{font-family:var(--f-head);font-weight:900;font-size:1.35rem;display:flex;justify-content:space-between;align-items:baseline;border-bottom:3px solid var(--ink);padding-bottom:6px;margin-bottom:10px}
.shop-group h3 span{font-size:.95rem;color:var(--orange);font-variant-numeric:tabular-nums}
.shops{list-style:none;margin:0;padding:0;columns:3 210px;column-gap:28px}
.shops li{break-inside:avoid;padding:6px 0;font-weight:700;line-height:1.5;border-bottom:1px solid var(--line)}
.shops li a{text-decoration:none;background-image:linear-gradient(var(--orange),var(--orange));background-size:100% 2px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:1px}
.shops li a:hover,.shops li a:focus-visible{color:var(--orange);outline:none}
.shops li a::after{content:" ↗";font-size:.75em;color:var(--orange)}
.shops li em{font-style:normal;font-size:.72rem;background:var(--orange);color:var(--paper);padding:1px 7px;border-radius:999px;margin-left:6px;font-weight:900;vertical-align:.1em}

.shop-tabs{display:flex;gap:10px;margin:0 0 28px}
.shop-tabs button{font:inherit;font-weight:900;font-size:.95rem;letter-spacing:.06em;padding:9px 20px;border:2px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;border-radius:999px}
.shop-tabs button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.pref-strip{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 32px;padding:0;list-style:none}
.pref-strip a{display:inline-block;background:var(--ink);color:var(--paper);border-radius:999px;padding:4px 14px;font-weight:900;font-size:.88rem;text-decoration:none;border:2px solid var(--ink);transition:background .15s,color .15s}
.pref-strip a:hover,.pref-strip a:focus-visible{background:var(--orange);color:var(--ink);outline:none}
.pref-strip a:hover b,.pref-strip a:focus-visible b{color:var(--ink)}
.shop-group[id]{scroll-margin-top:72px}
.pref-strip li b{color:var(--sky);font-family:var(--f-num);font-weight:400;margin-left:6px}
.shop-groups.by-pref{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:36px 28px}
.shop-groups.by-pref .wide{grid-column:1/-1}
.shop-groups.by-pref .shop-group:not(.wide) .shops{columns:1}
.shops li small{display:block;font-size:.72rem;color:var(--orange);font-weight:900;letter-spacing:.04em}

/* info */
#info{background:var(--river)}
#info .sec-head .en{color:var(--ink)}
.info{display:grid;grid-template-columns:8.5em 1fr;border-top:3px solid var(--ink)}
.info dt,.info dd{margin:0;padding:14px 4px;border-bottom:1px solid var(--ink)}
.info dt{font-weight:900;letter-spacing:.08em}
.info dd{min-width:0;font-weight:700}
.access{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:28px}
.access div{background:var(--paper);border:2px solid var(--ink);padding:18px 20px;display:grid;gap:4px}
.access b{font-family:var(--f-head);font-weight:900;font-size:1.2rem}
.btn{display:inline-block;margin-top:22px;background:var(--orange);color:var(--ink);text-decoration:none;font-weight:900;padding:12px 24px;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);letter-spacing:.06em}
.btn:hover,.btn:focus-visible{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink);outline:none}
.caution{margin-top:28px;font-size:.92rem;font-weight:700;max-width:40em}

/* more from calma */
#more{background:var(--paper)}
.acts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr));gap:16px}
.acts li{background:#fff;border:2px solid var(--ink);padding:20px 22px;display:grid;gap:6px;align-content:start;min-width:0}
.acts b{font-family:var(--f-head);font-weight:900;font-size:1.2rem;line-height:1.35}
.acts p{margin:0;font-weight:700;font-size:.92rem}
.acts a{justify-self:start;margin-top:6px;font-weight:900;font-size:.88rem;text-decoration:none;border-bottom:2px solid var(--orange)}
.acts a:hover,.acts a:focus-visible{color:var(--orange);outline:none}
.follow{margin-top:44px;background:var(--ink);color:var(--paper);padding:28px 26px;border-left:10px solid var(--orange)}
.follow h3{font-family:var(--f-head);font-weight:900;font-size:1.35rem;margin:0 0 6px}
.follow p{margin:0;font-weight:700}
.follow-btns{display:flex;flex-wrap:wrap;gap:0 14px}
.follow .btn{white-space:nowrap;padding:12px 18px;font-size:.92rem}
.acts a{color:var(--ink)}
.follow .btn{box-shadow:4px 4px 0 var(--paper);border-color:var(--paper)}
.follow .btn:hover,.follow .btn:focus-visible{box-shadow:2px 2px 0 var(--paper)}

/* footer */
footer{background:var(--ink);color:var(--paper);padding-block:56px;text-align:center}
footer .wrap{display:grid;gap:16px;justify-items:center}
.flogo{width:min(320px,80%)}
.tags{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;font-weight:700;font-size:.9rem}
.tags a{text-decoration:none;border-bottom:2px solid var(--orange)}
.org{font-size:.85rem}

@media (max-width:760px){
  .hero{padding:28px 16px 44px}
  .hero-in{grid-template-columns:minmax(0,1fr);gap:28px}
  .mv{order:2;max-width:440px;width:100%;justify-self:center;box-shadow:8px 8px 0 var(--ink)}
  .hero-txt{order:1;justify-items:start}
}
@media (max-width:560px){
  section{padding-block:60px}
  .info{grid-template-columns:1fr}
  .info dt{border-bottom:none;padding-bottom:0}
  .info dd{padding-top:2px}
}

.nav .brand a{padding:6px 10px 6px 0}
.cent-nav{height:30px;width:auto}
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:48px;align-items:start}
.about-main{min-width:0}
.emblem{margin:8px 0 0;display:grid;gap:10px;justify-items:center}
.emblem img{width:100%;max-width:260px}
.emblem figcaption{font-weight:900;font-size:.8rem;letter-spacing:.08em}
#artists .sec-head{align-items:flex-end}
.cent-big{margin-left:auto;width:clamp(120px,22vw,220px)}
.emblem-foot{width:min(130px,36%)}
.wordmark{width:min(220px,60%)}
@media (max-width:760px){
  .about-grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .emblem img{max-width:200px}
}

#movie{background:var(--ink);color:var(--paper)}
#movie .sec-head .en{color:var(--orange)}
.movie iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.movie{position:relative;display:block;aspect-ratio:16/9;max-width:100%;background:var(--ink);text-decoration:none;color:var(--paper);overflow:hidden;border:3px solid var(--paper)}
.movie-thumb{width:100%;height:100%;object-fit:cover}


.play{position:absolute;inset:auto 24px 24px auto;width:64px;height:64px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;transition:transform .15s}
.movie-cap{margin-top:14px;font-weight:900;letter-spacing:.04em}
.movie-cap a{text-decoration:none;border-bottom:2px solid var(--orange)}
.movie:hover .play,.movie:focus-visible .play{transform:scale(1.08);background:var(--paper);color:var(--ink)}
.movie:focus-visible{outline:3px solid var(--sky);outline-offset:4px}
@media (max-width:560px){.play{width:44px;height:44px;inset:auto 12px 12px auto}}

.access a{font-weight:900;text-decoration:none;border-bottom:2px solid var(--orange)}
.bus{margin-top:16px;background:var(--paper);border:2px solid var(--ink);scroll-margin-top:64px}
.bus summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px}
.bus summary::-webkit-details-marker{display:none}
.bus summary:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.bus-sum{display:grid;gap:2px}
.bus-sum b{font-weight:900;font-size:1.05rem}
.bus-sum small{font-weight:700;font-size:.85rem}
.bus-toggle{flex:none;width:32px;height:32px;border-radius:50%;background:var(--ink);position:relative}
.bus-toggle::before,.bus-toggle::after{content:"";position:absolute;left:9px;right:9px;top:15px;height:2px;background:var(--paper)}
.bus-toggle::after{transform:rotate(90deg);transition:transform .15s}
.bus[open] .bus-toggle::after{transform:rotate(0)}
.bus-body{display:grid;gap:16px;padding:0 20px 22px}
.bus h3{font-family:var(--f-head);font-weight:900;font-size:1.35rem;line-height:1.4}
.bus-lead{font-weight:700;max-width:40em}
.bus-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.bus-col{min-width:0}
.bus-col h4{margin:0 0 8px;font-weight:900;font-size:1.1rem;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;border-bottom:3px solid var(--ink);padding-bottom:6px}
.bus-col h4 small{font-size:.8rem;font-weight:700}
.bus-col ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.bus-col li{display:flex;align-items:center;gap:6px;border:1px solid var(--line);padding:6px 8px;font-family:var(--f-num);font-size:1.05rem;font-variant-numeric:tabular-nums}
.bus-col li.direct{background:var(--orange);border-color:var(--orange)}
.bus-col li span,.bus-notes .tag{font-family:var(--f-body);font-weight:900;font-size:.68rem;background:var(--ink);color:var(--paper);padding:1px 6px;border-radius:999px;letter-spacing:.04em}
.bus-notes{margin:0;padding-left:1.2em;font-size:.9rem;font-weight:700;display:grid;gap:4px}
@media (max-width:560px){.bus summary{padding:14px}.bus-body{padding:0 14px 18px}.bus-col ul{grid-template-columns:repeat(2,minmax(0,1fr))}}

.daynight{margin-top:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;max-width:56em}
.dn{padding:22px 24px;display:grid;gap:8px;align-content:start;border:2px solid var(--ink)}
.dn.day{background:var(--paper);color:var(--ink)}
.dn.night{background:var(--ink);color:var(--paper);margin:0;max-width:none;border-left:2px solid var(--ink)}
.dn-label{font-family:var(--f-num);font-size:1.5rem;line-height:1.1;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.dn.day .dn-label{color:var(--orange)}
.dn.night .dn-label{color:var(--sky)}
.dn-label span{font-size:1.05rem;color:inherit}
.dn-title{font-weight:900;letter-spacing:.14em;font-size:.85rem}

.cal{display:flex;flex-wrap:wrap;gap:10px}
.cal-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border:2px solid var(--ink);color:var(--ink);text-decoration:none;font-weight:900;font-size:.88rem;letter-spacing:.04em;background:transparent}
.cal-btn::before{content:"";width:14px;height:14px;border:2px solid currentColor;border-top-width:4px;border-radius:2px;flex:none}
.cal-btn:hover,.cal-btn:focus-visible{background:var(--ink);color:var(--paper);outline:none}

/* pick up */
#pickup{background:var(--paper)}
.picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:20px}
.pick{background:#fff;border:2px solid var(--ink);display:grid;grid-template-rows:auto 1fr;min-width:0}
.pick figure{margin:0;position:relative;border-bottom:2px solid var(--ink)}
.pick img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 30%}
.pick figcaption{position:absolute;right:8px;bottom:6px;font-size:.66rem;font-weight:700;color:#fff;text-shadow:0 0 4px #0009}
.pick-txt{padding:16px 18px 20px;display:grid;gap:6px;align-content:start}
.pick-tag{margin:0;font-size:.72rem;font-weight:900;letter-spacing:.12em;color:var(--orange)}
.pick h3{font-family:var(--f-head);font-weight:900;font-size:1.25rem;line-height:1.35}
.pick-txt p:last-child{margin:0;font-size:.9rem;font-weight:700;line-height:1.8}
.pick.noimg{background:var(--ink);color:var(--paper)}
.pick.noimg .pick-txt{padding-top:24px}

/* calma & profile */
#calma{background:var(--river)}
#calma .sec-head .en{color:var(--ink)}
#calma .pull{color:var(--ink)}
.calma-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;margin-top:28px;align-items:start}
.profile{background:var(--paper);border:2px solid var(--ink);padding:22px 24px;display:grid;gap:12px}
.profile p{margin:0;font-size:.92rem;font-weight:700}
.profile-name{font-family:var(--f-head);font-weight:900;font-size:1.5rem!important;line-height:1.3}
.profile-name small{display:block;font-size:.75rem;letter-spacing:.06em;margin-top:2px}
.history summary{cursor:pointer;font-weight:900;font-size:.95rem;border-top:2px solid var(--ink);padding-top:10px}
.history dl{display:grid;grid-template-columns:3.4em 1fr;gap:6px 10px;margin:10px 0 0;font-size:.85rem;font-weight:700;line-height:1.7}
.history dt{font-family:var(--f-num);color:var(--orange)}
.history dd{margin:0}
.profile-link a{font-weight:900;text-decoration:none;border-bottom:2px solid var(--orange);margin-right:10px}
@media (max-width:760px){.calma-grid{grid-template-columns:minmax(0,1fr);gap:24px}}
.pick img.fit{object-fit:contain;background:#141110}
a.oth{color:inherit;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:var(--orange)}
a.oth::after{content:" ↗";font-size:.7em}
/* profile: photo left, text right. CALMA text above, card full width */
.calma-grid{grid-template-columns:minmax(0,1fr)!important;gap:28px!important;max-width:880px}
.calma-grid .prose{max-width:40em}
.profile{grid-template-columns:200px minmax(0,1fr);column-gap:28px;align-items:start}
.profile>*{grid-column:2}
.profile-photo{grid-column:1;grid-row:1 / span 4;margin:0;border:2px solid var(--ink)}
.profile-photo img{display:block;width:100%;height:auto}
@media (max-width:640px){
  .profile{grid-template-columns:96px minmax(0,1fr);column-gap:16px}
  .profile-photo{grid-row:1;align-self:center}
  .profile>*:not(.profile-photo):not(.profile-name){grid-column:1 / -1}
  .profile-name .sep{display:none}
  .profile-name .role{display:block}
}
.note-ga{font-size:.72rem;opacity:.7}

/* NEWS */
#news{padding-block:36px 0}
.news-box{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:28px;align-items:start;border:2px solid var(--ink);background:#fff;padding:18px 22px}
.news-label{font-family:var(--f-num);font-size:1.05rem;letter-spacing:.08em;color:var(--orange);line-height:1.6;padding-top:4px}
.news-list{list-style:none;margin:0;padding:0}
.news-list li+li{border-top:1px solid var(--line)}
.news-list a,.news-list li>div{display:grid;grid-template-columns:7.2em minmax(0,1fr);column-gap:16px;padding:8px 0;text-decoration:none}
.news-list time{font-weight:900;font-size:.88rem;letter-spacing:.04em;color:var(--ink-soft);padding-top:2px;font-variant-numeric:tabular-nums}
.news-txt{display:grid;gap:2px}
.news-main{font-weight:900;line-height:1.6}
.news-txt small{font-size:.8rem;color:var(--ink-soft);line-height:1.6}
.news-list a:hover .news-main,.news-list a:focus-visible .news-main{color:var(--orange-deep);text-decoration:underline;text-underline-offset:3px}
.news-list .ext{font-size:.8em}
.news-more{grid-column:2;margin-top:6px}
.news-more summary{cursor:pointer;font-size:.85rem;font-weight:900;color:var(--ink-soft)}
@media (max-width:640px){
  #news{padding-block:24px 0}
  .news-box{grid-template-columns:minmax(0,1fr);padding:14px 16px;row-gap:4px}
  .news-more{grid-column:1}
  .news-list a,.news-list li>div{grid-template-columns:minmax(0,1fr);row-gap:0}
}
