@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;600;700;800&display=swap');
.brand-tag{font-size:.8em;font-weight:600;color:#73886d}
:root{font-family:'DM Sans','Noto Sans JP',sans-serif;color:#2b3129;background:#f5f3ea;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 max(6vw,28px);border-bottom:1px solid #dcded2}.brand{font-weight:800;letter-spacing:-.03em;font-size:18px}.brand-mark{color:#859879;font-size:27px;margin-right:6px}.topbar nav{display:flex;gap:32px;font-size:13px;font-weight:600}.topbar nav a:hover{color:#64785f}.hero{min-height:675px;display:grid;grid-template-columns:1fr 1.08fr;align-items:center;gap:5vw;padding:68px max(6vw,28px) 86px;max-width:1536px;margin:auto}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:700;color:#798d70}.hero h1{font-size:clamp(48px,5.3vw,88px);letter-spacing:-.07em;line-height:1.18;margin:24px 0}.hero h1 em{font-style:normal;color:#78946f}.hero-copy>p{font-size:17px;line-height:2;max-width:530px;color:#5c6558}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}.button{border-radius:999px;padding:16px 24px;font-size:13px;font-weight:700;display:inline-flex;justify-content:center;gap:20px;align-items:center;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.primary{background:#344a39;color:white}.secondary{background:white;border:1px solid #d8ded1}.hero-copy .release-note{font-size:12px;color:#7b8378;margin-top:18px}.desktop{height:min(42vw,530px);min-height:370px;border-radius:25px;background:linear-gradient(155deg,#8da889 0%,#bac8a6 46%,#e4ddbc 100%);position:relative;overflow:hidden;box-shadow:0 30px 60px #53674c2b,inset 0 0 0 1px #ffffff80}.desktop:before{content:'';position:absolute;inset:25% -8% -40%;border-radius:50% 50% 0 0;background:linear-gradient(20deg,#799574,#c5cda1);transform:rotate(-9deg)}.desktop-bar{height:34px;background:#ffffff9c;display:flex;align-items:center;justify-content:space-between;padding:0 18px;color:#607065;font-size:11px;letter-spacing:.12em}.desktop-window{position:absolute;left:9%;top:20%;width:54%;height:54%;border-radius:15px;background:#ffffffc9;box-shadow:0 12px 36px #4e5e4924;overflow:hidden;backdrop-filter:blur(12px)}.window-dots{padding:13px 17px;color:#9fb39a;font-size:10px;letter-spacing:4px;border-bottom:1px solid #dce4d8}.window-lines{padding:23px}.window-lines i{display:block;height:10px;background:#d8e1d3;margin-bottom:17px;border-radius:8px}.window-lines i:nth-child(2){width:75%}.window-lines i:nth-child(3){width:85%}.window-lines i:nth-child(4){width:55%}.hero-degu{position:absolute;width:67%;max-width:none;right:2%;bottom:0;filter:drop-shadow(0 25px 12px #3d4c3445)}.desktop-label{position:absolute;left:5%;bottom:6%;padding:9px 15px;border-radius:99px;background:#26362dbb;color:white;font-size:11px;backdrop-filter:blur(6px)}.features,.colors{padding:105px max(6vw,28px)}.features{background:#e8ecdf}.section-heading{max-width:1200px;margin:0 auto 38px}.section-heading h2,.download h2{font-size:clamp(31px,3vw,48px);letter-spacing:-.055em;line-height:1.4;margin:15px 0}.section-heading p{color:#6b7467;line-height:1.8}.feature-grid{max-width:1200px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-grid article{background:#f8f9f3;border-radius:22px;padding:35px;min-height:235px}.feature-icon{font-size:12px;color:#879d7b;font-weight:700}.feature-grid h3{font-size:20px;margin:22px 0 13px}.feature-grid p{color:#687265;font-size:14px;line-height:1.9;margin:0}.color-grid{max-width:1200px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.color-grid figure{background:#e6eadc;margin:0;border:1px solid #dce3d4;border-radius:20px;overflow:hidden}.color-grid figure:nth-child(4n+2){background:#eceddc}.color-grid figure:nth-child(4n+3){background:#e5e5dd}.color-grid figure:nth-child(4n+4){background:#e9e1d7}.color-grid img{width:100%;height:175px;object-fit:contain;object-position:bottom center;padding:9px 15px 0;filter:drop-shadow(0 8px 5px #3947351a)}.color-grid figcaption{padding:14px 18px 16px;font-weight:700;font-size:12px;display:flex;justify-content:space-between}.color-grid figcaption span{font-size:10px;color:#698461}.download{max-width:1200px;margin:10px auto 110px;padding:45px 50px;background:#344a39;color:#fff;border-radius:28px;display:flex;align-items:center;justify-content:space-between;gap:30px}.download .eyebrow{color:#bbd2af}.download p{color:#d8e4d2;font-size:14px}.download .button{background:#f7f6ea;color:#344a39;flex-shrink:0}footer{border-top:1px solid #dcded2;display:flex;justify-content:space-between;gap:20px;padding:30px max(6vw,28px);font-size:12px;color:#697469}footer span:first-child{font-weight:800;color:#344a39}@media(max-width:900px){.hero{grid-template-columns:1fr}.desktop{height:500px}.feature-grid{grid-template-columns:1fr}.color-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.topbar{height:65px}.topbar nav{gap:12px;font-size:11px}.topbar nav a:nth-child(1){display:none}.hero{padding-top:55px}.hero h1{font-size:53px}.hero-copy>p{font-size:15px}.desktop{height:330px;min-height:330px}.hero-degu{width:83%;right:-10%}.desktop-label{font-size:9px}.features,.colors{padding:72px 22px}.color-grid{grid-template-columns:repeat(2,1fr);gap:10px}.color-grid img{height:135px}.color-grid figcaption{padding:11px;font-size:11px}.download{margin:0 22px 80px;padding:34px 25px;display:block}.download .button{margin-top:16px}footer{display:block;line-height:2}}
@media(max-width:600px){.topbar{padding:0 22px;gap:8px}.brand{font-size:14px;white-space:nowrap}.brand-mark{font-size:19px;margin-right:2px}.brand-tag{display:none}.topbar nav{flex-shrink:0}.topbar nav a:not(:last-child){display:none}.hero{grid-template-columns:minmax(0,1fr);padding-left:22px;padding-right:22px}.hero>*{min-width:0}.hero h1{font-size:clamp(35px,9vw,48px);overflow-wrap:anywhere}.desktop{min-width:0}.actions .button{max-width:100%}}
.hero-degu-fallback{transition:opacity .2s}.hero-degu-video{display:none;position:absolute;left:0;bottom:0;width:100%;height:auto;pointer-events:none;filter:drop-shadow(0 15px 10px #3d4c3440)}.demo-ready .hero-degu-video{display:block}.demo-playing .hero-degu-fallback{opacity:0}.demo-controls[hidden]{display:none}.demo-controls{position:absolute;z-index:5;top:49px;right:16px;display:flex;gap:5px;padding:5px;border-radius:999px;background:#f8faf0df;backdrop-filter:blur(9px);box-shadow:0 2px 12px #3b4c3420}.demo-controls button{border:0;background:transparent;color:#3d5541;border-radius:999px;padding:7px 10px;font:700 11px 'Noto Sans JP',sans-serif;cursor:pointer;white-space:nowrap}.demo-controls button[aria-pressed="true"]{background:#344a39;color:white}.demo-controls button:focus-visible{outline:3px solid #315c9e;outline-offset:2px}.desktop-label{z-index:6}@media(max-width:600px){.demo-controls{top:45px;right:10px;gap:1px;padding:4px}.demo-controls button{font-size:10px;padding:6px 8px}}
.demo-controls button{min-height:36px}@media(max-width:600px){.demo-controls button{min-height:44px}footer span{display:block}}
.hero-degu-animation{display:none;position:absolute;left:0;bottom:0;width:100%;height:auto;pointer-events:none;filter:drop-shadow(0 15px 10px #3d4c3440)}
.demo-stage{position:relative;min-width:0}
.topbar nav{align-items:center}
.language-link{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:36px;padding:0 10px;border:1px solid #d8ded1;border-radius:999px}
.demo-webp .hero-degu-animation{display:block}
.demo-webp .hero-degu-video{display:none}
@media(max-width:600px){
  .hero{padding-top:32px;padding-bottom:55px;gap:20px}
  .hero h1{margin:16px 0}
  .hero-copy>p{line-height:1.8}
  .actions{margin-top:22px}
  .hero-copy .release-note{margin-top:13px}
  .desktop{height:250px;min-height:250px}
  .hero-degu{width:58%;right:6%}
  .desktop-label{display:none}
  .demo-controls{position:static;width:max-content;max-width:100%;margin:10px auto 0}
  .topbar nav a[href^="download"]{display:inline-flex;align-items:center;min-height:44px}
  .language-link{min-height:44px}
}
@media(max-width:360px){.desktop{height:238px;min-height:238px}}