html,body{height:100%}html{font-size:clamp(16px,1.6vw,19px)}:root{--header-offset: clamp(6rem, 14vh, 8rem)}body{font-family:Hiragino Kaku Gothic ProN,sans-serif;background:radial-gradient(circle at 50% -20%,#ffd09440,#fff7ece6 55%,#fff5ea 85%);margin:0;line-height:1.7;cursor:url(/play_32.png),auto;min-height:100vh;display:flex;flex-direction:column;position:relative;overflow-x:hidden}.no-scroll{overflow:hidden;height:100vh}body>*{position:relative;z-index:1}body:before,body:after{content:"";position:fixed;top:0;left:0;width:clamp(150px,20vw,240px);height:clamp(120px,16vw,200px);background-repeat:no-repeat;background-size:contain;background-position:center;opacity:0;pointer-events:none;z-index:0}body:before{top:18vh;left:-22vw;background-image:url(/1.png);animation:cat-drift-left 46s linear infinite}body:after{top:60vh;left:-24vw;background-image:url(/2.png);width:clamp(170px,22vw,260px);height:clamp(140px,18vw,220px);animation:cat-drift-left 54s ease-in-out infinite;animation-delay:12s}main:after{content:"";position:fixed;bottom:18vh;right:-24vw;width:clamp(140px,19vw,230px);height:clamp(120px,17vw,205px);background-image:url(/3.png);background-repeat:no-repeat;background-size:contain;background-position:center;opacity:0;pointer-events:none;z-index:0;animation:cat-drift-right 58s ease-in-out infinite;animation-delay:24s}@keyframes cat-drift-left{0%{transform:translate(0);opacity:0}10%{opacity:1}70%{opacity:1}to{transform:translate(140vw);opacity:0}}@keyframes cat-drift-right{0%{transform:translate(0);opacity:0}12%{opacity:1}72%{opacity:1}to{transform:translate(-140vw);opacity:0}}.header{background-image:linear-gradient(#d8c97beb,#d8c97beb),url(/miharineko.webp);background-size:100% 100%,80px;background-repeat:no-repeat,repeat;text-align:center;padding:clamp(.65rem,2vh,1.1rem) clamp(.8rem,2vw,1.5rem);position:relative}.header h1{font-size:clamp(2rem,4vw,3rem);margin:0 0 clamp(.4rem,1vh,.8rem)}.main-content{text-align:center;padding:clamp(.4rem,2vh,1rem) 1rem;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:clamp(.45rem,2vh,1.1rem);box-sizing:border-box;flex:1;width:100%;position:relative;padding-top:clamp(3.5rem,9vh,6rem)}.talking-cats{position:absolute;inset:150px 0 0;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none;padding:0 clamp(1.2rem,6vw,4rem)}.talking-cat{display:flex;flex-direction:column;align-items:center;gap:clamp(.6rem,1.8vw,1rem);max-width:clamp(160px,22vw,240px)}.talking-cat--assistant{margin-top:clamp(1rem,4vh,2.5rem)}.talking-cat img{width:clamp(140px,18vw,220px);height:auto;filter:drop-shadow(0 16px 28px rgba(179,145,105,.28))}.talking-cat figcaption{background-color:#fffffff0;border-radius:18px;padding:clamp(.65rem,1.8vw,1rem) clamp(.75rem,2.2vw,1.2rem);box-shadow:0 16px 34px #c8aa8233;border:2px solid rgba(245,163,146,.4);font-size:clamp(1rem,2.1vw,1.2rem);line-height:1.4;position:relative}.talking-cat figcaption:after{content:"";position:absolute;bottom:-16px;left:50%;transform:translate(-50%);border-width:16px 12px 0 12px;border-style:solid;border-color:rgba(255,255,255,.94) transparent transparent transparent;filter:drop-shadow(0 6px 8px rgba(200,170,130,.2))}.talking-cat--assistant figcaption:after{bottom:auto;top:-16px;border-width:0 12px 16px 12px;border-color:transparent transparent rgba(255,255,255,.94) transparent}.talking-cat--assistant figcaption{margin-top:clamp(-.2rem,-.6vw,-.1rem)}.talking-cat--professor figcaption:after{bottom:auto;top:-16px;border-width:0 12px 16px 12px;border-color:transparent transparent rgba(255,255,255,.94) transparent}.bubble-heading{display:block;font-weight:700;color:#f38770;margin-bottom:.35rem;font-size:clamp(1.05rem,2.3vw,1.25rem)}@media(max-width:1024px){.talking-cats{padding:0 clamp(.5rem,4vw,1.5rem)}.story-comic{width:min(94vw,880px)}.comic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.main-content{padding-top:clamp(2.5rem,8vh,4rem)}.talking-cats{position:static;flex-direction:column;align-items:center;gap:clamp(1.2rem,4vw,1.8rem);margin-bottom:clamp(1rem,4vw,2rem)}.talking-cat{max-width:260px}.talking-cat--assistant{margin-top:0}.talking-cat figcaption:after{bottom:-16px;top:auto;border-width:16px 12px 0 12px;border-color:rgba(255,255,255,.94) transparent transparent transparent}.talking-cat--assistant figcaption{margin-top:0}.story-comic{width:100%;margin-top:clamp(1.6rem,4vh,2.4rem)}.comic-grid{gap:clamp(.9rem,3vw,1.2rem)}}@media(max-width:520px){.story-comic{padding:clamp(1rem,4vw,1.4rem)}.comic-grid{grid-template-columns:1fr}}.main-content h2{margin:0;font-size:clamp(1.35rem,2.2vw,1.9rem);line-height:1.2}.paws-grid{display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr;max-width:840px;width:100%;margin:0 auto;gap:clamp(.6rem,2vh,1rem);align-items:center;justify-items:center;position:relative}.usage-carousel{position:relative;width:min(96vw,1100px);aspect-ratio:16 / 9;margin:clamp(1.8rem,4vh,2.6rem) auto 0;border-radius:24px;overflow:hidden;box-shadow:0 18px 40px #c8a06e40;border:3px solid rgba(245,163,146,.35);background:#fffaf4}.usage-carousel:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(255,210,180,.25),transparent 60%);pointer-events:none;z-index:1}.carousel-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;animation:usageCarousel 30s infinite;transition:opacity .6s ease}.carousel-image:nth-child(1){animation-delay:0s}.carousel-image:nth-child(2){animation-delay:6s}.carousel-image:nth-child(3){animation-delay:12s}.carousel-image:nth-child(4){animation-delay:18s}.carousel-image:nth-child(5){animation-delay:24s}@keyframes usageCarousel{0%,15%{opacity:1}20%,to{opacity:0}}.story-comic{width:min(96vw,1100px);margin:clamp(2.2rem,5vh,3rem) auto 0;padding:clamp(1.4rem,3vw,2.2rem) clamp(1rem,2.5vw,1.8rem);background:#ffffffeb;border-radius:26px;box-shadow:0 18px 35px #d2aa7838;border:3px solid rgba(216,201,123,.4);position:relative;overflow:hidden}.story-comic:before,.story-comic:after{content:"";position:absolute;border-radius:50%;background:#f5a39259;filter:blur(28px);opacity:.6;pointer-events:none}.story-comic:before{width:160px;height:160px;top:-60px;left:-40px}.story-comic:after{width:220px;height:220px;bottom:-100px;right:-70px;background:#b8d6ff59}.story-comic h3{margin:0 0 clamp(1rem,2vw,1.4rem);font-size:clamp(1.4rem,2.6vw,2rem);letter-spacing:.03em}.comic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,2vw,1.6rem);position:relative;z-index:1}.comic-panel{margin:0;background:linear-gradient(165deg,#fff8ecf2,#fff0dcd9);border-radius:18px;padding:clamp(.9rem,2vw,1.3rem);box-shadow:inset 0 0 0 2px #f5a39240;display:flex;flex-direction:column;gap:clamp(.4rem,1.2vw,.8rem);min-height:180px}.panel-number{font-size:clamp(1.1rem,2.4vw,1.6rem);font-weight:700;color:#f38770;background:#fffc;border-radius:999px;align-self:flex-start;padding:.1rem .6rem;box-shadow:0 6px 10px #f0967833}.comic-panel h4{margin:0;font-size:clamp(1.05rem,2.2vw,1.3rem)}.comic-panel p{margin:0;font-size:clamp(.95rem,1.9vw,1.1rem);line-height:1.6}.paw-item{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:#000;font-size:clamp(.8rem,1.8vh,1.1rem);transition:transform .2s ease}.paw-item img{width:clamp(90px,13vh,168px);height:auto}.paw-item:hover{transform:scale(1.1)}.cat-center{grid-column:2 / 3;grid-row:1 / 3}.cat-center img{width:clamp(120px,19vh,210px);height:auto}.start-button a{display:inline-block;background-color:#f5a392;color:#fff;padding:clamp(.55rem,1.8vh,.9rem) clamp(1.4rem,4.6vw,2.3rem);border-radius:8px;text-decoration:none;font-size:clamp(1.05rem,2vh,1.35rem);margin-top:0;transition:background .3s}.start-button a:hover{background-color:#e17d70}footer{margin-top:auto;text-align:center;color:#777;padding-bottom:.75rem;padding-top:.75rem}@media(max-height:780px){.main-content{transform:scale(.95);transform-origin:top center}}@media(max-height:700px){.main-content{transform:scale(.9)}}.page-content{max-width:1000px;margin:0 auto;padding:2rem 1rem}.page-title{text-align:center;font-size:1.8rem;margin-bottom:2rem}.back-link{display:block;width:auto;margin-bottom:1rem;text-decoration:none;color:#007bff;font-size:1rem;padding:.5rem;transition:color .2s;text-align:left;margin-left:0;max-width:100%}.back-link:hover{color:#000}.block-feature-container{display:flex;justify-content:center;gap:2rem;align-items:flex-start;margin-top:2rem}.info-frame{flex:1;max-width:450px;min-height:400px;border:4px solid #d8c97b;position:relative;background-color:#fff;padding:1.5rem;box-sizing:border-box}.cat-icon-row{display:flex;justify-content:space-around;margin-bottom:1rem;padding:0 .5rem;border-bottom:2px solid #d8c97b}.cat-icon-row img{width:25px;height:auto}.cat-icon-row.bottom-row{border-top:2px solid #d8c97b;border-bottom:none;padding-top:1rem;margin-top:1rem;flex-wrap:wrap}.cat-emoji{font-size:1.5rem;line-height:1}.info-text{text-align:left;line-height:1.6;font-size:.95rem;padding:1rem 0 1rem 1.5rem;position:relative}.text-with-cats{margin-bottom:1rem;text-indent:-1.5rem;padding-left:1.5rem}.cat-image-box{flex:1;max-width:450px;border:1px solid #ccc;padding:1rem;display:flex;justify-content:center;align-items:center}.cat-main-image{max-width:100%;height:auto;display:block}.block-page-start-button{text-align:right;max-width:930px;margin:1rem auto}@media(max-width:800px){.block-feature-container{flex-direction:column;align-items:center;gap:1.5rem}.info-frame,.cat-image-box{max-width:100%}.block-page-start-button{text-align:center;max-width:100%}}.intro-section{display:flex;justify-content:center;align-items:center;gap:1rem;margin:2rem 0}.cat-support-left img,.cat-support-right img{width:100px;height:auto}.info-frame-frame{border:5px solid #d8c97b;padding:1rem;background-color:#fff;width:400px;text-align:center;font-size:1rem;line-height:1.5;box-shadow:0 3px 5px #0000001a}.howto{text-align:left;margin:3rem auto;max-width:700px}.howto h2{font-size:1.2rem;margin-top:2rem}.slideshow{text-align:center}.slideshow img{width:100%;max-width:700px;height:auto;border:1px solid #ccc;border-radius:8px}.static-img{width:100%;max-width:700px;display:block;margin:0 auto;border:1px solid #ccc;border-radius:8px}.nyan-section{display:flex;justify-content:center;align-items:center;gap:1rem;margin-top:2rem}.speech-bubble{background:#fff;border:2px solid #7bbf6a;border-radius:20px;padding:1rem 1.5rem;font-size:1.2rem;position:relative}.speech-bubble:after{content:"";position:absolute;bottom:-20px;left:50px;border:10px solid transparent;border-top-color:#7bbf6a}.cat-box{width:150px;height:auto}.slideshow{position:relative;display:flex;justify-content:center;align-items:center;gap:clamp(.5rem,3vw,1.5rem);margin:2rem 0;flex-wrap:nowrap}.slideshow img{width:min(75vw,700px);max-width:700px;border-radius:12px;box-shadow:0 4px 12px #0003;transition:opacity .5s ease}.slide-control{position:relative;border:none;background:#ffffffe6;color:#f08a5d;font-size:1.8rem;font-weight:700;width:48px;height:48px;border-radius:50%;cursor:pointer;flex-shrink:0;box-shadow:0 4px 12px #00000026;transition:background .3s ease,transform .2s ease}.slide-control:hover{background:#f08a5d;color:#fff;transform:scale(1.05)}.restart-text{position:absolute;bottom:12%;left:50%;transform:translate(-50%);background:#fffc;color:#00f;font-size:1.2rem;font-weight:700;padding:.5rem 1rem;border-radius:12px;cursor:pointer;display:none;opacity:0;transition:opacity 1s ease;text-shadow:0 1px 2px #fff}.restart-text.fade-in{opacity:1}.restart-text:hover{background:#f5a392;color:#fff}.cat-side{position:fixed;top:var(--header-offset);width:120px;height:calc(100% - var(--header-offset));background-image:url(/cat.png);background-repeat:repeat-y;background-size:contain;background-position:center;z-index:-1;opacity:.9}.cat-side.left{left:0;transform:scaleX(-1)}.cat-side.right{right:0}.page-content{padding:40px 140px;position:relative;z-index:1}.header{text-align:center;padding:20px}h1{font-size:2rem}.back-link{position:fixed;top:80px;left:160px;color:#444;text-decoration:none}.restart-text{display:none;opacity:0;cursor:pointer;transition:opacity .8s}.restart-text.fade-in{display:block;opacity:1}header.header{position:fixed;top:0;left:0;width:100%;background-image:linear-gradient(#d8c97beb,#d8c97beb),url(/miharineko.webp);background-size:100% 100%,80px;background-repeat:no-repeat,repeat;z-index:1000;padding:clamp(.65rem,2vh,1.1rem) clamp(.8rem,2vw,1.5rem);text-align:center;border-bottom:2px solid #f2c4d4}.page-content{padding-top:80px}.back-link{position:fixed!important;top:85px;left:20px;z-index:3000;background:#d8c97b;padding:6px 10px;border-radius:6px;text-decoration:none;color:#444;font-weight:700}.back-link{position:fixed!important;top:20px;left:20px;z-index:999999!important}.cat-side,.cat-support-left,.cat-support-right,.frame-inner,.intro-section,.page-content{z-index:auto!important}#slide-img{width:200%;height:200%;object-fit:contain}.header{background-image:linear-gradient(#d8c97beb,#d8c97beb),url(/miharineko.webp);background-size:100% 100%,80px;background-repeat:no-repeat,repeat;text-align:center;padding:clamp(.8rem,2.3vh,1.4rem) clamp(1rem,3vw,1.8rem);position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(.35rem,1vh,.75rem);min-height:clamp(130px,16vh,175px)}.header h1{font-size:clamp(2.6rem,5vw,3.9rem);line-height:1.08;margin:clamp(.35rem,1vh,.7rem) 0 0}.nav-menu{display:flex;justify-content:flex-end;gap:clamp(.9rem,2vw,1.6rem);width:100%;max-width:min(92vw,1040px);margin:0 auto 0 0;box-sizing:border-box;padding-right:clamp(.4rem,1vw,1.2rem);flex-wrap:wrap}.nav-menu a{color:#fff;text-decoration:none;font-size:1rem;font-weight:600;transition:.2s}.nav-menu a:hover{text-decoration:underline;opacity:.8}