@font-face{font-family:Line;src:url('/fonts/line-seed-jp/LINESeedJP-Regular.woff')}@font-face{font-family:Line;src:url('/fonts/line-seed-jp/LINESeedJP-Bold.woff');font-weight:700}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:20px}body{margin:0;background:#fff;color:#111;font-family:Arial,Line,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit;text-underline-offset:5px}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #2454ff;outline-offset:5px}.rail{width:60px;position:fixed;inset:0 auto 0 0;z-index:30;border-right:1px solid #a5b7c080;display:flex;align-items:center;flex-direction:column;background:#fff}.rail-title{writing-mode:vertical-rl;transform:rotate(180deg);font-size:14px;text-decoration:none;margin-top:22px}.rail button{position:absolute;top:46%;width:60px;height:60px;border:0;background:#00c8ce;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer}.rail button span{width:24px;height:2px;background:#111}.rail-end{position:absolute;bottom:28px;writing-mode:vertical-rl;text-decoration:none;font-size:11px;letter-spacing:.1em}main{margin-left:60px}#navigation{position:fixed;inset:0 0 0 60px;background:#00c8ce;z-index:25;padding:60px 8vw}#navigation img{width:210px}#navigation>div{display:grid;margin:45px 0;gap:10px}#navigation a{font-size:clamp(30px,5vw,64px);font-weight:700;letter-spacing:-.05em;text-decoration:none}#navigation p{font-size:12px;line-height:1.8}.hero{height:100svh;min-height:630px;position:relative;overflow:hidden;background:#111;color:white}.hero-grid{position:absolute;inset:0;background:linear-gradient(90deg,transparent calc(12.5% - 1px),#62798755 12.5%,transparent calc(12.5% + 1px),transparent calc(87.5% - 1px),#62798755 87.5%,transparent calc(87.5% + 1px)),linear-gradient(transparent 20%,#62798755 calc(20% + 1px),transparent calc(20% + 2px),transparent 56%,#62798755 calc(56% + 1px),transparent calc(56% + 2px),transparent 88%,#62798755 calc(88% + 1px),transparent calc(88% + 2px))}.hero h1{position:absolute;top:38%;left:12.5%;margin:0;font-size:clamp(110px,13.5vw,220px);line-height:1;letter-spacing:-.065em;font-weight:500}.hero-logo{position:absolute;top:28px;left:4%;background:white;width:145px;padding:10px;height:auto}.motif{position:absolute;display:grid;place-items:center;width:12.5%;aspect-ratio:1}.motif i{display:block;width:66%;height:66%;border-radius:50%}.m1{top:0;left:25%;background:#f9e600}.m1 i{background:#007a82}.m2{top:-8%;right:12.5%;background:#ff48a5}.m2 i{background:#2454ff}.m3{bottom:-5%;left:12.5%;background:#ff5c28}.m3 i{background:#f9e600}.m4{bottom:0;right:0;background:#007a82}.m4 i{background:#00c8ce}.chip-run{display:flex;position:absolute;left:54%;top:56%;width:34%;height:12%}.chip-run span{flex:1;background:var(--bg);display:grid;place-items:center}.chip-run span:after{content:'';width:60%;aspect-ratio:1;background:var(--fg);border-radius:50%}.hero-meta{position:absolute;left:4%;right:4%;bottom:30px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em}.statement{min-height:95svh;background:#007a82;color:#d4ffff;padding:10vw 12.5% 45px;display:flex;flex-direction:column;justify-content:center}.statement>p{font-size:clamp(35px,5.2vw,82px);font-weight:700;letter-spacing:-.055em;line-height:1.5;margin:0}.inline-chip{display:inline-block;width:.8em;height:.8em;margin:0 .16em;vertical-align:baseline;position:relative}.inline-chip:after{content:'';position:absolute;inset:20%;border-radius:50%}.inline-chip.one{background:#f9e600}.inline-chip.one:after{background:#ff5c28}.inline-chip.two{background:#ff48a5}.inline-chip.two:after{background:#111}.statement-foot{display:flex;justify-content:space-between;font-size:12px;margin-top:65px;line-height:1.8}.ruled{background-image:linear-gradient(90deg,transparent calc(5% - 1px),#c6d3dc 5%,transparent calc(5% + 1px),transparent calc(95% - 1px),#c6d3dc 95%,transparent calc(95% + 1px))}.palette{padding:110px 5% 80px}.section-head{display:grid;grid-template-columns:2fr 1fr;border-top:1px solid #c6d3dc;border-bottom:1px solid #c6d3dc;gap:30px;padding:0;margin-bottom:65px}.section-head h2{font-size:clamp(30px,3.5vw,54px);line-height:1.07;letter-spacing:-.055em;margin:0;padding:25px 0;font-weight:600}.section-head>p{border-left:1px solid #c6d3dc;margin:0;padding:27px 20px;font-size:13px;line-height:1.8;color:#555}.palette-group{margin-bottom:65px}.palette h3{font-size:15px;font-weight:400;color:#666;margin:0 0 25px}.palette h3 small{font-size:11px;margin-left:15px}.fan{display:flex;align-items:stretch;height:220px;isolation:isolate}.color-card{position:relative;flex:1;min-width:0;padding:22px;border:0;border-radius:22px 22px 0 0;transition:flex .4s ease,transform .4s ease;background:var(--color);color:var(--text);text-align:left;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;box-shadow:-1px 0 0 #1111}.color-card+.color-card{margin-left:-24px}.color-card:last-child{flex:2.2}.color-card:hover,.color-card:focus-visible,.color-card.selected{flex:3.8;z-index:2}.color-card b{font-size:22px;letter-spacing:-.03em;white-space:nowrap}.color-card span{font:12px monospace;white-space:nowrap}.fan:has(.color-card:hover) .color-card:last-child:not(:hover),.fan:has(.selected) .color-card:last-child:not(.selected){flex:1}.grey{height:110px}.grey .color-card{padding:18px}.grey b{font-size:13px}.grey .color-card+.color-card{margin-left:-18px}.grey .color-card span{font-size:10px}.palette-help,.image-note{font-size:11px;line-height:1.8;color:#666;margin:30px 0 0}.imagery{padding:80px 5% 110px}.photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.photo-grid figure{margin:0;border:1px solid #c6d3dc;border-left:0;padding:32px 26px}.photo-grid figure:first-child{border-left:1px solid #c6d3dc}.photo-panel{background:var(--panel);padding:50px 24px;aspect-ratio:.84;display:flex;align-items:center}.photo-panel img{width:100%;aspect-ratio:.72;object-fit:cover;display:block}.photo-grid figcaption{display:flex;justify-content:space-between;font-size:11px;padding-top:20px;gap:5px}.photo-grid figcaption span:last-child{font-family:monospace}.usage{background:#111;color:#fff;padding:75px 8% 65px;--active:#00c8ce}.usage>header{display:flex;justify-content:space-between;gap:40px;align-items:flex-end;margin-bottom:65px}.usage h2{font-size:clamp(40px,5.5vw,84px);line-height:1.04;font-weight:500;letter-spacing:-.055em;margin:0}.usage>header p{font-size:13px;line-height:1.8}.application-stage{display:grid;grid-template-columns:1fr 1fr;gap:25px}.poster{min-height:500px;background:var(--active);color:#111;padding:36px;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start}.poster>img{width:150px;height:auto;z-index:1}.poster h3{font-size:clamp(45px,5.5vw,82px);line-height:.98;letter-spacing:-.05em;margin:70px 0 45px;z-index:1}.poster>p{font-size:13px;margin-top:auto;z-index:1}.poster-shape{position:absolute;right:-100px;bottom:-140px;border:80px solid #111;width:370px;height:370px;border-radius:50%;opacity:.1}.app-right{display:grid;grid-template-rows:1fr 1fr;gap:25px}.web-card{background:white;color:#111;padding:26px;border-top:16px solid var(--active)}.web-bar{display:flex;align-items:center;justify-content:space-between;gap:12px}.web-bar img{width:100px}.web-bar span{font-size:8px}.web-card h3{font-size:clamp(25px,2.8vw,43px);line-height:1.25;letter-spacing:-.05em;margin:34px 0}.sample-cta{font-size:11px;display:inline-block;background:var(--active);padding:12px 15px}.deck-card{background:var(--active);color:#111;padding:30px;display:flex;flex-direction:column;justify-content:space-between}.deck-card span{font-size:9px;letter-spacing:.08em}.deck-card h3{font-size:clamp(24px,2.8vw,42px);line-height:1.4;letter-spacing:-.04em;margin:25px 0}.theme-controls{display:flex;justify-content:center;gap:18px;margin:40px 0 22px;flex-wrap:wrap}.theme-controls button{border:1px solid transparent;color:#fff;background:transparent;padding:8px 12px;border-radius:30px;display:flex;gap:8px;align-items:center;cursor:pointer;font-size:12px}.theme-controls button:before{content:'';width:18px;height:18px;border-radius:50%;background:var(--color)}.theme-controls button.active{border-color:#fff}.usage-note{text-align:center;font-size:11px;line-height:1.8;color:#b9b9b9}.practical{padding:100px 5%}.contrast-grid{display:grid;grid-template-columns:repeat(3,1fr)}.contrast-grid article{padding:28px;min-height:230px;display:flex;flex-direction:column;justify-content:space-between}.contrast-grid strong{font-size:75px;letter-spacing:-.05em}.contrast-grid span{font-size:12px;line-height:1.8}details{border-bottom:1px solid #c6d3dc;padding:25px 0;font-size:13px}summary{cursor:pointer}details p{max-width:850px;line-height:2;color:#555}footer{padding:50px 5%;border-top:1px solid #c6d3dc;display:flex;gap:25px;justify-content:space-between;align-items:flex-start;font-size:10px;line-height:1.8}footer img{width:130px}footer p{margin:0}#status{position:fixed;bottom:20px;right:20px;background:#111;color:#fff;padding:12px 18px;z-index:50;font-size:13px}#status:empty{display:none}[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.color-card{transition:none}}@media(max-width:850px){.statement{padding-left:8%;padding-right:8%}.statement-foot{display:block}.statement-foot span{display:block;margin-top:10px}.photo-grid figure{padding:20px 12px}.photo-panel{padding:30px 12px}.color-card{padding:18px 12px}.color-card b{font-size:17px}.usage{padding-left:5%;padding-right:5%}.poster{padding:25px}.section-head{grid-template-columns:1.4fr 1fr}.grey .color-card{padding:14px 7px}.grey .color-card span{font-size:9px}}@media(max-width:600px){.rail{width:42px}.rail button{width:42px;height:48px}.rail button span{width:20px}main{margin-left:42px}#navigation{left:42px;padding:45px 24px}.hero{min-height:580px;height:85svh}.hero h1{left:8%;top:40%;font-size:110px}.hero-logo{width:125px;left:8%}.hero-meta span{display:none}.motif{width:22%}.m1{left:32%;top:16%}.m2{top:0;right:0}.chip-run{left:30%;width:62%;height:10%;top:60%}.m3{left:8%;bottom:4%}.statement{min-height:650px;padding:80px 7% 45px}.statement>p{font-size:clamp(26px,6.7vw,40px);line-height:1.7}.statement-foot{font-size:10px}.palette,.imagery,.practical{padding:65px 7%}.section-head{grid-template-columns:1fr;gap:0;margin-bottom:40px}.section-head h2{font-size:34px}.section-head>p{border-left:0;border-top:1px solid #c6d3dc;padding:20px 0;font-size:12px}.fan{height:200px}.color-card{padding:20px 12px}.color-card b{font-size:18px}.accent .color-card b,.accent .color-card span{opacity:0;transition:opacity .15s}.accent .color-card:hover b,.accent .color-card:focus-visible b,.accent .color-card.selected b,.accent .color-card:hover span,.accent .color-card:focus-visible span,.accent .color-card.selected span{opacity:1}.color-card+.color-card{margin-left:-16px}.accent .color-card:last-child{flex:1}.accent .color-card:hover,.accent .color-card:focus-visible,.accent .color-card.selected{flex:8}.grey{height:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.grey .color-card{min-height:100px;border-radius:10px 10px 0 0;margin:0!important;padding:12px 8px}.grey .color-card b{font-size:12px}.grey .color-card span{font-size:9px}.photo-grid{grid-template-columns:1fr}.photo-grid figure{padding:28px;border-left:1px solid #c6d3dc;border-top:0}.photo-grid figure:first-child{border-top:1px solid #c6d3dc}.photo-panel{padding:40px;aspect-ratio:1}.photo-panel img{aspect-ratio:.85}.usage{padding:55px 7%}.usage>header{display:block;margin-bottom:35px}.usage h2{font-size:42px}.application-stage{grid-template-columns:1fr}.poster{min-height:450px}.poster h3{font-size:68px}.app-right{gap:20px}.web-card h3,.deck-card h3{font-size:32px}.theme-controls{gap:4px}.theme-controls button{padding:8px;font-size:10px}.contrast-grid{grid-template-columns:1fr}.contrast-grid article{min-height:200px}footer{padding:35px 7%;flex-wrap:wrap;gap:28px}footer p{width:100%}}

.rail-end{writing-mode:horizontal-tb;width:90px;height:24px;bottom:54px;left:50%;transform:translateX(-50%) rotate(-90deg);display:flex;align-items:center;justify-content:center}.rail-end img{display:block;width:90px;height:auto;max-width:none}

main{margin-left:0}
