/* =========================================================
   がちゃメーカー UIキット v0.1
   styles.css の後に読み込み、既存クラスの見た目をそろえる
   ========================================================= */
:root{
  --ink:#3a2346; --text:#4a3a55; --muted:#8a7a96;
  --sky:#e4f4ff; --sky-grid:#cfe9fb; --paper:#fffaf5; --white:#ffffff;
  --pink:#ff6fb5; --pink-d:#e2468f; --pink-l:#ffc3df;
  --blue:#5cc8f5; --blue-d:#2f9fd3; --blue-l:#bfeaff;
  --mint:#5fcf98; --mint-d:#2fa56d; --sun:#ffd65a; --sun-l:#fff1b8;
  --red:#f06464; --cheek:#ff9cc6; --purple:#a979e8; --orange:#ffb02e; --gray:#9aa3ad;
  --f-dot:"DotGothic16","Hiragino Kaku Gothic ProN","Yu Gothic",monospace;
  --f-body:"M PLUS Rounded 1c","Hiragino Maru Gothic ProN","Hiragino Sans","Yu Gothic",system-ui,sans-serif;
  --tabbar-h:64px;
  /* 既存変数も新しい色に寄せる */
  --color-primary:var(--pink); --color-secondary:var(--blue); --color-success:var(--mint);
  --color-warning:var(--sun); --color-danger:var(--red); --color-bg:var(--sky);
  --color-text:var(--text); --color-border:var(--ink); --color-shadow:var(--ink);
  --font-body:var(--f-body); --font-pixel:var(--f-dot);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{
  font-family:var(--f-body);color:var(--text);
  background-color:var(--sky);
  background-image:linear-gradient(var(--sky-grid) 1px,transparent 1px),linear-gradient(90deg,var(--sky-grid) 1px,transparent 1px);
  background-size:24px 24px;
  image-rendering:auto;           /* 写真がドット化して見にくい問題を解消 */
  line-height:1.7;
}
img{image-rendering:auto}
.px svg{display:block;image-rendering:pixelated}
.container{width:100%;max-width:1040px;margin:0 auto;padding:20px 16px 32px}
a{color:var(--blue-d)}

/* ---------- 見出し ---------- */
.page-header{text-align:left;margin:4px 0 20px;display:grid;gap:6px}
.page-title,.section-title,.auth-title{font-family:var(--f-dot)!important;font-weight:400;color:var(--ink)!important;letter-spacing:.02em;text-wrap:balance}
.page-title{font-size:1.5rem;margin:0;line-height:1.35}
.page-header p{color:var(--muted);margin:0;font-size:.92rem}
.section-title{font-size:1.15rem;margin:0 0 12px}

/* ---------- ボタン ---------- */
.btn{
  --bg:var(--pink);--fg:var(--white);
  font-family:var(--f-body)!important;font-weight:800;font-size:.95rem;line-height:1.25;
  color:var(--fg)!important;background:var(--bg)!important;
  border:3px solid var(--ink)!important;border-radius:0;
  box-shadow:0 4px 0 var(--ink)!important;
  padding:10px 20px;margin:4px;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  text-decoration:none!important;cursor:pointer;position:relative;
  transition:transform .12s cubic-bezier(.3,1.6,.6,1),box-shadow .12s;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--ink)!important;filter:none}
