/*
Theme Name: 日本語のしおり
Theme URI: https://example.com/
Author: Kamomeza
Description: 台湾向け日本語学習ゲームサイト。スクロール連動のカモメと、ゲーム投稿機能。
Version: 1.5.6
Requires at least: 6.2
Requires PHP: 7.4
Text Domain: nihongo-no-shiori
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700&family=Noto+Serif+JP:wght@500;600;700&display=swap');
:root{--ink:#324e43;--green:#506f60;--sage:#779687;--mint:#e7efe7;--cream:#f8f6ed;--beige:#e9e0d0;--text:#39433e;--muted:#66776b;--line:#e3e8e0;--card:#fff;--shadow:0 15px 38px rgba(37,62,46,.08);--serif:'Noto Serif JP','Noto Serif TC',serif;--sans:'Noto Sans TC',system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:86px;overflow-x:hidden;width:100%}body{margin:0;background:#fffefa;color:var(--text);font:16px/1.85 var(--sans);overflow-x:hidden;width:100%;max-width:100vw}button,a{font:inherit}a{color:inherit}a:focus-visible,button:focus-visible{outline:3px solid #cf9a46;outline-offset:4px}button{cursor:pointer}img{max-width:100%;display:block}.container{max-width:1200px;margin:auto;padding-inline:32px}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,254,250,.97);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.header-inner{height:82px;display:flex;justify-content:space-between;align-items:center;gap:25px}.brand{text-decoration:none;display:inline-flex;align-items:center;gap:12px;color:var(--ink);white-space:nowrap;font:700 clamp(19px,2.1vw,25px) var(--serif);letter-spacing:.02em}.brand-mark{height:43px;width:49px;display:grid;place-items:center;border-radius:50%;background:#eef4ed}.brand-mark svg{width:33px;height:33px}.nav{display:flex;align-items:center;gap:28px}.nav a{text-decoration:none;font-size:14px;font-weight:600;color:#46584b;transition:color .2s}.nav a:hover{color:#a47b4b}.insta-nav{display:flex;align-items:center;gap:7px}.insta-nav svg{height:19px;width:19px}.menu-button{display:none;border:1px solid var(--line);background:white;border-radius:13px;padding:10px;line-height:0}.menu-button svg{height:23px;width:23px}
.hero{background:linear-gradient(115deg,#fbfaf5 0%,#f8f6ed 47%,#eaf0e9 100%);overflow:hidden;position:relative}.hero-inner{min-height:530px;display:grid;grid-template-columns:1fr 1.02fr;align-items:center;gap:42px}.eyebrow{font-size:13px;color:var(--green);font-weight:700;letter-spacing:.12em}.hero h1{font:700 clamp(42px,4.3vw,65px)/1.4 var(--serif);letter-spacing:.025em;color:var(--ink);margin:20px 0 16px}.hero-lead{font-size:21px;color:var(--ink);font-weight:600;margin:0 0 15px}.hero-desc{max-width:460px;color:#5f7165;margin:0 0 32px}.btn{border:0;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:12px;border-radius:100px;padding:13px 27px;background:var(--green);color:white;font-weight:700;font-size:15px;transition:transform .2s,background .2s,box-shadow .2s;box-shadow:0 8px 20px #385f4a22}.btn:hover{background:#354f40;transform:translateY(-2px)}.btn svg{height:18px;width:18px}.btn-outline{background:transparent;color:var(--ink);border:1px solid #a7b9ab;box-shadow:none}.btn-outline:hover{background:#e9f2e8;color:var(--ink)}.hero-art{height:445px;align-self:end;position:relative;display:flex;align-items:flex-end;justify-content:center}.hero-art:before{content:"";position:absolute;border-radius:50%;inset:4% -3% 0 0;background:#e8eee2}.hero-art img{width:min(100%,545px);height:420px;object-fit:cover;object-position:center;border-radius:220px 220px 0 0;position:relative;mix-blend-mode:multiply;mask-image:linear-gradient(to bottom,#000 86%,transparent 100%)}.floating-note{position:absolute;bottom:32px;right:7%;background:#fffefaeb;padding:10px 17px;border-radius:12px;color:var(--ink);font-size:13px;box-shadow:var(--shadow);transform:rotate(-4deg)}.section{padding-block:87px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:32px;gap:12px}.section-label{font-weight:700;font-size:12px;color:var(--sage);letter-spacing:.18em}.section-title{font:700 clamp(26px,3vw,35px)/1.5 var(--serif);color:var(--ink);margin:5px 0 8px}.section-sub{color:var(--muted);font-size:15px;margin:0}.text-link{display:inline-flex;align-items:center;gap:8px;color:var(--green);font-weight:700;text-decoration:none;font-size:14px;white-space:nowrap}.text-link:hover{text-decoration:underline}.game-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:28px}.game-card{border:1px solid var(--line);background:white;border-radius:22px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;text-decoration:none;transition:transform .2s,box-shadow .2s}.game-card:hover{transform:translateY(-5px);box-shadow:0 22px 44px rgba(37,62,46,.12)}.game-card .image-wrap{height:245px;overflow:hidden;background:#e5dfd0}.game-card img{width:100%;height:100%;object-fit:cover;transition:transform .35s}.game-card:hover img{transform:scale(1.035)}.game-content{padding:24px 26px 25px;position:relative;flex:1}.tag-row{display:flex;gap:7px;flex-wrap:wrap}.tag{font-size:12px;color:#4d7158;background:#edf2ea;padding:3px 10px;border-radius:6px;font-weight:600}.game-content h3{font:700 24px/1.5 var(--serif);color:var(--ink);margin:14px 0 8px}.game-content p{margin:0;padding-right:40px;color:var(--muted);font-size:14px}.round-arrow{position:absolute;right:23px;bottom:23px;background:var(--green);color:white;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;font-size:23px}.soon{border:1.5px dashed #cad8ca;background:#f5f7f1;border-radius:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:35px 24px;color:#718574}.soon-figure{font-size:50px;line-height:1}.soon h3{margin:0;color:var(--ink);font:600 23px var(--serif)}.soon p{font-size:14px;max-width:240px;margin:0}.small-note{margin-top:16px;color:var(--muted);font-size:12px}
.about{background:linear-gradient(120deg,#eef3ed,#f9f8f1)}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}.about-image{position:relative}.about-image img{width:100%;height:320px;object-fit:cover;border-radius:24px;box-shadow:var(--shadow)}.about-text p{margin:16px 0 22px;color:#617268}.about-text .section-title{margin-top:5px}.quote{font:600 clamp(17px,1.7vw,21px)/1.8 var(--serif);color:var(--ink)}.instagram-section{text-align:center}.instagram-section .section-title{font-family:var(--serif)}.insta-icon{width:42px;height:42px;margin:auto;display:grid;place-items:center;color:#9b625f}.insta-icon svg{width:32px;height:32px}.insta-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:32px 0 26px}.insta-tile{aspect-ratio:1.25;background:linear-gradient(140deg,#e6eee2,#f7f1e5);border-radius:14px;overflow:hidden;display:grid;place-items:center;color:var(--ink);font:600 15px var(--serif)}.insta-tile:nth-child(2){background:#e4ecdf}.insta-tile:nth-child(3){background:#f1eadd}.insta-tile:nth-child(4){background:#e0eae7}.insta-tile img{width:100%;height:100%;object-fit:cover}.site-footer{background:var(--ink);color:#e7eee8;padding:34px 0}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}.footer-logo{font:600 21px var(--serif);color:#fff;margin:0 0 3px}.footer-copy{font-size:12px;color:#d3dfd5;margin:0}.footer-links{display:flex;gap:22px;flex-wrap:wrap}.footer-links a{font-size:13px;text-decoration:none;color:#e7eee8}.footer-links a:hover{text-decoration:underline}.copyright{margin-top:15px;font-size:11px;color:#b8cabe}.info-note{background:#f4f5ef;border:1px solid #e1e7dd;border-radius:12px;padding:11px 15px;font-size:13px;color:#68796e;max-width:750px;margin:20px auto 0}.footer-link-button{border:0;background:none;color:inherit;padding:0;cursor:pointer}.dialog{border:0;border-radius:18px;padding:30px;width:min(90vw,480px);box-shadow:0 25px 80px #22362955}.dialog::backdrop{background:#20372a88}.dialog h2{margin:0;color:var(--ink);font:600 24px var(--serif)}.dialog p{color:var(--muted);font-size:14px}.dialog .btn{margin-top:10px}
@media(max-width:800px){.container{padding-inline:22px}.header-inner{height:68px}.brand{font-size:19px;gap:6px}.brand-mark{height:38px;width:40px}.menu-button{display:block}.nav{display:none;position:absolute;left:0;right:0;top:68px;background:#fffefa;padding:17px 22px 22px;box-shadow:0 15px 20px #233c3022;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}.nav.is-open{display:flex}.nav a{display:block;padding:12px 8px;border-bottom:1px solid #edf0e9}.hero-inner{min-height:0;grid-template-columns:1fr;gap:0;padding-top:55px}.hero h1{font-size:clamp(37px,9vw,49px);margin:10px 0}.hero-lead{font-size:17px}.hero-desc{font-size:14px;margin-bottom:22px}.hero-art{height:340px;margin:25px -22px 0}.hero-art img{height:330px;width:100%;object-fit:cover;object-position:50% 28%;border-radius:110px 110px 0 0}.hero-art:before{inset:5% 4% 0}.floating-note{right:8%;bottom:20px}.section{padding-block:59px}.section-head{align-items:start}.game-layout{grid-template-columns:1fr;gap:16px}.game-card .image-wrap{height:230px}.soon{min-height:176px;padding:22px}.soon-figure{font-size:30px}.about-grid{grid-template-columns:1fr;gap:27px}.about-image img{height:250px}.insta-tiles{grid-template-columns:repeat(2,1fr)}.footer-inner{flex-direction:column;align-items:flex-start}.footer-links{gap:14px}}
@media(max-width:420px){.container{padding-inline:18px}.hero-inner{padding-top:42px}.hero-art{margin-inline:-18px}.hero-art img{height:300px}.hero-art{height:300px}.section-head{display:block}.text-link{margin-top:13px}.game-content h3{font-size:19px}.game-card .image-wrap{height:195px}.footer-links{gap:11px}.footer-links a{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Interactive home preview — added in Ver.2 */
.discovery{background:#eef3ec;padding-block:82px;position:relative;overflow:hidden}
.discovery:before{content:"";position:absolute;width:240px;height:240px;border-radius:50%;background:#f8f6ed80;top:-120px;right:-40px}
.discovery-grid{display:grid;grid-template-columns:.77fr 1.23fr;gap:48px;align-items:center;position:relative}
.discovery-intro .section-title{max-width:360px}
.discovery-intro p{color:var(--muted);font-size:15px}
.discovery-count{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid #dbe5da;padding:10px 15px;border-radius:50px;margin-top:18px;color:var(--ink);font-size:13px;font-weight:700}
.count-dots{display:inline-flex;gap:5px}.count-dots i{width:10px;height:10px;border:1.5px solid #a5b9aa;border-radius:50%;background:transparent}.count-dots i.done{background:#6b9476;border-color:#6b9476}
.discovery-board{position:relative;min-height:354px;border:8px solid #fffefb;background:#efe4d5;box-shadow:0 20px 42px #304b3b22;border-radius:28px;overflow:hidden}
.discovery-board>img{width:100%;height:354px;object-fit:cover}
.find-item{position:absolute;width:56px;height:56px;border-radius:50%;border:2px solid #fff;display:grid;place-items:center;background:#fffffff0;color:#385946;box-shadow:0 7px 22px #27392955;transition:transform .18s,background .18s;z-index:2}
.find-item svg{width:27px;height:27px}.find-item:hover{transform:scale(1.1);background:#e7f4df}.find-item:focus-visible{z-index:5}.find-item.found{background:#5e846d;color:white}.find-item.item1{left:16%;top:28%}.find-item.item2{right:18%;top:25%}.find-item.item3{left:51%;bottom:16%}
.find-item:not(.found):after{content:"";position:absolute;inset:-7px;border:1.5px solid #fff;border-radius:50%;pointer-events:none;animation:hint-pulse 2.8s infinite}
@keyframes hint-pulse{0%,100%{transform:scale(.93);opacity:.9}55%{transform:scale(1.14);opacity:.35}}
.find-result{position:absolute;left:16px;right:16px;bottom:15px;z-index:3;border-radius:14px;background:#fffefaed;box-shadow:0 12px 25px #25382733;padding:12px 17px;display:none;align-items:center;gap:12px}
.find-result.visible{display:flex}.find-result .jp{font:700 19px var(--serif);color:var(--ink)}.find-result .zh{font-size:13px;color:var(--muted)}.find-result .result-icon{font-size:28px}.find-result-text{flex:1}
.discovery-complete{margin-top:18px;background:#fffefa;border-radius:15px;padding:15px 17px;border:1px solid #d7e5d6;display:none}.discovery-complete.visible{display:block}.discovery-complete p{margin:0 0 12px;font-size:14px}.discovery-complete .btn{font-size:13px;padding:10px 17px}
.discovery-tip{font-size:12px!important;color:#728478}.little-bird{display:inline-block;font-size:36px;transform-origin:bottom center;transition:transform .25s}.little-bird.happy{transform:rotate(-15deg) translateY(-7px) scale(1.12)}
.game-card .round-arrow{transition:transform .2s}.game-card:hover .round-arrow{transform:translateX(3px)}
@media(max-width:800px){.discovery{padding-block:58px}.discovery-grid{grid-template-columns:1fr;gap:22px}.discovery-board{min-height:300px}.discovery-board>img{height:310px}.find-item{width:52px;height:52px}}
@media(max-width:420px){.discovery-board{min-height:260px}.discovery-board>img{height:270px}.find-item{width:48px;height:48px}.find-result{left:9px;right:9px;bottom:9px;padding:9px 11px}.find-result .jp{font-size:16px}}
@media(prefers-reduced-motion:reduce){.find-item:not(.found):after{animation:none}}

/* Ver.3: gentle site-wide motion (not a second game) */
.hero{position:relative}.hero::before,.hero::after{content:"";position:absolute;pointer-events:none;border-radius:50%;border:1px solid #a4bbaa55;width:135px;height:135px;top:9%;left:48%;animation:ambient-drift 11s ease-in-out infinite alternate}.hero::after{width:75px;height:75px;top:auto;bottom:14%;left:5%;animation-duration:13s;animation-delay:-5s}
.hero-art{isolation:isolate}.hero-art img{animation:hero-breathe 7s ease-in-out infinite;transform-origin:50% 88%}.hero-art::after{content:"✧";position:absolute;top:11%;right:7%;font-size:30px;color:#9bb5a5;animation:twinkle 5s ease-in-out infinite;pointer-events:none}.floating-note{animation:note-drift 5.5s ease-in-out infinite}
.hero .btn svg,.hero .btn span{display:inline-block;transition:transform .25s}.hero .btn:hover span{transform:translateX(5px)}
.section-label{position:relative;display:inline-block}.section-label::after{content:"";display:block;height:2px;width:22px;margin-top:6px;background:#9ab5a1;transition:width .5s}.section-label:hover::after{width:100%}
.soon-figure{animation:bookmark-bob 4.5s ease-in-out infinite}.about-image img{transition:transform .7s cubic-bezier(.2,.7,.3,1)}.about-image:hover img{transform:scale(1.025)}
.insta-tile{transition:transform .3s,box-shadow .3s}.insta-tile:hover{transform:translateY(-5px) rotate(-1deg);box-shadow:0 12px 25px #304b3b1b}
/* Animate only after script has initialized. Content is visible without JS. */
.motion-ready .scroll-reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.75,.25,1)}
.motion-ready .scroll-reveal.is-visible{opacity:1;transform:translateY(0)}
.motion-ready .game-card.scroll-reveal{transition:opacity .75s ease,transform .75s cubic-bezier(.2,.75,.25,1),box-shadow .2s}.motion-ready .game-card.scroll-reveal.is-visible:hover{transform:translateY(-5px)}
@keyframes ambient-drift{from{transform:translate(0,0)}to{transform:translate(22px,-27px)}}
@keyframes hero-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes note-drift{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-7px) rotate(-2deg)}}
@keyframes twinkle{0%,100%{opacity:.3;transform:scale(.85)}50%{opacity:1;transform:scale(1.1)}}
@keyframes bookmark-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media(max-width:800px){.hero::before{left:70%}.hero-art::after{right:13%}}
@media(prefers-reduced-motion:reduce){.hero::before,.hero::after,.hero-art img,.hero-art::after,.floating-note,.soon-figure{animation:none!important}.motion-ready .scroll-reveal{opacity:1!important;transform:none!important}.insta-tile:hover,.about-image:hover img{transform:none!important}}

/* Ver.4: travelling mascot and section bookmarks */
.travel-bird{position:fixed;right:19px;top:48%;width:78px;height:78px;z-index:22;pointer-events:none;opacity:0;transform:translate3d(100px,-50%,0);transition:opacity .4s ease;filter:drop-shadow(0 7px 5px #2d4b3c33)}
.travel-bird.is-active{opacity:.96}.travel-bird svg{width:100%;height:100%;overflow:visible}.travel-bird .wing{transform-origin:29px 31px;animation:bird-flap 2.4s ease-in-out infinite alternate}.travel-bird .bird-scarf{fill:#729680}
@keyframes bird-flap{to{transform:rotate(-8deg) translateY(-2px)}}
.bookmark-pop{position:absolute;right:0;top:30%;z-index:4;transform:translateX(110%);opacity:0;transition:transform .65s cubic-bezier(.2,.8,.2,1),opacity .5s ease;border:0;color:#fff;background:#54745e;padding:12px 12px 15px;border-radius:8px 0 0 5px;box-shadow:-3px 8px 17px #1f382b2b;min-height:80px;writing-mode:vertical-rl;letter-spacing:.12em;font-weight:700;font-size:13px}
.bookmark-pop:after{content:'';position:absolute;bottom:-12px;right:0;border-right:19px solid #54745e;border-bottom:12px solid transparent}
.bookmark-pop.is-visible{transform:translateX(0);opacity:1}.bookmark-pop:hover{background:#3d6147}.bookmark-pop:focus-visible{outline-offset:-3px}
#about,#games,.instagram-section{position:relative}.bookmark-pop.bookmark-alt{background:#94785e}.bookmark-pop.bookmark-alt:after{border-right-color:#94785e}.bookmark-message{position:fixed;right:25px;bottom:30px;max-width:min(330px,calc(100vw - 40px));z-index:55;background:#fffefa;color:#375240;box-shadow:0 15px 38px #2b443c32;border:1px solid #d9e6d9;border-radius:17px;padding:17px 42px 17px 18px;font-size:14px;line-height:1.7;display:none}.bookmark-message.is-open{display:block}.bookmark-message button{position:absolute;right:12px;top:7px;background:none;border:0;font-size:25px;color:#54745e}
@media(max-width:800px){.travel-bird{width:57px;height:57px;right:4px}.bookmark-pop{padding:9px 7px 11px;font-size:11px;min-height:64px}.bookmark-message{bottom:20px;right:15px}}
@media(prefers-reduced-motion:reduce){.travel-bird{display:none!important}.bookmark-pop{transition:none}.travel-bird .wing{animation:none}}

.brand-logo-img{width:clamp(190px,23vw,260px);height:auto;max-height:68px;object-fit:contain;object-position:left center}
.brand{gap:0}.brand:hover .brand-logo-img{transform:translateY(-1px)}.brand-logo-img{transition:transform .25s}
.hero-art{isolation:isolate}
.hero-art .hero-scenery{opacity:.43;filter:saturate(.7);object-position:60% 50%}
.hero-art .hero-mascot{position:absolute;z-index:3;inset:auto auto 7px 50%;transform:translateX(-50%);width:min(87%,390px);height:min(94%,395px);object-fit:contain;object-position:center bottom;mix-blend-mode:normal;mask-image:none;filter:drop-shadow(0 18px 16px rgba(45,67,50,.15));animation:mascot-hover 5.5s ease-in-out infinite}
@keyframes mascot-hover{0%,100%{transform:translate(-50%,0) rotate(-1deg)}50%{transform:translate(-50%,-9px) rotate(1deg)}}
.travel-bird .travel-bird-image{width:100%;height:100%;object-fit:contain}
.little-bird{width:60px;height:60px;vertical-align:middle}
.little-bird img{width:100%;height:100%;object-fit:contain}
.little-bird.happy{transform:rotate(-8deg) translateY(-5px) scale(1.06)}
@media(max-width:800px){.brand-logo-img{width:clamp(175px,43vw,220px);max-height:56px}.hero-art .hero-mascot{width:min(75%,300px);height:94%;bottom:4px}.hero-art .hero-scenery{object-position:50% 40%}}
@media(prefers-reduced-motion:reduce){.hero-art .hero-mascot{animation:none;transform:translateX(-50%)}}

/* Ver.6: clean first-view and landing-perch flights */
.hero{background:#f8f6ed}
.hero-art:before{display:none!important}
.hero-art{background:transparent;overflow:visible}
.hero-art .hero-mascot{height:96%;width:min(91%,420px);bottom:0;filter:drop-shadow(0 14px 13px rgba(45,67,50,.12))}
.floating-note{z-index:4;bottom:19px;right:0;background:#fffefa;box-shadow:0 7px 17px rgba(50,78,67,.1)}
.hero:before,.hero:after,.hero-inner:before,.hero-inner:after{box-shadow:none!important}
.travel-bird{top:0;right:auto;left:0;width:85px;height:85px;opacity:0;transform:translate3d(-200px,-200px,0);transition:opacity .25s ease;z-index:23;will-change:transform;pointer-events:none}
.travel-bird.is-active{opacity:1}
.travel-bird-image{width:100%;height:100%;object-fit:contain;transform-origin:50% 70%}
.travel-bird.is-flying .travel-bird-image{animation:flight-wings .3s ease-in-out infinite alternate}
.travel-bird.is-resting .travel-bird-image{animation:perched-breathe 2.6s ease-in-out infinite}
@keyframes flight-wings{from{transform:rotate(-6deg) translateY(-3px)}to{transform:rotate(8deg) translateY(3px)}}
@keyframes perched-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
/* The bookmark is the actual physical landing place, no longer hidden behind the bird. */
.bookmark-pop{right:var(--bookmark-right);top:26px;z-index:21;border-radius:10px 10px 4px 4px;transform:translateY(14px) scale(.97)}
.bookmark-pop.is-visible{transform:translateY(0) scale(1)}
.bookmark-pop::before{content:'';position:absolute;left:0;right:0;top:-7px;height:8px;background:#6c8d74;border-radius:7px 7px 0 0}
.bookmark-pop.bookmark-alt::before{background:#b49a80}
@media(max-width:800px){.hero-art .hero-mascot{height:98%;width:min(77%,300px)}.floating-note{right:7%}.travel-bird{width:65px;height:65px}.bookmark-pop{right:9px;top:25%;min-height:70px;padding:10px 9px 11px}}
@media(prefers-reduced-motion:reduce){.travel-bird{display:none!important}.hero-art .hero-mascot{animation:none!important}.bookmark-pop{opacity:1!important;transform:translateX(0)!important}}

/* Ver.7 — pose switch and physically scroll-tracked flight */
.travel-bird{width:clamp(64px,7.8vw,92px);height:clamp(64px,7.8vw,92px);transform-origin:50% 100%;}
.travel-bird .bird-pose{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .17s ease;pointer-events:none}
.travel-bird .bird-pose-flight{opacity:1}
.travel-bird .bird-pose-landed{opacity:0}
.travel-bird.is-resting .bird-pose-flight{opacity:0}
.travel-bird.is-resting .bird-pose-landed{opacity:1}
.travel-bird.is-flying .bird-pose-flight{animation:flight-wings .38s ease-in-out infinite alternate}
.travel-bird.is-resting .bird-pose-landed{animation:perched-breathe 2.6s ease-in-out infinite}
@media(max-width:800px){.travel-bird{width:clamp(58px,12vw,70px);height:clamp(58px,12vw,70px)}}
@media(prefers-reduced-motion:reduce){.travel-bird{display:none!important}.travel-bird .bird-pose{animation:none!important}}
/* Ver.8: scroll position is the animation timeline; don't ease independently. */
.travel-bird{transition:opacity .25s ease}
.travel-bird .bird-pose{transition:opacity .12s linear}
@media(prefers-reduced-motion:reduce){.travel-bird{display:none!important}}

/* Ver.10: flying seagull accents in hero/minigame and no horizontal overflow */
main,.site-header,.site-footer,.section,.discovery,.hero{overflow-x:clip}
.hero-flight,
.discover-flight{
  position:absolute;
  z-index:4;
  pointer-events:none;
}
.hero-flight{
  top:62px;
  right:clamp(28px,7vw,105px);
  width:clamp(78px,9vw,122px);
  animation:sectionBirdSwoop 5.8s ease-in-out infinite;
}
.discover-flight{
  top:30px;
  right:clamp(24px,4vw,42px);
  width:clamp(72px,8vw,110px);
  animation:sectionBirdFloat 4.9s ease-in-out infinite;
}
.hero-flight img,
.discover-flight img,
.little-bird img{
  width:100%;
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 8px 10px rgba(45,67,50,.15));
}
.hero-flight img,
.discover-flight img{
  animation:flightWingsVisual .46s ease-in-out infinite alternate;
}
@keyframes flightWingsVisual{
  0%{transform:rotate(-6deg) translateY(0) scale(1)}
  100%{transform:rotate(3deg) translateY(-3px) scale(1.03)}
}
@keyframes sectionBirdSwoop{
  0%,100%{transform:translate3d(0,0,0)}
  25%{transform:translate3d(12px,-10px,0)}
  50%{transform:translate3d(-5px,-22px,0)}
  75%{transform:translate3d(-14px,-9px,0)}
}
@keyframes sectionBirdFloat{
  0%,100%{transform:translate3d(0,0,0)}
  35%{transform:translate3d(-16px,-10px,0)}
  70%{transform:translate3d(6px,-20px,0)}
}
.discovery-board{overflow:hidden}
.discover-flight{right:auto;left:50%;transform:translateX(-50%)}
@media(max-width:800px){
  .hero-flight{top:18px;right:12px;width:82px}
  .discover-flight{top:16px;width:76px}
}
@media(prefers-reduced-motion:reduce){
  .hero-flight,.discover-flight{display:none}
  .hero-flight img,.discover-flight img,.little-bird img{animation:none!important}
}


/* Ver.11: visible in-section bookmarks, including hero and discovery */
:root{--bookmark-right:max(12px, calc((100vw - 1200px) / 2 + 12px));}
.hero,.discovery,#games,#about,.instagram-section{position:relative}
.bookmark-pop{
  right:var(--bookmark-right);
  top:26px;
  z-index:21;
  border-radius:10px 10px 4px 4px;
  transform:translateY(14px) scale(.97);
  opacity:0;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .35s ease,background .2s ease;
  min-height:84px;
  padding:12px 10px 15px;
  box-shadow:-3px 8px 17px #1f382b2b;
}
.bookmark-pop.is-visible{transform:translateY(0) scale(1);opacity:1}
.bookmark-pop::before{content:'';position:absolute;left:0;right:0;top:-7px;height:8px;background:#6c8d74;border-radius:7px 7px 0 0}
.bookmark-pop.bookmark-alt::before{background:#b49a80}
.hero .bookmark-pop{top:120px;background:#698870}
.hero .bookmark-pop::after{border-right-color:#698870}
.discovery .bookmark-pop{top:18px}
#games .bookmark-pop{top:22px}
#about .bookmark-pop{top:22px}
.instagram-section .bookmark-pop{top:22px}
@media(max-width:800px){
  :root{--bookmark-right:10px}
  .bookmark-pop{top:14px;min-height:68px;padding:10px 8px 12px;font-size:11px}
  .hero .bookmark-pop{top:84px}
}


/* Ver.12: one travelling bird only. Restore clear bookmark visibility. */
.hero-flight,.discover-flight,.little-bird{display:none!important}
.discovery-board>img{object-position:center center}
.discovery-board .item1{left:12%;top:20%}
.discovery-board .item2{left:49%;top:31%}
.discovery-board .item3{left:auto;right:9%;top:28%}
@media(max-width:800px){
  .discovery-board .item1{left:12%;top:19%}
  .discovery-board .item2{left:47%;top:35%}
  .discovery-board .item3{right:8%;top:29%}
}

/* Game archive cards */
.shiori-archive .game-content h2{font:700 22px/1.5 var(--serif);color:var(--ink);margin:14px 0 8px}.shiori-archive .game-content p{font-size:14px}


/* Archive design v1.3.0 */
.shiori-archive{min-height:100vh;background:#fffefa}.shiori-archive .archive-bar{padding:15px 0;border-bottom:1px solid #e4eae0;background:#fffefa;font-size:13px;color:#829487}.shiori-archive .archive-bar a{color:#3f604b;font-weight:700;text-decoration:none}.shiori-archive .archive-bar a:hover{text-decoration:underline}.shiori-archive .archive-main{padding-bottom:100px}.shiori-archive .archive-header{padding:65px 0 29px;position:relative}.shiori-archive .archive-header .section-title{font-size:clamp(32px,4vw,46px);margin:7px 0 4px}.shiori-archive .archive-header-icon{font-family:sans-serif;font-size:22px;color:#b5c9ae;vertical-align:top}.shiori-archive .archive-header-ja{font-size:13px;color:#809183;margin:11px 0 0}.shiori-archive .archive-intro{background:linear-gradient(105deg,#eef4eb,#f9f7eb);border:1px solid #e1e9da;border-radius:23px;padding:24px 31px;display:flex;gap:16px;align-items:center;justify-content:space-between}.shiori-archive .archive-intro-label{display:block;font-size:10px;letter-spacing:.15em;color:#79947e;font-weight:800;margin-bottom:5px}.shiori-archive .archive-intro strong{font-size:17px;color:#3b5944}.shiori-archive .archive-intro p{font-size:13px;color:#718173;margin:6px 0 0}.shiori-archive .archive-intro-icon{font-size:42px;opacity:.85}.shiori-archive .archive-tools{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap;margin:42px 0 22px}.shiori-archive .archive-tools-title{display:flex;align-items:baseline;gap:15px}.shiori-archive .archive-total{font-size:23px;font-weight:800;line-height:1.3;color:#3c614c}.shiori-archive .archive-total small{font-size:12px;font-weight:600}.shiori-archive .archive-tools-title p{font-size:13px;color:#89958b;margin:0}.shiori-archive .archive-filter{display:flex;gap:8px;flex-wrap:wrap}.shiori-archive .archive-filter-btn{background:#fff;border:1px solid #e0e7df;color:#617665;font-size:13px;line-height:1.4;border-radius:50px;padding:10px 17px;transition:.2s}.shiori-archive .archive-filter-btn span{font-size:11px;opacity:.65;margin-left:4px}.shiori-archive .archive-filter-btn:hover{border-color:#7f9b83}.shiori-archive .archive-filter-btn.is-active{background:#436e53;border-color:#436e53;color:#fff}.shiori-archive .game-layout.archive-game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.shiori-archive .archive-game-card{min-width:0;box-shadow:0 6px 25px rgba(39,75,50,.055);border-radius:20px}.shiori-archive .archive-game-card[hidden]{display:none!important}.shiori-archive .archive-card-link{display:flex;flex-direction:column;flex:1;text-decoration:none;min-width:0}.shiori-archive .archive-game-card .image-wrap{height:auto;aspect-ratio:1.64;position:relative;background:#eef1e9}.shiori-archive .archive-image-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;background:radial-gradient(circle at 25% 15%,#f7ebd9,#dce9de 77%)}.shiori-archive .archive-image-fallback>span{font-size:66px;line-height:1.2}.shiori-archive .archive-image-fallback small{font:600 12px var(--serif);color:#668173;letter-spacing:.1em}.shiori-archive .archive-image-chip{position:absolute;top:13px;left:14px;padding:5px 11px;background:#fffef5ec;border-radius:999px;color:#4f6f57;font-size:12px;font-weight:700;backdrop-filter:blur(5px)}.shiori-archive .archive-game-card .game-content{padding:21px 22px 20px;display:flex;flex-direction:column;flex:1}.shiori-archive .archive-card-meta{display:flex;justify-content:space-between;gap:8px;align-items:center}.shiori-archive .archive-meta-kicker{font-size:10px;font-weight:800;letter-spacing:.13em;color:#a8b6a7}.shiori-archive .archive-level{font-size:11px;font-weight:700;padding:3px 9px;border:1px solid #dde9dd;border-radius:7px;color:#53815f;background:#f3f8f2}.shiori-archive .game-content h2{font:700 22px/1.5 var(--serif);margin:13px 0 7px;color:#324d3c}.shiori-archive .archive-card-desc{font-size:13px;color:#738277;line-height:1.8;min-height:3.6em;margin:0;padding:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}.shiori-archive .archive-study{border-top:1px dashed #e0e7de;padding-top:15px;margin:17px 0 10px}.shiori-archive .archive-study-label{display:block;font-size:11px;font-weight:700;color:#819486;margin-bottom:9px}.shiori-archive .archive-study .tag{font-size:12px;border-radius:8px;color:#4d735a;background:#edf4ec;padding:5px 10px}.shiori-archive .archive-card-bottom{border-top:1px solid #eef1eb;margin-top:auto;padding-top:16px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;font-weight:800;color:#476f52}.shiori-archive .archive-card-bottom span[lang=ja]{font-weight:500;font-size:10px;color:#a2b0a5;display:block;margin-top:1px}.shiori-archive .archive-card-bottom .round-arrow{position:static;flex:0 0 37px;width:37px;height:37px;font-size:21px}.shiori-archive .archive-no-results{text-align:center;padding:45px 10px;color:#7b897b}.shiori-archive .shiori-pagination{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:35px 0}.shiori-archive .shiori-pagination:empty{display:none}.shiori-archive .shiori-pagination .page-numbers{display:inline-flex;align-items:center;background:#eef3eb;border-radius:9px;padding:8px 14px;text-decoration:none;color:#54705b}.shiori-archive .shiori-pagination .current{background:#436e53;color:white}.shiori-archive .archive-soon{padding:70px 20px;text-align:center}.shiori-archive .archive-soon>span{font-size:45px}.shiori-archive .archive-soon h2{color:#49624c}.shiori-archive .archive-footer{border-top:1px solid #e8ece5;background:#f7f8f2;padding:27px 0;color:#748375;font-size:12px}.shiori-archive .archive-footer .container{display:flex;align-items:center;justify-content:space-between;gap:20px}.shiori-archive .archive-footer a{text-decoration:none;color:#52725c;font-weight:700}
@media(max-width:1020px){.shiori-archive .game-layout.archive-game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.shiori-archive .archive-header{padding:42px 0 24px}.shiori-archive .archive-intro{padding:20px}.shiori-archive .archive-intro-icon{font-size:29px}.shiori-archive .archive-tools{align-items:start;flex-direction:column;margin:32px 0 18px}.shiori-archive .archive-filter{width:100%;gap:6px}.shiori-archive .archive-filter-btn{font-size:12px;padding:9px 12px}.shiori-archive .game-layout.archive-game-grid{grid-template-columns:1fr;gap:17px}.shiori-archive .archive-game-card .image-wrap{aspect-ratio:1.8}.shiori-archive .archive-game-card .game-content{padding:18px 19px}.shiori-archive .game-content h2{font-size:21px}.shiori-archive .archive-card-desc{min-height:0}.shiori-archive .archive-main{padding-bottom:65px}}

/* v1.4.0 - Top page game cards: equal columns, responsive thumbnails */
#games .home-game-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:24px}
#games .home-game-grid>.game-card{min-width:0;height:100%;border-radius:24px;overflow:hidden}
#games .home-game-grid>.game-card .image-wrap{width:100%;height:auto;aspect-ratio:16 / 9;position:relative;flex:none;overflow:hidden;background:#edf1e9}
#games .home-game-grid>.game-card .image-wrap img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%}
#games .home-game-grid>.game-card .game-content{padding:24px 27px 27px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;flex:1}
#games .home-game-grid>.game-card .tag-row{gap:8px}
#games .home-game-grid>.game-card .tag{font-size:12px;padding:5px 11px;border-radius:8px}
#games .home-game-grid>.game-card h3{font-size:clamp(19px,2vw,25px);line-height:1.45;margin:19px 0 10px}
#games .home-game-grid>.game-card p{font-size:14px;line-height:1.8;padding-right:58px;overflow-wrap:anywhere}
#games .home-game-grid>.game-card .round-arrow{right:25px;bottom:24px}
@media(max-width:720px){#games .home-game-grid{grid-template-columns:1fr;gap:18px}#games .home-game-grid>.game-card .game-content{padding:21px 22px 24px}#games .home-game-grid>.game-card h3{font-size:21px;margin:15px 0 8px}#games .home-game-grid>.game-card p{font-size:13px}}

/* Ver.1.5 – editable privacy/contact pages and expanded about section */
.about-text p{margin:12px 0;color:#617268;line-height:1.95}
.about-text .quote{margin:9px 0 22px}
.about-signature{color:#466b52!important;font-family:var(--serif);font-weight:700;margin-top:23px!important;font-size:14px}
.shiori-subpage{min-height:75vh;background:linear-gradient(180deg,#f1f5ed 0,#fffefa 260px)}
.shiori-subpage-head{padding:64px 0 35px;text-align:center}
.shiori-subpage-head .section-title{font-size:clamp(30px,4vw,43px)}
.shiori-subpage-head p{margin:8px auto 0;max-width:660px;color:#728174;font-size:14px}
.shiori-page-grid{max-width:860px;margin:auto;padding-bottom:95px}
.shiori-page-paper{padding:clamp(25px,5vw,55px);border-radius:25px;background:#fff;border:1px solid #e1e8dd;box-shadow:0 12px 34px rgba(40,70,50,.055)}
.shiori-page-paper h2{font-size:22px;line-height:1.5;margin:35px 0 10px;color:#385643}
.shiori-page-paper h2:first-child{margin-top:0}
.shiori-page-paper h3{font-size:17px;color:#3f614d;margin:25px 0 8px}
.shiori-page-paper p,.shiori-page-paper li{line-height:1.95;color:#5e7062}
.shiori-page-paper a{color:#31694c;text-decoration:underline;text-underline-offset:3px}
.shiori-page-paper ul{padding-left:1.4em}
.shiori-contact-intro{max-width:720px;margin:0 auto 30px;font-size:15px;color:#617567}
.shiori-page-paper .wpcf7 label{display:block;color:#42614d;font-size:14px;font-weight:700;margin:22px 0 6px}
.shiori-page-paper .wpcf7 input:not([type=submit]):not([type=checkbox]),.shiori-page-paper .wpcf7 textarea,.shiori-page-paper .wpcf7 select{width:100%;max-width:100%;border:1px solid #cfdccf;border-radius:12px;background:#fffefa;padding:12px 15px;color:#394b3e;font:inherit;font-size:15px;outline-offset:3px}
.shiori-page-paper .wpcf7 input[type=checkbox]{accent-color:#456e50;margin-right:8px}
.shiori-page-paper .wpcf7 input[type=submit]{background:#4f735d;border:0;border-radius:30px;color:white;font:700 15px var(--sans);padding:13px 37px;cursor:pointer}
.shiori-page-paper .wpcf7 input[type=submit]:hover{background:#395641}
.shiori-page-paper .wpcf7 .wpcf7-not-valid-tip{font-size:12px;color:#ac4242}
.shiori-page-paper .wpcf7 .wpcf7-response-output{border-radius:10px;padding:14px;margin:18px 0 0}
.shiori-page-notice{background:#f4f7f1;border:1px solid #d9e4d7;border-radius:16px;padding:15px 20px;font-size:14px;color:#59705e}
.shiori-subpage .site-footer{margin-top:0}
@media(max-width:800px){.shiori-subpage-head{padding:43px 0 26px}.shiori-page-grid{padding-bottom:60px}}

.shiori-static-nav{display:flex;gap:23px;align-items:center;flex-wrap:wrap}
.shiori-static-nav a{text-decoration:none;color:#486350;font-size:13px;font-weight:700}
.shiori-static-nav a:hover{text-decoration:underline}
.shiori-breadcrumb{display:inline-block;margin-top:12px;text-decoration:none;color:#5d7a61;font-size:13px}
@media(max-width:700px){.shiori-static-nav{gap:12px}.shiori-static-nav a{font-size:11px}.shiori-static-nav a:nth-child(3){display:none}.shiori-subpage-head{padding-top:38px}}

/* Ver.1.5.1: Contact Form 7 form layout */
.shiori-page-paper .shiori-cf7-form{max-width:780px;margin:0 auto}
.shiori-page-paper .shiori-cf7-lead{margin:0 0 26px;color:#5f7364;line-height:1.9}
.shiori-page-paper .shiori-cf7-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.shiori-page-paper .shiori-field{min-width:0;margin:0 0 22px}
.shiori-page-paper .shiori-field label{display:block;margin:0 0 9px;font-weight:700;font-size:14px;color:#3d5e49}
.shiori-page-paper .shiori-field .wpcf7-form-control-wrap{display:block}
.shiori-page-paper .shiori-field input:not([type=checkbox]),
.shiori-page-paper .shiori-field select,
.shiori-page-paper .shiori-field textarea{box-sizing:border-box;display:block;width:100%;min-width:0;margin:0;border:1px solid #d3dfd3;border-radius:13px;background:#fffefb;min-height:52px;padding:13px 15px;font-family:inherit;font-size:15px;line-height:1.6;color:#314c3b;transition:border-color .2s,box-shadow .2s}
.shiori-page-paper .shiori-field textarea{min-height:190px;resize:vertical}
.shiori-page-paper .shiori-field :is(input,textarea,select):focus-visible{border-color:#4c8066;outline:none;box-shadow:0 0 0 3px rgba(91,139,108,.17)}
.shiori-page-paper .shiori-required{color:#b55849;font-weight:800}
.shiori-page-paper .shiori-cf7-consent{padding:18px 20px;margin:4px 0 28px;border-radius:14px;background:#f3f7f0;border:1px solid #dce7d8;color:#4a6554;font-size:14px;line-height:1.8}
.shiori-page-paper .shiori-cf7-consent .wpcf7-list-item{margin:0}
.shiori-page-paper .shiori-cf7-consent .wpcf7-list-item>label{display:flex;align-items:flex-start;gap:9px;margin:0;font-size:14px;font-weight:500;cursor:pointer}
.shiori-page-paper .shiori-cf7-consent input[type=checkbox]{flex-shrink:0;margin-top:6px}
.shiori-page-paper .shiori-cf7-consent a{font-weight:700;text-underline-offset:3px}
.shiori-page-paper .shiori-cf7-actions{display:flex;justify-content:center;margin-top:6px}
.shiori-page-paper .shiori-cf7-actions input[type=submit]{width:min(100%,320px);padding:15px 20px;border-radius:100px;min-height:54px;font-size:15px;transition:background .2s,transform .2s}
.shiori-page-paper .shiori-cf7-actions input[type=submit]:hover{transform:translateY(-1px)}
.shiori-page-paper .shiori-cf7-actions input[type=submit]:disabled{cursor:wait;opacity:.7}
.shiori-page-paper .wpcf7-spinner{margin:10px auto}
@media(max-width:640px){.shiori-page-paper .shiori-cf7-grid{grid-template-columns:1fr;gap:0}.shiori-page-paper .shiori-cf7-consent{padding:14px 15px}.shiori-page-paper .shiori-cf7-actions input[type=submit]{width:100%}}

/* v1.5.3: readings directly above Japanese kanji; never beside the word */
.find-result .jp ruby, #games .game-card ruby, .shiori-archive .game-card ruby {
    ruby-position: over;
    ruby-align: center;
    white-space: nowrap;
}
.find-result .jp rt, #games .game-card rt, .shiori-archive .game-card rt {
    font-family: 'Noto Sans JP', 'Noto Sans TC', sans-serif;
    font-size: .55em;
    line-height: 1;
    font-weight: 500;
    text-align: center;
}
.find-result .jp {line-height: 2.15; padding-top: .25em;}
#games .game-card h3, .shiori-archive .game-card h2 {line-height: 2; overflow-wrap: anywhere;}
#games .game-card .game-content p, .shiori-archive .game-card .archive-card-desc {line-height: 2.2;}
#games .tag-row .tag, .shiori-archive .archive-study .tag {line-height: 1.8;}
@media(max-width:600px) {
    .find-result .jp {line-height:2.1}
    #games .game-card h3 {line-height: 1.95;}
}

/* Ver 1.5.5 - About artwork, preserving its original aspect ratio. */
#about .about-image{display:flex;align-items:center;justify-content:center;min-width:0}
#about .about-image img{display:block;width:100%;height:auto;max-height:540px;object-fit:contain;object-position:center;border-radius:23px;background:#f8f6e8}
#games .home-game-grid .tag-row .tag{white-space:nowrap}
.shiori-archive .archive-study .tag-row{flex-wrap:wrap}
@media(max-width:720px){#about .about-image img{width:min(100%,430px);height:auto;max-height:none}}

/* v1.5.6 Spotlight integration */
.shiori-instagram-feed{max-width:960px;margin:30px auto 0;text-align:left;min-height:0}
.shiori-instagram-feed img{height:auto;max-width:100%}
.shiori-instagram-feed a:focus-visible{outline:3px solid #cf9a46;outline-offset:3px}
.shiori-instagram-feed :is(.sli-feed,.sli-container,.sli-grid){max-width:100%}
@media(max-width:800px){.shiori-instagram-feed{margin-top:24px}}
