/* A single battery becomes a night of evidence. Only the homepage loads this file. */
.film{--film-ink:#202124;--film-muted:#565a60;--beat:1;--entrance:1;--charge:1;isolation:isolate;aspect-ratio:auto;height:520px;border:0;border-radius:16px;background:#f2f3f5;color:var(--film-ink);transition:background .65s,color .45s;contain:layout paint}
.film-scene{position:absolute;inset:0;padding:42px 46px 80px;z-index:2;pointer-events:none}
.film-time{display:flex;align-items:center;gap:16px;font-size:.82rem;font-weight:550;color:var(--film-muted);font-variant-numeric:tabular-nums;letter-spacing:0}
.film-clock{padding-left:16px;border-left:1px solid currentColor}
.film-title{color:var(--film-ink);font-size:clamp(2.5rem,5vw,4.4rem);line-height:1.02;letter-spacing:-.04em;font-weight:650;max-width:10ch;margin-top:26px;text-wrap:balance;opacity:calc(.65 + var(--entrance)*.35);transform:translateX(calc((1 - var(--entrance))*20px))}
.film-detail{position:absolute;right:44px;top:350px;width:43%;text-align:center;color:var(--film-muted);font-size:.8rem;line-height:1.4}
.film-art{position:absolute;inset:0;z-index:1;pointer-events:none}
.film-energy{position:absolute;right:52px;top:155px;width:41%;height:152px;transform:perspective(900px) rotateY(-12deg) rotateZ(-4deg);transition:transform .7s cubic-bezier(.16,1,.3,1),top .7s}
.film-energy-shell{position:absolute;inset:-15px -16px;border:4px solid #a9b0b7;border-radius:25px;background:linear-gradient(125deg,#fff8,transparent 60%);box-shadow:0 24px 32px -20px #1c22263d;transition:border-color .5s,opacity .45s}
.film-energy-shell:after{content:"";position:absolute;top:calc(50% - 24px);right:-15px;width:10px;height:48px;border-radius:0 5px 5px 0;background:#a9b0b7;transition:background .5s}
.film-cells{height:100%;display:flex;gap:4px;align-items:stretch}
.film-cells i{flex:1;min-width:0;display:block;border-radius:4px;background:#70ae35;transform-origin:center bottom;transition:background .5s;box-shadow:inset 0 1px 0 #ffffff40}
.film-question{position:absolute;inset:0;display:grid;place-items:center;font-size:7rem;line-height:1;font-weight:500;letter-spacing:-.04em;color:#535961;opacity:0;transform:scale(.8);transition:opacity .45s,transform .6s cubic-bezier(.16,1,.3,1)}
.film-axis{position:absolute;right:38px;top:320px;width:44%;display:flex;justify-content:space-between;border-top:1px solid #a3a7ac;padding-top:9px;font-size:.68rem;color:var(--film-muted);opacity:0;transition:opacity .45s}
.film-scan{position:absolute;right:calc(48% - var(--beat)*40%);top:155px;height:152px;width:1px;background:#ffffff90;opacity:0}
.film[data-scene="1"]{--film-ink:#f5f5f7;--film-muted:#c5c9ce;background:#151b23}
.film[data-scene="1"] .film-energy{transform:perspective(900px) rotateY(0) rotateZ(0)}
.film[data-scene="1"] .film-energy-shell{border-color:#7b828d;background:none;box-shadow:none}
.film[data-scene="1"] .film-energy-shell:after{background:#7b828d}
.film[data-scene="1"] .film-cells i{background:#fa805f}
.film[data-scene="1"] .film-axis,.film[data-scene="1"] .film-scan{opacity:1}
.film[data-scene="1"] .film-detail{top:364px}
.film[data-scene="2"]{background:#e9eaed}
.film[data-scene="2"] .film-title{font-size:clamp(2.3rem,4.3vw,3.7rem);max-width:12ch}
.film[data-scene="2"] .film-energy{transform:perspective(900px) rotateY(10deg) rotateZ(3deg)}
.film[data-scene="2"] .film-cells i{background:#969da6;opacity:.16!important}
.film[data-scene="2"] .film-energy-shell{border-color:#a9b0b7;border-style:dashed;background:none;box-shadow:none}
.film[data-scene="2"] .film-question{opacity:1;transform:scale(1)}
.film[data-scene="3"]{background:#edf2e9}
.film[data-scene="3"] .film-energy{transform:none;top:155px}
.film[data-scene="3"] .film-energy-shell{opacity:0}
.film[data-scene="3"] .film-cells i{background:#658b46;transform:scaleY(var(--wake))}
.film[data-scene="3"] .film-axis{opacity:1;border-color:#a0ae98}
.film[data-scene="3"] .film-detail{top:356px}
.film-brand{display:flex;align-items:center;gap:11px;color:var(--film-ink);font-size:1rem;font-weight:550}
.film-brand img{border-radius:9px}
.film-result .film-title{margin-top:24px;max-width:10ch}
.film-resolution{font-size:1.05rem;color:var(--film-muted);max-width:30ch;line-height:1.4;margin-top:20px;width:43%}
.film-cta{display:inline-flex;align-items:center;gap:12px;pointer-events:auto;margin-top:20px;min-height:44px;font-size:.88rem;font-weight:550;text-decoration:underline;text-underline-offset:5px;max-width:43%;line-height:1.4}
.film-cta svg{flex-shrink:0;transition:transform .2s}
.film-cta:hover svg{transform:translateX(4px)}
.film .motion-controls{z-index:3;background:transparent;border-top:1px solid #898f932e;inset:auto 24px 0;padding:3px 0;gap:16px;color:var(--film-ink)}
.film .scene-steps{gap:7px;flex:1;max-width:230px}
.film .scene-steps button{height:48px;width:auto;flex:1;padding:20px 0}
.film .scene-steps span{position:relative;overflow:hidden;height:3px;background:#8d949950}
.film .scene-steps span:after{position:absolute;inset:0;content:"";background:var(--film-ink);transform:scaleX(var(--step,0));transform-origin:left}
.film .scene-steps [aria-pressed=true] span{background:#8d949950}
.film .motion-toggle{color:var(--film-ink);min-height:48px;max-width:48%;height:auto;font-size:.75rem;line-height:1.3;padding:8px 0 8px 10px}
.film :is(button,a):focus-visible{outline-color:var(--film-ink);outline-offset:3px}
html:lang(ja) .film-title,html:lang(ko) .film-title{font-size:clamp(2.1rem,3.6vw,3.15rem);line-height:1.2;letter-spacing:-.035em;max-width:12ch;word-break:normal;overflow-wrap:anywhere}
html:lang(ko) .film-title{word-break:keep-all}
html[data-theme=dark] .film:not([data-scene="1"]){--film-ink:#f3f4f6;--film-muted:#c0c6cd;background:#242b32}
html[data-theme=dark] .film[data-scene="3"]{background:#242f25}
html[data-theme=dark] .film-question{color:#c0c6cd}
@media(min-width:768px) and (max-width:1000px){.film{height:490px}.film-scene{padding-inline:32px}.film-title{font-size:3.1rem}.film[data-scene="2"] .film-title{font-size:2.8rem}.film-energy{right:38px;top:163px;height:128px;width:40%}.film-detail{top:336px;right:25px}.film-axis{top:314px;right:25px;width:43%}.film[data-scene="1"] .film-detail,.film[data-scene="3"] .film-detail{top:350px}.film-resolution,.film-cta{width:45%;max-width:45%}.film-cells{gap:3px}.film-scan{top:163px;height:128px}}
@media(max-width:767px){
  .film{height:570px;aspect-ratio:auto;border-radius:14px}
  .film-scene{padding:26px 26px 66px}
  .film-time{font-size:.77rem;gap:12px}
  .film-title,.film[data-scene="2"] .film-title{font-size:clamp(2.2rem,8.5vw,3.2rem);line-height:1.07;max-width:13ch;margin-top:20px}
  .film-energy{width:74%;height:106px;right:13%;top:296px}
  .film-energy-shell{inset:-11px -10px;border-width:3px;border-radius:19px}
  .film-energy-shell:after{height:34px;width:7px;right:-11px;top:calc(50% - 17px)}
  .film-cells{gap:3px}.film-cells i{border-radius:2px}
  .film-detail,.film[data-scene="1"] .film-detail,.film[data-scene="3"] .film-detail{right:24px;top:451px;width:calc(100% - 48px);font-size:.74rem}
  .film-axis{top:417px;right:24px;width:calc(100% - 48px);font-size:.63rem}
  .film-scan{top:296px;height:106px;right:calc(87% - var(--beat)*74%)}
  .film-question{font-size:5.3rem}
  .film[data-scene="3"] .film-energy{top:328px;height:80px}
  .film-brand{font-size:.9rem;gap:9px}.film-brand img{width:30px;height:30px}
  .film-result .film-title{font-size:2.6rem;margin-top:16px}
  .film-resolution{width:100%;max-width:30ch;font-size:.95rem;margin-top:14px}
  .film-cta{max-width:100%;font-size:.83rem;margin-top:8px}
  .film .motion-controls{inset:auto 17px 0;gap:15px}
  .film .scene-steps{max-width:160px}.film .motion-toggle{font-size:.7rem}
  html:lang(ja) .film-title,html:lang(ko) .film-title,html:lang(ja) .film[data-scene="2"] .film-title,html:lang(ko) .film[data-scene="2"] .film-title{font-size:clamp(1.85rem,7.2vw,2.7rem);max-width:15ch;line-height:1.2}
}
@media(max-width:374px){.film{height:570px}.film-scene{padding-inline:21px}.film-title,.film[data-scene="2"] .film-title{font-size:2.1rem;max-width:13ch}.film-result .film-title{font-size:2.3rem}.film-energy{width:72%;right:14%}.film .scene-steps{max-width:135px}}
@media(prefers-reduced-motion:reduce){.film,.film *,.film *:before,.film *:after{transition:none!important;animation:none!important}.film-title{transform:none;opacity:1}.film-scan{display:none}}