.btn:active{transform:translateY(4px);box-shadow:0 0 0 var(--ink)!important}
.btn:focus-visible{outline:3px dashed var(--pink-d);outline-offset:4px}
.btn:disabled,.btn.disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn-primary{--bg:var(--pink)}
.btn-secondary,.btn-info{--bg:var(--blue)}
.btn-success{--bg:var(--mint)}
.btn-warning{--bg:var(--sun);--fg:var(--ink)}
.btn-danger{--bg:var(--red)}
.btn-ghost,.btn-outline-secondary,.btn-outline-primary{--bg:var(--white);--fg:var(--ink)}
.btn-small,.btn-sm{font-size:.8rem;padding:6px 12px;border-width:2px!important;box-shadow:0 3px 0 var(--ink)!important}
.btn-small:active,.btn-sm:active{transform:translateY(3px)}
.btn-large,.btn-lg{font-size:1.1rem;padding:14px 28px}
.btn-block{display:flex;width:100%;margin:8px 0}
.btn-spin{position:relative;overflow:hidden}
.btn-spin::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-40%;width:28%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);transform:skewX(-20deg);animation:gm-shine 2.8s ease-in-out infinite;pointer-events:none}
@keyframes gm-shine{0%,60%{left:-40%}100%{left:130%}}
.action-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0}
.action-bar .btn{margin:0}

/* ---------- 入力 ---------- */
.form-group{margin-bottom:16px;display:grid;gap:6px}
.form-label,.form-group>label{font-weight:700;font-size:.88rem;color:var(--ink)}
.form-control,input[type=text],input[type=email],input[type=password],input[type=number],input[type=search],select,textarea{
  font-family:var(--f-body);font-size:1rem;color:var(--text);
  background:var(--white);border:3px solid var(--ink)!important;border-radius:0;
  padding:10px 12px;box-shadow:inset 0 3px 0 #efe6f2;
  transition:box-shadow .15s,border-color .15s;max-width:100%;
}
.form-control:focus,input:focus,select:focus,textarea:focus{outline:none;border-color:var(--pink-d)!important;box-shadow:0 0 0 4px var(--pink-l)}
.form-help,.form-text{color:var(--muted);font-size:.78rem}

