/* ネストラン v3（1110 底上げ）：演出・手ざわり・新しい板。style.css → ui.css の後に読む */
[hidden]{display:none!important}
:root{--ease-pop:cubic-bezier(.2,1.5,.4,1);--ease-out:cubic-bezier(.2,.8,.2,1)}
/* ---- 押した手ごたえ ---- */
.btn{transition:transform .09s var(--ease-out),filter .12s}
.btn:active{transform:translateY(3px) scale(.975);filter:brightness(.94)}
@media (hover:hover){.btn:hover{filter:brightness(1.06)}}
.btn.main{overflow:hidden}
.btn.main:after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:28%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:shine 3.2s infinite 1s;pointer-events:none}
@keyframes shine{0%{left:-40%}28%,100%{left:130%}}
.modal .card{animation:cardin .32s var(--ease-pop)}
@keyframes cardin{0%{transform:translateY(26px) scale(.94);opacity:0}}
.modal{animation:fadein .2s}@keyframes fadein{0%{opacity:0}}
.modal{z-index:30}#setm,#how{z-index:32}
/* ---- 切りかえ ---- */
#wipe{position:fixed;inset:0;z-index:50;pointer-events:none;background:radial-gradient(circle at 50% 46%,#fff6d8 0,#ffd98a 38%,#f5a83a 100%);clip-path:circle(0 at 50% 50%);display:none}
#wipe:before{content:"";position:absolute;left:50%;top:46%;width:110px;height:140px;margin:-70px 0 0 -55px;background:url(ui/egg_g.png) center/contain no-repeat;animation:wegg .8s linear infinite}
@keyframes wegg{0%{transform:rotate(-12deg)}50%{transform:rotate(12deg) translateY(-8px)}100%{transform:rotate(-12deg)}}
#wipe.in{display:block;pointer-events:auto;animation:wipein .33s var(--ease-out) forwards}
#wipe.out{display:block;clip-path:circle(150% at 50% 50%);animation:wipeout .36s ease-in forwards}
@keyframes wipein{to{clip-path:circle(150% at 50% 50%)}}
@keyframes wipeout{to{clip-path:circle(0 at 50% 50%)}}
/* ---- 画面のふち・速さの線 ---- */
#vig,#speed{position:fixed;inset:0;pointer-events:none;z-index:2;opacity:0}
#vig.alarm{box-shadow:inset 0 0 90px 22px rgba(255,40,30,.6);animation:vpulse 1.5s forwards}
#vig.good{opacity:1;box-shadow:inset 0 0 90px 10px rgba(255,214,90,.65);animation:vfade .7s forwards}
#vig.hurt{opacity:1;box-shadow:inset 0 0 120px 30px rgba(255,60,40,.55);animation:vfade .45s forwards}
@keyframes vpulse{0%,33%,66%{opacity:1}16%,50%{opacity:.35}100%{opacity:0}}@keyframes vfade{to{opacity:0}}
#speed{background:center/cover no-repeat;transition:opacity .25s;will-change:opacity,transform}
#speed.on{opacity:.6;animation:spd .14s steps(2) infinite}
@keyframes spd{50%{transform:rotate(2.6deg) scale(1.03)}}
/* ---- タイトル ---- */
.logo{animation:logoin .7s var(--ease-pop),bob 3.6s ease-in-out infinite .7s}
@keyframes logoin{0%{transform:translateY(-40px) scale(.7);opacity:0}}
@keyframes bob{50%{transform:translateY(-5px)}}
.logo .emblem{position:relative;overflow:hidden}
.logo .emblem i{position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.8) 50%,transparent 65%);transform:translateX(-120%);animation:embl 3.4s infinite 1.2s}
@keyframes embl{0%{transform:translateX(-120%)}30%,100%{transform:translateX(120%)}}
.tcard{animation:cardin .5s var(--ease-pop) .12s backwards}
.card.panel.tcard{padding:26px 22px 20px}
.mecard{display:flex;gap:10px;align-items:center;padding:6px 10px;border-radius:14px;background:rgba(255,255,255,.72);box-shadow:0 0 0 2px rgba(201,138,62,.35) inset}
#meBuddy{width:64px;height:64px;flex:none;animation:bob 2.2s ease-in-out infinite}
.mebox{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.mebox input{height:34px;padding:2px 10px;font-weight:800;font-size:16px;width:100%}
.rankrow{display:flex;align-items:baseline;gap:8px;font-size:12.5px}
.rankrow b{font-size:14px;color:#fff;background:linear-gradient(#f7a13a,#e2700c);padding:0 9px;border-radius:99px;box-shadow:0 2px 0 #a64d06;white-space:nowrap}
.rankrow span{font-weight:800;color:var(--wood2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rankrow em{margin-left:auto;font-style:normal;font-weight:900;color:#e2700c;font-size:18px}
.xpbar{height:8px;border-radius:99px;background:rgba(90,60,20,.18);overflow:hidden;box-shadow:0 1px 0 rgba(255,255,255,.7)}
.xpbar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#ffd34d,#ff9a2e);transition:width .55s var(--ease-out)}
.xpbar.big{height:14px}.xpbar.warm i{background:linear-gradient(90deg,#ffb08a,#ff6f61)}
.skills{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.skills button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px 5px;border-radius:14px;background:rgba(255,255,255,.6);box-shadow:0 0 0 2px rgba(201,138,62,.3) inset,0 3px 0 rgba(138,85,34,.25);font-size:11.5px;font-weight:800;color:var(--wood2);transition:transform .15s var(--ease-pop),background .15s;white-space:nowrap}
.skills button .sk-ic{width:40px!important;height:40px!important;transition:transform .2s var(--ease-pop)}
.skills button.on{background:linear-gradient(#fff,#ffeeb8);box-shadow:0 0 0 3px var(--gold) inset,0 0 0 2px #fff,0 4px 0 var(--gold2);transform:translateY(-3px);color:var(--ink)}
.skills button.on .sk-ic{transform:scale(1.15) rotate(-6deg)}
.skill{margin:6px 0 10px;padding:6px 10px;font-size:13px}.skill b{display:block}.skill small{display:block;font-size:11.5px;line-height:1.4}
#bSolo{flex-direction:column;gap:0;line-height:1.1;height:66px;padding-bottom:6px}#bSolo span{font-size:21px}#bSolo small{font-size:11.5px;opacity:.9;letter-spacing:.08em;font-weight:700}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:-4px 0 2px;border-radius:12px;overflow:hidden;box-shadow:0 0 0 2px var(--wood) inset;background:rgba(255,255,255,.6)}
.seg button{height:32px;font-size:12.5px;font-weight:800;color:var(--wood2)}
.seg button.on{background:linear-gradient(#ffb547,#f08a1f);color:#fff;text-shadow:0 1px 0 #a64d06}
.seg button.lock{opacity:.45}
.tabs4{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.tabs4 .btn{font-size:12px;height:42px;padding:0 2px;white-space:nowrap}
@media (min-width:900px) and (min-aspect-ratio:5/4){#title.on{flex-direction:row;justify-content:center;align-items:center;gap:5vw}#title .logo{transform-origin:center;scale:1.25}}
@media (max-width:380px){.card.panel.tcard{padding:24px 16px 18px}.skills button{font-size:10.5px}.tabs4 .btn{font-size:11px}}
/* ---- 試合の画面 ---- */
#bMenu{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center}#bMenu i{width:18px;height:3px;border-radius:2px;background:var(--wood2)}
#myNest{position:relative}
#myRank{position:absolute;left:50%;bottom:-13px;transform:translateX(-50%);font-style:normal;font-size:11px;font-weight:900;color:#fff;background:var(--teal);padding:0 8px;border-radius:99px;white-space:nowrap;box-shadow:0 0 0 2px #fff}
#myRank:empty{display:none}
#myRank.top{background:linear-gradient(#ffcf4d,#f09a1b);color:#5a2d06}
#myRank.bump{animation:rbump .45s var(--ease-pop)}@keyframes rbump{40%{transform:translateX(-50%) scale(1.6)}}
#carry{width:auto;min-width:40px;padding:0 7px;display:flex;gap:3px;align-items:center;justify-content:center}
#carryPts{color:#fff;font-size:14px;font-weight:900}
#carry.on{animation:carryin .3s var(--ease-pop)}@keyframes carryin{0%{transform:scale(.3)}}
#goal{position:fixed;left:50%;top:calc(max(10px,env(safe-area-inset-top)) + 46px);transform:translate(-50%,-8px);display:flex;align-items:center;gap:7px;padding:5px 14px 5px 8px;border-radius:99px;background:linear-gradient(#fffaf0,#ffe9b0);border:2px solid var(--gold);box-shadow:0 3px 0 var(--gold2),0 6px 14px rgba(0,0,0,.2);font-weight:800;font-size:13.5px;white-space:nowrap;opacity:0;transition:.25s var(--ease-pop);pointer-events:none;z-index:4}
#goal.on{opacity:1;transform:translate(-50%,0)}
#goal .gi{width:22px;height:22px;border-radius:50%;background:var(--teal);display:grid;place-items:center;color:#fff;font-style:normal;font-size:12px;font-weight:900}
#goal .gi:before{content:attr(data-n)}
#goal b{font-size:11px;color:var(--wood2);opacity:.7}
#goal.done{background:linear-gradient(#eaffd8,#b9f09a);border-color:#4fae3a;animation:goalok .5s var(--ease-pop)}
#goal.done .gi{background:#3d9d2c}#goal.done .gi:before{content:"✓"}
@keyframes goalok{0%{transform:translate(-50%,0) scale(1.25)}}
#board li{transition:transform .35s var(--ease-pop)}#board li b.bump{animation:bump .4s}
#last10{position:fixed;left:50%;top:30%;transform:translate(-50%,-50%);font-size:120px;font-weight:900;color:rgba(255,255,255,.92);-webkit-text-stroke:10px rgba(165,40,26,.85);paint-order:stroke fill;pointer-events:none;opacity:0}
#last10.tick{animation:l10 .95s ease-out}
@keyframes l10{0%{opacity:.95;transform:translate(-50%,-50%) scale(1.5)}25%{transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(.9)}}
#stamps{position:fixed;left:10px;top:calc(max(10px,env(safe-area-inset-top)) + 176px);display:flex;flex-direction:column;gap:6px;pointer-events:none;z-index:4;max-width:70vw}
.stampc{display:flex;align-items:center;gap:7px;padding:5px 12px 5px 7px;border-radius:12px;background:rgba(20,36,59,.82);color:#fff;font-size:12.5px;font-weight:700;border-left:4px solid var(--gold);animation:stin .4s var(--ease-pop);transition:.4s;width:max-content;max-width:100%}
.stampc.out{opacity:0;transform:translateX(-30px)}
.stampc.ms{background:linear-gradient(90deg,#2d9d4a,#56c66a);border-left-color:#fff;font-size:13.5px;box-shadow:0 4px 12px rgba(0,0,0,.25)}
@keyframes stin{0%{transform:translateX(-60px);opacity:0}}
.chk{flex:none;width:18px;height:18px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.7) inset;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:900}
.stampc.ms .chk,.mslist li.done .chk{background:#fff;color:#2d9d4a;box-shadow:none}.stampc.ms .chk:before,.mslist li.done .chk:before{content:"✓"}
.act{transition:transform .08s var(--ease-out),filter .1s}.act.on{transform:scale(.88);filter:brightness(1.15)}
.act .cdn{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;font-size:30px;font-weight:900;color:#fff;text-shadow:0 2px 4px #000;z-index:2;pointer-events:none}
.act.hot{outline:5px solid rgba(255,255,255,.9);outline-offset:2px;animation:hot .5s infinite}@keyframes hot{50%{transform:scale(1.08)}}
.act.ready{animation:ready .6s var(--ease-pop)}@keyframes ready{0%{transform:scale(1.25);filter:brightness(1.8)}}
#banner{z-index:4}#banner b{font-size:32px}
#banner.on b{animation:banin .45s var(--ease-pop)}@keyframes banin{0%{transform:scale(1.7);opacity:0}}
#banner.rush b{-webkit-text-stroke-color:#b8560a;color:#fff3b0}#banner.top b{-webkit-text-stroke-color:#a86b00;color:#ffe14d}
#count.go{animation:pop .5s var(--ease-pop)}
#finish{position:fixed;inset:0;display:none;align-items:center;justify-content:center;pointer-events:none;z-index:5}
#finish.on{display:flex}
#finish:before,#finish:after{content:"";position:absolute;left:0;right:0;height:11vh;background:#14243b;animation:lbx .35s var(--ease-out) backwards}
#finish:before{top:0;transform-origin:top}#finish:after{bottom:0;transform-origin:bottom}@keyframes lbx{0%{transform:scaleY(0)}}
#finish b{font-size:min(19vw,110px);font-weight:900;color:#fff;-webkit-text-stroke:12px #8a4a12;paint-order:stroke fill;text-shadow:0 8px 0 #5a2d06;animation:fin .6s var(--ease-pop);white-space:nowrap;rotate:-4deg}
@keyframes fin{0%{transform:scale(3);opacity:0}}
.pop{animation:popin .3s var(--ease-pop)}@keyframes popin{0%{scale:.2}}
.pop.big{font-size:34px}.pop.huge{font-size:46px}
#arrows i.home:after,#arrows i.gold:after,#arrows i.thief:after{content:"";position:absolute;left:-52px;top:-13px;width:26px;height:26px;border-radius:50%;background:#fff center/72% no-repeat;box-shadow:0 0 0 2px var(--c),0 2px 4px rgba(0,0,0,.3)}
#arrows i.home:after{background-image:url(ui/nest.png)}#arrows i.gold:after{background-image:url(ui/egg_g.png)}#arrows i.thief:after{background-image:url(ui/alarm.png)}
.tag.nest.mine{box-shadow:0 0 0 3px #fff,0 0 14px 4px var(--nc);font-size:19px}
.tag.nest.mine:before{content:"じぶんの巣 ";font-size:11px;font-weight:800}
/* ---- 結果 ---- */
#ovStamp{position:fixed;left:50%;top:max(5vh,env(safe-area-inset-top));transform:translateX(-50%);text-align:center;opacity:0;pointer-events:none;white-space:nowrap}
#ovStamp.on{opacity:1;animation:fin .6s var(--ease-pop)}
#ovStamp b{display:block;font-size:min(15vw,72px);font-weight:900;color:#fff;-webkit-text-stroke:10px #126174;paint-order:stroke fill;text-shadow:0 6px 0 #0b4352;line-height:1.1}
#ovStamp.win b{-webkit-text-stroke-color:#b8560a;color:#fff3b0;text-shadow:0 6px 0 #7a3a05,0 0 30px #ffd34d;animation:winb 1.2s ease-in-out infinite}
@keyframes winb{50%{transform:scale(1.06) rotate(-2deg)}}
#ovStamp small{display:inline-block;margin-top:2px;padding:2px 14px;border-radius:99px;background:rgba(20,36,59,.75);color:#fff;font-size:13px;font-weight:700}
#over .card.ovcard{display:flex;flex-direction:column;max-height:62vh;overflow:hidden;animation:cardin .5s var(--ease-pop) .3s backwards;padding:24px 20px 18px}
#ovPages{flex:1;min-height:0;overflow:auto;touch-action:pan-y;margin-bottom:10px}
.ovp{display:none}.ovp.on{display:block;animation:fadein .3s}
#ovList{max-height:none;margin:0 0 8px;gap:5px}
#ovList li{transition:transform .4s var(--ease-pop),opacity .25s;padding:6px 10px}
#ovList li.hid,.aw.hid,#ovParts li.hid,.mslist li.hid{opacity:0;transform:translateX(40px)}
#ovList li .st{display:block!important}
#ovAwards{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.aw{display:flex;flex-direction:column;align-items:center;padding:5px 2px;border-radius:12px;background:linear-gradient(#fff,#fff1c4);border:2px solid var(--gold);transition:.35s var(--ease-pop);min-width:0}
.aw small{font-size:10px;color:var(--wood2);font-weight:800;margin:0;opacity:1}.aw b{font-size:13px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.aw span{font-size:11px;opacity:.7}
#ovXp{padding:8px 12px;border-radius:14px;background:rgba(255,255,255,.75);box-shadow:0 0 0 2px rgba(201,138,62,.35) inset;margin-bottom:8px}
#ovXp.up{animation:lvup .8s var(--ease-pop)}@keyframes lvup{0%{transform:scale(1.08);box-shadow:0 0 0 3px var(--gold) inset,0 0 40px 10px #ffd34d}}
#ovParts{list-style:none;display:flex;flex-wrap:wrap;gap:4px 10px;margin:6px 0 0;padding:0;font-size:12px}
#ovParts li{transition:.3s var(--ease-pop)}#ovParts li b{margin-left:4px;color:#e2700c}
.mslist{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column;gap:4px}
.mslist li{display:flex;align-items:center;gap:8px;padding:5px 10px;border-radius:10px;background:rgba(255,255,255,.7);font-size:13px;transition:.3s var(--ease-pop)}
.mslist li .chk{box-shadow:0 0 0 2px var(--wood) inset}.mslist li b{margin-left:auto;font-size:12px;color:var(--wood2)}
.mslist li.done{background:linear-gradient(90deg,#d9f7c8,#f2ffe6);font-weight:800}.mslist li.done .chk{background:#2d9d4a;color:#fff}
.mslist li.stamp .chk{animation:stampin .4s var(--ease-pop)}@keyframes stampin{0%{transform:scale(3.2) rotate(-30deg);opacity:0}}
#pause .mslist li,#rec .mslist li{background:#fff}
#ovEgg{margin:0 0 8px;padding:4px 8px}#ovEgg canvas{width:70px;height:70px}
#ovWarm,#zkWarm{display:flex;align-items:center;gap:12px;padding:6px 10px;border-radius:14px;background:linear-gradient(#fff3ea,#ffe1cf);border:2px solid #ffb08a;margin:0 0 8px}
#ovWarm canvas,#zkWarm canvas{width:76px;height:76px;flex:none}
.warmegg{animation:warm 1.4s ease-in-out infinite;transform-origin:50% 90%;filter:drop-shadow(0 0 8px rgba(255,140,90,.7))}
@keyframes warm{25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}
.hatching .warmegg{animation:crackk .19s linear infinite}@keyframes crackk{25%{transform:rotate(-13deg) translateX(-3px)}75%{transform:rotate(13deg) translateX(3px)}}
.born{animation:born .7s var(--ease-pop)}@keyframes born{0%{transform:scale(0) rotate(-40deg)}60%{transform:scale(1.3)}}
.bornbox{background:linear-gradient(#fffbe0,#ffe98a)!important;border-color:var(--gold)!important;box-shadow:0 0 24px 4px rgba(255,211,77,.8)}
.wtxt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.wtxt b{font-size:15px;color:#d1492e}.wtxt span{font-size:12px}
@media (min-aspect-ratio:4/3){#ovStamp{left:27%;top:7vh}#over .card.ovcard{max-height:92vh}}
@media (max-aspect-ratio:3/4){#ovList li{padding:4px 10px}#ovList li .st{font-size:10px}}
/* ---- ひな・図鑑・きろく・設定・遊び方 ---- */
#zukan .card{width:min(520px,100%)}
.zk{position:relative;cursor:pointer;transition:transform .12s var(--ease-pop)}.zk:active{transform:scale(.94)}
.zk em{position:absolute;right:2px;top:2px;font-style:normal;font-size:9.5px;font-weight:800;color:#fff;background:var(--teal);padding:0 5px;border-radius:99px}
.zk em.cnt{background:rgba(90,60,20,.55)}
.zk.pet{background:linear-gradient(#fff,#e9fbff);border-color:#8fd3e6}
.zk.buddy{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold),0 0 12px rgba(255,211,77,.8)}.zk.buddy em{background:#e2700c}
.zk.warming{border-color:#ff8f6b;box-shadow:0 0 0 2px #ffb08a}.zk.warming canvas{animation:warm 1.4s ease-in-out infinite;transform-origin:50% 90%}
.zk.no{cursor:default}
.how3{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:6px}
.how3 li{display:flex;gap:10px;align-items:center;padding:7px 10px;border-radius:12px;background:rgba(255,255,255,.75);box-shadow:0 0 0 2px rgba(201,138,62,.3) inset}
.how3 li div{display:flex;flex-direction:column}.how3 b{font-size:15px}.how3 span{font-size:12.5px;line-height:1.4}
.hi{flex:none;width:46px;height:46px;border-radius:50%;background:#fff center/66% no-repeat;box-shadow:0 0 0 3px var(--gold),0 3px 0 var(--gold2)}
.hi-1{background-image:url(ui/egg_w.png)}.hi-2{background-image:url(ui/nest.png)}.hi-3{background-image:url(ui/hit.png);background-color:var(--coral)}
.howl{font-size:12.5px}
.rrow{display:flex;justify-content:space-between;gap:10px;padding:5px 10px;border-radius:8px;font-size:13.5px}.rrow:nth-child(odd){background:rgba(255,255,255,.65)}.rrow b{white-space:nowrap}
.subh{margin:12px 0 6px;font-size:13px;color:var(--wood2)}
.sl{display:flex;align-items:center;gap:12px;margin:10px 0;font-weight:800;font-size:14px}.sl span{width:92px;flex:none}.sl input{flex:1;accent-color:#e2700c;height:28px;padding:0;box-shadow:none;border:0;background:none}
#pause .card,#setm .card,#rec .card{width:min(400px,100%)}
#setm .btn,#rec .btn,#how .btn,#zukan .btn{margin-top:6px}
/* 小さい画面・横向き */
@media (max-height:500px){#goal{top:calc(max(10px,env(safe-area-inset-top)) + 40px);font-size:12px}#stamps{top:calc(max(10px,env(safe-area-inset-top)) + 140px)}#last10{font-size:84px}#over .card.ovcard{max-height:94vh}}
@media (max-width:420px){#goal{font-size:12.5px;top:calc(max(10px,env(safe-area-inset-top)) + 150px)}#stamps{top:calc(max(10px,env(safe-area-inset-top)) + 196px)}}
@media (prefers-reduced-motion:reduce){.logo,.btn.main:after,#meBuddy,.warmegg{animation:none}}

#zukan .ribbon{white-space:nowrap;font-size:17px}#zkCount{display:block;font-size:12px;letter-spacing:0;line-height:1.2;opacity:.95}
#over .card.ovcard{max-height:66vh}
@media (min-aspect-ratio:4/3){#over .card.ovcard{max-height:92vh}}

body:not([data-scr=hud]) #vig,body:not([data-scr=hud]) #speed{display:none}
/* タブレット・PC：板と試合の部品を大きく */
@media (min-width:700px) and (min-height:740px){#title .tcard,#lobby .card,.modal .card{zoom:1.16}#over .ovcard{zoom:1.2}#topL,#mini,#board,#timer,#goal,#stamps{zoom:1.25}#acts{transform:scale(1.3);transform-origin:right bottom}#banner b{font-size:44px}#banner small{font-size:16px}.tag{font-size:14px}.tag.nest{font-size:20px}}
@media (min-width:700px) and (min-height:1000px){#title .tcard,#lobby .card,.modal .card{zoom:1.4}#over .ovcard{zoom:1.45}#title .logo{zoom:1.4}}

/* B の担当 11/10 夜：スマホの点の表の上下の行が ふちの絵の下に入っていた */
@media (max-width:420px){#board{padding:10px 9px 11px}#goal{top:calc(max(10px,env(safe-area-inset-top)) + 160px)}#stamps{top:calc(max(10px,env(safe-area-inset-top)) + 204px)}}
/* 11/11：横長の画面のタイトルで、大きくした題の字が板にふれていた → 間をあける */
@media (min-width:900px) and (min-aspect-ratio:5/4){#title .logo{margin:0 52px 0 44px}}
/* 11/11：たまごが 3 こまでの巣は取られない → 点の札に盾の印 */
.tag.nest.safe:after{content:"";display:inline-block;width:.72em;height:.82em;margin-left:5px;vertical-align:-.08em;background:#fff;clip-path:polygon(50% 0,100% 16%,100% 55%,50% 100%,0 55%,0 16%);opacity:.92}

/* ---- 11/11：待合（1 人ずつの札：キャラの姿・巣・技・じゅんびOK） ---- */
#lobby .card{width:min(94vw,560px)}
.lbcode{display:flex;align-items:center;justify-content:center;gap:10px;margin:2px 0 8px;font-weight:800;color:var(--wood2)}
.lbcode span{font-size:12px;opacity:.8}.lbcode b{font-size:26px;letter-spacing:.14em;color:#3a2a14;background:#fff;border:2px dashed var(--gold);border-radius:12px;padding:2px 14px;font-family:ui-monospace,Consolas,monospace}
.lbcode .btn{width:auto;padding:0 14px;min-height:34px}
#lbList{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-height:none;overflow:visible;margin:4px 0 10px}
#lbList li.lbp{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 4px 7px;background:linear-gradient(#fffdf6,#fff3d6);border:2px solid var(--cream2);border-radius:14px;min-width:0;animation:lbin .35s var(--ease-pop) backwards}
#lbList li.lbp:nth-child(2){animation-delay:.04s}#lbList li.lbp:nth-child(3){animation-delay:.08s}#lbList li.lbp:nth-child(4){animation-delay:.12s}#lbList li.lbp:nth-child(5){animation-delay:.16s}#lbList li.lbp:nth-child(6){animation-delay:.2s}#lbList li.lbp:nth-child(7){animation-delay:.24s}#lbList li.lbp:nth-child(8){animation-delay:.28s}
@keyframes lbin{from{opacity:0;transform:translateY(10px) scale(.92)}}
#lbList li.me{border-color:var(--teal);box-shadow:0 0 0 2px rgba(31,154,160,.25)}
#lbList li.ready{border-color:#4fae3a;background:linear-gradient(#f6ffe9,#dcf7c4)}
.lbst{position:relative;width:76px;height:80px}
.lbst canvas{position:absolute;left:50%;bottom:9px;width:68px;height:68px;transform:translateX(-50%);image-rendering:pixelated;animation:lbbob 2.4s ease-in-out infinite}
.lbp:nth-child(even) .lbst canvas{animation-delay:-1.1s}
@keyframes lbbob{50%{transform:translateX(-50%) translateY(-3px)}}
.lbst .lbnest{position:absolute;left:50%;bottom:-2px;width:74px;height:34px;transform:translateX(-50%);background:url(ui/nest.png) center/contain no-repeat}
.lbst .lbegg{position:absolute;left:50%;bottom:10px;width:38px;height:46px;transform:translateX(-50%);background:url(ui/egg_w.png) center/contain no-repeat;opacity:.9;animation:lbbob 3s ease-in-out infinite}
.lbst canvas.lbpet{left:auto;right:-8px;bottom:2px;width:34px;height:34px;transform:none;animation:none}
.lbp .nm{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px;color:#3a2a14}
.lbsk{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:800;color:#fff;padding:1px 7px 1px 2px;border-radius:99px;background:var(--c,#8a7a5c);white-space:nowrap}
.lbsk i{width:18px;height:18px;border-radius:50%;background:#fff center/86% no-repeat}
.lbsk[data-g=NT]{--c:var(--NT)}.lbsk[data-g=NF]{--c:var(--NF)}.lbsk[data-g=SJ]{--c:var(--SJ)}.lbsk[data-g=SP]{--c:var(--SP)}
.lbsk.none{background:none;color:#9a8a6a;font-weight:700;padding:1px 2px;white-space:normal;text-align:center;line-height:1.25;font-size:9.5px}
.lbp.cpu,.lbp.open{background:rgba(255,255,255,.55);border-style:dashed}.lbp.cpu .nm,.lbp.open .nm{color:#9a8a6a}.lbp.open .lbnest{opacity:.4}
.lbhost{position:absolute;left:-4px;top:-7px;font-style:normal;font-size:10px;font-weight:800;color:#5a3a08;background:linear-gradient(#ffe58a,#f5c33a);border:1.5px solid #b98a1c;border-radius:8px;padding:0 6px 0 20px;line-height:17px}
.lbhost:before{content:"";position:absolute;left:1px;top:-3px;width:19px;height:19px;background:url(ui/crown.png) center/contain no-repeat}
.lbok{position:absolute;right:-5px;top:20px;font-style:normal;font-size:10.5px;font-weight:900;color:#fff;background:#3d9d2c;border:2px solid #fff;border-radius:8px;padding:0 6px;line-height:18px;transform:rotate(8deg) scale(0);box-shadow:0 2px 0 #2b7420}
.lbp.ready .lbok{transform:rotate(8deg) scale(1);transition:transform .3s var(--ease-pop)}
.lbmy{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:0 0 6px;font-size:12px;font-weight:800;color:var(--wood2)}
#lbSkill{display:flex;gap:5px}
#lbSkill button{width:40px;height:40px;border-radius:12px;border:2px solid var(--cream2);background:#fff center/78% no-repeat;cursor:pointer;padding:0}
#lbSkill button.on{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold),0 3px 0 var(--gold2);transform:translateY(-1px)}
#bReady{width:auto;padding:0 16px 0 12px;display:inline-flex;align-items:center;gap:6px}
#bReady .chk{width:18px;height:18px;border-radius:50%;border:2px solid #fff;display:inline-block;box-sizing:border-box}
#bReady.on{filter:hue-rotate(-70deg) saturate(1.2)}#bReady.on .chk{background:#fff;box-shadow:inset 0 0 0 3px #3d9d2c}
@media (max-width:480px){#lbList{grid-template-columns:repeat(4,1fr);gap:5px}.lbst{width:66px;height:72px}.lbst canvas{width:60px;height:60px}.lbst .lbnest{width:64px;height:30px}.lbp .nm{font-size:11.5px}.lbsk{font-size:9px;padding-right:5px}.lbsk i{width:15px;height:15px}.lbcode b{font-size:22px}.lbok{font-size:9.5px;right:-3px}}
@media (max-height:500px){#lbList{grid-template-columns:repeat(8,1fr)}#lobby .card{width:min(96vw,860px)}.lbst{width:66px;height:70px}.lbst canvas{width:58px;height:58px}}
@media (prefers-reduced-motion:reduce){.lbst canvas,.lbst .lbegg,#lbList li.lbp{animation:none}}

/* ---- 11/11：知らせの帯（字だけ → 帯と印。今ある絵で） ---- */
#banner{padding:12px 40px 10px;min-width:min(74vw,400px);--bc1:#1f9aa0;--bc2:#167f86}
#banner:before{content:"";position:absolute;inset:8px 0 6px;z-index:-1;background:linear-gradient(90deg,transparent,var(--bc1) 12%,var(--bc2) 50%,var(--bc1) 88%,transparent);border-top:2px solid rgba(255,255,255,.7);border-bottom:3px solid rgba(0,0,0,.2);box-shadow:0 6px 18px rgba(0,0,0,.18);transform:skewX(-10deg) scaleX(0);transition:transform .3s var(--ease-pop)}
#banner.on:before{transform:skewX(-10deg) scaleX(1)}
#banner:after{content:"";position:absolute;left:50%;top:-34px;width:52px;height:52px;margin-left:-26px;background:var(--bi,none) center/contain no-repeat;filter:drop-shadow(0 3px 0 rgba(0,0,0,.25));transform:scale(0)}
#banner.on:after{transform:scale(1);transition:transform .35s var(--ease-pop) .08s}
#banner small{background:rgba(20,36,59,.55)}
#banner.gold{--bc1:#f2b21b;--bc2:#d98a00;--bi:url(ui/egg_g.png)}
#banner.rainbow{--bi:url(ui/egg_r.png)}#banner.rainbow:before{background:linear-gradient(90deg,transparent,#e5484d 10%,#f2b21b 28%,#2f9e66 46%,#38b6e8 64%,#8a5cd8 82%,transparent)}
#banner.rush{--bc1:#f08a24;--bc2:#d9660a;--bi:url(ui/egg_s.png)}
#banner.alarm{--bc1:#e5484d;--bc2:#b3261e;--bi:url(ui/alarm.png)}#banner.alarm:after{animation:shake .35s 3}
#banner.steal{--bc1:#1f9aa0;--bc2:#126174;--bi:url(ui/nest.png);padding:8px 30px 7px}#banner.steal b{font-size:24px}#banner.steal:after{width:40px;height:40px;margin-left:-20px;top:-24px}
#banner.top{--bc1:#f2b21b;--bc2:#c98700;--bi:url(ui/crown.png)}
#banner.fall{--bc1:#3d6fe0;--bc2:#2a4fa8}
@media (min-width:700px) and (min-height:740px){#banner.steal b{font-size:32px}#banner:after{width:66px;height:66px;margin-left:-33px;top:-44px}}
@media (max-height:500px){#banner{padding:8px 30px 7px}#banner:after{width:38px;height:38px;margin-left:-19px;top:-22px}}
/* 待合の札：姿を大きく・じゅんびOK の印は顔にかぶらない右上へ */
.lbst{width:88px;height:92px}.lbst canvas{width:84px;height:84px;bottom:8px}.lbst .lbnest{width:80px;height:36px}.lbst .lbegg{width:42px;height:50px}
.lbok{top:-8px;right:-6px}
@media (max-width:480px){.lbst{width:70px;height:78px}.lbst canvas{width:68px;height:68px}.lbst .lbnest{width:66px;height:30px}.lbok{top:-7px;right:-4px}}
@media (max-height:500px){.lbst{width:70px;height:74px}.lbst canvas{width:64px;height:64px}}
/* 待合：スマホの横持ち（高さ 500 より低い）で、はじめる・もどるが入りきるように */
@media (max-height:500px){#lobby .card{max-height:98vh;overflow-y:auto;padding-top:10px;padding-bottom:10px}#lobby h2.ribbon{display:none}.lbcode{margin:0 0 6px}#lobby .btns{flex-direction:row-reverse;gap:8px}#lobby .btns .btn{flex:1}#lbNote{margin:2px 0 6px}}

/* ---- 11/11 夕：山場の演出 ---- */
#rays{position:fixed;left:calc(50% - 100vmax);top:calc(var(--ry,22%) - 100vmax);width:200vmax;height:200vmax;pointer-events:none;z-index:2;opacity:0;--rc:rgba(255,226,120,.55);background:repeating-conic-gradient(from 0deg,var(--rc) 0deg 6deg,transparent 6deg 15deg);-webkit-mask:radial-gradient(circle,#000 0,rgba(0,0,0,.85) 8%,transparent 30%);mask:radial-gradient(circle,#000 0,rgba(0,0,0,.85) 8%,transparent 30%);mix-blend-mode:screen}
#rays.on{animation:rays 1.5s ease-out forwards}
@keyframes rays{0%{opacity:0;transform:rotate(0) scale(.5)}14%{opacity:1}100%{opacity:0;transform:rotate(38deg) scale(1.15)}}
#rays.gold{--rc:rgba(255,214,90,.6)}#rays.rush{--rc:rgba(255,190,110,.55)}#rays.white{--rc:rgba(255,255,255,.55)}#rays.red{--rc:rgba(255,90,70,.45)}
#rays.rainbow{background:repeating-conic-gradient(from 0deg,rgba(255,110,110,.5) 0deg 5deg,transparent 5deg 12deg,rgba(255,220,90,.5) 12deg 17deg,transparent 17deg 24deg,rgba(110,230,160,.5) 24deg 29deg,transparent 29deg 36deg,rgba(110,190,255,.5) 36deg 41deg,transparent 41deg 48deg,rgba(200,140,255,.5) 48deg 53deg,transparent 53deg 60deg)}
#eggrain{position:fixed;inset:0;pointer-events:none;z-index:2;overflow:hidden}
#eggrain i{position:absolute;top:-80px;width:var(--sz,44px);height:calc(var(--sz,44px) * 1.2);background:center/contain no-repeat;animation:eggfall 1.5s cubic-bezier(.45,.05,.7,.4) forwards;filter:drop-shadow(0 4px 2px rgba(0,0,0,.25))}
@keyframes eggfall{0%{transform:translateY(0) rotate(0)}100%{transform:translateY(118vh) rotate(var(--rot,60deg))}}
body:not([data-scr=hud]) #rays,body:not([data-scr=hud]) #eggrain{display:none}
#board li.up{animation:rowup .9s ease-out}#board li.dn{animation:rowdn .9s ease-out}
@keyframes rowup{0%{background:rgba(110,230,140,.6)}100%{background:transparent}}@keyframes rowdn{0%{background:rgba(255,100,90,.45)}100%{background:transparent}}
#finish b{position:relative}#finish:after{box-shadow:0 -40vh 0 40vh rgba(255,255,255,0)}
#ovStamp:before{content:"";position:absolute;left:50%;top:50%;width:150vmin;height:150vmin;margin:-75vmin 0 0 -75vmin;z-index:-1;background:repeating-conic-gradient(from 0deg,rgba(150,230,240,.35) 0deg 6deg,transparent 6deg 15deg);-webkit-mask:radial-gradient(circle,#000 0,transparent 42%);mask:radial-gradient(circle,#000 0,transparent 42%);animation:spin 14s linear infinite;opacity:.9}
#ovStamp.win:before{background:repeating-conic-gradient(from 0deg,rgba(255,220,110,.55) 0deg 6deg,transparent 6deg 15deg)}
@keyframes spin{to{transform:rotate(360deg)}}
#ovList li.glow{box-shadow:0 0 0 3px var(--teal),0 0 18px 2px rgba(31,154,160,.5);animation:myrow 1.6s ease-in-out 2}
#ovList li.rk1:not(.hid){background:linear-gradient(100deg,#fff6d6 0%,#fff 40%,#fff6d6 60%,#fff 100%);background-size:250% 100%;animation:shine 2.4s linear infinite}
@keyframes myrow{50%{transform:scale(1.03)}}@keyframes shine{to{background-position:-250% 0}}
@media (prefers-reduced-motion:reduce){#rays,#eggrain,#ovStamp:before{display:none}}
/* ---- 11/11 夕：きろく（技ごと・称号）・図鑑のそろい具合 ---- */
.subh{margin:12px 0 6px;font-size:14px;color:var(--wood2)}
.recsk{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.rsk{display:grid;grid-template-columns:30px 1fr;grid-template-rows:auto auto;column-gap:6px;align-items:center;padding:5px 7px;background:#fff;border-radius:10px;border:2px solid var(--cream2)}
.rsk i{grid-row:1/3;width:30px;height:30px;background:center/contain no-repeat}.rsk b{font-size:12.5px}.rsk span{font-size:10.5px;color:#7a6a4c}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:6px;max-height:42vh;overflow:auto;padding:2px}
.bdg{display:flex;flex-direction:column;align-items:center;gap:1px;padding:7px 4px 6px;border-radius:12px;border:2px solid #c98b4a;background:linear-gradient(#fff3e2,#f3d3ad);cursor:pointer;font-family:inherit;color:#3a2a14}
.bdg.t1{border-color:#9fb0c4;background:linear-gradient(#ffffff,#dfe6ee)}.bdg.t2{border-color:#e0a91c;background:linear-gradient(#fffbe6,#ffe58a);box-shadow:0 0 10px rgba(255,211,77,.6)}
.bdg i{width:34px;height:34px;background:center/contain no-repeat;filter:drop-shadow(0 2px 0 rgba(0,0,0,.15))}
.bdg b{font-size:11.5px;line-height:1.3;text-align:center}.bdg small{font-size:9.5px;color:#7a6a4c;line-height:1.25;text-align:center}
.bdg.no{background:#eee7da;border-color:#cfc4ae;box-shadow:none;cursor:default}.bdg.no i{filter:grayscale(1) brightness(.6);opacity:.45}.bdg.no b{color:#9a8a6a}
.bdg.on{outline:3px solid var(--teal);outline-offset:1px}
.zksets{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:5px;margin:6px 0 2px}
.zkset{position:relative;display:flex;justify-content:space-between;align-items:center;gap:4px;padding:3px 8px 6px;border-radius:9px;background:#fff;border:2px solid var(--zc);font-size:11.5px;overflow:hidden}
.zkset i{position:absolute;left:0;bottom:0;height:4px;background:var(--zc)}.zkset span{font-weight:800;color:#5a4a2c}
.zkset.full{background:linear-gradient(#fff,#fff6d6);box-shadow:0 0 8px rgba(255,211,77,.7)}.zkset.full:after{content:"そろった";position:absolute;right:4px;top:-1px;font-size:8.5px;font-weight:900;color:#b8560a}