:root{--bg:#0a0a24;--card:rgba(24,20,66,.82);--line:#4a4a9a;--text:#eeeaff;--gold:#e8cf86;--cyan:#6fe3ff;--pink:#d46cff;--mute:#a9a8d6}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse at top,#26206a,var(--bg) 55%) fixed;color:var(--text);
  font-family:"Hiragino Mincho ProN","Yu Mincho",serif;line-height:1.8}
.hero{position:relative;max-height:70vh;overflow:hidden}
.hero img{display:block;width:100%;height:min(70vh,640px);object-fit:cover;object-position:50% 25%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,transparent 45%,var(--bg) 100%)}
.hero-text{position:absolute;z-index:1;left:0;right:0;bottom:0;text-align:center;padding:1rem}
.sub{letter-spacing:.3em;color:var(--cyan);margin:0;font-size:.8rem;text-shadow:0 0 10px var(--cyan)}
h1{margin:.3rem 0;font-size:clamp(1.6rem,6vw,2.6rem);color:#fff;text-shadow:0 0 14px var(--pink),0 0 28px #7a3cff}
.lead{color:var(--text);margin:0;text-shadow:0 1px 6px #000}
main{max-width:640px;margin:0 auto;padding:1rem}
.card{background:var(--card);backdrop-filter:blur(6px);box-shadow:0 0 24px rgba(130,90,255,.25);border:1px solid var(--line);border-radius:12px;padding:1.2rem;margin-bottom:1.2rem}
.card[hidden]{display:none}
h2{margin:0 0 .3rem;color:var(--gold);font-size:1.2rem}
h3{margin:1.2rem 0 .2rem;color:var(--cyan);font-size:1rem;border-bottom:1px solid var(--line)}
label{display:block;margin-bottom:.9rem}
fieldset{border:0;padding:0;margin:0 0 .9rem}
legend{padding:0}
label.inline{display:inline-block;margin-right:1rem}
.check{font-size:.85rem;color:var(--mute)}
input:not([type=radio]):not([type=checkbox]),textarea{display:block;width:100%;margin-top:.25rem;padding:.6rem;
  background:rgba(8,8,32,.8);border:1px solid var(--line);border-radius:8px;color:var(--text);font:inherit}
button{font:inherit;cursor:pointer;background:linear-gradient(135deg,var(--cyan),var(--pink));color:#12103a;border:0;border-radius:8px;padding:.7rem 1.4rem;font-weight:bold}
button:disabled{opacity:.5;cursor:wait}
#submit{width:100%;font-size:1.1rem;box-shadow:0 0 16px rgba(212,108,255,.6)}
.error{color:#ff9ac0;min-height:1.2em;margin:.5rem 0 0}
.note,.mute{color:var(--mute);font-size:.85rem}
.sign{font-size:1.4rem;color:var(--gold);text-align:center;margin:0}
.result p{margin:.3rem 0;white-space:pre-wrap}
.lucky{display:flex;gap:.5rem;flex-wrap:wrap}
.lucky span{background:rgba(8,8,32,.8);border:1px solid var(--line);border-radius:999px;padding:.1rem .8rem;font-size:.9rem}
.list{list-style:none;padding:0;margin:0}
.item{border-top:1px solid var(--line);padding:.9rem 0}
.item .who{color:var(--gold);font-size:.9rem}
.item .what{margin:.1rem 0 .4rem;font-size:1.05rem}
footer{text-align:center;color:var(--mute);font-size:.75rem;padding:1rem 1rem 2rem}
.page-head{text-align:center;padding:2rem 1rem 0}
.center{text-align:center}
.btn-link{display:inline-block;padding:.6rem 1.4rem;border:1px solid var(--cyan);border-radius:999px;color:var(--cyan);text-decoration:none;text-shadow:0 0 8px var(--cyan)}
.item{display:flex;align-items:center;gap:1rem}
.item .body{flex:1}
button.like{background:rgba(8,8,32,.8);color:var(--pink);border:1px solid var(--pink);border-radius:999px;padding:.3rem .9rem;min-width:4.5rem;white-space:nowrap}
button.like:active{background:var(--pink);color:#12103a}

/* ===== 占い中の演出 ===== */
.no-scroll{overflow:hidden}
#divining{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:radial-gradient(ellipse at center,rgba(46,32,120,.94),rgba(6,5,30,.97));animation:fadein .5s both}
#divining[hidden]{display:none}
.stage{position:relative;width:min(78vw,340px);aspect-ratio:1}
.stage .circle{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 0 6px currentColor);animation:spin 20s linear infinite}
.stage .circle.a{color:#e8cf86}
.stage .circle.b{inset:8%;width:84%;height:84%;color:#6fe3ff;animation-duration:32s;animation-direction:reverse}
.orb{position:absolute;inset:30%;border-radius:50%;overflow:hidden;
  background:radial-gradient(circle at 35% 30%,#fff 0,#c9f3ff 10%,#8a6bff 45%,#241575 100%);
  box-shadow:0 0 30px #8a6bff,0 0 80px #d46cff;animation:pulse 2.4s ease-in-out infinite}
.orb::before{content:"";position:absolute;inset:-20%;mix-blend-mode:screen;animation:spin 5s linear infinite;
  background:conic-gradient(from 0deg,transparent,rgba(111,227,255,.75),transparent 35%,rgba(212,108,255,.75) 60%,transparent 80%)}
.orb::after{content:"";position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.9),transparent 22%)}
.orbit{position:absolute;inset:0;animation:spin 7s linear infinite}
.orbit span{position:absolute;top:-2%;left:50%;margin-left:-.5em;font-size:1.5rem;color:#fff;text-shadow:0 0 8px var(--cyan),0 0 18px var(--pink)}
.orbit.o2{inset:10%;animation-duration:9s;animation-direction:reverse}
.orbit.o2 span{color:var(--gold);font-size:1.2rem}
.orbit.o3{inset:-6%;animation-duration:12s}
.orbit.o3 span{color:var(--cyan);font-size:1rem}
.msg{margin:1.8rem 1rem 0;color:#fff;font-size:1.1rem;text-align:center;text-shadow:0 0 12px var(--pink)}
.msg.fade{animation:msgfade 2.6s both}
.sparks{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.spark{position:absolute;bottom:-10px;width:4px;height:4px;border-radius:50%;background:#fff;
  box-shadow:0 0 8px 2px var(--cyan);opacity:0;animation:rise 4s linear infinite}
.spark:nth-child(3n){box-shadow:0 0 8px 2px var(--pink)}
.spark:nth-child(5n){box-shadow:0 0 8px 2px var(--gold)}
.result>*{animation:appear .9s both}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse{50%{transform:scale(1.07);box-shadow:0 0 45px #8a6bff,0 0 110px #d46cff}}
@keyframes fadein{from{opacity:0}}
@keyframes msgfade{0%{opacity:0;transform:translateY(6px)}15%,85%{opacity:1;transform:none}100%{opacity:0}}
@keyframes rise{0%{transform:translateY(0) scale(.6);opacity:0}15%{opacity:1}100%{transform:translateY(-100vh) scale(1.2);opacity:0}}
@keyframes appear{from{opacity:0;transform:translateY(14px);filter:blur(4px)}}
@media (prefers-reduced-motion:reduce){
  #divining *,.result>*{animation-duration:.01s!important;animation-iteration-count:1!important}
}

/* ===== みんなの挑戦(夢の一覧)ページ: 暗い夜空に、揺らめいて光る夢 ===== */
body.dreams::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;animation:twinkle 3.5s ease-in-out infinite alternate;
  background-image:
    radial-gradient(2px 2px at 8% 12%,#fff,transparent),radial-gradient(1.5px 1.5px at 22% 40%,#fff,transparent),
    radial-gradient(2px 2px at 35% 8%,#fff,transparent),radial-gradient(1.5px 1.5px at 48% 30%,#fff,transparent),
    radial-gradient(2.5px 2.5px at 60% 15%,#e8cf86,transparent),radial-gradient(1.5px 1.5px at 72% 45%,#fff,transparent),
    radial-gradient(2px 2px at 85% 10%,#6fe3ff,transparent),radial-gradient(1.5px 1.5px at 93% 35%,#fff,transparent),
    radial-gradient(2px 2px at 15% 70%,#fff,transparent),radial-gradient(2.5px 2.5px at 40% 85%,#e8cf86,transparent),
    radial-gradient(1.5px 1.5px at 66% 78%,#fff,transparent),radial-gradient(2px 2px at 88% 66%,#6fe3ff,transparent)}
/* 地平線にほのかな夜明けの光 */
body.dreams::after{content:"";position:fixed;left:0;right:0;bottom:0;height:45vh;pointer-events:none;z-index:0;
  background:radial-gradient(ellipse at 50% 100%,rgba(255,190,120,.28),rgba(212,108,255,.14) 45%,transparent 70%);
  animation:breathe 6s ease-in-out infinite alternate}
body.dreams main,body.dreams header,body.dreams footer{position:relative;z-index:1}
body.dreams h1{text-shadow:0 0 16px #ffd27a,0 0 32px #d46cff}
.dreams .item{animation:appear 1s both;animation-delay:calc(2.3s + var(--i,0) * .12s)}
.dreams .item .what{font-size:1.15rem;color:#fff7d6;animation:flicker 3.4s ease-in-out infinite alternate}
.dreams button.like{background:linear-gradient(135deg,#ffe9a6,#ffb86b);color:#4a2a00;border:0;box-shadow:0 0 14px rgba(255,220,130,.6)}
.dreams button.like:active{transform:scale(.92)}

/* 開幕の演出 */
#dawn{position:fixed;inset:0;z-index:50;overflow:hidden;background:#070620;display:flex;align-items:center;justify-content:center;
  animation:dawn-out .9s ease 2.6s forwards}
#dawn[hidden]{display:none}
.dawn-light{position:absolute;left:50%;bottom:0;width:150vmax;height:150vmax;margin:0 0 -75vmax -75vmax;border-radius:50%;
  background:radial-gradient(circle,#fff8d6 0,#ffd27a 14%,rgba(255,140,210,.65) 38%,rgba(120,80,255,.35) 55%,transparent 70%);
  transform:scale(0);animation:dawn-rise 2.6s cubic-bezier(.2,.7,.2,1) forwards}
.dawn-rays{position:absolute;left:50%;bottom:0;width:200vmax;height:200vmax;margin:0 0 -100vmax -100vmax;opacity:0;
  background:repeating-conic-gradient(from 0deg,rgba(255,230,160,.35) 0 4deg,transparent 4deg 14deg);
  -webkit-mask-image:radial-gradient(circle,#000 0,transparent 55%);mask-image:radial-gradient(circle,#000 0,transparent 55%);
  animation:spin 40s linear infinite,rays-in 2.4s ease .3s forwards}
.dawn-text{position:relative;z-index:1;margin:0;font-size:clamp(1.6rem,6vw,2.4rem);letter-spacing:.3em;color:#fff;
  text-shadow:0 0 14px #ffd27a,0 0 30px #ff9bf0;animation:text-in 1.6s ease .8s both}

@keyframes flicker{
  0%{text-shadow:0 0 6px #ffd27a,0 0 14px #ff9bf0;opacity:.9}
  25%{text-shadow:0 0 10px #fff,0 0 22px #ffd27a,0 0 38px #ff9bf0;opacity:1}
  50%{text-shadow:0 0 5px #ffd27a,0 0 12px #d46cff;opacity:.86}
  75%{text-shadow:0 0 12px #fff,0 0 26px #6fe3ff,0 0 44px #d46cff;opacity:1}
  100%{text-shadow:0 0 8px #ffd27a,0 0 18px #ff9bf0;opacity:.94}}
@keyframes breathe{from{opacity:.55}to{opacity:1}}
@keyframes twinkle{from{opacity:.45}to{opacity:1}}
@keyframes dawn-rise{to{transform:scale(1)}}
@keyframes rays-in{to{opacity:1}}
@keyframes text-in{from{opacity:0;letter-spacing:.8em;filter:blur(6px)}60%{opacity:1}to{opacity:1;filter:none}}
@keyframes dawn-out{to{opacity:0;visibility:hidden}}
@media (prefers-reduced-motion:reduce){
  .dreams .item .what{animation:none}
  #dawn{animation-delay:.2s}
  #dawn *{animation-duration:.01s!important;animation-delay:0s!important}
}

/* ===== 夢の記録(合計数) ===== */
.stats{display:flex;gap:.8rem;margin:0 0 1.2rem}
.stats[hidden]{display:none}
.stat{position:relative;flex:1;text-align:center;padding:.9rem .5rem 1rem;border-radius:14px;overflow:hidden;
  border:1px solid rgba(232,207,134,.5);
  background:radial-gradient(ellipse at 50% 0,rgba(212,108,255,.35),rgba(24,20,66,.85) 75%);
  box-shadow:0 0 22px rgba(212,108,255,.3),inset 0 0 18px rgba(232,207,134,.12)}
.stat::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%);
  transform:translateX(-120%);animation:sheen 5s ease-in-out infinite}
.stat:nth-child(2)::before{animation-delay:1.6s}
.stat .icon{display:block;font-size:1.3rem;color:var(--gold);text-shadow:0 0 10px #ffd27a,0 0 22px var(--pink);animation:twinkle-icon 2.2s ease-in-out infinite alternate}
.stat:nth-child(2) .icon{animation-delay:.9s}
.stat .label{display:block;font-size:.8rem;letter-spacing:.2em;color:var(--mute)}
.stat .value{display:block;margin-top:.1rem}
.stat .num{font-size:clamp(1.7rem,7vw,2.3rem);font-weight:bold;font-variant-numeric:tabular-nums;
  background:linear-gradient(180deg,#fff7d6,#ffd27a 55%,#ff9bf0);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 8px rgba(255,210,122,.7))}
.stat i{font-style:normal;font-size:.85rem;margin-left:.2rem;color:var(--gold)}
.dreams .stats{animation:appear 1s both;animation-delay:2.2s}
@keyframes sheen{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@keyframes twinkle-icon{from{opacity:.6;transform:scale(.9) rotate(-8deg)}to{opacity:1;transform:scale(1.15) rotate(8deg)}}
@media (prefers-reduced-motion:reduce){.stat::before,.stat .icon{animation:none}}

/* ===== 夢のことば(ワードクラウド) ===== */
.center .btn-link{margin:.25rem .3rem}
body.words main{max-width:960px}
.cloud{position:relative;width:100%;overflow:hidden}
button.w{position:absolute;white-space:nowrap;line-height:1.2;padding:0 5px;margin:0;border:0;border-radius:8px;background:none;
  font-family:inherit;font-weight:bold;cursor:pointer;color:#fff;
  animation:word-in .9s ease both,drift 6s ease-in-out infinite alternate}
button.w:hover,button.w:focus-visible{background:rgba(255,255,255,.12);outline:none;z-index:2}
button.w.gold{color:#fff3c4;text-shadow:0 0 8px #ffd27a,0 0 22px #ffb35c,0 0 40px #ff9bf0}
button.w.pink{color:#ffd6fb;text-shadow:0 0 8px #ff9bf0,0 0 22px #d46cff}
button.w.cyan{color:#d4f7ff;text-shadow:0 0 8px #6fe3ff,0 0 22px #6f8cff}
button.w.white{color:#fff;text-shadow:0 0 8px #b9a8ff,0 0 20px #8a6bff}
@keyframes word-in{from{opacity:0;filter:blur(8px)}to{opacity:1;filter:none}}
@keyframes drift{from{transform:translateY(-4px)}to{transform:translateY(4px)}}
@media (prefers-reduced-motion:reduce){button.w{animation:word-in .01s both}}

/* ===== ナビゲーション ===== */
.site-nav{position:sticky;top:0;z-index:40;background:rgba(10,10,36,.8);backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(232,207,134,.35);box-shadow:0 2px 18px rgba(130,90,255,.25)}
.nav-inner{position:relative;display:flex;align-items:center;gap:.6rem;max-width:960px;margin:0 auto;padding:.4rem 1rem}
.brand{color:var(--gold);text-decoration:none;font-weight:bold;letter-spacing:.15em;white-space:nowrap;text-shadow:0 0 10px #ffd27a}
/* いつも見えているメニュー */
.tabs{list-style:none;margin:0 0 0 auto;padding:0;display:flex;gap:.3rem}
.tabs a{display:block;padding:.4rem .9rem;border-radius:999px;color:var(--text);text-decoration:none;font-size:.95rem;white-space:nowrap;
  border:1px solid transparent;transition:background .2s,border-color .2s,text-shadow .2s}
.tabs a:hover{background:rgba(255,255,255,.1);text-shadow:0 0 8px var(--cyan)}
.tabs a[aria-current=page]{border-color:var(--gold);color:var(--gold);text-shadow:0 0 8px #ffd27a;background:rgba(232,207,134,.08)}
/* ハンバーガーメニュー(開くとドロワーが下に出る) */
.burger{width:44px;height:44px;padding:0;background:none;border:0;border-radius:8px;position:relative;box-shadow:none;flex:none}
.burger span{position:absolute;left:10px;right:10px;height:2px;border-radius:2px;background:var(--gold);box-shadow:0 0 6px #ffd27a;
  transition:transform .3s,opacity .2s,top .3s}
.burger span:nth-child(1){top:14px}
.burger span:nth-child(2){top:21px}
.burger span:nth-child(3){top:28px}
.burger[aria-expanded=true] span:nth-child(1){top:21px;transform:rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){top:21px;transform:rotate(-45deg)}
.burger:focus-visible{outline:2px solid var(--cyan)}
.menu{position:absolute;top:100%;right:.5rem;width:min(320px,calc(100vw - 1rem));list-style:none;margin:0;padding:.4rem;
  background:rgba(14,10,52,.97);border:1px solid rgba(232,207,134,.35);border-radius:0 0 14px 14px;box-shadow:0 10px 30px rgba(0,0,0,.5);
  visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .25s,transform .25s,visibility .25s}
.menu.open{visibility:visible;opacity:1;transform:none}
.menu a{display:block;padding:.7rem 1rem;border-radius:10px;color:var(--text);text-decoration:none;border:1px solid transparent}
.menu a:hover{background:rgba(255,255,255,.1)}
.menu a[aria-current=page]{border-color:var(--gold);background:rgba(232,207,134,.08)}
.menu b{display:block;color:var(--gold);text-shadow:0 0 8px rgba(255,210,122,.6)}
.menu small{display:block;color:var(--mute);font-size:.8rem}
@media (max-width:640px){
  .nav-inner{flex-wrap:wrap;padding-bottom:.3rem}
  .burger{margin-left:auto}
  .tabs{order:3;flex:1 0 100%;margin:0;gap:.25rem}
  .tabs li{flex:1}
  .tabs a{padding:.4rem .2rem;text-align:center;font-size:.82rem}
}
@media (prefers-reduced-motion:reduce){.burger span,.menu{transition:none}}

body.words .item{animation-delay:calc(var(--i,0) * .08s)}

/* ===== 占い館の扉(開幕の演出) ===== */
#gate{position:fixed;inset:0;z-index:60;overflow:hidden;perspective:1400px;background:#05041a;
  animation:gate-out .9s ease 3s forwards}
#gate[hidden]{display:none}
.gate-light{position:absolute;left:50%;top:50%;width:90vmax;height:90vmax;margin:-45vmax 0 0 -45vmax;border-radius:50%;opacity:0;
  background:radial-gradient(circle,#fff 0,#fff3c4 12%,#ffd27a 26%,rgba(255,140,210,.7) 46%,rgba(100,90,255,.35) 62%,transparent 72%);
  transform:scale(.1);animation:gate-light 2.4s ease-in .8s forwards}
.door{position:absolute;top:0;bottom:0;width:50.2%;backface-visibility:hidden;
  background:linear-gradient(90deg,#150f46,#2a1d78 55%,#1b1355);
  box-shadow:inset 0 0 60px rgba(0,0,0,.6),inset 0 0 0 3px #e8cf86,0 0 30px rgba(212,108,255,.4)}
.door::before{content:"";position:absolute;inset:7%;border:1px solid rgba(232,207,134,.7);border-radius:6px;
  background:
    radial-gradient(circle at 50% 50%,rgba(111,227,255,.18),transparent 55%),
    repeating-linear-gradient(0deg,transparent 0 38px,rgba(232,207,134,.12) 38px 39px)}
.door::after{content:"";position:absolute;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff7d6,#e8cf86 55%,#8a6a1c);box-shadow:0 0 12px #ffd27a}
.door.left{left:0;transform-origin:left center;animation:door-left 1.8s cubic-bezier(.6,.05,.3,1) .9s forwards}
.door.left::after{right:7%}
.door.right{right:0;transform-origin:right center;animation:door-right 1.8s cubic-bezier(.6,.05,.3,1) .9s forwards}
.door.right::after{left:7%}
.gate-emblem{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;
  pointer-events:none;color:#fff7d6;text-shadow:0 0 14px #ffd27a,0 0 34px #d46cff;animation:emblem 2s ease both,emblem-out .5s ease .8s forwards}
.gate-emblem span{font-size:clamp(4rem,18vw,7rem);line-height:1}
.gate-emblem p{margin:.2rem 0 0;font-size:clamp(1.2rem,5vw,1.8rem);letter-spacing:.5em;text-indent:.5em}
#gate .sparks{z-index:1}

@keyframes door-left{to{transform:rotateY(105deg)}}
@keyframes door-right{to{transform:rotateY(-105deg)}}
@keyframes gate-light{0%{opacity:0;transform:scale(.1)}25%{opacity:1}100%{opacity:1;transform:scale(1.6)}}
@keyframes emblem{from{opacity:0;transform:scale(.85);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes emblem-out{to{opacity:0}}
@keyframes gate-out{to{opacity:0;visibility:hidden}}
@media (prefers-reduced-motion:reduce){
  #gate{animation-delay:.3s}
  #gate *{animation-duration:.01s!important;animation-delay:0s!important}
}

/* ===== 思いのページ・小さなリンク ===== */
.menu li.minor a{padding:.45rem 1rem;font-size:.85rem;color:var(--mute)}
.menu li.minor a:hover{color:var(--text)}
footer a{color:var(--mute);text-decoration:underline;text-underline-offset:3px}
footer a:hover{color:var(--gold)}
.about h2{margin:1.8rem 0 .4rem;font-size:1.15rem;color:var(--gold);text-shadow:0 0 10px rgba(255,210,122,.5)}
.about h2:first-child{margin-top:0}
.about p{margin:0 0 .6rem;line-height:2.05}
.about-list{margin:0 0 .6rem;padding-left:1.2rem;line-height:1.95;color:var(--text)}
.about-list li{margin-bottom:.3rem}
.sign-off{margin-top:2rem!important;text-align:right;color:var(--mute);letter-spacing:.12em;font-size:.9rem}
.about{animation:appear 1s both}

/* 制作者の紹介 */
.sponsor{text-align:center;animation:appear 1s .3s both}
.sponsor p{margin:.5rem 0;line-height:1.95}
.sponsor .mute{text-align:left;font-size:.85rem}
.sponsor b{color:var(--gold)}
.sponsor-logo{display:block;width:min(300px,80%);margin:.8rem auto;padding:.7rem 1rem;border-radius:14px;background:#fff;
  box-shadow:0 0 22px rgba(255,255,255,.25)}
.sponsor-logo img{display:block;width:100%;height:auto}

/* お知らせ(曲づくり) */
.announce{display:flex;align-items:center;justify-content:center;gap:.8rem;margin:0 0 1.2rem;padding:.9rem 1rem;border-radius:14px;
  border:1px solid rgba(232,207,134,.55);text-align:center;
  background:linear-gradient(135deg,rgba(111,227,255,.14),rgba(212,108,255,.2));box-shadow:0 0 22px rgba(212,108,255,.3)}
.announce p{margin:0;line-height:1.9;color:#fff7d6;text-shadow:0 0 10px rgba(255,210,122,.6)}
.note-icon{font-size:1.6rem;color:var(--gold);text-shadow:0 0 10px #ffd27a,0 0 22px var(--pink);animation:bob 2.4s ease-in-out infinite alternate}
.note-icon:last-child{animation-delay:1.2s}
@keyframes bob{from{transform:translateY(3px) rotate(-8deg)}to{transform:translateY(-4px) rotate(8deg)}}
@media (prefers-reduced-motion:reduce){.note-icon{animation:none}}

/* 自分の夢 */
.item.mine{border-radius:12px;padding:.9rem 1rem;margin:.2rem 0 .6rem;border:1px solid rgba(232,207,134,.7);
  background:linear-gradient(135deg,rgba(232,207,134,.14),rgba(212,108,255,.16));box-shadow:0 0 20px rgba(255,210,122,.3)}
.item.mine .who{color:#fff3c4;text-shadow:0 0 8px #ffd27a}