.landing-page-container{--landing-bg-primary:var(--color-bg-secondary,#fafafa);--landing-bg-card:var(--color-card-bg,#ffffff);--landing-bg-section:var(--color-bg-tertiary,#f7fafc);--landing-text-primary:var(--color-text-primary,#1a202c);--landing-text-secondary:var(--color-text-secondary,#4a5568);--landing-text-muted:var(--color-text-tertiary,#718096);--landing-border:var(--color-border,#e2e8f0);--landing-border-hover:var(--color-border-hover,#cbd5e0);--landing-header-bg:rgba(250,250,250,0.95);--landing-header-border:var(--landing-border);--landing-note-back-bg:#f7fafc;--landing-note-middle-bg:#edf2f7;--landing-note-main-bg:#ffffff;--landing-note-border:var(--landing-border);--landing-note-middle-border:#cbd5e0;--landing-card-shadow:0 4px 6px rgba(0,0,0,0.05);--landing-card-shadow-hover:0 8px 16px rgba(0,0,0,0.1);--landing-note-shadow:0 8px 16px rgba(0,0,0,0.2);--landing-action-gradient:linear-gradient(135deg,#667eea,#764ba2);--landing-action-text:#ffffff}.landing-header .button-base{padding:.5rem 1.5rem;font-size:.875rem;min-height:2rem;border-radius:8px;font-weight:600}.landing-header .button-base:hover:not(:disabled){transform:translateY(-1px)}.landing-page-container{min-height:var(--viewport-height,100dvh)!important;background:var(--landing-bg-primary)!important;color:var(--landing-text-primary)!important;font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN W3,Meiryo,sans-serif!important;overflow-x:hidden!important;width:100%!important;padding:1rem 1.5rem!important;margin:0!important;position:relative!important}.landing-header,.landing-page-container{box-sizing:border-box!important;display:block!important}.landing-header{position:sticky!important;top:0!important;background:var(--landing-header-bg)!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;border-bottom:1px solid var(--landing-border)!important;z-index:var(--z-menu)!important;width:100vw!important;margin-left:calc(-50vw + 50%)!important;margin-right:calc(-50vw + 50%)!important}.sticky-header{transition:all .3s ease}.header-navigation{max-width:1200px;margin:0 auto;padding:.75rem 2rem}.landing-main-content{max-width:1200px!important;margin:0 auto!important;padding:2rem 1.5rem!important;box-sizing:border-box!important;width:100%!important;display:block!important}.hero-section{text-align:center!important;margin-bottom:3rem!important;padding:2rem 0!important;display:block!important}.hero-grid{display:grid!important;grid-template-columns:1.2fr .8fr!important;gap:3rem!important;align-items:center!important;max-width:1100px!important;margin:0 auto!important}.hero-content{text-align:left!important;padding-right:1rem!important;display:block!important}.hero-buttons,.hero-content-text{transition:all .6s ease}.hero-buttons{display:flex;gap:1rem;margin-top:2rem}.hero-title{margin:0 0 1.5rem;font-size:clamp(1.875rem,4vw,3rem);font-weight:700;line-height:1.2;letter-spacing:-.02em;color:var(--landing-text-primary)}.hero-description{margin:0;max-width:36rem;font-size:1.125rem;line-height:1.8;color:var(--landing-text-secondary)}.landing-section{width:100%;max-width:100vw;overflow-x:hidden;padding:5rem 0;box-sizing:border-box}.landing-section-inner{max-width:1280px;margin:0 auto;padding:0 clamp(1.5rem,4vw,4rem);box-sizing:border-box}.landing-section-title{margin:0;font-size:clamp(1.75rem,3vw,2.25rem);font-weight:600;line-height:1.2;color:var(--landing-text-primary)}.landing-section-description{margin:1rem auto 0;max-width:42rem;font-size:1.125rem;line-height:1.7;color:var(--landing-text-secondary)}.landing-header-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:44px}.landing-header-brand{display:flex;align-items:center;gap:1.5rem}.landing-header-logo{width:auto;height:40px;object-fit:contain}.landing-header-badge{display:none;padding:.25rem .75rem;border:1px solid var(--landing-border);border-radius:9999px;font-size:.75rem;font-weight:600;color:var(--landing-text-secondary)}.landing-header-actions{display:flex;align-items:center;gap:1rem}.landing-nav{display:none;align-items:center;gap:.5rem;margin:0;padding:0;list-style:none}.landing-nav-patterns{display:flex;align-items:center;gap:.25rem}.landing-nav-link{display:inline-flex;align-items:center;padding:.375rem .75rem;border-radius:.375rem;font-size:.875rem;color:var(--landing-text-muted);text-decoration:none;transition:color .2s ease,background-color .2s ease}.landing-nav-link:hover{color:var(--landing-text-primary);background:var(--landing-bg-section)}.landing-nav-link--compact{font-size:.75rem;padding-inline:.5rem}.landing-nav-divider{display:none;width:1px;height:20px;background:var(--landing-border)}.landing-badge{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;border-radius:9999px;font-size:.875rem;font-weight:600;color:var(--landing-text-primary);background:var(--landing-bg-card);border:1px solid var(--landing-border)}.landing-badge--orange{border-color:#f6ad55;color:#c05621;background:#fffaf0}.landing-badge--purple{border-color:#d6bcfa;color:#6b46c1;background:#faf5ff}.landing-badge--outline{padding:.25rem .5rem;font-size:.75rem;font-weight:500}.button-base.is-loading{opacity:.85;cursor:wait}@media (min-width:768px){.landing-header-badge,.landing-nav,.landing-nav-divider{display:flex}.landing-nav-divider{display:inline-block}}.hero-grid .note-animation-container,.hero-grid aside.note-animation-container,.note-animation-container,aside.note-animation-container{position:relative;height:364px;transition:all .6s ease;margin:0 auto;width:364px;max-width:calc(100% - 2rem);max-height:calc(100vh - 4rem);box-sizing:border-box;overflow:hidden}.note-animation-container .chakra-box.note-back-page,.note-animation-container .note-back-page,aside.note-animation-container .chakra-box.note-back-page,aside.note-animation-container .note-back-page{position:absolute;top:26px;left:26px;width:312px;height:312px;background:var(--landing-note-back-bg);border:1px solid var(--landing-note-border);border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,.1);transform:rotate(-5deg);display:block;visibility:visible;opacity:1}.note-animation-container .chakra-box.note-middle-page,.note-animation-container .note-middle-page,aside.note-animation-container .chakra-box.note-middle-page,aside.note-animation-container .note-middle-page{position:absolute;top:13px;left:13px;width:312px;height:312px;background:var(--landing-note-middle-bg);border:1px solid var(--landing-note-middle-border);border-radius:8px;box-shadow:0 6px 12px rgba(0,0,0,.15);transform:rotate(-2deg);display:block;visibility:visible;opacity:1}.note-main-page{position:absolute;top:0;left:0;width:312px;height:312px;background:var(--landing-note-main-bg);border:1px solid var(--landing-note-border);border-radius:8px;box-shadow:var(--landing-note-shadow);display:flex;flex-direction:column;padding:1.5rem;box-sizing:border-box;color:var(--landing-text-primary)}.note-animation-container .chakra-card.note-main-page,.note-animation-container .note-main-page,.note-animation-container div.note-main-page,aside.note-animation-container .chakra-card.note-main-page,aside.note-animation-container .note-main-page,aside.note-animation-container div.note-main-page{width:312px;height:312px;max-width:312px;max-height:312px;min-width:312px;min-height:312px;box-sizing:border-box}.note-animation-container .note-main-page .chakra-card__body{padding:1.5rem;box-sizing:border-box}.note-main-page__body{display:flex;flex-direction:column;gap:.75rem;height:100%}.note-main-page__header{display:flex;align-items:center;gap:.5rem;min-width:0}.note-main-page__icon{flex-shrink:0;font-size:1rem}.note-main-page__title{margin:0;font-size:1rem;font-weight:600;color:var(--landing-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.note-main-page__meta{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.note-date-text{font-size:10px;line-height:1.2;color:var(--landing-text-muted)}.note-main-page__badge{flex-shrink:0;font-size:11px;font-weight:700;padding:.25rem .625rem;border-radius:.375rem;color:#ffffff;background:#10b981;border:1px solid #059669;box-shadow:0 2px 4px rgba(0,0,0,.15)}.note-main-page__divider{border:0;border-top:1px solid var(--landing-border);margin:0}.note-content-text{margin:0;flex:1 1;font-size:.75rem;line-height:1.6;color:var(--landing-text-secondary);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.note-main-page__indicators{display:flex;justify-content:center;gap:.5rem}.note-main-page__dot{width:5px;height:5px;border-radius:9999px;background:var(--landing-border);transition:all .3s ease}.note-main-page__dot--active{background:#2b6cb0}.chakra-ui-dark .note-main-page__dot--active,[data-theme=dark] .note-main-page__dot--active{background:#4299e1}@media (min-width:768px){.note-animation-container .chakra-box.note-back-page,.note-animation-container .chakra-box.note-middle-page,.note-animation-container .note-back-page,.note-animation-container .note-middle-page,aside.note-animation-container .chakra-box.note-back-page,aside.note-animation-container .chakra-box.note-middle-page,aside.note-animation-container .note-back-page,aside.note-animation-container .note-middle-page{display:block;visibility:visible;opacity:1;position:absolute}.note-animation-container,aside.note-animation-container{position:relative;height:364px;width:364px}}@media (max-width:768px){.note-animation-container,aside.note-animation-container{max-width:calc(100% - 2rem)}}@media (max-width:480px){.note-animation-container,aside.note-animation-container{max-width:calc(100% - 1rem)}}.comparison-section{margin:3rem 0;padding:2rem 0;background:var(--landing-bg-section)}.comparison-header{text-align:center;margin-bottom:2rem;transition:all .6s ease}.comparison-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:1100px;margin:0 auto}.comparison-card{background:var(--landing-bg-card);border:1px solid var(--landing-border);color:var(--landing-text-primary);transform:translateY(0);text-align:center;padding:2rem}.comparison-card:hover{transform:translateY(-4px);box-shadow:var(--landing-card-shadow-hover)}.comparison-card__icon{display:inline-flex;align-items:center;justify-content:center;width:4rem;height:4rem;margin:0 auto 1.5rem;border-radius:9999px;font-size:2rem}.comparison-card__icon--cost{background:rgba(16,185,129,.12)}.comparison-card__icon--primary{background:rgba(43,108,176,.12)}.comparison-card__icon--accent{background:rgba(66,153,225,.12)}.comparison-card__title{margin:0 0 .75rem;font-size:1.125rem;font-weight:600;color:var(--landing-text-primary)}.comparison-card__description{margin:0;line-height:1.7;color:var(--landing-text-secondary)}.features-section{margin:3rem 0;padding:2rem 0}.features-header{text-align:center;margin-bottom:2rem}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;max-width:1100px;margin:0 auto}.action-section{margin:3rem 0;padding:2.5rem 0;background:var(--landing-action-gradient);color:var(--landing-action-text);text-align:center}.action-container,.action-section{display:flex;justify-content:center}.action-container{max-width:960px;margin:0 auto;padding:0 2rem;flex-direction:column;align-items:center}.action-header{margin-bottom:1rem}.action-header h2,.action-header__title{margin:0 0 .75rem;font-weight:600;color:var(--landing-action-text);font-size:clamp(1.75rem,3vw,2.25rem);line-height:1.2}.action-header p,.action-header__description{margin:0;font-size:1rem;line-height:1.5;opacity:.95;color:rgba(255,255,255,.9);max-width:42rem}.action-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:1.5rem}.developer-section{margin:3rem 0;padding:2rem 0}.developer-header{text-align:center;margin-bottom:2rem}.developer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:1100px;margin:0 auto}.developer-card{background:var(--landing-bg-card);border:1px solid var(--landing-border);border-radius:12px;padding:2rem;box-shadow:var(--landing-card-shadow);transition:all .3s ease;color:var(--landing-text-primary)}.developer-card:hover{transform:translateY(-4px);box-shadow:var(--landing-card-shadow-hover)}.developer-card--highlight{max-width:56rem;margin:0 auto;width:100%;border:2px solid #d6bcfa}.developer-card__grid{display:grid;grid-template-columns:1fr;gap:2rem;align-items:center}.developer-card__subtitle{margin:0 0 1.5rem;font-size:1.25rem;font-weight:600;color:#805ad5}.developer-card__list{margin:0;padding:0;list-style:none;display:grid;gap:1rem}.developer-card__list li{display:flex;gap:.75rem;align-items:flex-start;line-height:1.7;color:var(--landing-text-secondary)}.developer-card__check{color:#38a169;font-weight:700}.developer-emphasis--purple{color:#805ad5}.developer-card__code{margin:0;padding:1.5rem;border-radius:.75rem;background:#1a202c;color:#68d391;overflow-x:auto;font-size:.875rem;line-height:1.5}.developer-card__footer{margin-top:2rem;display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center}.developer-card__cta-text{margin:0;font-size:1.125rem;font-weight:600;color:var(--landing-text-primary)}.dev-feature{text-align:center}.dev-feature__emoji{display:block;font-size:3rem;margin-bottom:.75rem}.dev-feature__title{margin:0 0 .5rem;font-size:1rem;font-weight:600;color:var(--landing-text-primary)}.dev-feature__description{margin:0;font-size:.875rem;color:var(--landing-text-muted)}.landing-feature-card{height:100%;display:flex;flex-direction:column;gap:1rem;border-color:var(--landing-border);background:var(--landing-bg-card)}.landing-feature-card:hover{border-color:var(--feature-accent,var(--landing-border))}.landing-feature-card__icon{display:inline-flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:.75rem;font-size:1.5rem;background:color-mix(in srgb,var(--feature-accent,#3182ce) 12%,transparent)}.landing-feature-card__title{margin:0;font-size:1.125rem;font-weight:600;color:var(--landing-text-primary)}.landing-feature-card__description{margin:0;font-size:.875rem;line-height:1.7;color:var(--landing-text-secondary)}.landing-feature-card__tags{display:flex;flex-wrap:wrap;gap:.5rem;margin:0;padding:0;list-style:none}@media (min-width:768px){.developer-card__grid{grid-template-columns:1fr 1fr;gap:3rem}}.chakra-ui-dark .landing-badge--orange,[data-theme=dark] .landing-badge--orange{color:#fbd38d;background:rgba(237,137,54,.15);border-color:#ed8936}.chakra-ui-dark .landing-badge--purple,[data-theme=dark] .landing-badge--purple{color:#d6bcfa;background:rgba(128,90,213,.15);border-color:#9f7aea}.card-hover{transition:all .3s ease}.card-hover:hover{transform:translateY(-2px);box-shadow:var(--landing-card-shadow-hover)}.animate-fade-in-up{animation:fadeInUp .6s ease forwards}.animate-slide-in-left{animation:slideInLeft .6s ease forwards}.animate-scale-in{animation:scaleIn .6s ease forwards}.animate-note-float{animation:noteFloat 3s ease-in-out infinite}@keyframes slideInLeft{0%{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes noteFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@media (max-width:768px){.landing-page-container{padding:.5rem 1rem!important}.landing-main-content{padding:1rem .5rem!important}.header-navigation{padding:.5rem 1rem}.hero-grid{grid-template-columns:1fr!important;gap:2rem!important;text-align:center}.hero-content{padding-right:0!important;text-align:center!important}.hero-buttons{justify-content:center;flex-direction:column;align-items:center}.comparison-grid,.developer-grid,.features-grid{grid-template-columns:1fr;gap:1.5rem}.cta-buttons{flex-direction:column;align-items:center}}@media (max-width:480px){.landing-page-container{padding:.25rem .5rem!important}.landing-main-content{padding:.5rem .25rem!important}.header-navigation{padding:.25rem .5rem}.cta-section{padding:1.5rem 0}.cta-header h2{font-size:1.25rem}.cta-header p{font-size:.85rem}}.opacity-0{opacity:0}.translate-x-\[-50px\]{transform:translateX(-50px)}.scale-75{transform:scale(.75)}.chakra-ui-dark .landing-page-container,[data-theme=dark] .landing-page-container{--landing-bg-primary:#0a0a0a;--landing-bg-card:#1a1a1a;--landing-bg-section:#1a1a1a;--landing-text-primary:#f7fafc;--landing-text-secondary:#e2e8f0;--landing-text-muted:#a0aec0;--landing-border:#2d3748;--landing-border-hover:#4a5568;--landing-header-bg:rgba(10,10,10,0.95);--landing-note-back-bg:#1a1a1a;--landing-note-middle-bg:#2d3748;--landing-note-main-bg:#1a1a1a;--landing-note-border:#2d3748;--landing-note-middle-border:#4a5568;--landing-card-shadow:0 4px 6px rgba(0,0,0,0.3);--landing-card-shadow-hover:0 8px 16px rgba(0,0,0,0.4);--landing-note-shadow:0 8px 16px rgba(0,0,0,0.4)}@media (prefers-color-scheme:dark){.landing-page-container:not([data-theme=light]){--landing-bg-primary:#0a0a0a;--landing-bg-card:#1a1a1a;--landing-bg-section:#1a1a1a;--landing-text-primary:#f7fafc;--landing-text-secondary:#e2e8f0;--landing-text-muted:#a0aec0;--landing-border:#2d3748;--landing-border-hover:#4a5568;--landing-header-bg:rgba(10,10,10,0.95);--landing-note-back-bg:#1a1a1a;--landing-note-middle-bg:#2d3748;--landing-note-main-bg:#1a1a1a;--landing-note-border:#2d3748;--landing-note-middle-border:#4a5568;--landing-card-shadow:0 4px 6px rgba(0,0,0,0.3);--landing-card-shadow-hover:0 8px 16px rgba(0,0,0,0.4);--landing-note-shadow:0 8px 16px rgba(0,0,0,0.4)}}.landing-cookie-warning,.landing-offline-status{position:fixed;right:1rem;bottom:1rem;z-index:1200;max-width:min(24rem,calc(100vw - 2rem));padding:.75rem 1rem;border:1px solid rgb(180 83 9/35%);border-radius:.75rem;color:#78350f;background:#fffbeb;box-shadow:0 8px 24px rgb(15 23 42/12%);font-size:.875rem}.landing-cookie-warning{color:#7f1d1d;border-color:rgb(185 28 28/35%);background:#fef2f2}