*,:after,:before{box-sizing:border-box}body,html{-webkit-font-smoothing:antialiased;background:radial-gradient(circle at top,#0f172a 0,#020617 60%);color:#e5e7eb;font-family:Noto Sans JP,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;margin:0;padding:0}.container{margin:0 auto;max-width:1080px;padding:0 1.5rem;width:100%}.site-header{backdrop-filter:blur(10px);background:linear-gradient(180deg,rgba(15,23,42,.9),rgba(15,23,42,.7),transparent);border-bottom:1px solid rgba(148,163,184,.2);position:sticky;top:0;z-index:10}.header-inner{align-items:center;display:flex;height:64px;justify-content:space-between}.logo{font-size:.95rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.nav{display:flex;font-size:.9rem;gap:1.5rem}.nav a{color:#bfc5cf;padding-bottom:.2rem;position:relative;text-decoration:none;transition:color .25s ease}.nav a:after{background:linear-gradient(90deg,#38bdf8,#a855f7);border-radius:999px;bottom:0;content:"";height:2px;left:0;position:absolute;transition:width .25s ease;width:0}.nav a:hover{color:#e5e7eb}.nav a:hover:after{width:100%}.hero{padding:1rem 0}.hero-header{margin:0 0 1rem}.hero-header,.hero-label{border-bottom:1px solid #1f2937}.hero-label{color:#e5e7eb;letter-spacing:.1rem;margin-bottom:.7rem;padding:0 .25rem;text-transform:uppercase}.hero-section{margin:1rem 0 1.5rem;padding:0 .5rem}.hero-inner.hero-grid{align-items:start;display:grid;gap:0 1rem;grid-template-columns:repeat(2,minmax(0,1fr))}@media (max-width:768px){.hero-inner.hero-grid{grid-template-columns:1fr}}.hero-inner.hero-flex{align-items:center;display:flex;gap:1rem}.hero-inner.hero-flex .flex-grow{flex-grow:1}.hero-inner.hero-flex.flex-start{align-items:start}@media (max-width:768px){.hero-inner.hero-flex{align-items:center;flex-direction:column}}.hero-inner .hero-text{color:#bfc5cf}.hero-inner .hero-text p{font-size:.95rem;margin:0 0 1.5rem}.hero-inner .hero-text dt{font-size:.9rem;font-weight:600}.hero-inner .hero-text dd{margin-bottom:.25rem}.hero-inner .hero-visual{width:100%}.hero-inner .hero-image{border:5px solid #e5e7eb;border-radius:5px;position:relative}.hero-inner .hero-image.rounded{border-radius:100%!important}.hero-inner .hero-box{display:block}.hero-inner .hero-dummy{display:block;height:0;width:100%}.btn-primary{align-items:center;background:#38bdf8;border-radius:10px;color:#f9fafb;display:inline-flex;font-size:.9rem;font-weight:600;justify-content:center;padding:.25rem .75rem;text-decoration:none;transition:transform .18s ease}.btn-primary:hover{transform:translate(1px,-1px) scale(1.05)}.btn-primary.btn-twitter:before{content:"\f099";font-family:Font Awesome\ 6 Brands;font-weight:400;margin-right:.25rem}.btn-primary.btn-github{background:#fff;color:#000}.btn-primary.btn-github:before{content:"\f09b";font-family:Font Awesome\ 6 Brands;font-weight:400;margin-right:.25rem}.btn-primary.btn-email{background:#fff;color:#000}.btn-primary.btn-email:before{content:"\f0e0";font-family:Font Awesome\ 6 Free;font-weight:400;margin-right:.25rem}.btn-primary.btn-amazon{background:#ff6200;color:#fff}.btn-primary.btn-amazon:before{content:"\f270";font-family:Font Awesome\ 6 Brands;font-weight:400;margin-right:.25rem}.glass-card{background:linear-gradient(135deg,rgba(15,23,42,.902),rgba(15,23,42,.6));border:1px solid rgba(148,163,184,.4);border-radius:10px;box-shadow:0 5px 20px rgba(15,23,42,.702);margin-bottom:1rem;overflow:hidden;padding:1rem;position:relative;width:100%}.glass-card:before{background:radial-gradient(circle at top,rgba(56,189,248,.2),transparent 55%);content:"";inset:-40%;opacity:.6;pointer-events:none;position:absolute}.glass-card .glass-title{color:#bfc5cf;font-size:.7rem;letter-spacing:.18em;margin:0 0 .5rem;position:relative;text-transform:uppercase;z-index:1}.glass-card .glass-main{font-size:.9rem;margin:.5rem 0;position:relative;z-index:1}.glass-card .glass-label{font-size:1.1rem;font-weight:600;margin:0 0 .5rem;position:relative;z-index:1}.glass-card .glass-link{color:#1e89bb}.glass-card hr{background-color:rgba(148,163,184,.4);border:none;height:1px}.content{background:radial-gradient(circle at top left,#0f172a 0,#020617 65%);border:1px solid rgba(148,163,184,.3);border-radius:10px;box-shadow:0 5px 20px rgba(15,23,42,.702);margin-bottom:3rem;margin-top:1.5rem}.content h1,.content h2,.content h3,.content h4{font-weight:600;margin-bottom:.75rem;margin-top:1.75rem}.content h1{border-bottom:1px solid #1f2937;font-size:1.7rem;padding-bottom:.4rem}.content h2{font-size:1.4rem}.content h3{font-size:1.15rem}.content p{color:#bfc5cf;font-size:.95rem;line-height:1.7;margin:.5rem 0 .75rem}.content a{border-bottom:1px dashed rgba(56,189,248,.6);color:#38bdf8;text-decoration:none}.content a:hover{border-bottom-style:solid}.content ol,.content ul{margin:.3rem 0 .9rem;padding-left:1.4rem}.content li{margin-bottom:.25rem}.content pre{background:#020617;border:1px solid rgba(15,23,42,.9);border-radius:5px;box-shadow:0 16px 30px rgba(15,23,42,.6);overflow-x:auto;padding:.9rem 1rem}.content code{color:#e5e7eb;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.85rem}.content hr{border:none;border-bottom:1px dashed rgba(148,163,184,.5);margin:1.8rem 0 1.2rem}.content blockquote{background:rgba(15,23,42,.8);border-left:3px solid rgba(56,189,248,.8);border-radius:0 5px 5px 0;color:#bfc5cf;margin:.8rem 0 1rem;padding:.7rem 1rem}.site-footer{background:radial-gradient(circle at bottom,#020617,#020617 60%,#0b1120 100%);border-top:1px solid #0f172a;color:#bfc5cf;font-size:.8rem;padding:1.5rem 0 2rem;text-align:center}@media (max-width:640px){.header-inner{flex-direction:row;gap:.75rem}.nav{font-size:.8rem;gap:.8rem}}
