@font-face{font-family:Roboto;src:url("./media/roboto-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Roboto;src:url("./media/roboto-700.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Roboto;src:url("./media/roboto-900.woff2") format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:EX Japanese;src:url("./media/jp-regular.woff") format("woff");font-weight:400 549;font-display:swap}
@font-face{font-family:EX Japanese;src:url("./media/jp-bold.woff") format("woff");font-weight:550 950;font-display:swap}
*{box-sizing:border-box}
html {
  --paper: #0d1116;
  --panel: #151c23;
  --ink: #f2f6f8;
  --muted: #b6c4ce;
  --muted-2: #91a3b0;
  --line: #354450;
  --subline: #25313b;
  --accent: #86d4f4;
  --on-accent: #081e2b;
  --cue: var(--accent);
  --tint: #192e3d;
  --ring: #b2e6ff;
  --shape: 3px;
  scroll-behavior: smooth;
  scroll-padding-top: 22px;
  color-scheme: dark;
  background: var(--paper);
  color: var(--ink);
}
body{margin:0;font:400 15px/1.5 Roboto,"EX Japanese","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;background:var(--paper);min-width:280px}
body.has-player{padding-bottom:84px}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
a,button,input,select{ -webkit-tap-highlight-color:transparent}
button:disabled{cursor:default}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--ring);outline-offset:3px}
::selection{background:var(--accent);color:var(--on-accent)}
h1,h2,h3,p{margin:0}
svg{width:1.1em;height:1.1em;display:block;flex:none}
[data-icon]{display:inline-flex;align-items:center;justify-content:center}
.shell{max-width:1460px;margin-inline:auto;padding-inline:clamp(22px,4.85vw,86px)}
.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.skip:focus{display:block;background:var(--accent);color:var(--on-accent);padding:8px 18px}
.mast{border-bottom:1px solid var(--subline)}
.mast-inner{height:67px;display:flex;align-items:center;gap:36px}
.brand{display:inline-flex;align-items:center;margin-right:auto;width:198px;height:48px}
.brand img,.footer-brand{display:block;width:100%;mix-blend-mode:screen}
.main-nav{display:flex;align-items:center;gap:29px;font-size:12px;font-weight:700}
.main-nav a,.main-nav button,.hero-all,.foot a,.foot button{text-underline-offset:4px}
.main-nav a:hover,.main-nav button:hover,.hero-all:hover,.foot a:hover,.foot button:hover{text-decoration:underline}
.channel-link{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 13px;border:1px solid var(--line);border-radius:30px;font-size:10px;font-weight:700;letter-spacing:.045em}
.channel-link:hover{border-color:var(--muted)}
.channel-link svg{width:14px;height:14px}
.channel-link .channel-ext svg{width:11px;height:11px}
.hero{background:var(--paper);border-bottom:1px solid var(--line)}
.hero-stage{position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(380px,31vw,468px);overflow:hidden}
.hero-image{position:absolute;z-index:-1;top:0;bottom:0;right:0;width:57%;overflow:hidden;background:var(--paper);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 96%,transparent)}
.hero-image img{width:100%;height:100%;object-fit:contain;display:block;mask-image:linear-gradient(180deg,transparent 0,#000 6%,#000 93%,transparent)}
.hero-copy{position:relative;padding-block:32px 40px;width:49%;pointer-events:none}
.hero-copy a{pointer-events:auto}
.hero-over,.kicker,.index-note,.program-count,.list-top,.dialog-kicker{font-size:10px;line-height:1.2;font-weight:700;letter-spacing:.16em}
.hero-over{display:flex;align-items:center;gap:10px;color:#bdd1de;letter-spacing:.14em;margin-bottom:21px}
.hero-over span{width:26px;height:2px;background:var(--accent)}
.hero-over i{font-style:normal;color:#869ead}
.hero h1{font-family:Roboto,Arial,sans-serif;font-size:clamp(77px,8.6vw,134px);line-height:.77;font-weight:900;letter-spacing:-.065em}
.hero h1>span{display:block;color:var(--accent);margin-top:.094em}
.hero h1 .period{color:var(--accent)}
.hero-jp{font-size:clamp(14px,1.12vw,18px);letter-spacing:.035em;font-weight:700;margin-top:24px}
.hero-actions{display:flex;align-items:center;gap:25px;margin-top:24px}
.btn,.modal-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:43px;padding:0 18px;font-size:13px;font-weight:700}
.hero-go{background:var(--accent);color:var(--on-accent);border-radius:var(--shape)}
.hero-go:hover,.modal-btn.primary:hover{filter:brightness(.9)}
.hero-go svg{width:17px;height:17px}
.hero-all{display:flex;align-items:center;gap:8px;color:#e1edf5;font-size:12px;font-weight:700}
.hero-all svg{width:15px;height:15px}
.programs,.catalog{padding-block:40px 42px}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px}
.kicker{display:flex;align-items:center;gap:9px;color:var(--cue);margin-bottom:8px}
.kicker i{display:block;width:17px;height:2px;background:currentColor}
.section-head h2{font-size:clamp(25px,2.2vw,34px);font-weight:700;line-height:1.26;letter-spacing:-.045em}
.index-note{color:var(--muted-2);font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.07em;margin-bottom:4px}
.program-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.45vw,22px)}
.program-card{display:block;text-align:left;width:100%;min-width:0}
.program-art{display:block;position:relative;background:var(--panel);overflow:hidden;isolation:isolate;aspect-ratio:2.27/1;border:1px solid var(--line);border-radius:var(--shape)}
.program-art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s}
.program-card:hover .program-art img{transform:scale(1.045)}
.program-card:hover .program-arrow,.program-card:focus-visible .program-arrow{color:var(--on-accent);background:var(--accent);border-color:var(--accent)}
.program-off .program-art{background:#211614}
.program-off .program-art img{object-position:center 49%}
.program-was .program-art img{object-position:center 43%}
.program-ex .program-art {
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    repeating-radial-gradient(ellipse at 102% -10%, transparent 0 12px, #cceefe6b 13px, transparent 14px 20px),
    linear-gradient(111deg, #4c98ba, #86d4f4);
}
.program-ex .program-art img {
  width: auto;
  height: 95%;
  border: 1px solid #d6f1ff99;
  box-shadow: 5px 5px 14px #24465257;
  transform: rotate(-5deg);
}
.program-ex:hover .program-art img { transform: rotate(-3deg) scale(1.04); }
.card-caption{display:flex;align-items:center;gap:12px;padding:11px 1px 0}
.card-caption strong{font-size:clamp(15px,1.4vw,21px);line-height:1.4;letter-spacing:-.035em}
.program-count{color:var(--muted-2);font-size:11px;letter-spacing:0}
.program-arrow{border:1px solid var(--line);border-radius:50%;margin-left:auto;width:27px;height:27px;display:grid;place-items:center;transition:.15s}
.program-arrow svg{width:13px;height:13px}
.catalog{border-top:1px solid var(--line);padding-bottom:65px}
.catalog-layout,.track-content{min-width:0}
.track-content{position:relative}
.filter-panel{display:flex;align-items:flex-end;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.filter-unit label{display:block;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:6px}
.select-wrap,.search-wrap{border:1px solid var(--line);background:var(--panel);border-radius:var(--shape);position:relative}
.select-wrap{display:flex;align-items:center}
select{width:100%;appearance:none;padding:8px 36px 8px 12px;min-height:38px;font-size:13px;border:none;background:transparent;cursor:pointer;border-radius:var(--shape)}
select option{background:var(--panel);color:var(--ink)}
.select-wrap>span{position:absolute;right:10px;pointer-events:none}
.select-wrap svg{width:13px;height:13px}
.reset{font-size:11px;text-decoration:underline;text-underline-offset:4px;color:var(--muted);padding:8px 4px;white-space:nowrap}
.reset:hover{color:var(--ink)}
.search-wrap{display:flex;align-items:center;gap:10px;padding:0 12px;min-width:0}
.search-wrap:focus-within,.select-wrap:focus-within{border-color:var(--ring);outline:1px solid var(--ring)}
.search-wrap svg{width:17px;height:17px;color:var(--muted)}
.search-wrap input{width:100%;min-width:0;background:none;border:0;height:40px;font-size:13px;outline:0}
.search-wrap input:focus-visible,select:focus-visible{outline:0}
input::placeholder{color:var(--muted-2);opacity:1}
.search-line{position:absolute;right:0;top:-52px;width:min(35%,380px)}
.list-top{display:flex;align-items:center;gap:10px;color:var(--muted);letter-spacing:.05em;padding-block:7px 10px;min-height:30px}
.demo-label{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:10px;letter-spacing:.04em}
.demo-label i{width:6px;height:6px;border-radius:50%;background:var(--cue)}
.track-row{display:grid;grid-template-columns:40px minmax(0,1.15fr) minmax(68px,.47fr) minmax(90px,.48fr) 42px 40px;align-items:center;gap:16px;border-top:1px solid var(--subline);padding:10px 8px 10px 0;min-height:72px}
.track-row:last-child{border-bottom:1px solid var(--subline)}
.track-row.is-selected{background:var(--tint)}
.track-row.is-selected .track-play{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.track-play,.row-download,.player-dl,.close-player,.dialog-close{display:grid;place-items:center}
.track-play{width:36px;height:36px;background:var(--accent);color:var(--on-accent);border:1px solid var(--accent);border-radius:50%;justify-self:center}
.track-play:hover{background:var(--ring);border-color:var(--ring)}
.row-download:hover{border-color:var(--cue);color:var(--cue)}
.track-play svg,.main-play svg{width:16px;height:16px}
.track-link{display:flex;align-items:center;gap:13px;text-align:left;min-width:0}
.track-link:hover .track-title{text-decoration:underline;text-underline-offset:3px}
.track-thumb{display:block;height:43px;width:43px;border:1px solid var(--line);object-fit:cover;border-radius:2px;flex:none}
.track-names{display:block;min-width:0}
.track-title{display:block;font-size:17px;font-weight:700;line-height:1.3;letter-spacing:-.015em;overflow-wrap:anywhere}
.track-meta{display:block;font-size:11px;line-height:1.4;color:var(--muted);margin-top:4px}
.track-scene{display:flex;align-items:center;gap:7px;font-size:12px;white-space:nowrap;color:var(--muted)}
.track-scene::before{content:"";height:6px;width:6px;border-radius:50%;background:var(--dot)}
.wave{height:30px;display:flex;align-items:center;gap:2px;min-width:0;font-size:0;color:var(--wave,#7898ac)}
.wave i{max-width:3px;flex:1 1 2px;background:currentColor;border-radius:2px;min-width:0;display:block}
.time,.seek-wrap output{font:11px/1 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.row-download{border:1px solid var(--line);border-radius:var(--shape);width:34px;height:34px}
.row-download svg{width:16px;height:16px}
.no-result{padding:32px 8px;color:var(--muted);border-top:1px solid var(--line)}
.no-result strong{display:block;color:var(--ink);margin-bottom:8px}
.foot{border-top:1px solid var(--line);padding-block:23px}
.footer-inner{display:flex;align-items:center;gap:24px;color:var(--muted);font-size:11px}
.footer-brand{width:151px;margin-right:auto}
.foot a{display:flex;align-items:center;gap:5px}
.player{position:fixed;z-index:8;bottom:0;right:0;left:0;background:#15222d;color:var(--ink);border-top:1px solid #4b6b81;box-shadow:0 -4px 18px #0003;padding-bottom:env(safe-area-inset-bottom)}
.player-inner{display:flex;align-items:center;min-height:72px;gap:clamp(12px,2.6vw,42px)}
.player-track{display:flex;align-items:center;gap:12px;min-width:140px;flex:1}
.player-track img{width:42px;height:42px;object-fit:cover;border-radius:2px}
.player-track>div{min-width:0}
#player-title{display:block;font-size:15px;font-weight:700;line-height:1.3;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
#player-show{display:block;font-size:10px;color:var(--muted);margin-top:1px}
.transport{display:flex;align-items:center;gap:10px}
.transport button,.close-player{height:36px;width:28px;color:#e3eef5;display:grid;place-items:center}
.transport button.main-play{width:37px;height:37px;border-radius:50%;background:var(--accent);color:var(--on-accent)}
.seek-wrap{display:flex;align-items:center;gap:9px;flex:1.35;max-width:540px}
.seek-wrap output{color:#c1d2df;font-size:10px}
#seek{width:100%;accent-color:var(--accent);min-width:36px;height:22px}
.player-dl{grid-auto-flow:column;gap:6px;font-size:11px;color:#d5edfa}
.player-dl svg{width:17px;height:17px}
.close-player{color:#b4c7d6}
dialog{width:min(470px,calc(100% - 32px));padding:0;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:6px;box-shadow:0 16px 90px #0008}
dialog::backdrop{background:#050e19bb}
.dialog-inner{position:relative;padding:31px}
.dialog-close{position:absolute;right:13px;top:12px;width:30px;height:30px;border:1px solid var(--line);border-radius:50%}
.dialog-kicker{color:var(--cue);margin:2px 35px 10px 0}
dialog h2{font-size:clamp(25px,5vw,36px);line-height:1.25;margin:0 26px 14px 0;letter-spacing:-.035em}
dialog .explain{font-size:14px;line-height:1.9;color:var(--muted)}
.detail-top{display:flex;align-items:center;gap:13px;margin-bottom:16px}
.detail-top img{width:60px;height:60px;object-fit:cover;border-radius:2px}
.detail-top p{font-size:13px;color:var(--muted);line-height:1.6}
.dialog-tools{display:flex;gap:9px;margin:23px 0 13px;flex-wrap:wrap}
.modal-btn{border:1px solid var(--line);border-radius:var(--shape);font-size:12px;min-height:39px;padding:0 13px}
.modal-btn.primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.dialog-note{font-size:11px;line-height:1.6;color:var(--muted-2)}
.guide-list{margin:17px 0 0}
.guide-list div{padding:11px 0;border-top:1px solid var(--line)}
.guide-list dt{font-size:14px;font-weight:700}
.guide-list dd{margin:3px 0 0;color:var(--muted);font-size:13px;line-height:1.7}
@media(max-width:920px){
  .mast-inner{gap:21px}.main-nav{gap:18px}.brand{width:174px}
  .hero-stage{min-height:350px}.hero-over{margin-bottom:18px}
  .track-row{grid-template-columns:34px minmax(0,1.1fr) minmax(58px,.36fr) minmax(48px,.34fr) 33px 33px;gap:11px}
}
@media(max-width:700px){
  .shell{padding-inline:20px}

  .mast-inner{height:56px;gap:15px}.brand{width:min(43vw,166px)}.main-nav{gap:0;font-size:11px}
  .main-nav>a{display:none!important}.channel-link{width:34px;height:34px;padding:0;justify-content:center}.channel-link span:nth-child(n+2){display:none}.channel-link svg{height:17px;width:17px}
  .hero-stage{display:flex;flex-direction:column;align-items:stretch;min-height:0}
  .hero-copy{width:100%;padding:27px 0 0;order:0}
  .hero-image{position:relative;top:auto;bottom:auto;right:auto;width:100%;height:clamp(170px,48vw,295px);order:1;margin:6px auto 2px;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 94%,transparent)}
  .hero-image img{object-fit:contain;mask-image:linear-gradient(180deg,transparent 0,#000 5%,#000 91%,transparent)}
  .hero-over{font-size:9px;margin-bottom:13px}.hero h1{font-size:clamp(59px,15.6vw,98px);line-height:.76;letter-spacing:-.06em}
  .hero h1>span{margin-top:.105em}.hero-jp{margin-top:16px;font-size:13px}.hero-actions{margin-top:15px;gap:20px}.btn{min-height:38px;font-size:12px;padding:0 13px}
  .hero-all{font-size:11px}.programs,.catalog{padding-block:26px 29px}.section-head{margin-bottom:13px}.kicker{font-size:9px;margin-bottom:6px}.index-note{font-size:9px}
  .program-grid{grid-template-columns:1fr;gap:0}
  .program-card{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;gap:13px;padding:9px 0;border-top:1px solid var(--subline)}
  .program-card:last-child{border-bottom:1px solid var(--subline)}
  .program-art{aspect-ratio:1.78/1}.card-caption{padding:0;display:grid;grid-template-columns:1fr 30px;gap:2px 3px}
  .card-caption strong{font-size:17px}.program-arrow{grid-column:2;grid-row:1/3;width:26px;height:26px}.program-count{font-size:9px}
  .search-line{position:static;width:auto}
  .filter-panel{gap:8px;margin-bottom:10px}.filter-unit label{font-size:10px;line-height:1.2;margin-bottom:5px}
  .select-wrap select{font-size:12px;min-height:36px;padding:7px 25px 7px 8px}
  .filter-panel .reset{font-size:10px;margin-left:auto}.track-row{grid-template-columns:33px minmax(0,1fr) 33px 32px;gap:8px;padding:9px 2px;min-height:62px}
  .track-scene,.wave{display:none}.track-link{gap:8px}.track-thumb{width:36px;height:36px}.track-title{font-size:15px}.track-meta{font-size:10px}.track-play{width:31px;height:31px}.time{font-size:10px}.row-download{width:30px;height:32px}

  .filter-unit{flex:0 1 auto}.filter-panel .reset{margin-left:auto;align-self:flex-end}
  .footer-inner{display:grid;grid-template-columns:1fr auto;gap:14px 12px}.footer-brand{width:137px}.foot a{grid-column:1/-1}.foot{padding-block:19px}
  body.has-player{padding-bottom:112px}.player-inner{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;column-gap:10px;row-gap:0;padding-top:6px;padding-bottom:3px;min-height:77px}
  .player-track{min-width:0;gap:7px}.player-track img{width:32px;height:32px}#player-title{font-size:12px}#player-show{font-size:9px}.transport{gap:3px}.transport button{width:22px;height:32px}
  .transport button.main-play{width:30px;height:30px}.transport svg{width:14px;height:14px}.player-dl{min-width:26px;min-height:34px}.player-dl span:last-child{display:none}
  .seek-wrap{grid-column:1/-1;grid-row:2;max-width:none}.seek-wrap output{font-size:9px}.close-player{width:22px;height:34px}.dialog-inner{padding:25px 20px}
}
@media(max-width:350px){
  .shell{padding-inline:14px}.mast-inner{gap:9px}.track-link .track-thumb{display:none}.program-card{grid-template-columns:90px 1fr}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
.license-chip{padding:3px 8px;border:1px solid var(--line);border-radius:3px;color:var(--muted);font-size:11px;width:fit-content}
.release{padding-block:38px 75px;min-height:64vh}.back-catalog,.scene-link{font-size:13px;color:var(--accent)}
.release-grid{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(0,1fr);align-items:start;gap:clamp(28px,5vw,82px);margin-top:26px}
.release-art{display:block;width:100%;aspect-ratio:1;object-fit:cover;border:1px solid var(--line);border-radius:3px}
.release-copy{padding-top:15px}.release h1{font-size:clamp(38px,5.8vw,86px);line-height:1.11;letter-spacing:-.04em;overflow-wrap:anywhere}
.release-meta{color:var(--muted);font-size:13px;margin:14px 0}.release-description,.release-license p{white-space:pre-line;overflow-wrap:anywhere}
.release-description{margin:23px 0}.release-license{padding:15px 0;border-block:1px solid var(--line)}
.release-license h2{font-size:12px;margin-bottom:7px;color:var(--muted)}.release-license strong{color:var(--accent)}
.release-license p{font-size:13px;margin-top:7px;color:var(--muted)}.scene-link{display:inline-flex;align-items:center;gap:6px;margin-top:10px;flex-wrap:wrap}
#catalog:focus{outline:none}
@media(max-width:700px){.release-grid{grid-template-columns:1fr;gap:15px}.release-art{width:min(100%,360px)}.release{padding-block:23px 40px}.release-copy{padding:0}.license-chip{display:none}}
.setup-form{max-width:450px;margin:30px auto}.setup-form h1{font-size:36px}.setup-form p,.setup-form form{margin:15px 0}
.setup-form label,.setup-form input{display:block}.setup-form label{font-size:13px}.setup-form input{width:100%;background:var(--panel);border:1px solid var(--line);padding:10px;margin:5px 0 14px}.setup-form a{color:var(--accent);font-size:13px}