/* ---------- 面・カード ---------- */
.gacha-card,.auth-box,.form-section,.create-gacha-container,.items-section,.welcome-container,.feature-list{
  background:var(--paper)!important;border:3px solid var(--ink)!important;border-radius:0;
  box-shadow:6px 6px 0 var(--ink)!important;
}
.gacha-card{padding:16px;transition:transform .15s cubic-bezier(.3,1.6,.6,1),box-shadow .15s}
.gacha-card:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--ink)!important}
.gacha-grid{gap:20px}
.empty-state{background:var(--white);border:3px dashed var(--ink);padding:28px 16px;text-align:center}
.error-message{background:#ffe3e3!important;color:var(--ink)!important;border:3px solid var(--ink)!important;box-shadow:0 4px 0 var(--red)!important;padding:10px 14px;font-weight:700}
.success-message{background:#ddf7e9!important;color:var(--ink)!important;border:3px solid var(--ink)!important;box-shadow:0 4px 0 var(--mint)!important;padding:10px 14px;font-weight:700}

/* ---------- バッジ ---------- */
.gm-new{display:inline-block;animation:gm-hop 1.1s steps(1) infinite;position:relative;vertical-align:middle}
.gm-new .spark{position:absolute;top:-6px;right:-8px;animation:gm-blink 1.1s steps(1) infinite}
@keyframes gm-hop{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes gm-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.gm-chip{font-family:var(--f-dot);font-size:.75rem;border:2px solid var(--ink);background:var(--white);color:var(--ink);padding:1px 8px;display:inline-flex;align-items:center;gap:4px;line-height:1.5;white-space:nowrap}
.gm-chip.ok{background:var(--blue-l)}.gm-chip.warn{background:var(--sun-l)}.gm-chip.saved{background:var(--mint);color:var(--white)}
.gm-rare{font-family:var(--f-dot);font-size:.8rem;color:var(--white);border:2px solid var(--ink);padding:0 8px;min-width:46px;text-align:center;display:inline-block;line-height:1.6;text-shadow:1px 1px 0 var(--ink)}
.gm-rare.N{background:var(--gray)}.gm-rare.R{background:var(--blue)}.gm-rare.SR{background:var(--purple)}.gm-rare.SSR{background:var(--orange)}
.gm-rare.UR{background:linear-gradient(90deg,#ff6fb5,#ffd65a,#5fcf98,#5cc8f5,#a979e8,#ff6fb5);background-size:300% 100%;animation:gm-rainbow 3s linear infinite}
@keyframes gm-rainbow{to{background-position:300% 0}}

/* ---------- ヘッダー ---------- */
.gm-header{position:sticky;top:0;z-index:50;background:var(--white);border-bottom:3px solid var(--ink);box-shadow:0 3px 0 rgba(58,35,70,.12)}
.gm-header-in{max-width:1040px;margin:0 auto;padding:8px 16px;display:flex;align-items:center;gap:16px}
.gm-logo{display:flex;align-items:center;gap:8px;text-decoration:none!important;color:var(--ink)!important;font-family:var(--f-dot);font-size:1.15rem;white-space:nowrap}
.gm-logo small{font-size:.65rem;background:var(--sun);border:2px solid var(--ink);padding:0 4px;line-height:1.4}
.gm-nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.gm-nav a{display:flex;align-items:center;gap:6px;padding:6px 10px;color:var(--text)!important;text-decoration:none!important;font-weight:700;font-size:.85rem;border:2px solid transparent;transition:background .12s,border-color .12s}
.gm-nav a:hover{background:var(--sky);border-color:var(--ink)}
.gm-nav a.is-active{background:var(--pink-l);border-color:var(--ink);color:var(--ink)!important}
.gm-nav a.is-active .px{animation:gm-hop .5s steps(1) 2}
.gm-user{display:flex;align-items:center;gap:6px;margin-left:8px;padding:3px 10px 3px 3px;border:2px solid var(--ink);background:var(--sky);text-decoration:none!important;color:var(--ink)!important;font-size:.8rem;font-weight:700;max-width:180px}
.gm-user img,.gm-user .ava{width:28px;height:28px;object-fit:cover;border:2px solid var(--ink);background:var(--white);flex:none;display:grid;place-items:center}
.gm-user span.name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gm-role{font-family:var(--f-dot);font-size:.65rem;padding:0 5px;border:2px solid var(--ink);line-height:1.4}
.gm-role.admin{background:var(--purple);color:var(--white)}.gm-role.creator{background:var(--pink);color:var(--white)}.gm-role.player{background:var(--blue);color:var(--white)}
.gm-head-right{display:flex;align-items:center;gap:8px;margin-left:8px}
.gm-login{font-weight:700;font-size:.85rem;color:var(--text)!important;text-decoration:none!important;padding:6px 4px}
.gm-reg{margin:0!important}
.gm-menu-btn{display:flex;align-items:center;gap:6px;background:var(--white);border:2px solid var(--ink);padding:5px 10px;font:700 .8rem var(--f-body);color:var(--ink);cursor:pointer;box-shadow:0 2px 0 var(--ink);transition:transform .1s}
.gm-menu-btn:hover{background:var(--sun-l)}
.gm-menu-btn:active{transform:translateY(2px);box-shadow:none}
/* 戻る＋ガチャ編集タブ */
.gm-sub{background:var(--paper);border-bottom:2px solid rgba(58,35,70,.15)}
.gm-sub-in{max-width:1040px;margin:0 auto;padding:6px 16px;display:flex;align-items:center;gap:10px;min-height:38px}
.gm-back{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.85rem;color:var(--ink)!important;text-decoration:none!important;padding:4px 10px 4px 6px;border:2px solid var(--ink);background:var(--white);white-space:nowrap;flex:none}
.gm-back:hover{background:var(--sky)}
.gm-ctx-name{font-family:var(--f-dot);color:var(--ink);font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.gm-ctx{max-width:1040px;margin:0 auto;padding:0 16px 8px;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.gm-ctx::-webkit-scrollbar{display:none}
.gm-ctx a{flex:none;display:inline-flex;align-items:center;gap:6px;padding:6px 12px;font-size:.8rem;font-weight:700;color:var(--text)!important;text-decoration:none!important;background:var(--white);border:2px solid var(--ink);white-space:nowrap}
.gm-ctx a:hover{background:var(--sky)}
.gm-ctx a.is-on{background:var(--pink);color:var(--white)!important;box-shadow:0 2px 0 var(--ink)}
.gm-ctx a:last-child:not(.is-on){background:var(--sun-l)}
@media (max-width:768px){
  .gm-header-in{padding:6px 12px;gap:8px}
  .gm-nav{display:none}
  .gm-head-right{margin-left:auto;gap:6px}
  .gm-user{margin-left:0;padding:2px}
  .gm-user span.name,.gm-user .gm-role{display:none}
  .gm-menu-btn{padding:5px 7px}
  .gm-menu-btn .gm-menu-l{display:none}
  .gm-login{display:none}
  .gm-logo{font-size:1rem}
  .gm-sub-in{padding:6px 12px}
  .gm-ctx{padding:0 12px 8px}
}
@media (max-width:360px){.gm-logo-t{display:none}}

/* ---------- メニュー（全ページ一覧） ---------- */
html.gm-lock,html.gm-lock body{overflow:hidden}
.gm-menu{position:fixed;inset:0;z-index:200}
.gm-menu-bg{position:absolute;inset:0;background:rgba(58,35,70,.45);opacity:0;transition:opacity .2s}
.gm-menu-panel{position:absolute;top:0;right:0;bottom:0;width:min(380px,92vw);background:var(--paper);border-left:3px solid var(--ink);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .22s cubic-bezier(.3,1.2,.6,1)}
.gm-menu.is-open .gm-menu-bg{opacity:1}
.gm-menu.is-open .gm-menu-panel{transform:none}
.gm-menu-head{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:3px solid var(--ink);background:var(--white)}
.gm-menu-me{display:flex;align-items:center;gap:10px;text-decoration:none!important;color:var(--ink)!important;min-width:0;flex:1}
.gm-menu-me img,.gm-menu-me .ava{width:42px;height:42px;object-fit:cover;border:2px solid var(--ink);background:var(--sky);display:grid;place-items:center;flex:none}
.gm-menu-me b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gm-menu-guest{display:flex;gap:8px;flex:1}
.gm-menu-guest .btn{margin:0!important}
.gm-menu-x{margin-left:auto;width:40px;height:40px;border:2px solid var(--ink);background:var(--white);font-size:1.4rem;line-height:1;cursor:pointer;color:var(--ink);flex:none}
.gm-menu-body{overflow-y:auto;padding:6px 14px calc(24px + env(safe-area-inset-bottom,0px));-webkit-overflow-scrolling:touch}
.gm-menu-search{display:flex;gap:6px;padding:4px 0 12px;border-bottom:2px dashed rgba(58,35,70,.15)}
.gm-menu-search input{flex:1;min-width:0;font-size:16px;padding:10px 12px;border:2px solid var(--ink,#3a2346);border-radius:10px;background:#fff}
.gm-menu-search button{flex:none;font-size:.95rem;padding:0 14px;border:2px solid var(--ink,#3a2346);border-radius:10px;background:var(--color-primary,#ff5ca8);color:#fff;font-weight:700}
.gm-menu-sec{padding:12px 0;border-bottom:2px dashed rgba(58,35,70,.15)}
.gm-menu-sec h3{display:flex;align-items:center;gap:6px;font:400 .85rem var(--f-dot);color:var(--muted);margin:0 0 8px}
.gm-menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.gm-menu-grid a{display:flex;align-items:center;gap:8px;padding:10px;background:var(--white);border:2px solid var(--ink);text-decoration:none!important;color:var(--text)!important;font-weight:700;font-size:.85rem;line-height:1.3;min-height:48px}
.gm-menu-grid a:hover{background:var(--sky)}
.gm-menu-grid a.is-on{background:var(--pink-l)}
.gm-mine{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.gm-mine li{display:flex;border:2px solid var(--ink);background:var(--white)}
.gm-mine .t{flex:1;min-width:0;display:flex;align-items:center;gap:8px;padding:6px 8px;text-decoration:none!important;color:var(--text)!important;font-size:.85rem;font-weight:700}
.gm-mine .t span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gm-mine img,.gm-mine .noimg,.gm-recent img,.gm-recent .noimg{width:36px;height:36px;object-fit:cover;border:2px solid var(--ink);flex:none;background:var(--sky);display:grid;place-items:center}
.gm-mine .s{flex:none;width:48px;display:grid;place-items:center;border-left:2px solid var(--ink);background:var(--sun-l)}
.gm-mine .s:hover{background:var(--sun)}
.gm-recent{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.gm-recent a{flex:none;width:92px;display:grid;justify-items:center;gap:4px;text-decoration:none!important;color:var(--text)!important;font-size:.72rem;font-weight:700;text-align:center;line-height:1.3}
.gm-recent img,.gm-recent .noimg{width:64px;height:64px}
.gm-recent a span:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gm-menu-foot{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:.78rem;margin:14px 0 0}
.gm-menu-foot a{color:var(--muted)!important}

/* ---------- スマホ下タブ ---------- */
.gm-tabbar{display:none}
@media (max-width:768px){
  body{padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom,0px))}
  .gm-tabbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:repeat(5,1fr);background:var(--white);border-top:3px solid var(--ink);padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px))}
  .gm-tabbar button{background:none;border:0;cursor:pointer}
  .gm-tabbar a,.gm-tabbar button{display:grid;justify-items:center;gap:2px;padding:4px 0;font-family:var(--f-dot);font-size:.68rem;color:var(--muted)!important;text-decoration:none!important;position:relative}
  .gm-tabbar a.is-active{color:var(--pink-d)!important}
  .gm-tabbar a.is-active::after{content:"";position:absolute;bottom:-4px;left:22%;right:22%;height:4px;background:var(--pink)}
  .gm-tabbar a.is-active .px{animation:gm-hop .5s steps(1) 2}
  /* 画面ごとの旧フッターナビは、結果画面以外では隠す */
  body:not(.gm-keep-pagenav) .fixed-bottom-nav{display:none!important}
  body.gm-keep-pagenav .gm-tabbar{display:none}
}
/* 結果画面などで残す旧フッターナビを新しい見た目に */
.fixed-bottom-nav{background:var(--white)!important;border-top:3px solid var(--ink)!important;box-shadow:none!important}
.fixed-bottom-nav .nav-item,.fixed-bottom-nav .bottom-nav-item{font-family:var(--f-dot);color:var(--text)!important;border-radius:0!important}
.fixed-bottom-nav .nav-item.nav-primary{background:var(--pink)!important;color:var(--white)!important;border:3px solid var(--ink);box-shadow:0 3px 0 var(--ink)!important}
@media (min-width:769px){ .fixed-bottom-nav{display:none!important} body{padding-bottom:0!important} }

/* ---------- フッター ---------- */
.gm-footer{margin-top:40px;border-top:3px solid var(--ink);background:var(--white)}
.gm-footer-in{max-width:1040px;margin:0 auto;padding:20px 16px;display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;justify-content:space-between;font-size:.8rem;color:var(--muted)}
.gm-footer nav{display:flex;flex-wrap:wrap;gap:6px 16px}
.gm-footer a{color:var(--text)!important}

/* ---------- トースト ---------- */
.gm-toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));transform:translate(-50%,200%);background:var(--ink);color:var(--white);padding:10px 16px;display:flex;align-items:center;gap:10px;font-weight:700;font-size:.9rem;transition:transform .35s cubic-bezier(.3,1.5,.6,1);z-index:100;border:3px solid var(--ink);box-shadow:0 4px 0 var(--pink)}
.gm-toast.show{transform:translate(-50%,0)}
@media (min-width:769px){.gm-toast{bottom:24px}}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- ページ別：みんなのガチャ（カード高さをそろえる） ---------- */
.gacha-grid{align-items:start}
.gacha-card-v2{display:flex!important;flex-direction:column;background:var(--paper)!important;border:3px solid var(--ink)!important;box-shadow:6px 6px 0 var(--ink)!important;transition:transform .15s cubic-bezier(.3,1.6,.6,1),box-shadow .15s}
.gacha-card-v2:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--ink)!important}
.gacha-card-v2.my-gacha{box-shadow:6px 6px 0 var(--orange)!important}
.gacha-card-v2 .gacha-image{border-bottom:3px solid var(--ink)!important}
.gacha-card-v2 .gacha-basic-info{display:flex;flex-direction:column;gap:8px;padding:12px 14px 14px!important}
.gacha-card-v2 .gacha-title{font-family:var(--f-dot);font-weight:400;font-size:1rem!important;color:var(--ink)!important;margin:0!important;line-height:1.35!important;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
/* 回数バッジが無いカードも同じ高さの行を確保 */
.gacha-card-v2 .gacha-badges{min-height:26px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin:0!important}
.gacha-card-v2 .gacha-badges .badge{font-family:var(--f-dot);font-weight:400;font-size:.72rem;border:2px solid var(--ink);border-radius:0!important;background:var(--white)!important;color:var(--ink)!important;padding:0 8px;line-height:1.6}
.gacha-card-v2 .gacha-badges .badge-play{background:var(--sun-l)!important}
.gacha-card-v2 .gacha-main-action .btn{margin:0}
.gacha-card-v2 .gacha-detail-toggle{border-top:2px dashed #e6dbe9;background:transparent!important}
.gacha-card-v2 .detail-toggle-btn{font-family:var(--f-dot);color:var(--muted)!important;background:transparent!important;width:100%;padding:8px;border:0;cursor:pointer}
.gacha-card-v2 .detail-toggle-btn:hover{color:var(--pink-d)!important}
.gacha-card-v2 .my-gacha-badge{background:var(--sun)!important;color:var(--ink)!important;font-family:var(--f-dot);font-weight:400;border-bottom:3px solid var(--ink)}

/* 新しい画面ではボタン幅を部品ごとに決める（styles.css のスマホ用 max-width:300px を解除） */
.gd .btn,.mp .btn,.cg .btn,.sp-head .btn,.sp-more .btn,.sp-next .btn,.gacha-machine .btn,.gm-menu .btn,.gd-crop .btn,.gd-bulkbar .btn{max-width:none;width:auto}
.gd-quick .btn,.gacha-machine .btn,.mp-cta,.cg-go{width:100%!important}
@media (max-width:768px){ .gd-acts .btn,.gd-row .btn,.gd-imgrow .btn,.gd-bulkbar .btn{flex:1 1 auto} }

/* PCヘッダー：項目が折り返さないように */
.gm-nav a,.gm-menu-btn,.gm-user{white-space:nowrap}
.gm-header-in{max-width:1180px}
@media (min-width:769px) and (max-width:1180px){
  .gm-user span.name{display:none}
  .gm-nav a{padding:6px 8px}
  .gm-logo small{display:none}
}
@media (min-width:769px) and (max-width:900px){ .gm-nav a .px{display:none} }

/* 入力欄＋ボタンの横並びがスマホではみ出さないように */
.comment-input-row{display:flex;gap:6px;min-width:0}
.comment-input-row .comment-input-field{flex:1 1 auto;min-width:0;width:auto!important}
.comment-input-row .comment-submit-btn{flex:none;width:auto!important;max-width:none!important;margin:0!important}